From 3ad2f67724894b14f1de4628379a6f33ff8ef5fc Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Wed, 22 Sep 2021 17:19:20 -0400 Subject: [PATCH 1/7] DashTable: Add dash_table component --- src/Dash.NET.Giraffe/Views.fs | 1 + src/Dash.NET/DashComponents/DashTable.fs | 3359 ++++++++++++++++++++++ 2 files changed, 3360 insertions(+) create mode 100644 src/Dash.NET/DashComponents/DashTable.fs diff --git a/src/Dash.NET.Giraffe/Views.fs b/src/Dash.NET.Giraffe/Views.fs index 9a34736..e4ed3cf 100644 --- a/src/Dash.NET.Giraffe/Views.fs +++ b/src/Dash.NET.Giraffe/Views.fs @@ -38,6 +38,7 @@ module Views = script [_type "application/javascript"; _crossorigin " "; _src "https://unpkg.com/dash-core-components@1.11.0/dash_core_components/dash_core_components.min.js"] [] script [_type "application/javascript"; _crossorigin " "; _src "https://cdn.jsdelivr.net/npm/dash-html-components@1.1.0/dash_html_components/dash_html_components.min.js"] [] script [_type "application/javascript"; _crossorigin " "; _src "https://cdn.plot.ly/plotly-latest.min.js"] [] + script [_type "application/javascript"; _crossorigin " "; _src "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js"] [] ] let createIndex metas appTitle faviconPath css appEntry config scripts renderer = diff --git a/src/Dash.NET/DashComponents/DashTable.fs b/src/Dash.NET/DashComponents/DashTable.fs new file mode 100644 index 0000000..a374abd --- /dev/null +++ b/src/Dash.NET/DashComponents/DashTable.fs @@ -0,0 +1,3359 @@ +module Dash.NET.DashTable + +open System +open Plotly.NET +open Dash.NET + +/// +///Dash DataTable is an interactive table component designed for +///designed for viewing, editing, and exploring large datasets. +///DataTable is rendered with standard, semantic HTML <table/> markup, +///which makes it accessible, responsive, and easy to style. This +///component was written from scratch in React.js specifically for the +///Dash community. Its API was designed to be ergonomic and its behavior +///is completely customizable through its properties. +/// +[] +module DataTable = + let inline convertOptional convert = function + | Some v -> convert v + | Option.None -> null + + /// + ///value equal to: 'first', 'last' + /// + type ColumnTogglePosition = + | First + | Last + static member convert = + function + | First -> "first" + | Last -> "last" + >> box + + type TogglableColumn = + | Position of ColumnTogglePosition + | Bool of bool + | MergedMultiHeader of bool list + static member convert = + function + | Position v -> ColumnTogglePosition.convert v + | Bool v -> box v + | MergedMultiHeader v -> box v + + /// + ///value equal to: 'odd', 'even' + /// + type Alternate = + | Odd + | Even + static member convert = + function + | Odd -> "odd" + | Even -> "even" + >> box + + /// + ///number | list with values of type: number | value equal to: 'odd', 'even' + /// + type SelectRowBy = + | Index of int + | Indices of int list + | Alternate of Alternate + static member convert = function + | Index v -> box v + | Indices v -> box v + | Alternate v -> Alternate.convert v + + /// + ///value equal to: 'any', 'numeric', 'text', 'datetime' + /// + ///The data-type provides support for per column typing and allows for data + ///validation and coercion. + ///'numeric': represents both floats and ints. + ///'text': represents a string. + ///'datetime': a string representing a date or date-time, in the form: + /// 'YYYY-MM-DD HH:MM:SS.ssssss' or some truncation thereof. Years must + /// have 4 digits, unless you use `validation.allow_YY: true`. Also + /// accepts 'T' or 't' between date and time, and allows timezone info + /// at the end. To convert these strings to Python `datetime` objects, + /// use `dateutil.parser.isoparse`. In R use `parse_iso_8601` from the + /// `parsedate` library. + /// WARNING: these parsers do not work with 2-digit years, if you use + /// `validation.allow_YY: true` and do not coerce to 4-digit years. + /// And parsers that do work with 2-digit years may make a different + /// guess about the century than we make on the front end. + ///'any': represents any type of data. + ///Defaults to 'any' if undefined. + /// + type ColumnType = + | Any + | Numeric + | Text + | Datetime + static member convert = + function + | Any -> "any" + | Numeric -> "numeric" + | Text -> "text" + | Datetime -> "datetime" + >> box + + /// + ///string | list with values of type: string + /// + type StyleColumn = + | Id of string + | Ids of string list + static member convert = function + | Id v -> box v + | Ids v -> box v + + /// + ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'header_index: number | list with values of type: number | value equal to: 'odd', 'even' (optional)', 'column_editable: boolean (optional)' (optional)' + /// + type ConditionalHeaderStyle = + { + ColumnId: StyleColumn option + ColumnType: ColumnType option + HeaderIndex: SelectRowBy option + ColumnEditable: bool option + } + static member init () = + { + ColumnId = None + ColumnType = None + HeaderIndex = None + ColumnEditable = None + } + static member convert this = + box {| + ``if`` = + box {| + column_id = convertOptional StyleColumn.convert this.ColumnId + column_type = convertOptional ColumnType.convert this.ColumnType + header_index = convertOptional SelectRowBy.convert this.HeaderIndex + column_editable = convertOptional box this.ColumnEditable + |} + |} + + + /// + ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'column_editable: boolean (optional)' (optional)' + /// + type ConditionalFilterStyle = + { + ColumnId: StyleColumn option + ColumnType: ColumnType option + ColumnEditable: bool option + } + static member init () = + { + ColumnId = None + ColumnType = None + ColumnEditable = None + } + static member convert this = + box {| + ``if`` = + box {| + column_id = convertOptional StyleColumn.convert this.ColumnId + column_type = convertOptional ColumnType.convert this.ColumnType + column_editable = convertOptional box this.ColumnEditable + |} + |} + + /// + ///value equal to: 'active', 'selected' + /// + type DataStyleState = + | Active + | Selected + static member convert = + function + | Active -> "active" + | Selected -> "selected" + >> box + + /// + ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'filter_query: string (optional)', 'state: value equal to: 'active', 'selected' (optional)', 'row_index: number | value equal to: 'odd', 'even' | list with values of type: number (optional)', 'column_editable: boolean (optional)' (optional)' + /// + type ConditionalDataStyle = + { + ColumnId: StyleColumn option + ColumnType: ColumnType option + FilterQuery: string option + State: DataStyleState option + RowIndex: SelectRowBy option + ColumnEditable: bool option + } + static member init () = + { + ColumnId = None + ColumnType = None + FilterQuery = None + State = None + RowIndex = None + ColumnEditable = None + } + static member convert this = + box {| + ``if`` = + box {| + column_id = convertOptional StyleColumn.convert this.ColumnId + column_type = convertOptional ColumnType.convert this.ColumnType + filter_query = convertOptional box this.FilterQuery + state = convertOptional DataStyleState.convert this.State + row_index = convertOptional SelectRowBy.convert this.RowIndex + column_editable = convertOptional box this.ColumnEditable + |} + |} + + /// + ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)' (optional)' + /// + type ConditionalCellStyle = + { + ColumnId: StyleColumn option + ColumnType: ColumnType option + } + static member init () = + { + ColumnId = None + ColumnType = None + } + static member convert this = + box {| + ``if`` = + box {| + column_id = convertOptional StyleColumn.convert this.ColumnId + column_type = convertOptional ColumnType.convert this.ColumnType + |} + |} + + /// + ///value equal to: 'asc', 'desc' + /// + type SortDirection = + | Asc + | Desc + static member convert = + function + | Asc -> "asc" + | Desc -> "desc" + >> box + + /// + ///record with the fields: 'column_id: string (required)', 'direction: value equal to: 'asc', 'desc' (required)' + /// + type SortBy = + { + ColumnId: string + Direction: SortDirection + } + static member create columnId direction = + { + ColumnId = columnId + Direction = direction + } + static member convert this = + box {| + column_id = this.ColumnId + direction = SortDirection.convert this.Direction + |} + + /// + ///value equal to: 'single', 'multi' + /// + type SortMode = + | Single + | Multi + static member convert = + function + | Single -> "single" + | Multi -> "multi" + >> box + + /// + ///value equal to: 'custom', 'native', 'none' + /// + type MaybeActionType = + | Custom + | Native + | None + static member convert = + function + | Custom -> "custom" + | Native -> "native" + | None -> "none" + >> box + + /// + ///value equal to: 'sensitive', 'insensitive' + /// + type FilterOptionCase = + | Sensitive + | Insensitive + static member convert = + function + | Sensitive -> "sensitive" + | Insensitive -> "insensitive" + >> box + + /// + ///record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' + /// + type FilterOption = + { Case: FilterOptionCase option } + static member create () = + { Case = Option.None } + static member convert this = + box {| case = convertOptional FilterOptionCase.convert this.Case |} + + /// + ///value equal to: 'and', 'or' + /// + type FilterActionOperator = + | And + | Or + static member convert = + function + | And -> "and" + | Or -> "or" + >> box + + /// + ///value equal to: 'custom', 'native' + /// + type FilterActionType = + | Custom + | Native + static member convert = + function + | Custom -> "custom" + | Native -> "native" + >> box + + /// + ///record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)' + /// + type ConditionalFilterAction = + { + Type: FilterActionType + Operator: FilterActionOperator option + } + static member create ``type`` = + { + Type = ``type`` + Operator = Option.None + } + static member convert this = + box {| + ``type`` = FilterActionType.convert this.Type + operator = convertOptional FilterActionOperator.convert this.Operator + |} + + /// + ///value equal to: 'custom', 'native', 'none' | record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)' + /// + type FilterAction = + // TODO: Might be able to use Option type here: ActionType of FilterActionType option + | Type of MaybeActionType + | Conditional of ConditionalFilterAction + static member convert = + function + | Type v -> v |> MaybeActionType.convert + | Conditional v -> v |> ConditionalFilterAction.convert + + /// + ///value equal to: 'text', 'markdown' + /// + ///refers to the type of tooltip syntax used + ///for the tooltip generation. Can either be `markdown` + ///or `text`. Defaults to `text`. + /// + type TooltipValueType = + | Text + | Markdown + static member convert = + function + | Text -> "text" + | Markdown -> "markdown" + >> box + + /// + ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' + /// + type TooltipValue = + { + Value: string + Type: TooltipValueType option + Delay: int option + Duration: int option + } + static member create value = + { + Value = value + Type = Option.None + Delay = Option.None + Duration = Option.None + } + static member convert this = + box {| + value = this.Value + ``type`` = convertOptional TooltipValueType.convert this.Type + delay = convertOptional box this.Delay + duration = convertOptional box this.Duration + |} + + /// + ///value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' + /// + // TODO: Might be able to use Option type here: Tooltip option + type MaybeTooltipValue = + | Text of string + | Value of TooltipValue + | Null + static member convert = + function + | Text v -> box v + | Value v -> TooltipValue.convert v + | Null -> box "null" + + /// + ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' | list with values of type: value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' + /// + type HeaderTooltip = + | Text of string + | Value of TooltipValue + // TODO: Might be able to use Option type here: Values of Tooltip option list + | Values of MaybeTooltipValue list + static member convert = + function + | Text v -> box v + | Value v -> TooltipValue.convert v + | Values v -> v |> List.map MaybeTooltipValue.convert |> box + + /// + ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' + /// + type DataTooltip = + | Text of string + | Value of TooltipValue + static member convert = + function + | Text v -> box v + | Value v -> TooltipValue.convert v + + /// + ///record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' + /// + ///The `if` refers to the condition that needs to be fulfilled + ///in order for the associated tooltip configuration to be + ///used. If multiple conditions are defined, all conditions + ///must be met for the tooltip to be used by a cell. + /// + type TooltipCondition = + { + ColumnId: string option + FilterQuery: string option + RowIndex: SelectRowBy option + } + static member create () = + { + ColumnId = Option.None + FilterQuery = Option.None + RowIndex = Option.None + } + static member convert this = + box {| + column_id = convertOptional box this.ColumnId + filter_query = convertOptional box this.FilterQuery + row_index = convertOptional SelectRowBy.convert this.RowIndex + |} + + /// + ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' (required)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' + /// + type ConditionalTooltip = + { + Value: string + If: TooltipCondition option + Type: TooltipValueType option + Delay: int option + Duration: int option + } + static member create value = + { + Value = value + If = Option.None + Type = Option.None + Delay = Option.None + Duration = Option.None + } + static member convert this = + box {| + value = this.Value + ``if`` = convertOptional TooltipCondition.convert this.If + delay = convertOptional box this.Delay + duration = convertOptional box this.Duration + ``type`` = convertOptional TooltipValueType.convert this.Type + |} + + // TODO: Might be able to use like this, to prevent duplication + //type ConditionalTooltip = + // { If: TooltipConditionalIf + // TooltipValue: TooltipValue } + // static member convert this = + // box + // {| ``if`` = (this.If |> TooltipConditionalIf.convert) + // value = this.TooltipValue.Value + // delay = this.TooltipValue.Delay + // duration = this.TooltipValue.Duration + // ``type`` = (this.TooltipValue.Type |> TooltipValueType.convert) |} + + /// + ///value equal to: 'both', 'data', 'header' + /// + ///Refers to whether the tooltip will be shown + ///only on data or headers. Can be `both`, `data`, `header`. + ///Defaults to `both`. + /// + type TooltipUseWith = + | Both + | Data + | Header + static member convert = + function + | Both -> "both" + | Data -> "data" + | Header -> "header" + >> box + + /// + ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)' + /// + type UseWithTooltipValue = + { + Value: string + UseWith: TooltipUseWith option + Type: TooltipValueType option + Delay: int option + Duration: int option + } + static member create value = + { + Value = value + UseWith = Option.None + Type = Option.None + Delay = Option.None + Duration = Option.None + } + static member convert this = + box {| + value = this.Value + use_with = convertOptional TooltipUseWith.convert this.UseWith + ``type`` = convertOptional TooltipValueType.convert this.Type + delay = convertOptional box this.Delay + duration = convertOptional box this.Duration + |} + // TODO: Might be able to use like this to prevent duplication + //type UseWithTooltipValue = + // { UseWith: TooltipUseWith + // TooltipValue: TooltipValue } + // static member convert this = + // box + // {| delay = this.TooltipValue.Delay + // duration = this.TooltipValue.Duration + // ``type`` = (this.TooltipValue.Type |> TooltipValueType.convert) + // use_with = (this.UseWith |> TooltipUseWith.convert) + // value = this.TooltipValue.Value |} + + /// + ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)' + /// + type Tooltip = + | Text of string + | UseWithValue of UseWithTooltipValue + static member convert = + function + | Text v -> box v + | UseWithValue v -> UseWithTooltipValue.convert v + + /// + ///record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' + /// + type DropdownCondition = + { + ColumnId: string option + FilterQuery: string option + } + static member create () = + { + ColumnId = Option.None + FilterQuery = Option.None + } + static member convert this = + box {| + column_id = convertOptional box this.ColumnId + filter_query = convertOptional box this.FilterQuery + |} + + /// + ///record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' + /// + type DropdownOption = + { + Label: string + Value: IConvertible + } + static member create label value = + { + Label = label + Value = value + } + static member convert this = + box {| + label = this.Label + value = this.Value + |} + + /// + ///record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)' + /// + type Dropdown = + { + Options: DropdownOption list + Clearable: bool option + } + static member create options = + { + Options = options + Clearable = Option.None + } + static member convert this = + box {| + options = this.Options |> List.map DropdownOption.convert + clearable = convertOptional box this.Clearable + |} + + /// + ///record with the fields: 'clearable: boolean (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)' + /// + type ConditionalDropdown = + { + Clearable: bool option + If: DropdownCondition option + Options: DropdownOption list + } + static member create options = + { + Clearable = Option.None + If = Option.None + Options = options + } + static member convert this = + box {| + clearable = convertOptional box this.Clearable + ``if`` = convertOptional DropdownCondition.convert this.If + options = this.Options |> List.map DropdownOption.convert + |} + + /// + ///record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)' + /// + type Cell = + { + Row: int option + Column: int option + RowId: IConvertible option + ColumnId: string option + } + static member create () = + { + Row = Option.None + Column = Option.None + RowId = Option.None + ColumnId = Option.None + } + static member convert this = + box {| + row = convertOptional box this.Row + column = convertOptional box this.Column + row_id = convertOptional box this.RowId + column_id = convertOptional box this.ColumnId + |} + + /// + ///value equal to: 'single', 'multi', 'false' + /// + type Select = + | Single + | Multi + | False + static member convert = + function + | Single -> "single" + | Multi -> "multi" + | False -> "false" + >> box + + ///• fixed_columns/fixed_headers (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { + type Fixed = + { + Data: uint option + Headers: bool option + } + static member create () = + { + Data = Option.None + Headers = Option.None + } + static member convert this = + box {| + data = convertOptional box this.Data + headers = convertOptional box this.Headers + |} + + /// + ///value equal to: 'none', 'ids', 'names', 'display' + /// + // TODO: Might be able to use Option type + type MaybeExportHeaders = + | None + | Ids + | Names + | Display + static member convert = + function + | None -> "none" + | Ids -> "ids" + | Names -> "names" + | Display -> "display" + >> box + + /// + ///value equal to: 'csv', 'xlsx', 'none' + /// + // TODO: Might be able to use Option type + type MaybeExportFormat = + | Csv + | Xlsx + | None + static member convert = + function + | Csv -> "csv" + | Xlsx -> "xlsx" + | None -> "none" + >> box + + /// + ///value equal to: 'all', 'visible' + /// + type ExportColumns = + | All + | Visible + static member convert = + function + | All -> "all" + | Visible -> "visible" + >> box + + /// + ///record with the fields: 'selector: string (required)', 'rule: string (required)' + /// + type Css = + { + Selector: string + Rule: string + } + static member create selector rule = + { + Selector = selector + Rule = rule + } + static member convert this = + box {| + selector = this.Selector + rule = this.Rule + |} + + /// + ///value equal to: '_blank', '_parent', '_self', '_top' + /// + type LinkBehaviour = + | Blank + | Parent + | Self + | Top + static member convert = + function + | Blank -> "_blank" + | Parent -> "_parent" + | Self -> "_self" + | Top -> "_top" + >> box + + /// + ///string | value equal to: '_blank', '_parent', '_self', '_top' + /// + ///(default: '_blank'). The link's behavior (_blank opens the link in a + ///new tab, _parent opens the link in the parent frame, _self opens the link in the + ///current tab, and _top opens the link in the top frame) or a string + /// + type LinkTarget = + | Text of string + | Behaviour of LinkBehaviour + static member convert = + function + | Text v -> box v + | Behaviour v -> v |> LinkBehaviour.convert + + /// + ///record with the fields: 'link_target: string | value equal to: '_blank', '_parent', '_self', '_top' (optional)', 'html: boolean (optional)' + /// + type MarkdownOptions = + { + LinkTarget: LinkTarget option + Html: bool option + } + static member create () = + { + LinkTarget = Option.None + Html = Option.None + } + static member convert this = + box {| + link_target = convertOptional LinkTarget.convert this.LinkTarget + html = convertOptional box this.Html + |} + + /// + ///record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' + /// + type LocaleFormat = + { + Symbol: string list option + Decimal: string option + Group: string option + Grouping: int list option + Numerals: string list option + Percent: string option + Separate4digits: bool option + } + static member create () = + { + Symbol = Option.None + Decimal = Option.None + Group = Option.None + Grouping = Option.None + Numerals = Option.None + Percent = Option.None + Separate4digits = Option.None + } + static member convert this = + box {| + symbol = convertOptional box this.Symbol + decimal = convertOptional box this.Decimal + group = convertOptional box this.Group + grouping = convertOptional box this.Grouping + numerals = convertOptional box this.Numerals + percent = convertOptional box this.Percent + separate_4digits = convertOptional box this.Separate4digits + |} + + /// + ///record with the fields: 'allow_null: boolean (optional)', 'default: boolean | number | string | record | list (optional)', 'allow_YY: boolean (optional)' + /// + ///The `validation` options for user input processing that can accept, reject or apply a + ///default value. + /// + type ColumnValidation = + { + AllowNull: bool option + Default: obj option + AllowYY: bool option + } + static member create () = + { + AllowNull = Option.None + Default = Option.None + AllowYY = Option.None + } + static member convert this = + box {| + allow_null = convertOptional box this.AllowNull + ``default`` = convertOptional box this.Default + allow_YY = convertOptional box this.AllowYY + |} + + /// + ///value equal to: 'accept', 'default', 'reject' + /// + ///(default 'reject'): What to do with the value if the action fails. + /// 'accept': use the invalid value; + /// 'default': replace the provided value with `validation.default`; + /// 'reject': do not modify the existing value. + /// + type FailureAction = + | Accept + | Default + | Reject + static member convert = + function + | Accept -> "accept" + | Default -> "default" + | Reject -> "reject" + >> box + + /// + ///value equal to: 'coerce', 'none', 'validate' + /// + ///(default 'coerce'): 'none': do not validate data; + /// 'coerce': check if the data corresponds to the destination type and + /// attempts to coerce it into the destination type if not; + /// 'validate': check if the data corresponds to the destination type (no coercion). + /// + type MaybeOnChangeAction = + | Coerce + | Validate + | None + static member convert = + function + | Coerce -> "coerce" + | Validate -> "validate" + | None -> "none" + >> box + + /// + ///record with the fields: 'action: value equal to: 'coerce', 'none', 'validate' (optional)', 'failure: value equal to: 'accept', 'default', 'reject' (optional)' + /// + ///The `on_change` behavior of the column for user-initiated modifications. + /// + type ColumnOnChange = + { + Action: MaybeOnChangeAction option + Failure: FailureAction option + } + static member create () = + { + Action = Option.None + Failure = Option.None + } + static member convert this = + box {| + action = convertOptional MaybeOnChangeAction.convert this.Action + failure = convertOptional FailureAction.convert this.Failure + |} + + /// + ///value equal to: 'input', 'dropdown', 'markdown' + /// + ///The `presentation` to use to display data. Markdown can be used on + ///columns with type 'text'. See 'dropdown' for more info. + ///Defaults to 'input' for ['datetime', 'numeric', 'text', 'any']. + /// + type ColumnPresentation = + | Input + | Dropdown + | Markdown + static member convert = + function + | Input -> "input" + | Dropdown -> "dropdown" + | Markdown -> "markdown" + >> box + + /// + ///record with the fields: 'locale: record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' (optional)', 'nully: boolean | number | string | record | list (optional)', 'prefix: number (optional)', 'specifier: string (optional)' + /// + ///The formatting applied to the column's data. + ///This prop is derived from the [d3-format](https://github.com/d3/d3-format) library specification. Apart from + ///being structured slightly differently (under a single prop), the usage is the same. + ///See also dash_table.FormatTemplate. It contains helper functions for typical number formats. + /// + type ColumnFormat = + { + Locale: LocaleFormat option + Nully: obj option + Prefix: int option + Specifier: string option + } + static member create () = + { + Locale = Option.None + Nully = Option.None + Prefix = Option.None + Specifier = Option.None + } + static member convert this = + box {| + locale = convertOptional LocaleFormat.convert this.Locale + nully = convertOptional box this.Nully + prefix = convertOptional box this.Prefix + specifier = convertOptional box this.Specifier + |} + + /// + ///value equal to: 'first', 'last' | boolean | list with values of type: boolean + /// + ///If true, the user can select the column by clicking on the checkbox or radio button + ///in the column. If there are multiple header rows, true will display the input + ///on each row. + ///If `last`, the input will only appear on the last header row. If `first` it will only + ///appear on the first header row. These are respectively shortcut equivalents to + ///`[false, ..., false, true]` and `[true, false, ..., false]`. + ///If there are merged, multi-header columns then you can choose which column header + ///row to display the input in by supplying an array of booleans. + ///For example, `[true, false]` will display the `selectable` input on the first row, + ///but now on the second row. + ///If the `selectable` input appears on a merged columns, then clicking on that input + ///will select *all* of the merged columns associated with it. + ///The table-level prop `column_selectable` is used to determine the type of column + ///selection to use. + /// + type ColumnSelectable = TogglableColumn + + /// + ///value equal to: 'first', 'last' | boolean | list with values of type: boolean + /// + ///If true, the user can rename the column by clicking on the `rename` + ///action button on the column. If there are multiple header rows, true + ///will display the action button on each row. + ///If `last`, the `rename` action button will only appear on the last header + ///row. If `first` it will only appear on the first header row. These + ///are respectively shortcut equivalents to `[false, ..., false, true]` and + ///`[true, false, ..., false]`. + ///If there are merged, multi-header columns then you can choose + ///which column header row to display the `rename` action button in by + ///supplying an array of booleans. + ///For example, `[true, false]` will display the `rename` action button + ///on the first row, but not the second row. + ///If the `rename` action button appears on a merged column, then clicking + ///on that button will rename *all* of the merged columns associated with it. + /// + type ColumnRenamable = TogglableColumn + + /// + ///value equal to: 'first', 'last' | boolean | list with values of type: boolean + /// + ///If true, the user can hide the column by clicking on the `hide` + ///action button on the column. If there are multiple header rows, true + ///will display the action button on each row. + ///If `last`, the `hide` action button will only appear on the last header + ///row. If `first` it will only appear on the first header row. These + ///are respectively shortcut equivalents to `[false, ..., false, true]` and + ///`[true, false, ..., false]`. + ///If there are merged, multi-header columns then you can choose + ///which column header row to display the `hide` action button in by + ///supplying an array of booleans. + ///For example, `[true, false]` will display the `hide` action button + ///on the first row, but not the second row. + ///If the `hide` action button appears on a merged column, then clicking + ///on that button will hide *all* of the merged columns associated with it. + /// + type ColumnHideable = TogglableColumn + + /// + ///Sensitifity value equal to: 'sensitive', 'insensitive' + /// + type FilterSensitifity = + | Sensitive + | Insensitive + static member convert = + function + | Sensitive -> "sensitive" + | Insensitive -> "insensitive" + >> box + + /// + ///record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' + /// + ///There are two `filter_options` props in the table. + ///This is the column-level filter_options prop and there is + ///also the table-level `filter_options` prop. + ///These props determine whether the applicable filter relational + ///operators will default to `sensitive` or `insensitive` comparison. + ///If the column-level `filter_options` prop is set it overrides + ///the table-level `filter_options` prop for that column. + /// + type ColumnFilterOption = + { Case: FilterSensitifity option } + static member create () = + { Case = Option.None } + static member convert this = + box {| case = convertOptional FilterSensitifity.convert this.Case |} + + /// + ///value equal to: 'first', 'last' | boolean | list with values of type: boolean + /// + ///If true, the user can remove the column by clicking on the `delete` + ///action button on the column. If there are multiple header rows, true + ///will display the action button on each row. + ///If `last`, the `delete` action button will only appear on the last header + ///row. If `first` it will only appear on the first header row. These + ///are respectively shortcut equivalents to `[false, ..., false, true]` and + ///`[true, false, ..., false]`. + ///If there are merged, multi-header columns then you can choose + ///which column header row to display the `delete` action button in by + ///supplying an array of booleans. + ///For example, `[true, false]` will display the `delete` action button + ///on the first row, but not the second row. + ///If the `delete` action button appears on a merged column, then clicking + ///on that button will remove *all* of the merged columns associated with it. + /// + type ColumnDeletable = TogglableColumn + + /// + ///value equal to: 'first', 'last' | boolean | list with values of type: boolean + /// + ///If true, the user can clear the column by clicking on the `clear` + ///action button on the column. If there are multiple header rows, true + ///will display the action button on each row. + ///If `last`, the `clear` action button will only appear on the last header + ///row. If `first` it will only appear on the first header row. These + ///are respectively shortcut equivalents to `[false, ..., false, true]` and + ///`[true, false, ..., false]`. + ///If there are merged, multi-header columns then you can choose + ///which column header row to display the `clear` action button in by + ///supplying an array of booleans. + ///For example, `[true, false]` will display the `clear` action button + ///on the first row, but not the second row. + ///If the `clear` action button appears on a merged column, then clicking + ///on that button will clear *all* of the merged columns associated with it. + ///Unlike `column.deletable`, this action does not remove the column(s) + ///from the table. It only removed the associated entries from `data`. + /// + type ColumnClearable = TogglableColumn + + /// + ///record with the fields: 'clearable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'deletable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'editable: boolean (optional)', 'filter_options: record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' (optional)', 'hideable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'renamable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'selectable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'format: record with the fields: 'locale: record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' (optional)', 'nully: boolean | number | string | record | list (optional)', 'prefix: number (optional)', 'specifier: string (optional)' (optional)', 'id: string (required)', 'name: string | list with values of type: string (required)', 'presentation: value equal to: 'input', 'dropdown', 'markdown' (optional)', 'on_change: record with the fields: 'action: value equal to: 'coerce', 'none', 'validate' (optional)', 'failure: value equal to: 'accept', 'default', 'reject' (optional)' (optional)', 'sort_as_null: list with values of type: string | number | boolean (optional)', 'validation: record with the fields: 'allow_null: boolean (optional)', 'default: boolean | number | string | record | list (optional)', 'allow_YY: boolean (optional)' (optional)', 'type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)' + /// + type Column = + { + Name: string list + Id: string + Type: ColumnType option + Clearable: ColumnClearable option + Deletable: ColumnDeletable option + Editable: bool option + FilterOptions: ColumnFilterOption option + Hideable: ColumnHideable option + Renamable: ColumnRenamable option + Selectable: ColumnSelectable option + Format: ColumnFormat option + Presentation: ColumnPresentation option + OnChange: ColumnOnChange option + SortAsNull: IConvertible list option + Validation: ColumnValidation option + } + static member create name id = + { + Name = [ name ] + Id = id + Type = Option.None + Clearable = Option.None + Deletable = Option.None + Editable = Option.None + FilterOptions = Option.None + Hideable = Option.None + Renamable = Option.None + Selectable = Option.None + Format = Option.None + Presentation = Option.None + OnChange = Option.None + SortAsNull = Option.None + Validation = Option.None + } + static member convert this = + box {| + name = this.Name + id = this.Id + ``type`` = convertOptional ColumnType.convert this.Type + clearable = convertOptional ColumnClearable.convert this.Clearable + deletable = convertOptional ColumnDeletable.convert this.Deletable + editable = convertOptional box this.Editable + filter_options = convertOptional ColumnFilterOption.convert this.FilterOptions + hideable = convertOptional ColumnHideable.convert this.Hideable + renamable = convertOptional ColumnRenamable.convert this.Renamable + selectable = convertOptional ColumnSelectable.convert this.Selectable + format = convertOptional ColumnFormat.convert this.Format + presentation = convertOptional ColumnPresentation.convert this.Presentation + on_change = convertOptional ColumnOnChange.convert this.OnChange + sort_as_null = convertOptional box this.SortAsNull + validation = convertOptional ColumnValidation.convert this.Validation + |} + + /// + ///record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)' + /// + type ActiveCell = + { + Row: int option + Column: int option + RowId: IConvertible option + ColumnId: string option + } + static member create () = + { + Row = Option.None + Column = Option.None + RowId = Option.None + ColumnId = Option.None + } + static member convert this = + box {| + row = convertOptional box this.Row + column = convertOptional box this.Column + row_id = convertOptional box this.RowId + column_id = convertOptional box this.ColumnId + |} + + /// + ///• active_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - The row and column indices and IDs of the currently active cell. + ///`row_id` is only returned if the data rows have an `id` key. + /// + ///• columns (list with values of type: record with the fields: 'clearable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'deletable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'editable: boolean (optional)', 'filter_options: record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' (optional)', 'hideable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'renamable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'selectable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'format: record with the fields: 'locale: record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' (optional)', 'nully: boolean | number | string | record | list (optional)', 'prefix: number (optional)', 'specifier: string (optional)' (optional)', 'id: string (required)', 'name: string | list with values of type: string (required)', 'presentation: value equal to: 'input', 'dropdown', 'markdown' (optional)', 'on_change: record with the fields: 'action: value equal to: 'coerce', 'none', 'validate' (optional)', 'failure: value equal to: 'accept', 'default', 'reject' (optional)' (optional)', 'sort_as_null: list with values of type: string | number | boolean (optional)', 'validation: record with the fields: 'allow_null: boolean (optional)', 'default: boolean | number | string | record | list (optional)', 'allow_YY: boolean (optional)' (optional)', 'type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)') - Columns describes various aspects about each individual column. + ///`name` and `id` are the only required parameters. + /// + ///• include_headers_on_copy_paste (boolean; default false) - If true, headers are included when copying from the table to different + ///tabs and elsewhere. Note that headers are ignored when copying from the table onto itself and + ///between two tables within the same tab. + /// + ///• locale_format (record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)') - The localization specific formatting information applied to all columns in the table. + ///This prop is derived from the [d3.formatLocale](https://github.com/d3/d3-format#formatLocale) data structure specification. + ///When left unspecified, each individual nested prop will default to a pre-determined value. + /// + ///• markdown_options (record with the fields: 'link_target: string | value equal to: '_blank', '_parent', '_self', '_top' (optional)', 'html: boolean (optional)'; default { + /// link_target: '_blank', + /// html: false + ///}) - The `markdown_options` property allows customization of the markdown cells behavior. + /// + ///• css (list with values of type: record with the fields: 'selector: string (required)', 'rule: string (required)'; default []) - The `css` property is a way to embed CSS selectors and rules + ///onto the page. + ///We recommend starting with the `style_*` properties + ///before using this `css` property. + ///Example: + ///[ + /// {"selector": ".dash-spreadsheet", "rule": 'font-family: "monospace"'} + ///] + /// + ///• data (list with values of type: record) - The contents of the table. + ///The keys of each item in data should match the column IDs. + ///Each item can also have an 'id' key, whose value is its row ID. If there + ///is a column with ID='id' this will display the row ID, otherwise it is + ///just used to reference the row for selections, filtering, etc. + ///Example: + ///[ + /// {'column-1': 4.5, 'column-2': 'montreal', 'column-3': 'canada'}, + /// {'column-1': 8, 'column-2': 'boston', 'column-3': 'america'} + ///] + /// + ///• data_previous (list with values of type: record) - The previous state of `data`. `data_previous` + ///has the same structure as `data` and it will be updated + ///whenever `data` changes, either through a callback or + ///by editing the table. + ///This is a read-only property: setting this property will not + ///have any impact on the table. + /// + ///• data_timestamp (number) - The unix timestamp when the data was last edited. + ///Use this property with other timestamp properties + ///(such as `n_clicks_timestamp` in `dash_html_components`) + ///to determine which property has changed within a callback. + /// + ///• editable (boolean; default false) - If True, then the data in all of the cells is editable. + ///When `editable` is True, particular columns can be made + ///uneditable by setting `editable` to `False` inside the `columns` + ///property. + ///If False, then the data in all of the cells is uneditable. + ///When `editable` is False, particular columns can be made + ///editable by setting `editable` to `True` inside the `columns` + ///property. + /// + ///• end_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`end_cell` represents the row / column coordinates and IDs of the cell + ///in one of the corners of the region. + ///`start_cell` represents the coordinates of the other corner. + /// + ///• export_columns (value equal to: 'all', 'visible'; default visible) - Denotes the columns that will be used in the export data file. + ///If `all`, all columns will be used (visible + hidden). If `visible`, + ///only the visible columns will be used. Defaults to `visible`. + /// + ///• export_format (value equal to: 'csv', 'xlsx', 'none'; default none) - Denotes the type of the export data file, + ///Defaults to `'none'` + /// + ///• export_headers (value equal to: 'none', 'ids', 'names', 'display') - Denotes the format of the headers in the export data file. + ///If `'none'`, there will be no header. If `'display'`, then the header + ///of the data file will be be how it is currently displayed. Note that + ///`'display'` is only supported for `'xlsx'` export_format and will behave + ///like `'names'` for `'csv'` export format. If `'ids'` or `'names'`, + ///then the headers of data file will be the column id or the column + ///names, respectively + /// + ///• fill_width (boolean; default true) - `fill_width` toggles between a set of CSS for two common behaviors: + ///True: The table container's width will grow to fill the available space; + ///False: The table container's width will equal the width of its content. + /// + ///• hidden_columns (list with values of type: string) - List of columns ids of the columns that are currently hidden. + ///See the associated nested prop `columns.hideable`. + /// + ///• is_focused (boolean) - If True, then the `active_cell` is in a focused state. + /// + ///• merge_duplicate_headers (boolean) - If True, then column headers that have neighbors with duplicate names + ///will be merged into a single cell. + ///This will be applied for single column headers and multi-column + ///headers. + /// + ///• fixed_columns (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { + /// headers: false, + /// data: 0 + ///}) - `fixed_columns` will "fix" the set of columns so that + ///they remain visible when scrolling horizontally across + ///the unfixed columns. `fixed_columns` fixes columns + ///from left-to-right. + ///If `headers` is False, no columns are fixed. + ///If `headers` is True, all operation columns (see `row_deletable` and `row_selectable`) + ///are fixed. Additional data columns can be fixed by + ///assigning a number to `data`. + ///Note that fixing columns introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + ///• fixed_rows (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { + /// headers: false, + /// data: 0 + ///}) - `fixed_rows` will "fix" the set of rows so that + ///they remain visible when scrolling vertically down + ///the table. `fixed_rows` fixes rows + ///from top-to-bottom, starting from the headers. + ///If `headers` is False, no rows are fixed. + ///If `headers` is True, all header and filter rows (see `filter_action`) are + ///fixed. Additional data rows can be fixed by assigning + ///a number to `data`. Note that fixing rows introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + ///• column_selectable (value equal to: 'single', 'multi', 'false'; default false) - If `single`, then the user can select a single column or group + ///of merged columns via the radio button that will appear in the + ///header rows. + ///If `multi`, then the user can select multiple columns or groups + ///of merged columns via the checkbox that will appear in the header + ///rows. + ///If false, then the user will not be able to select columns and no + ///input will appear in the header rows. + ///When a column is selected, its id will be contained in `selected_columns` + ///and `derived_viewport_selected_columns`. + /// + ///• row_deletable (boolean) - If True, then a `x` will appear next to each `row` + ///and the user can delete the row. + /// + ///• cell_selectable (boolean; default true) - If True (default), then it is possible to click and navigate + ///table cells. + /// + ///• row_selectable (value equal to: 'single', 'multi', 'false'; default false) - If `single`, then the user can select a single row + ///via a radio button that will appear next to each row. + ///If `multi`, then the user can select multiple rows + ///via a checkbox that will appear next to each row. + ///If false, then the user will not be able to select rows + ///and no additional UI elements will appear. + ///When a row is selected, its index will be contained + ///in `selected_rows`. + /// + ///• selected_cells (list with values of type: record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)'; default []) - `selected_cells` represents the set of cells that are selected, + ///as an array of objects, each item similar to `active_cell`. + ///Multiple cells can be selected by holding down shift and + ///clicking on a different cell or holding down shift and navigating + ///with the arrow keys. + /// + ///• selected_rows (list with values of type: number; default []) - `selected_rows` contains the indices of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + ///• selected_columns (list with values of type: string; default []) - `selected_columns` contains the ids of columns that + ///are selected via the UI elements that appear when + ///`column_selectable` is `'single' or 'multi'`. + /// + ///• selected_row_ids (list with values of type: string | number; default []) - `selected_row_ids` contains the ids of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + ///• start_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`start_cell` represents the [row, column] coordinates of the cell + ///in one of the corners of the region. + ///`end_cell` represents the coordinates of the other corner. + /// + ///• style_as_list_view (boolean; default false) - If True, then the table will be styled like a list view + ///and not have borders between the columns. + /// + ///• page_action (value equal to: 'custom', 'native', 'none'; default native) - `page_action` refers to a mode of the table where + ///not all of the rows are displayed at once: only a subset + ///are displayed (a "page") and the next subset of rows + ///can viewed by clicking "Next" or "Previous" buttons + ///at the bottom of the page. + ///Pagination is used to improve performance: instead of + ///rendering all of the rows at once (which can be expensive), + ///we only display a subset of them. + ///With pagination, we can either page through data that exists + ///in the table (e.g. page through `10,000` rows in `data` `100` rows at a time) + ///or we can update the data on-the-fly with callbacks + ///when the user clicks on the "Previous" or "Next" buttons. + ///These modes can be toggled with this `page_action` parameter: + ///`'native'`: all data is passed to the table up-front, paging logic is + ///handled by the table; + ///`'custom'`: data is passed to the table one page at a time, paging logic + ///is handled via callbacks; + ///`'none'`: disables paging, render all of the data at once. + /// + ///• page_current (number; default 0) - `page_current` represents which page the user is on. + ///Use this property to index through data in your callbacks with + ///backend paging. + /// + ///• page_count (number) - `page_count` represents the number of the pages in the + ///paginated table. This is really only useful when performing + ///backend pagination, since the front end is able to use the + ///full size of the table to calculate the number of pages. + /// + ///• page_size (number; default 250) - `page_size` represents the number of rows that will be + ///displayed on a particular page when `page_action` is `'custom'` or `'native'` + /// + ///• dropdown (dict with values of type: record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default {}) - `dropdown` specifies dropdown options for different columns. + ///Each entry refers to the column ID. + ///The `clearable` property defines whether the value can be deleted. + ///The `options` property refers to the `options` of the dropdown. + /// + ///• dropdown_conditional (list with values of type: record with the fields: 'clearable: boolean (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default []) - `dropdown_conditional` specifies dropdown options in various columns and cells. + ///This property allows you to specify different dropdowns + ///depending on certain conditions. For example, you may + ///render different "city" dropdowns in a row depending on the + ///current value in the "state" column. + /// + ///• dropdown_data (list with values of type: dict with values of type: record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default []) - `dropdown_data` specifies dropdown options on a row-by-row, column-by-column basis. + ///Each item in the array corresponds to the corresponding dropdowns for the `data` item + ///at the same index. Each entry in the item refers to the Column ID. + /// + ///• tooltip (dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)'; default {}) - `tooltip` is the column based tooltip configuration applied to all rows. The key is the column + /// id and the value is a tooltip configuration. + ///Example: {i: {'value': i, 'use_with: 'both'} for i in df.columns} + /// + ///• tooltip_conditional (list with values of type: record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' (required)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default []) - `tooltip_conditional` represents the tooltip shown + ///for different columns and cells. + ///This property allows you to specify different tooltips + ///depending on certain conditions. For example, you may have + ///different tooltips in the same column based on the value + ///of a certain data property. + ///Priority is from first to last defined conditional tooltip + ///in the list. Higher priority (more specific) conditional + ///tooltips should be put at the beginning of the list. + /// + ///• tooltip_data (list with values of type: dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default []) - `tooltip_data` represents the tooltip shown + ///for different columns and cells. + ///A list of dicts for which each key is + ///a column id and the value is a tooltip configuration. + /// + ///• tooltip_header (dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' | list with values of type: value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default {}) - `tooltip_header` represents the tooltip shown + ///for each header column and optionally each header row. + ///Example to show long column names in a tooltip: {i: i for i in df.columns}. + ///Example to show different column names in a tooltip: {'Rep': 'Republican', 'Dem': 'Democrat'}. + ///If the table has multiple rows of headers, then use a list as the value of the + ///`tooltip_header` items. + /// + ///• tooltip_delay (number; default 350) - `tooltip_delay` represents the table-wide delay in milliseconds before + ///the tooltip is shown when hovering a cell. If set to `None`, the tooltip + ///will be shown immediately. + ///Defaults to 350. + /// + ///• tooltip_duration (number; default 2000) - `tooltip_duration` represents the table-wide duration in milliseconds + ///during which the tooltip will be displayed when hovering a cell. If + ///set to `None`, the tooltip will not disappear. + ///Defaults to 2000. + /// + ///• filter_query (string; default ) - If `filter_action` is enabled, then the current filtering + ///string is represented in this `filter_query` + ///property. + /// + ///• filter_action (value equal to: 'custom', 'native', 'none' | record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)'; default none) - The `filter_action` property controls the behavior of the `filtering` UI. + ///If `'none'`, then the filtering UI is not displayed. + ///If `'native'`, then the filtering UI is displayed and the filtering + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, then the filtering UI is displayed but it is the + ///responsibility of the developer to program the filtering + ///through a callback (where `filter_query` or `derived_filter_query_structure` would be the input + ///and `data` would be the output). + /// + ///• filter_options (record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)'; default {}) - There are two `filter_options` props in the table. + ///This is the table-level filter_options prop and there is + ///also the column-level `filter_options` prop. + ///These props determine whether the applicable filter relational + ///operators will default to `sensitive` or `insensitive` comparison. + ///If the column-level `filter_options` prop is set it overrides + ///the table-level `filter_options` prop for that column. + /// + ///• sort_action (value equal to: 'custom', 'native', 'none'; default none) - The `sort_action` property enables data to be + ///sorted on a per-column basis. + ///If `'none'`, then the sorting UI is not displayed. + ///If `'native'`, then the sorting UI is displayed and the sorting + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, the the sorting UI is displayed but it is the + ///responsibility of the developer to program the sorting + ///through a callback (where `sort_by` would be the input and `data` + ///would be the output). + ///Clicking on the sort arrows will update the + ///`sort_by` property. + /// + ///• sort_mode (value equal to: 'single', 'multi'; default single) - Sorting can be performed across multiple columns + ///(e.g. sort by country, sort within each country, + /// sort by year) or by a single column. + ///NOTE - With multi-column sort, it's currently + ///not possible to determine the order in which + ///the columns were sorted through the UI. + ///See [https://github.com/plotly/dash-table/issues/170](https://github.com/plotly/dash-table/issues/170) + /// + ///• sort_by (list with values of type: record with the fields: 'column_id: string (required)', 'direction: value equal to: 'asc', 'desc' (required)'; default []) - `sort_by` describes the current state + ///of the sorting UI. + ///That is, if the user clicked on the sort arrow + ///of a column, then this property will be updated + ///with the column ID and the direction + ///(`asc` or `desc`) of the sort. + ///For multi-column sorting, this will be a list of + ///sorting parameters, in the order in which they were + ///clicked. + /// + ///• sort_as_null (list with values of type: string | number | boolean; default []) - An array of string, number and boolean values that are treated as `None` + ///(i.e. ignored and always displayed last) when sorting. + ///This value will be used by columns without `sort_as_null`. + ///Defaults to `[]`. + /// + ///• style_table (record; default {}) - CSS styles to be applied to the outer `table` container. + ///This is commonly used for setting properties like the + ///width or the height of the table. + /// + ///• style_cell (record) - CSS styles to be applied to each individual cell of the table. + ///This includes the header cells, the `data` cells, and the filter + ///cells. + /// + ///• style_data (record) - CSS styles to be applied to each individual data cell. + ///That is, unlike `style_cell`, it excludes the header and filter cells. + /// + ///• style_filter (record) - CSS styles to be applied to the filter cells. + ///Note that this may change in the future as we build out a + ///more complex filtering UI. + /// + ///• style_header (record) - CSS styles to be applied to each individual header cell. + ///That is, unlike `style_cell`, it excludes the `data` and filter cells. + /// + ///• style_cell_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)' (optional)'; default []) - Conditional CSS styles for the cells. + ///This can be used to apply styles to cells on a per-column basis. + /// + ///• style_data_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'filter_query: string (optional)', 'state: value equal to: 'active', 'selected' (optional)', 'row_index: number | value equal to: 'odd', 'even' | list with values of type: number (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the data cells. + ///This can be used to apply styles to data cells on a per-column basis. + /// + ///• style_filter_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the filter cells. + ///This can be used to apply styles to filter cells on a per-column basis. + /// + ///• style_header_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'header_index: number | list with values of type: number | value equal to: 'odd', 'even' (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the header cells. + ///This can be used to apply styles to header cells on a per-column basis. + /// + ///• virtualization (boolean; default false) - This property tells the table to use virtualization when rendering. + ///Assumptions are that: + ///the width of the columns is fixed; + ///the height of the rows is always the same; and + ///runtime styling changes will not affect width and height vs. first rendering + /// + ///• derived_filter_query_structure (record) - This property represents the current structure of + ///`filter_query` as a tree structure. Each node of the + ///query structure has: + ///type (string; required): + /// 'open-block', + /// 'logical-operator', + /// 'relational-operator', + /// 'unary-operator', or + /// 'expression'; + ///subType (string; optional): + /// 'open-block': '()', + /// 'logical-operator': '&&', '||', + /// 'relational-operator': '=', '>=', '>', '<=', '<', '!=', 'contains', + /// 'unary-operator': '!', 'is bool', 'is even', 'is nil', 'is num', 'is object', 'is odd', 'is prime', 'is str', + /// 'expression': 'value', 'field'; + ///value (any): + /// 'expression, value': passed value, + /// 'expression, field': the field/prop name. + ///block (nested query structure; optional). + ///left (nested query structure; optional). + ///right (nested query structure; optional). + ///If the query is invalid or empty, the `derived_filter_query_structure` will + ///be `None`. + /// + ///• derived_viewport_data (list with values of type: record; default []) - This property represents the current state of `data` + ///on the current page. This property will be updated + ///on paging, sorting, and filtering. + /// + ///• derived_viewport_indices (list with values of type: number; default []) - `derived_viewport_indices` indicates the order in which the original + ///rows appear after being filtered, sorted, and/or paged. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + ///• derived_viewport_row_ids (list with values of type: string | number; default []) - `derived_viewport_row_ids` lists row IDs in the order they appear + ///after being filtered, sorted, and/or paged. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + ///• derived_viewport_selected_columns (list with values of type: string) - `derived_viewport_selected_columns` contains the ids of the + ///`selected_columns` that are not currently hidden. + /// + ///• derived_viewport_selected_rows (list with values of type: number; default []) - `derived_viewport_selected_rows` represents the indices of the + ///`selected_rows` from the perspective of the `derived_viewport_indices`. + /// + ///• derived_viewport_selected_row_ids (list with values of type: string | number; default []) - `derived_viewport_selected_row_ids` represents the IDs of the + ///`selected_rows` on the currently visible page. + /// + ///• derived_virtual_data (list with values of type: record; default []) - This property represents the visible state of `data` + ///across all pages after the front-end sorting and filtering + ///as been applied. + /// + ///• derived_virtual_indices (list with values of type: number; default []) - `derived_virtual_indices` indicates the order in which the original + ///rows appear after being filtered and sorted. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + ///• derived_virtual_row_ids (list with values of type: string | number; default []) - `derived_virtual_row_ids` indicates the row IDs in the order in which + ///they appear after being filtered and sorted. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + ///• derived_virtual_selected_rows (list with values of type: number; default []) - `derived_virtual_selected_rows` represents the indices of the + /// `selected_rows` from the perspective of the `derived_virtual_indices`. + /// + ///• derived_virtual_selected_row_ids (list with values of type: string | number; default []) - `derived_virtual_selected_row_ids` represents the IDs of the + ///`selected_rows` as they appear after filtering and sorting, + ///across all pages. + /// + ///• loading_state (record with the fields: 'is_loading: boolean (optional)', 'prop_name: string (optional)', 'component_name: string (optional)') - Object that holds the loading state object coming from dash-renderer + /// + ///• persistence (boolean | string | number) - Used to allow user interactions in this component to be persisted when + ///the component - or the page - is refreshed. If `persisted` is truthy and + ///hasn't changed from its previous value, any `persisted_props` that the + ///user has changed while using the app will keep those changes, as long as + ///the new prop value also matches what was given originally. + ///Used in conjunction with `persistence_type` and `persisted_props`. + /// + ///• persisted_props (list with values of type: value equal to: 'columns_name', 'data', 'filter_query', 'hidden_columns', 'selected_columns', 'selected_rows', 'sort_by'; default [ + /// 'columns_name', + /// 'filter_query', + /// 'hidden_columns', + /// 'selected_columns', + /// 'selected_rows', + /// 'sort_by' + ///]) - Properties whose user interactions will persist after refreshing the + ///component or the page. + /// + ///• persistence_type (value equal to: 'local', 'session', 'memory'; default local) - Where persisted user changes will be stored: + ///memory: only kept in memory, reset on page refresh. + ///local: window.localStorage, data is kept after the browser quit. + ///session: window.sessionStorage, data is cleared once the browser quit. + /// + type Prop = + | ActiveCell of ActiveCell + | Columns of seq + | IncludeHeadersOnCopyPaste of bool + | LocaleFormat of LocaleFormat + | MarkdownOptions of MarkdownOptions + | Css of seq + | Data of seq + | DataPrevious of seq + | DataTimestamp of int64 + | Editable of bool + | EndCell of Cell + | ExportColumns of ExportColumns + | ExportFormat of MaybeExportFormat + // TODO: Might be able to use Option type: ExportHeaders of ExportHeaders option + | ExportHeaders of MaybeExportHeaders + | FillWidth of bool + | HiddenColumns of seq + | IsFocused of bool + | MergeDuplicateHeaders of bool + | FixedColumns of Fixed + | FixedRows of Fixed + | ColumnSelectable of Select + | RowDeletable of bool + | CellSelectable of bool + | RowSelectable of Select + | SelectedCells of seq + | SelectedRows of seq + | SelectedColumns of seq + | SelectedRowIds of seq + | StartCell of Cell + | StyleAsListView of bool + | PageAction of MaybeActionType + | PageCurrent of int + | PageCount of int + | PageSize of int + | Dropdown of Map + | DropdownConditional of seq + | DropdownData of seq> + | Tooltip of Map + | TooltipConditional of seq + | TooltipData of seq> + | TooltipHeader of Map + | TooltipDelay of int + | TooltipDuration of int + | FilterQuery of string + | FilterAction of FilterAction + | FilterOptions of FilterOption + | SortAction of MaybeActionType + | SortMode of SortMode + | SortBy of seq + | SortAsNull of seq + | StyleTable of DashComponentStyle + | StyleCell of DashComponentStyle + | StyleData of DashComponentStyle + | StyleFilter of DashComponentStyle + | StyleHeader of DashComponentStyle + | StyleCellConditional of seq + | StyleDataConditional of seq + | StyleFilterConditional of seq + | StyleHeaderConditional of seq + | Virtualization of bool + | DerivedFilterQueryStructure of obj + | DerivedViewportData of seq + | DerivedViewportIndices of seq + | DerivedViewportRowIds of seq + | DerivedViewportSelectedColumns of seq + | DerivedViewportSelectedRows of seq + | DerivedViewportSelectedRowIds of seq + | DerivedVirtualData of seq + | DerivedVirtualIndices of seq + | DerivedVirtualRowIds of seq + | DerivedVirtualSelectedRows of seq + | DerivedVirtualSelectedRowIds of seq + | LoadingState of LoadingState + | Persistence of IConvertible + | PersistedProps of string [] + | PersistenceType of PersistenceTypeOptions + + static member convert = function + | ActiveCell p -> ActiveCell.convert p + | Columns p -> p |> Seq.map Column.convert |> box + | IncludeHeadersOnCopyPaste p -> box p + | LocaleFormat p -> LocaleFormat.convert p + | MarkdownOptions p -> MarkdownOptions.convert p + | Css p -> p |> Seq.map Css.convert |> box + | Data p -> box p + | DataPrevious p -> box p + | DataTimestamp p -> box p + | Editable p -> box p + | EndCell p -> Cell.convert p + | ExportColumns p -> ExportColumns.convert p + | ExportFormat p -> MaybeExportFormat.convert p + | ExportHeaders p -> MaybeExportHeaders.convert p + | FillWidth p -> box p + | HiddenColumns p -> box p + | IsFocused p -> box p + | MergeDuplicateHeaders p -> box p + | FixedColumns p -> Fixed.convert p + | FixedRows p -> Fixed.convert p + | ColumnSelectable p -> Select.convert p + | RowDeletable p -> box p + | CellSelectable p -> box p + | RowSelectable p -> Select.convert p + | SelectedCells p -> p |> Seq.map Cell.convert |> box + | SelectedRows p -> box p + | SelectedColumns p -> box p + | SelectedRowIds p -> box p + | StartCell p -> Cell.convert p + | StyleAsListView p -> box p + | PageAction p -> MaybeActionType.convert p + | PageCurrent p -> box p + | PageCount p -> box p + | PageSize p -> box p + | Dropdown p -> p |> Map.map (fun _ -> Dropdown.convert) |> box + | DropdownConditional p -> p |> Seq.map ConditionalDropdown.convert |> box + | DropdownData p -> p |> Seq.map (Map.map (fun _ -> Dropdown.convert)) |> box + | Tooltip p -> p |> Map.map (fun _ -> Tooltip.convert) |> box + | TooltipConditional p -> box p + | TooltipData p -> p |> Seq.map (Map.map (fun _ -> DataTooltip.convert)) |> box + | TooltipHeader p -> p |> Map.map (fun _ -> HeaderTooltip.convert) |> box + | TooltipDelay p -> box p + | TooltipDuration p -> box p + | FilterQuery p -> box p + | FilterAction p -> FilterAction.convert p + | FilterOptions p -> FilterOption.convert p + | SortAction p -> MaybeActionType.convert p + | SortMode p -> SortMode.convert p + | SortBy p -> p |> Seq.map SortBy.convert |> box + | SortAsNull p -> box p + | StyleTable p -> box p + | StyleCell p -> box p + | StyleData p -> box p + | StyleFilter p -> box p + | StyleHeader p -> box p + | StyleCellConditional p -> p |> Seq.map ConditionalCellStyle.convert |> box + | StyleDataConditional p -> p |> Seq.map ConditionalDataStyle.convert |> box + | StyleFilterConditional p -> p |> Seq.map ConditionalFilterStyle.convert |> box + | StyleHeaderConditional p -> p |> Seq.map ConditionalHeaderStyle.convert |> box + | Virtualization p -> box p + | DerivedFilterQueryStructure p -> box p + | DerivedViewportData p -> box p + | DerivedViewportIndices p -> box p + | DerivedViewportRowIds p -> box p + | DerivedViewportSelectedColumns p -> box p + | DerivedViewportSelectedRows p -> box p + | DerivedViewportSelectedRowIds p -> box p + | DerivedVirtualData p -> box p + | DerivedVirtualIndices p -> box p + | DerivedVirtualRowIds p -> box p + | DerivedVirtualSelectedRows p -> box p + | DerivedVirtualSelectedRowIds p -> box p + | LoadingState p -> box p + | Persistence p -> box p + | PersistedProps p -> box p + | PersistenceType p -> PersistenceTypeOptions.convert p + + static member toNameOf = function + | ActiveCell _ -> "active_cell" + | Columns _ -> "columns" + | IncludeHeadersOnCopyPaste _ -> "include_headers_on_copy_paste" + | LocaleFormat _ -> "locale_format" + | MarkdownOptions _ -> "markdown_options" + | Css _ -> "css" + | Data _ -> "data" + | DataPrevious _ -> "data_previous" + | DataTimestamp _ -> "data_timestamp" + | Editable _ -> "editable" + | EndCell _ -> "end_cell" + | ExportColumns _ -> "export_columns" + | ExportFormat _ -> "export_format" + | ExportHeaders _ -> "export_headers" + | FillWidth _ -> "fill_width" + | HiddenColumns _ -> "hidden_columns" + | IsFocused _ -> "is_focused" + | MergeDuplicateHeaders _ -> "merge_duplicate_headers" + | FixedColumns _ -> "fixed_columns" + | FixedRows _ -> "fixed_rows" + | ColumnSelectable _ -> "column_selectable" + | RowDeletable _ -> "row_deletable" + | CellSelectable _ -> "cell_selectable" + | RowSelectable _ -> "row_selectable" + | SelectedCells _ -> "selected_cells" + | SelectedRows _ -> "selected_rows" + | SelectedColumns _ -> "selected_columns" + | SelectedRowIds _ -> "selected_row_ids" + | StartCell _ -> "start_cell" + | StyleAsListView _ -> "style_as_list_view" + | PageAction _ -> "page_action" + | PageCurrent _ -> "page_current" + | PageCount _ -> "page_count" + | PageSize _ -> "page_size" + | Dropdown _ -> "dropdown" + | DropdownConditional _ -> "dropdown_conditional" + | DropdownData _ -> "dropdown_data" + | Tooltip _ -> "tooltip" + | TooltipConditional _ -> "tooltip_conditional" + | TooltipData _ -> "tooltip_data" + | TooltipHeader _ -> "tooltip_header" + | TooltipDelay _ -> "tooltip_delay" + | TooltipDuration _ -> "tooltip_duration" + | FilterQuery _ -> "filter_query" + | FilterAction _ -> "filter_action" + | FilterOptions _ -> "filter_options" + | SortAction _ -> "sort_action" + | SortMode _ -> "sort_mode" + | SortBy _ -> "sort_by" + | SortAsNull _ -> "sort_as_null" + | StyleTable _ -> "style_table" + | StyleCell _ -> "style_cell" + | StyleData _ -> "style_data" + | StyleFilter _ -> "style_filter" + | StyleHeader _ -> "style_header" + | StyleCellConditional _ -> "style_cell_conditional" + | StyleDataConditional _ -> "style_data_conditional" + | StyleFilterConditional _ -> "style_filter_conditional" + | StyleHeaderConditional _ -> "style_header_conditional" + | Virtualization _ -> "virtualization" + | DerivedFilterQueryStructure _ -> "derived_filter_query_structure" + | DerivedViewportData _ -> "derived_viewport_data" + | DerivedViewportIndices _ -> "derived_viewport_indices" + | DerivedViewportRowIds _ -> "derived_viewport_row_ids" + | DerivedViewportSelectedColumns _ -> "derived_viewport_selected_columns" + | DerivedViewportSelectedRows _ -> "derived_viewport_selected_rows" + | DerivedViewportSelectedRowIds _ -> "derived_viewport_selected_row_ids" + | DerivedVirtualData _ -> "derived_virtual_data" + | DerivedVirtualIndices _ -> "derived_virtual_indices" + | DerivedVirtualRowIds _ -> "derived_virtual_row_ids" + | DerivedVirtualSelectedRows _ -> "derived_virtual_selected_rows" + | DerivedVirtualSelectedRowIds _ -> "derived_virtual_selected_row_ids" + | LoadingState _ -> "loading_state" + | Persistence _ -> "persistence" + | PersistedProps _ -> "persisted_props" + | PersistenceType _ -> "persistence_type" + + static member toDynamicMemberDef(prop: Prop) = + prop |> Prop.toNameOf, prop |> Prop.convert + + static member setValueOpt dynamicObj toProp propName = + Option.map (toProp >> Prop.convert) + >> DynObj.setValueOpt dynamicObj propName + + /// + ///A list of children or a property for this dash component + /// + type Attr = + | Prop of Prop + | Children of DashComponent list + /// + ///The row and column indices and IDs of the currently active cell. + ///`row_id` is only returned if the data rows have an `id` key. + /// + static member activeCell(p: ActiveCell) = Prop(ActiveCell p) + /// + ///Columns describes various aspects about each individual column. + ///`name` and `id` are the only required parameters. + /// + static member columns(p: #seq) = Prop(Columns p) + /// + ///If true, headers are included when copying from the table to different + ///tabs and elsewhere. Note that headers are ignored when copying from the table onto itself and + ///between two tables within the same tab. + /// + static member includeHeadersOnCopyPaste(p: bool) = Prop(IncludeHeadersOnCopyPaste p) + /// + ///The localization specific formatting information applied to all columns in the table. + ///This prop is derived from the [d3.formatLocale](https://github.com/d3/d3-format#formatLocale) data structure specification. + ///When left unspecified, each individual nested prop will default to a pre-determined value. + /// + static member localeFormat(p: LocaleFormat) = Prop(LocaleFormat p) + /// + ///The `markdown_options` property allows customization of the markdown cells behavior. + /// + static member markdownOptions(p: MarkdownOptions) = Prop(MarkdownOptions p) + /// + ///The `css` property is a way to embed CSS selectors and rules + ///onto the page. + ///We recommend starting with the `style_*` properties + ///before using this `css` property. + ///Example: + ///[ + /// {"selector": ".dash-spreadsheet", "rule": 'font-family: "monospace"'} + ///] + /// + static member css(p: #seq) = Prop(Css p) + /// + ///The contents of the table. + ///The keys of each item in data should match the column IDs. + ///Each item can also have an 'id' key, whose value is its row ID. If there + ///is a column with ID='id' this will display the row ID, otherwise it is + ///just used to reference the row for selections, filtering, etc. + ///Example: + ///[ + /// {'column-1': 4.5, 'column-2': 'montreal', 'column-3': 'canada'}, + /// {'column-1': 8, 'column-2': 'boston', 'column-3': 'america'} + ///] + /// + static member data(p: #seq ) = Prop(Data p) + /// + ///The previous state of `data`. `data_previous` + ///has the same structure as `data` and it will be updated + ///whenever `data` changes, either through a callback or + ///by editing the table. + ///This is a read-only property: setting this property will not + ///have any impact on the table. + /// + static member dataPrevious(p: #seq) = Prop(DataPrevious p) + /// + ///The unix timestamp when the data was last edited. + ///Use this property with other timestamp properties + ///(such as `n_clicks_timestamp` in `dash_html_components`) + ///to determine which property has changed within a callback. + /// + static member dataTimestamp(p: int64) = Prop(DataTimestamp p) + /// + ///If True, then the data in all of the cells is editable. + ///When `editable` is True, particular columns can be made + ///uneditable by setting `editable` to `False` inside the `columns` + ///property. + ///If False, then the data in all of the cells is uneditable. + ///When `editable` is False, particular columns can be made + ///editable by setting `editable` to `True` inside the `columns` + ///property. + /// + static member editable(p: bool) = Prop(Editable p) + /// + ///When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`end_cell` represents the row / column coordinates and IDs of the cell + ///in one of the corners of the region. + ///`start_cell` represents the coordinates of the other corner. + /// + static member endCell(p: Cell) = Prop(EndCell p) + /// + ///Denotes the columns that will be used in the export data file. + ///If `all`, all columns will be used (visible + hidden). If `visible`, + ///only the visible columns will be used. Defaults to `visible`. + /// + static member exportColumns(p: ExportColumns) = Prop(ExportColumns p) + /// + ///Denotes the type of the export data file, + ///Defaults to `'none'` + /// + static member exportFormat(p: MaybeExportFormat) = Prop(ExportFormat p) + /// + ///Denotes the format of the headers in the export data file. + ///If `'none'`, there will be no header. If `'display'`, then the header + ///of the data file will be be how it is currently displayed. Note that + ///`'display'` is only supported for `'xlsx'` export_format and will behave + ///like `'names'` for `'csv'` export format. If `'ids'` or `'names'`, + ///then the headers of data file will be the column id or the column + ///names, respectively + /// + static member exportHeaders(p: MaybeExportHeaders) = Prop(ExportHeaders p) + /// + ///`fill_width` toggles between a set of CSS for two common behaviors: + ///True: The table container's width will grow to fill the available space; + ///False: The table container's width will equal the width of its content. + /// + static member fillWidth(p: bool) = Prop(FillWidth p) + /// + ///List of columns ids of the columns that are currently hidden. + ///See the associated nested prop `columns.hideable`. + /// + static member hiddenColumns(p: #seq) = Prop(HiddenColumns p) + /// + ///If True, then the `active_cell` is in a focused state. + /// + static member isFocused(p: bool) = Prop(IsFocused p) + /// + ///If True, then column headers that have neighbors with duplicate names + ///will be merged into a single cell. + ///This will be applied for single column headers and multi-column + ///headers. + /// + static member mergeDuplicateHeaders(p: bool) = Prop(MergeDuplicateHeaders p) + /// + ///`fixed_columns` will "fix" the set of columns so that + ///they remain visible when scrolling horizontally across + ///the unfixed columns. `fixed_columns` fixes columns + ///from left-to-right. + ///If `headers` is False, no columns are fixed. + ///If `headers` is True, all operation columns (see `row_deletable` and `row_selectable`) + ///are fixed. Additional data columns can be fixed by + ///assigning a number to `data`. + ///Note that fixing columns introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + static member fixedColumns(p: Fixed) = Prop(FixedColumns p) + /// + ///`fixed_rows` will "fix" the set of rows so that + ///they remain visible when scrolling vertically down + ///the table. `fixed_rows` fixes rows + ///from top-to-bottom, starting from the headers. + ///If `headers` is False, no rows are fixed. + ///If `headers` is True, all header and filter rows (see `filter_action`) are + ///fixed. Additional data rows can be fixed by assigning + ///a number to `data`. Note that fixing rows introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + static member fixedRows(p: Fixed) = Prop(FixedRows p) + /// + ///If `single`, then the user can select a single column or group + ///of merged columns via the radio button that will appear in the + ///header rows. + ///If `multi`, then the user can select multiple columns or groups + ///of merged columns via the checkbox that will appear in the header + ///rows. + ///If false, then the user will not be able to select columns and no + ///input will appear in the header rows. + ///When a column is selected, its id will be contained in `selected_columns` + ///and `derived_viewport_selected_columns`. + /// + static member columnSelectable(p: Select) = Prop(ColumnSelectable p) + /// + ///If True, then a `x` will appear next to each `row` + ///and the user can delete the row. + /// + static member rowDeletable(p: bool) = Prop(RowDeletable p) + /// + ///If True (default), then it is possible to click and navigate + ///table cells. + /// + static member cellSelectable(p: bool) = Prop(CellSelectable p) + /// + ///If `single`, then the user can select a single row + ///via a radio button that will appear next to each row. + ///If `multi`, then the user can select multiple rows + ///via a checkbox that will appear next to each row. + ///If false, then the user will not be able to select rows + ///and no additional UI elements will appear. + ///When a row is selected, its index will be contained + ///in `selected_rows`. + /// + static member rowSelectable(p: Select) = Prop(RowSelectable p) + /// + ///`selected_cells` represents the set of cells that are selected, + ///as an array of objects, each item similar to `active_cell`. + ///Multiple cells can be selected by holding down shift and + ///clicking on a different cell or holding down shift and navigating + ///with the arrow keys. + /// + static member selectedCells(p: #seq) = Prop(SelectedCells p) + /// + ///`selected_rows` contains the indices of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + static member selectedRows(p: #seq) = Prop(SelectedRows p) + /// + ///`selected_columns` contains the ids of columns that + ///are selected via the UI elements that appear when + ///`column_selectable` is `'single' or 'multi'`. + /// + static member selectedColumns(p: #seq) = Prop(SelectedColumns p) + /// + ///`selected_row_ids` contains the ids of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + static member selectedRowIds(p: #seq) = Prop(SelectedRowIds p) + /// + ///When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`start_cell` represents the [row, column] coordinates of the cell + ///in one of the corners of the region. + ///`end_cell` represents the coordinates of the other corner. + /// + static member startCell(p: Cell) = Prop(StartCell p) + /// + ///If True, then the table will be styled like a list view + ///and not have borders between the columns. + /// + static member styleAsListView(p: bool) = Prop(StyleAsListView p) + /// + ///`page_action` refers to a mode of the table where + ///not all of the rows are displayed at once: only a subset + ///are displayed (a "page") and the next subset of rows + ///can viewed by clicking "Next" or "Previous" buttons + ///at the bottom of the page. + ///Pagination is used to improve performance: instead of + ///rendering all of the rows at once (which can be expensive), + ///we only display a subset of them. + ///With pagination, we can either page through data that exists + ///in the table (e.g. page through `10,000` rows in `data` `100` rows at a time) + ///or we can update the data on-the-fly with callbacks + ///when the user clicks on the "Previous" or "Next" buttons. + ///These modes can be toggled with this `page_action` parameter: + ///`'native'`: all data is passed to the table up-front, paging logic is + ///handled by the table; + ///`'custom'`: data is passed to the table one page at a time, paging logic + ///is handled via callbacks; + ///`'none'`: disables paging, render all of the data at once. + /// + static member pageAction(p: MaybeActionType) = Prop(PageAction p) + /// + ///`page_current` represents which page the user is on. + ///Use this property to index through data in your callbacks with + ///backend paging. + /// + static member pageCurrent(p: int) = Prop(PageCurrent p) + /// + ///`page_count` represents the number of the pages in the + ///paginated table. This is really only useful when performing + ///backend pagination, since the front end is able to use the + ///full size of the table to calculate the number of pages. + /// + static member pageCount(p: int) = Prop(PageCount p) + /// + ///`page_size` represents the number of rows that will be + ///displayed on a particular page when `page_action` is `'custom'` or `'native'` + /// + static member pageSize(p: int) = Prop(PageSize p) + /// + ///`dropdown` specifies dropdown options for different columns. + ///Each entry refers to the column ID. + ///The `clearable` property defines whether the value can be deleted. + ///The `options` property refers to the `options` of the dropdown. + /// + static member dropdown(p: Map) = Prop(Dropdown p) + /// + ///`dropdown_conditional` specifies dropdown options in various columns and cells. + ///This property allows you to specify different dropdowns + ///depending on certain conditions. For example, you may + ///render different "city" dropdowns in a row depending on the + ///current value in the "state" column. + /// + static member dropdownConditional(p: #seq) = Prop(DropdownConditional p) + /// + ///`dropdown_data` specifies dropdown options on a row-by-row, column-by-column basis. + ///Each item in the array corresponds to the corresponding dropdowns for the `data` item + ///at the same index. Each entry in the item refers to the Column ID. + /// + static member dropdownData(p: seq>) = Prop(DropdownData p) + /// + ///`tooltip` is the column based tooltip configuration applied to all rows. The key is the column + /// id and the value is a tooltip configuration. + ///Example: {i: {'value': i, 'use_with: 'both'} for i in df.columns} + /// + static member tooltip(p: Map) = Prop(Tooltip p) + /// + ///`tooltip_conditional` represents the tooltip shown + ///for different columns and cells. + ///This property allows you to specify different tooltips + ///depending on certain conditions. For example, you may have + ///different tooltips in the same column based on the value + ///of a certain data property. + ///Priority is from first to last defined conditional tooltip + ///in the list. Higher priority (more specific) conditional + ///tooltips should be put at the beginning of the list. + /// + static member tooltipConditional(p: #seq) = Prop(TooltipConditional p) + /// + ///`tooltip_data` represents the tooltip shown + ///for different columns and cells. + ///A list of dicts for which each key is + ///a column id and the value is a tooltip configuration. + /// + static member tooltipData(p: #seq>) = Prop(TooltipData p) + /// + ///`tooltip_header` represents the tooltip shown + ///for each header column and optionally each header row. + ///Example to show long column names in a tooltip: {i: i for i in df.columns}. + ///Example to show different column names in a tooltip: {'Rep': 'Republican', 'Dem': 'Democrat'}. + ///If the table has multiple rows of headers, then use a list as the value of the + ///`tooltip_header` items. + /// + static member tooltipHeader(p: Map) = Prop(TooltipHeader p) + /// + ///`tooltip_delay` represents the table-wide delay in milliseconds before + ///the tooltip is shown when hovering a cell. If set to `None`, the tooltip + ///will be shown immediately. + ///Defaults to 350. + /// + static member tooltipDelay(p: int) = Prop(TooltipDelay p) + /// + ///`tooltip_duration` represents the table-wide duration in milliseconds + ///during which the tooltip will be displayed when hovering a cell. If + ///set to `None`, the tooltip will not disappear. + ///Defaults to 2000. + /// + static member tooltipDuration(p: int) = Prop(TooltipDuration p) + /// + ///If `filter_action` is enabled, then the current filtering + ///string is represented in this `filter_query` + ///property. + /// + static member filterQuery(p: string) = Prop(FilterQuery p) + /// + ///The `filter_action` property controls the behavior of the `filtering` UI. + ///If `'none'`, then the filtering UI is not displayed. + ///If `'native'`, then the filtering UI is displayed and the filtering + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, then the filtering UI is displayed but it is the + ///responsibility of the developer to program the filtering + ///through a callback (where `filter_query` or `derived_filter_query_structure` would be the input + ///and `data` would be the output). + /// + static member filterAction(p: MaybeActionType) = Prop(FilterAction(FilterAction.Type p)) + /// + ///The `filter_action` property controls the behavior of the `filtering` UI. + ///If `'none'`, then the filtering UI is not displayed. + ///If `'native'`, then the filtering UI is displayed and the filtering + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, then the filtering UI is displayed but it is the + ///responsibility of the developer to program the filtering + ///through a callback (where `filter_query` or `derived_filter_query_structure` would be the input + ///and `data` would be the output). + /// + static member filterAction(p: ConditionalFilterAction) = Prop(FilterAction(FilterAction.Conditional p)) + /// + ///There are two `filter_options` props in the table. + ///This is the table-level filter_options prop and there is + ///also the column-level `filter_options` prop. + ///These props determine whether the applicable filter relational + ///operators will default to `sensitive` or `insensitive` comparison. + ///If the column-level `filter_options` prop is set it overrides + ///the table-level `filter_options` prop for that column. + /// + static member filterOptions(p: FilterOption) = Prop(FilterOptions p) + /// + ///The `sort_action` property enables data to be + ///sorted on a per-column basis. + ///If `'none'`, then the sorting UI is not displayed. + ///If `'native'`, then the sorting UI is displayed and the sorting + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, the the sorting UI is displayed but it is the + ///responsibility of the developer to program the sorting + ///through a callback (where `sort_by` would be the input and `data` + ///would be the output). + ///Clicking on the sort arrows will update the + ///`sort_by` property. + /// + static member sortAction(p: MaybeActionType) = Prop(SortAction p) + /// + ///Sorting can be performed across multiple columns + ///(e.g. sort by country, sort within each country, + /// sort by year) or by a single column. + ///NOTE - With multi-column sort, it's currently + ///not possible to determine the order in which + ///the columns were sorted through the UI. + ///See [https://github.com/plotly/dash-table/issues/170](https://github.com/plotly/dash-table/issues/170) + /// + static member sortMode(p: SortMode) = Prop(SortMode p) + /// + ///`sort_by` describes the current state + ///of the sorting UI. + ///That is, if the user clicked on the sort arrow + ///of a column, then this property will be updated + ///with the column ID and the direction + ///(`asc` or `desc`) of the sort. + ///For multi-column sorting, this will be a list of + ///sorting parameters, in the order in which they were + ///clicked. + /// + static member sortBy(p: #seq) = Prop(SortBy p) + /// + ///An array of string, number and boolean values that are treated as `None` + ///(i.e. ignored and always displayed last) when sorting. + ///This value will be used by columns without `sort_as_null`. + ///Defaults to `[]`. + /// + static member sortAsNull(p: #seq) = Prop(SortAsNull p) + /// + ///CSS styles to be applied to the outer `table` container. + ///This is commonly used for setting properties like the + ///width or the height of the table. + /// + static member styleTable(p: seq) = Prop(StyleTable(DashComponentStyle.fromCssStyle p)) + /// + ///CSS styles to be applied to each individual cell of the table. + ///This includes the header cells, the `data` cells, and the filter + ///cells. + /// + static member styleCell(p: seq) = Prop(StyleCell(DashComponentStyle.fromCssStyle p)) + /// + ///CSS styles to be applied to each individual data cell. + ///That is, unlike `style_cell`, it excludes the header and filter cells. + /// + static member styleData(p: seq) = Prop(StyleData(DashComponentStyle.fromCssStyle p)) + /// + ///CSS styles to be applied to the filter cells. + ///Note that this may change in the future as we build out a + ///more complex filtering UI. + /// + static member styleFilter(p: seq) = Prop(StyleFilter(DashComponentStyle.fromCssStyle p)) + /// + ///CSS styles to be applied to each individual header cell. + ///That is, unlike `style_cell`, it excludes the `data` and filter cells. + /// + static member styleHeader(p: seq) = Prop(StyleHeader(DashComponentStyle.fromCssStyle p)) + /// + ///Conditional CSS styles for the cells. + ///This can be used to apply styles to cells on a per-column basis. + /// + static member styleCellConditional(p: #seq) = Prop(StyleCellConditional p) + /// + ///Conditional CSS styles for the data cells. + ///This can be used to apply styles to data cells on a per-column basis. + /// + static member styleDataConditional(p: #seq) = Prop(StyleDataConditional p) + /// + ///Conditional CSS styles for the filter cells. + ///This can be used to apply styles to filter cells on a per-column basis. + /// + static member styleFilterConditional(p: #seq) = Prop(StyleFilterConditional p) + /// + ///Conditional CSS styles for the header cells. + ///This can be used to apply styles to header cells on a per-column basis. + /// + static member styleHeaderConditional(p: #seq) = Prop(StyleHeaderConditional p) + /// + ///This property tells the table to use virtualization when rendering. + ///Assumptions are that: + ///the width of the columns is fixed; + ///the height of the rows is always the same; and + ///runtime styling changes will not affect width and height vs. first rendering + /// + static member virtualization(p: bool) = Prop(Virtualization p) + /// + ///This property represents the current structure of + ///`filter_query` as a tree structure. Each node of the + ///query structure has: + ///type (string; required): + /// 'open-block', + /// 'logical-operator', + /// 'relational-operator', + /// 'unary-operator', or + /// 'expression'; + ///subType (string; optional): + /// 'open-block': '()', + /// 'logical-operator': '&&', '||', + /// 'relational-operator': '=', '>=', '>', '<=', '<', '!=', 'contains', + /// 'unary-operator': '!', 'is bool', 'is even', 'is nil', 'is num', 'is object', 'is odd', 'is prime', 'is str', + /// 'expression': 'value', 'field'; + ///value (any): + /// 'expression, value': passed value, + /// 'expression, field': the field/prop name. + ///block (nested query structure; optional). + ///left (nested query structure; optional). + ///right (nested query structure; optional). + ///If the query is invalid or empty, the `derived_filter_query_structure` will + ///be `None`. + /// + static member derivedFilterQueryStructure(p: obj) = Prop(DerivedFilterQueryStructure p) + /// + ///This property represents the current state of `data` + ///on the current page. This property will be updated + ///on paging, sorting, and filtering. + /// + static member derivedViewportData(p: #seq) = Prop(DerivedViewportData p) + /// + ///`derived_viewport_indices` indicates the order in which the original + ///rows appear after being filtered, sorted, and/or paged. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + static member derivedViewportIndices(p: #seq) = Prop(DerivedViewportIndices p) + /// + ///`derived_viewport_row_ids` lists row IDs in the order they appear + ///after being filtered, sorted, and/or paged. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + static member derivedViewportRowIds(p: #seq) = Prop(DerivedViewportRowIds p) + /// + ///`derived_viewport_selected_columns` contains the ids of the + ///`selected_columns` that are not currently hidden. + /// + static member derivedViewportSelectedColumns(p: #seq) = + Prop(DerivedViewportSelectedColumns p) + /// + ///`derived_viewport_selected_rows` represents the indices of the + ///`selected_rows` from the perspective of the `derived_viewport_indices`. + /// + static member derivedViewportSelectedRows(p: #seq) = Prop(DerivedViewportSelectedRows p) + /// + ///`derived_viewport_selected_row_ids` represents the IDs of the + ///`selected_rows` on the currently visible page. + /// + static member derivedViewportSelectedRowIds(p: #seq) = Prop(DerivedViewportSelectedRowIds p) + /// + ///This property represents the visible state of `data` + ///across all pages after the front-end sorting and filtering + ///as been applied. + /// + static member derivedVirtualData(p: #seq) = Prop(DerivedVirtualData p) + /// + ///`derived_virtual_indices` indicates the order in which the original + ///rows appear after being filtered and sorted. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + static member derivedVirtualIndices(p: #seq) = Prop(DerivedVirtualIndices p) + /// + ///`derived_virtual_row_ids` indicates the row IDs in the order in which + ///they appear after being filtered and sorted. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + static member derivedVirtualRowIds(p: #seq) = Prop(DerivedVirtualRowIds p) + /// + ///`derived_virtual_selected_rows` represents the indices of the + /// `selected_rows` from the perspective of the `derived_virtual_indices`. + /// + static member derivedVirtualSelectedRows(p: #seq) = Prop(DerivedVirtualSelectedRows p) + /// + ///`derived_virtual_selected_row_ids` represents the IDs of the + ///`selected_rows` as they appear after filtering and sorting, + ///across all pages. + /// + static member derivedVirtualSelectedRowIds(p: #seq) = Prop(DerivedVirtualSelectedRowIds p) + /// + ///Object that holds the loading state object coming from dash-renderer + /// + static member loadingState(p: LoadingState) = Prop(LoadingState p) + /// + ///Used to allow user interactions in this component to be persisted when + ///the component - or the page - is refreshed. If `persisted` is truthy and + ///hasn't changed from its previous value, any `persisted_props` that the + ///user has changed while using the app will keep those changes, as long as + ///the new prop value also matches what was given originally. + ///Used in conjunction with `persistence_type` and `persisted_props`. + /// + static member persistence(p: IConvertible) = Prop(Persistence p) + /// + ///Properties whose user interactions will persist after refreshing the + ///component or the page. + /// + static member persistedProps(p: string []) = Prop(PersistedProps p) + /// + ///The child or children of this dash component + /// + static member children(value: int) = Children [ Html.text value ] + /// + ///The child or children of this dash component + /// + static member children(value: string) = Children [ Html.text value ] + /// + ///The child or children of this dash component + /// + static member children(value: float) = Children [ Html.text value ] + /// + ///The child or children of this dash component + /// + static member children(value: Guid) = Children [ Html.text value ] + /// + ///The child or children of this dash component + /// + static member children(value: DashComponent) = Children [ value ] + /// + ///The child or children of this dash component + /// + static member children(value: DashComponent list) = Children(value) + /// + ///The child or children of this dash component + /// + static member children(value: seq) = Children(List.ofSeq value) + + /// + ///Dash DataTable is an interactive table component designed for + ///designed for viewing, editing, and exploring large datasets. + ///DataTable is rendered with standard, semantic HTML <table/> markup, + ///which makes it accessible, responsive, and easy to style. This + ///component was written from scratch in React.js specifically for the + ///Dash community. Its API was designed to be ergonomic and its behavior + ///is completely customizable through its properties. + /// + type DataTable() = + inherit DashComponent() + static member applyMembers + ( + id: string, + children: seq, + ?activeCell: ActiveCell, + ?columns: seq, + ?includeHeadersOnCopyPaste: bool, + ?localeFormat: LocaleFormat, + ?markdownOptions: MarkdownOptions, + ?css: seq, + ?data: seq, + ?dataPrevious: seq, + ?dataTimestamp: int64, + ?editable: bool, + ?endCell: Cell, + ?exportColumns: ExportColumns, + ?exportFormat: MaybeExportFormat, + ?exportHeaders: MaybeExportHeaders, + ?fillWidth: bool, + ?hiddenColumns: seq, + ?isFocused: bool, + ?mergeDuplicateHeaders: bool, + ?fixedColumns: Fixed, + ?fixedRows: Fixed, + ?columnSelectable: Select, + ?rowDeletable: bool, + ?cellSelectable: bool, + ?rowSelectable: Select, + ?selectedCells: seq, + ?selectedRows: seq, + ?selectedColumns: seq, + ?selectedRowIds: seq, + ?startCell: Cell, + ?styleAsListView: bool, + ?pageAction: MaybeActionType, + ?pageCurrent: int, + ?pageCount: int, + ?pageSize: int, + ?dropdown: Map, + ?dropdownConditional: seq, + ?dropdownData: seq>, + ?tooltip: Map, + ?tooltipConditional: seq, + ?tooltipData: seq>, + ?tooltipHeader: Map, + ?tooltipDelay: int, + ?tooltipDuration: int, + ?filterQuery: string, + ?filterAction: FilterAction, + ?filterOptions: FilterOption, + ?sortAction: MaybeActionType, + ?sortMode: SortMode, + ?sortBy: seq, + ?sortAsNull: seq, + ?styleTable: DashComponentStyle, + ?styleCell: DashComponentStyle, + ?styleData: DashComponentStyle, + ?styleFilter: DashComponentStyle, + ?styleHeader: DashComponentStyle, + ?styleCellConditional: seq, + ?styleDataConditional: seq, + ?styleFilterConditional: seq, + ?styleHeaderConditional: seq, + ?virtualization: bool, + ?derivedFilterQueryStructure: obj, + ?derivedViewportData: seq, + ?derivedViewportIndices: seq, + ?derivedViewportRowIds: seq, + ?derivedViewportSelectedColumns: seq, + ?derivedViewportSelectedRows: seq, + ?derivedViewportSelectedRowIds: seq, + ?derivedVirtualData: seq, + ?derivedVirtualIndices: seq, + ?derivedVirtualRowIds: seq, + ?derivedVirtualSelectedRows: seq, + ?derivedVirtualSelectedRowIds: seq, + ?loadingState: LoadingState, + ?persistence: IConvertible, + ?persistedProps: string [], + ?persistenceType: PersistenceTypeOptions + ) = + (fun (t: DataTable) -> + let props = DashComponentProps() + + DynObj.setValue props "id" id + DynObj.setValue props "children" children + Prop.setValueOpt props ActiveCell "activeCell" activeCell + Prop.setValueOpt props Columns "columns" columns + Prop.setValueOpt props IncludeHeadersOnCopyPaste "includeHeadersOnCopyPaste" includeHeadersOnCopyPaste + Prop.setValueOpt props LocaleFormat "localeFormat" localeFormat + Prop.setValueOpt props MarkdownOptions "markdownOptions" markdownOptions + Prop.setValueOpt props Css "css" css + Prop.setValueOpt props Data "data" data + Prop.setValueOpt props DataPrevious "dataPrevious" dataPrevious + Prop.setValueOpt props DataTimestamp "dataTimestamp" dataTimestamp + Prop.setValueOpt props Editable "editable" editable + Prop.setValueOpt props EndCell "endCell" endCell + Prop.setValueOpt props ExportColumns "exportColumns" exportColumns + Prop.setValueOpt props ExportFormat "exportFormat" exportFormat + Prop.setValueOpt props ExportHeaders "exportHeaders" exportHeaders + Prop.setValueOpt props FillWidth "fillWidth" fillWidth + Prop.setValueOpt props HiddenColumns "hiddenColumns" hiddenColumns + Prop.setValueOpt props IsFocused "isFocused" isFocused + Prop.setValueOpt props MergeDuplicateHeaders "mergeDuplicateHeaders" mergeDuplicateHeaders + Prop.setValueOpt props FixedColumns "fixedColumns" fixedColumns + Prop.setValueOpt props FixedRows "fixedRows" fixedRows + Prop.setValueOpt props ColumnSelectable "columnSelectable" columnSelectable + Prop.setValueOpt props RowDeletable "rowDeletable" rowDeletable + Prop.setValueOpt props CellSelectable "cellSelectable" cellSelectable + Prop.setValueOpt props RowSelectable "rowSelectable" rowSelectable + Prop.setValueOpt props SelectedCells "selectedCells" selectedCells + Prop.setValueOpt props SelectedRows "selectedRows" selectedRows + Prop.setValueOpt props SelectedColumns "selectedColumns" selectedColumns + Prop.setValueOpt props SelectedRowIds "selectedRowIds" selectedRowIds + Prop.setValueOpt props StartCell "startCell" startCell + Prop.setValueOpt props StyleAsListView "styleAsListView" styleAsListView + Prop.setValueOpt props PageAction "pageAction" pageAction + Prop.setValueOpt props PageCurrent "pageCurrent" pageCurrent + Prop.setValueOpt props PageCount "pageCount" pageCount + Prop.setValueOpt props PageSize "pageSize" pageSize + Prop.setValueOpt props Dropdown "dropdown" dropdown + Prop.setValueOpt props DropdownConditional "dropdownConditional" dropdownConditional + Prop.setValueOpt props DropdownData "dropdownData" dropdownData + Prop.setValueOpt props Tooltip "tooltip" tooltip + Prop.setValueOpt props TooltipConditional "tooltipConditional" tooltipConditional + Prop.setValueOpt props TooltipData "tooltipData" tooltipData + Prop.setValueOpt props TooltipHeader "tooltipHeader" tooltipHeader + Prop.setValueOpt props TooltipDelay "tooltipDelay" tooltipDelay + Prop.setValueOpt props TooltipDuration "tooltipDuration" tooltipDuration + Prop.setValueOpt props FilterQuery "filterQuery" filterQuery + Prop.setValueOpt props FilterAction "filterAction" filterAction + Prop.setValueOpt props FilterOptions "filterOptions" filterOptions + Prop.setValueOpt props SortAction "sortAction" sortAction + Prop.setValueOpt props SortMode "sortMode" sortMode + Prop.setValueOpt props SortBy "sortBy" sortBy + Prop.setValueOpt props SortAsNull "sortAsNull" sortAsNull + Prop.setValueOpt props StyleTable "styleTable" styleTable + Prop.setValueOpt props StyleCell "styleCell" styleCell + Prop.setValueOpt props StyleData "styleData" styleData + Prop.setValueOpt props StyleFilter "styleFilter" styleFilter + Prop.setValueOpt props StyleHeader "styleHeader" styleHeader + Prop.setValueOpt props StyleCellConditional "styleCellConditional" styleCellConditional + Prop.setValueOpt props StyleDataConditional "styleDataConditional" styleDataConditional + Prop.setValueOpt props StyleFilterConditional "styleFilterConditional" styleFilterConditional + Prop.setValueOpt props StyleHeaderConditional "styleHeaderConditional" styleHeaderConditional + Prop.setValueOpt props Virtualization "virtualization" virtualization + Prop.setValueOpt props DerivedFilterQueryStructure "derivedFilterQueryStructure" derivedFilterQueryStructure + Prop.setValueOpt props DerivedViewportData "derivedViewportData" derivedViewportData + Prop.setValueOpt props DerivedViewportIndices "derivedViewportIndices" derivedViewportIndices + Prop.setValueOpt props DerivedViewportRowIds "derivedViewportRowIds" derivedViewportRowIds + Prop.setValueOpt props DerivedViewportSelectedColumns "derivedViewportSelectedColumns" derivedViewportSelectedColumns + Prop.setValueOpt props DerivedViewportSelectedRows "derivedViewportSelectedRows" derivedViewportSelectedRows + Prop.setValueOpt props DerivedViewportSelectedRowIds "derivedViewportSelectedRowIds" derivedViewportSelectedRowIds + Prop.setValueOpt props DerivedVirtualData "derivedVirtualData" derivedVirtualData + Prop.setValueOpt props DerivedVirtualIndices "derivedVirtualIndices" derivedVirtualIndices + Prop.setValueOpt props DerivedVirtualRowIds "derivedVirtualRowIds" derivedVirtualRowIds + Prop.setValueOpt props DerivedVirtualSelectedRows "derivedVirtualSelectedRows" derivedVirtualSelectedRows + Prop.setValueOpt props DerivedVirtualSelectedRowIds "derivedVirtualSelectedRowIds" derivedVirtualSelectedRowIds + Prop.setValueOpt props LoadingState "loadingState" loadingState + Prop.setValueOpt props Persistence "persistence" persistence + Prop.setValueOpt props PersistedProps "persistedProps" persistedProps + Prop.setValueOpt props PersistenceType "persistenceType" persistenceType + DynObj.setValue t "namespace" "dash_table" + DynObj.setValue t "props" props + DynObj.setValue t "type" "DataTable" + t) + + static member init + ( + id: string, + children: seq, + ?activeCell: ActiveCell, + ?columns: seq, + ?includeHeadersOnCopyPaste: bool, + ?localeFormat: LocaleFormat, + ?markdownOptions: MarkdownOptions, + ?css: seq, + ?data: seq, + ?dataPrevious: seq, + ?dataTimestamp: int64, + ?editable: bool, + ?endCell: Cell, + ?exportColumns: ExportColumns, + ?exportFormat: MaybeExportFormat, + ?exportHeaders: MaybeExportHeaders, + ?fillWidth: bool, + ?hiddenColumns: seq, + ?isFocused: bool, + ?mergeDuplicateHeaders: bool, + ?fixedColumns: Fixed, + ?fixedRows: Fixed, + ?columnSelectable: Select, + ?rowDeletable: bool, + ?cellSelectable: bool, + ?rowSelectable: Select, + ?selectedCells: seq, + ?selectedRows: seq, + ?selectedColumns: seq, + ?selectedRowIds: seq, + ?startCell: Cell, + ?styleAsListView: bool, + ?pageAction: MaybeActionType, + ?pageCurrent: int, + ?pageCount: int, + ?pageSize: int, + ?dropdown: Map, + ?dropdownConditional: seq, + ?dropdownData: seq>, + ?tooltip: Map, + ?tooltipConditional: seq, + ?tooltipData: seq>, + ?tooltipHeader: Map, + ?tooltipDelay: int, + ?tooltipDuration: int, + ?filterQuery: string, + ?filterAction: FilterAction, + ?filterOptions: FilterOption, + ?sortAction: MaybeActionType, + ?sortMode: SortMode, + ?sortBy: seq, + ?sortAsNull: seq, + ?styleTable: DashComponentStyle, + ?styleCell: DashComponentStyle, + ?styleData: DashComponentStyle, + ?styleFilter: DashComponentStyle, + ?styleHeader: DashComponentStyle, + ?styleCellConditional: seq, + ?styleDataConditional: seq, + ?styleFilterConditional: seq, + ?styleHeaderConditional: seq, + ?virtualization: bool, + ?derivedFilterQueryStructure: obj, + ?derivedViewportData: seq, + ?derivedViewportIndices: seq, + ?derivedViewportRowIds: seq, + ?derivedViewportSelectedColumns: seq, + ?derivedViewportSelectedRows: seq, + ?derivedViewportSelectedRowIds: seq, + ?derivedVirtualData: seq, + ?derivedVirtualIndices: seq, + ?derivedVirtualRowIds: seq, + ?derivedVirtualSelectedRows: seq, + ?derivedVirtualSelectedRowIds: seq, + ?loadingState: LoadingState, + ?persistence: IConvertible, + ?persistedProps: string [], + ?persistenceType: PersistenceTypeOptions + ) = + DataTable.applyMembers + (id, + children, + ?activeCell = activeCell, + ?columns = columns, + ?includeHeadersOnCopyPaste = includeHeadersOnCopyPaste, + ?localeFormat = localeFormat, + ?markdownOptions = markdownOptions, + ?css = css, + ?data = data, + ?dataPrevious = dataPrevious, + ?dataTimestamp = dataTimestamp, + ?editable = editable, + ?endCell = endCell, + ?exportColumns = exportColumns, + ?exportFormat = exportFormat, + ?exportHeaders = exportHeaders, + ?fillWidth = fillWidth, + ?hiddenColumns = hiddenColumns, + ?isFocused = isFocused, + ?mergeDuplicateHeaders = mergeDuplicateHeaders, + ?fixedColumns = fixedColumns, + ?fixedRows = fixedRows, + ?columnSelectable = columnSelectable, + ?rowDeletable = rowDeletable, + ?cellSelectable = cellSelectable, + ?rowSelectable = rowSelectable, + ?selectedCells = selectedCells, + ?selectedRows = selectedRows, + ?selectedColumns = selectedColumns, + ?selectedRowIds = selectedRowIds, + ?startCell = startCell, + ?styleAsListView = styleAsListView, + ?pageAction = pageAction, + ?pageCurrent = pageCurrent, + ?pageCount = pageCount, + ?pageSize = pageSize, + ?dropdown = dropdown, + ?dropdownConditional = dropdownConditional, + ?dropdownData = dropdownData, + ?tooltip = tooltip, + ?tooltipConditional = tooltipConditional, + ?tooltipData = tooltipData, + ?tooltipHeader = tooltipHeader, + ?tooltipDelay = tooltipDelay, + ?tooltipDuration = tooltipDuration, + ?filterQuery = filterQuery, + ?filterAction = filterAction, + ?filterOptions = filterOptions, + ?sortAction = sortAction, + ?sortMode = sortMode, + ?sortBy = sortBy, + ?sortAsNull = sortAsNull, + ?styleTable = styleTable, + ?styleCell = styleCell, + ?styleData = styleData, + ?styleFilter = styleFilter, + ?styleHeader = styleHeader, + ?styleCellConditional = styleCellConditional, + ?styleDataConditional = styleDataConditional, + ?styleFilterConditional = styleFilterConditional, + ?styleHeaderConditional = styleHeaderConditional, + ?virtualization = virtualization, + ?derivedFilterQueryStructure = derivedFilterQueryStructure, + ?derivedViewportData = derivedViewportData, + ?derivedViewportIndices = derivedViewportIndices, + ?derivedViewportRowIds = derivedViewportRowIds, + ?derivedViewportSelectedColumns = derivedViewportSelectedColumns, + ?derivedViewportSelectedRows = derivedViewportSelectedRows, + ?derivedViewportSelectedRowIds = derivedViewportSelectedRowIds, + ?derivedVirtualData = derivedVirtualData, + ?derivedVirtualIndices = derivedVirtualIndices, + ?derivedVirtualRowIds = derivedVirtualRowIds, + ?derivedVirtualSelectedRows = derivedVirtualSelectedRows, + ?derivedVirtualSelectedRowIds = derivedVirtualSelectedRowIds, + ?loadingState = loadingState, + ?persistence = persistence, + ?persistedProps = persistedProps, + ?persistenceType = persistenceType) + (DataTable()) + + // TODO: Are these required? + //static member definition: LoadableComponentDefinition = + // { ComponentName = "DataTable" + // ComponentJavascript = + // [ "components\\DashTable\\async-export.js" + // "components\\DashTable\\async-highlight.js" + // "components\\DashTable\\async-table.js" + // "components\\DashTable\\bundle.js" + // "components\\DashTable\\demo.js" ] } + + /// + ///Dash DataTable is an interactive table component designed for + ///designed for viewing, editing, and exploring large datasets. + ///DataTable is rendered with standard, semantic HTML <table/> markup, + ///which makes it accessible, responsive, and easy to style. This + ///component was written from scratch in React.js specifically for the + ///Dash community. Its API was designed to be ergonomic and its behavior + ///is completely customizable through its properties. + /// + ///Properties: + /// + ///• active_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - The row and column indices and IDs of the currently active cell. + ///`row_id` is only returned if the data rows have an `id` key. + /// + ///• columns (list with values of type: record with the fields: 'clearable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'deletable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'editable: boolean (optional)', 'filter_options: record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' (optional)', 'hideable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'renamable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'selectable: value equal to: 'first', 'last' | boolean | list with values of type: boolean (optional)', 'format: record with the fields: 'locale: record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' (optional)', 'nully: boolean | number | string | record | list (optional)', 'prefix: number (optional)', 'specifier: string (optional)' (optional)', 'id: string (required)', 'name: string | list with values of type: string (required)', 'presentation: value equal to: 'input', 'dropdown', 'markdown' (optional)', 'on_change: record with the fields: 'action: value equal to: 'coerce', 'none', 'validate' (optional)', 'failure: value equal to: 'accept', 'default', 'reject' (optional)' (optional)', 'sort_as_null: list with values of type: string | number | boolean (optional)', 'validation: record with the fields: 'allow_null: boolean (optional)', 'default: boolean | number | string | record | list (optional)', 'allow_YY: boolean (optional)' (optional)', 'type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)') - Columns describes various aspects about each individual column. + ///`name` and `id` are the only required parameters. + /// + ///• include_headers_on_copy_paste (boolean; default false) - If true, headers are included when copying from the table to different + ///tabs and elsewhere. Note that headers are ignored when copying from the table onto itself and + ///between two tables within the same tab. + /// + ///• locale_format (record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)') - The localization specific formatting information applied to all columns in the table. + ///This prop is derived from the [d3.formatLocale](https://github.com/d3/d3-format#formatLocale) data structure specification. + ///When left unspecified, each individual nested prop will default to a pre-determined value. + /// + ///• markdown_options (record with the fields: 'link_target: string | value equal to: '_blank', '_parent', '_self', '_top' (optional)', 'html: boolean (optional)'; default { + /// link_target: '_blank', + /// html: false + ///}) - The `markdown_options` property allows customization of the markdown cells behavior. + /// + ///• css (list with values of type: record with the fields: 'selector: string (required)', 'rule: string (required)'; default []) - The `css` property is a way to embed CSS selectors and rules + ///onto the page. + ///We recommend starting with the `style_*` properties + ///before using this `css` property. + ///Example: + ///[ + /// {"selector": ".dash-spreadsheet", "rule": 'font-family: "monospace"'} + ///] + /// + ///• data (list with values of type: record) - The contents of the table. + ///The keys of each item in data should match the column IDs. + ///Each item can also have an 'id' key, whose value is its row ID. If there + ///is a column with ID='id' this will display the row ID, otherwise it is + ///just used to reference the row for selections, filtering, etc. + ///Example: + ///[ + /// {'column-1': 4.5, 'column-2': 'montreal', 'column-3': 'canada'}, + /// {'column-1': 8, 'column-2': 'boston', 'column-3': 'america'} + ///] + /// + ///• data_previous (list with values of type: record) - The previous state of `data`. `data_previous` + ///has the same structure as `data` and it will be updated + ///whenever `data` changes, either through a callback or + ///by editing the table. + ///This is a read-only property: setting this property will not + ///have any impact on the table. + /// + ///• data_timestamp (number) - The unix timestamp when the data was last edited. + ///Use this property with other timestamp properties + ///(such as `n_clicks_timestamp` in `dash_html_components`) + ///to determine which property has changed within a callback. + /// + ///• editable (boolean; default false) - If True, then the data in all of the cells is editable. + ///When `editable` is True, particular columns can be made + ///uneditable by setting `editable` to `False` inside the `columns` + ///property. + ///If False, then the data in all of the cells is uneditable. + ///When `editable` is False, particular columns can be made + ///editable by setting `editable` to `True` inside the `columns` + ///property. + /// + ///• end_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`end_cell` represents the row / column coordinates and IDs of the cell + ///in one of the corners of the region. + ///`start_cell` represents the coordinates of the other corner. + /// + ///• export_columns (value equal to: 'all', 'visible'; default visible) - Denotes the columns that will be used in the export data file. + ///If `all`, all columns will be used (visible + hidden). If `visible`, + ///only the visible columns will be used. Defaults to `visible`. + /// + ///• export_format (value equal to: 'csv', 'xlsx', 'none'; default none) - Denotes the type of the export data file, + ///Defaults to `'none'` + /// + ///• export_headers (value equal to: 'none', 'ids', 'names', 'display') - Denotes the format of the headers in the export data file. + ///If `'none'`, there will be no header. If `'display'`, then the header + ///of the data file will be be how it is currently displayed. Note that + ///`'display'` is only supported for `'xlsx'` export_format and will behave + ///like `'names'` for `'csv'` export format. If `'ids'` or `'names'`, + ///then the headers of data file will be the column id or the column + ///names, respectively + /// + ///• fill_width (boolean; default true) - `fill_width` toggles between a set of CSS for two common behaviors: + ///True: The table container's width will grow to fill the available space; + ///False: The table container's width will equal the width of its content. + /// + ///• hidden_columns (list with values of type: string) - List of columns ids of the columns that are currently hidden. + ///See the associated nested prop `columns.hideable`. + /// + ///• id (string) - The ID of the table. + /// + ///• is_focused (boolean) - If True, then the `active_cell` is in a focused state. + /// + ///• merge_duplicate_headers (boolean) - If True, then column headers that have neighbors with duplicate names + ///will be merged into a single cell. + ///This will be applied for single column headers and multi-column + ///headers. + /// + ///• fixed_columns (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { + /// headers: false, + /// data: 0 + ///}) - `fixed_columns` will "fix" the set of columns so that + ///they remain visible when scrolling horizontally across + ///the unfixed columns. `fixed_columns` fixes columns + ///from left-to-right. + ///If `headers` is False, no columns are fixed. + ///If `headers` is True, all operation columns (see `row_deletable` and `row_selectable`) + ///are fixed. Additional data columns can be fixed by + ///assigning a number to `data`. + ///Note that fixing columns introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + ///• fixed_rows (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { + /// headers: false, + /// data: 0 + ///}) - `fixed_rows` will "fix" the set of rows so that + ///they remain visible when scrolling vertically down + ///the table. `fixed_rows` fixes rows + ///from top-to-bottom, starting from the headers. + ///If `headers` is False, no rows are fixed. + ///If `headers` is True, all header and filter rows (see `filter_action`) are + ///fixed. Additional data rows can be fixed by assigning + ///a number to `data`. Note that fixing rows introduces some changes to the + ///underlying markup of the table and may impact the + ///way that your columns are rendered or sized. + ///View the documentation examples to learn more. + /// + ///• column_selectable (value equal to: 'single', 'multi', 'false'; default false) - If `single`, then the user can select a single column or group + ///of merged columns via the radio button that will appear in the + ///header rows. + ///If `multi`, then the user can select multiple columns or groups + ///of merged columns via the checkbox that will appear in the header + ///rows. + ///If false, then the user will not be able to select columns and no + ///input will appear in the header rows. + ///When a column is selected, its id will be contained in `selected_columns` + ///and `derived_viewport_selected_columns`. + /// + ///• row_deletable (boolean) - If True, then a `x` will appear next to each `row` + ///and the user can delete the row. + /// + ///• cell_selectable (boolean; default true) - If True (default), then it is possible to click and navigate + ///table cells. + /// + ///• row_selectable (value equal to: 'single', 'multi', 'false'; default false) - If `single`, then the user can select a single row + ///via a radio button that will appear next to each row. + ///If `multi`, then the user can select multiple rows + ///via a checkbox that will appear next to each row. + ///If false, then the user will not be able to select rows + ///and no additional UI elements will appear. + ///When a row is selected, its index will be contained + ///in `selected_rows`. + /// + ///• selected_cells (list with values of type: record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)'; default []) - `selected_cells` represents the set of cells that are selected, + ///as an array of objects, each item similar to `active_cell`. + ///Multiple cells can be selected by holding down shift and + ///clicking on a different cell or holding down shift and navigating + ///with the arrow keys. + /// + ///• selected_rows (list with values of type: number; default []) - `selected_rows` contains the indices of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + ///• selected_columns (list with values of type: string; default []) - `selected_columns` contains the ids of columns that + ///are selected via the UI elements that appear when + ///`column_selectable` is `'single' or 'multi'`. + /// + ///• selected_row_ids (list with values of type: string | number; default []) - `selected_row_ids` contains the ids of rows that + ///are selected via the UI elements that appear when + ///`row_selectable` is `'single'` or `'multi'`. + /// + ///• start_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - When selecting multiple cells + ///(via clicking on a cell and then shift-clicking on another cell), + ///`start_cell` represents the [row, column] coordinates of the cell + ///in one of the corners of the region. + ///`end_cell` represents the coordinates of the other corner. + /// + ///• style_as_list_view (boolean; default false) - If True, then the table will be styled like a list view + ///and not have borders between the columns. + /// + ///• page_action (value equal to: 'custom', 'native', 'none'; default native) - `page_action` refers to a mode of the table where + ///not all of the rows are displayed at once: only a subset + ///are displayed (a "page") and the next subset of rows + ///can viewed by clicking "Next" or "Previous" buttons + ///at the bottom of the page. + ///Pagination is used to improve performance: instead of + ///rendering all of the rows at once (which can be expensive), + ///we only display a subset of them. + ///With pagination, we can either page through data that exists + ///in the table (e.g. page through `10,000` rows in `data` `100` rows at a time) + ///or we can update the data on-the-fly with callbacks + ///when the user clicks on the "Previous" or "Next" buttons. + ///These modes can be toggled with this `page_action` parameter: + ///`'native'`: all data is passed to the table up-front, paging logic is + ///handled by the table; + ///`'custom'`: data is passed to the table one page at a time, paging logic + ///is handled via callbacks; + ///`'none'`: disables paging, render all of the data at once. + /// + ///• page_current (number; default 0) - `page_current` represents which page the user is on. + ///Use this property to index through data in your callbacks with + ///backend paging. + /// + ///• page_count (number) - `page_count` represents the number of the pages in the + ///paginated table. This is really only useful when performing + ///backend pagination, since the front end is able to use the + ///full size of the table to calculate the number of pages. + /// + ///• page_size (number; default 250) - `page_size` represents the number of rows that will be + ///displayed on a particular page when `page_action` is `'custom'` or `'native'` + /// + ///• dropdown (dict with values of type: record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default {}) - `dropdown` specifies dropdown options for different columns. + ///Each entry refers to the column ID. + ///The `clearable` property defines whether the value can be deleted. + ///The `options` property refers to the `options` of the dropdown. + /// + ///• dropdown_conditional (list with values of type: record with the fields: 'clearable: boolean (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default []) - `dropdown_conditional` specifies dropdown options in various columns and cells. + ///This property allows you to specify different dropdowns + ///depending on certain conditions. For example, you may + ///render different "city" dropdowns in a row depending on the + ///current value in the "state" column. + /// + ///• dropdown_data (list with values of type: dict with values of type: record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)'; default []) - `dropdown_data` specifies dropdown options on a row-by-row, column-by-column basis. + ///Each item in the array corresponds to the corresponding dropdowns for the `data` item + ///at the same index. Each entry in the item refers to the Column ID. + /// + ///• tooltip (dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)'; default {}) - `tooltip` is the column based tooltip configuration applied to all rows. The key is the column + /// id and the value is a tooltip configuration. + ///Example: {i: {'value': i, 'use_with: 'both'} for i in df.columns} + /// + ///• tooltip_conditional (list with values of type: record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' (required)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default []) - `tooltip_conditional` represents the tooltip shown + ///for different columns and cells. + ///This property allows you to specify different tooltips + ///depending on certain conditions. For example, you may have + ///different tooltips in the same column based on the value + ///of a certain data property. + ///Priority is from first to last defined conditional tooltip + ///in the list. Higher priority (more specific) conditional + ///tooltips should be put at the beginning of the list. + /// + ///• tooltip_data (list with values of type: dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default []) - `tooltip_data` represents the tooltip shown + ///for different columns and cells. + ///A list of dicts for which each key is + ///a column id and the value is a tooltip configuration. + /// + ///• tooltip_header (dict with values of type: string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' | list with values of type: value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)'; default {}) - `tooltip_header` represents the tooltip shown + ///for each header column and optionally each header row. + ///Example to show long column names in a tooltip: {i: i for i in df.columns}. + ///Example to show different column names in a tooltip: {'Rep': 'Republican', 'Dem': 'Democrat'}. + ///If the table has multiple rows of headers, then use a list as the value of the + ///`tooltip_header` items. + /// + ///• tooltip_delay (number; default 350) - `tooltip_delay` represents the table-wide delay in milliseconds before + ///the tooltip is shown when hovering a cell. If set to `None`, the tooltip + ///will be shown immediately. + ///Defaults to 350. + /// + ///• tooltip_duration (number; default 2000) - `tooltip_duration` represents the table-wide duration in milliseconds + ///during which the tooltip will be displayed when hovering a cell. If + ///set to `None`, the tooltip will not disappear. + ///Defaults to 2000. + /// + ///• filter_query (string; default ) - If `filter_action` is enabled, then the current filtering + ///string is represented in this `filter_query` + ///property. + /// + ///• filter_action (value equal to: 'custom', 'native', 'none' | record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)'; default none) - The `filter_action` property controls the behavior of the `filtering` UI. + ///If `'none'`, then the filtering UI is not displayed. + ///If `'native'`, then the filtering UI is displayed and the filtering + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, then the filtering UI is displayed but it is the + ///responsibility of the developer to program the filtering + ///through a callback (where `filter_query` or `derived_filter_query_structure` would be the input + ///and `data` would be the output). + /// + ///• filter_options (record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)'; default {}) - There are two `filter_options` props in the table. + ///This is the table-level filter_options prop and there is + ///also the column-level `filter_options` prop. + ///These props determine whether the applicable filter relational + ///operators will default to `sensitive` or `insensitive` comparison. + ///If the column-level `filter_options` prop is set it overrides + ///the table-level `filter_options` prop for that column. + /// + ///• sort_action (value equal to: 'custom', 'native', 'none'; default none) - The `sort_action` property enables data to be + ///sorted on a per-column basis. + ///If `'none'`, then the sorting UI is not displayed. + ///If `'native'`, then the sorting UI is displayed and the sorting + ///logic is handled by the table. That is, it is performed on the data + ///that exists in the `data` property. + ///If `'custom'`, the the sorting UI is displayed but it is the + ///responsibility of the developer to program the sorting + ///through a callback (where `sort_by` would be the input and `data` + ///would be the output). + ///Clicking on the sort arrows will update the + ///`sort_by` property. + /// + ///• sort_mode (value equal to: 'single', 'multi'; default single) - Sorting can be performed across multiple columns + ///(e.g. sort by country, sort within each country, + /// sort by year) or by a single column. + ///NOTE - With multi-column sort, it's currently + ///not possible to determine the order in which + ///the columns were sorted through the UI. + ///See [https://github.com/plotly/dash-table/issues/170](https://github.com/plotly/dash-table/issues/170) + /// + ///• sort_by (list with values of type: record with the fields: 'column_id: string (required)', 'direction: value equal to: 'asc', 'desc' (required)'; default []) - `sort_by` describes the current state + ///of the sorting UI. + ///That is, if the user clicked on the sort arrow + ///of a column, then this property will be updated + ///with the column ID and the direction + ///(`asc` or `desc`) of the sort. + ///For multi-column sorting, this will be a list of + ///sorting parameters, in the order in which they were + ///clicked. + /// + ///• sort_as_null (list with values of type: string | number | boolean; default []) - An array of string, number and boolean values that are treated as `None` + ///(i.e. ignored and always displayed last) when sorting. + ///This value will be used by columns without `sort_as_null`. + ///Defaults to `[]`. + /// + ///• style_table (record; default {}) - CSS styles to be applied to the outer `table` container. + ///This is commonly used for setting properties like the + ///width or the height of the table. + /// + ///• style_cell (record) - CSS styles to be applied to each individual cell of the table. + ///This includes the header cells, the `data` cells, and the filter + ///cells. + /// + ///• style_data (record) - CSS styles to be applied to each individual data cell. + ///That is, unlike `style_cell`, it excludes the header and filter cells. + /// + ///• style_filter (record) - CSS styles to be applied to the filter cells. + ///Note that this may change in the future as we build out a + ///more complex filtering UI. + /// + ///• style_header (record) - CSS styles to be applied to each individual header cell. + ///That is, unlike `style_cell`, it excludes the `data` and filter cells. + /// + ///• style_cell_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)' (optional)'; default []) - Conditional CSS styles for the cells. + ///This can be used to apply styles to cells on a per-column basis. + /// + ///• style_data_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'filter_query: string (optional)', 'state: value equal to: 'active', 'selected' (optional)', 'row_index: number | value equal to: 'odd', 'even' | list with values of type: number (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the data cells. + ///This can be used to apply styles to data cells on a per-column basis. + /// + ///• style_filter_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the filter cells. + ///This can be used to apply styles to filter cells on a per-column basis. + /// + ///• style_header_conditional (list with values of type: record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'header_index: number | list with values of type: number | value equal to: 'odd', 'even' (optional)', 'column_editable: boolean (optional)' (optional)'; default []) - Conditional CSS styles for the header cells. + ///This can be used to apply styles to header cells on a per-column basis. + /// + ///• virtualization (boolean; default false) - This property tells the table to use virtualization when rendering. + ///Assumptions are that: + ///the width of the columns is fixed; + ///the height of the rows is always the same; and + ///runtime styling changes will not affect width and height vs. first rendering + /// + ///• derived_filter_query_structure (record) - This property represents the current structure of + ///`filter_query` as a tree structure. Each node of the + ///query structure has: + ///type (string; required): + /// 'open-block', + /// 'logical-operator', + /// 'relational-operator', + /// 'unary-operator', or + /// 'expression'; + ///subType (string; optional): + /// 'open-block': '()', + /// 'logical-operator': '&&', '||', + /// 'relational-operator': '=', '>=', '>', '<=', '<', '!=', 'contains', + /// 'unary-operator': '!', 'is bool', 'is even', 'is nil', 'is num', 'is object', 'is odd', 'is prime', 'is str', + /// 'expression': 'value', 'field'; + ///value (any): + /// 'expression, value': passed value, + /// 'expression, field': the field/prop name. + ///block (nested query structure; optional). + ///left (nested query structure; optional). + ///right (nested query structure; optional). + ///If the query is invalid or empty, the `derived_filter_query_structure` will + ///be `None`. + /// + ///• derived_viewport_data (list with values of type: record; default []) - This property represents the current state of `data` + ///on the current page. This property will be updated + ///on paging, sorting, and filtering. + /// + ///• derived_viewport_indices (list with values of type: number; default []) - `derived_viewport_indices` indicates the order in which the original + ///rows appear after being filtered, sorted, and/or paged. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + ///• derived_viewport_row_ids (list with values of type: string | number; default []) - `derived_viewport_row_ids` lists row IDs in the order they appear + ///after being filtered, sorted, and/or paged. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + ///• derived_viewport_selected_columns (list with values of type: string) - `derived_viewport_selected_columns` contains the ids of the + ///`selected_columns` that are not currently hidden. + /// + ///• derived_viewport_selected_rows (list with values of type: number; default []) - `derived_viewport_selected_rows` represents the indices of the + ///`selected_rows` from the perspective of the `derived_viewport_indices`. + /// + ///• derived_viewport_selected_row_ids (list with values of type: string | number; default []) - `derived_viewport_selected_row_ids` represents the IDs of the + ///`selected_rows` on the currently visible page. + /// + ///• derived_virtual_data (list with values of type: record; default []) - This property represents the visible state of `data` + ///across all pages after the front-end sorting and filtering + ///as been applied. + /// + ///• derived_virtual_indices (list with values of type: number; default []) - `derived_virtual_indices` indicates the order in which the original + ///rows appear after being filtered and sorted. + ///`derived_viewport_indices` contains indices for the current page, + ///while `derived_virtual_indices` contains indices across all pages. + /// + ///• derived_virtual_row_ids (list with values of type: string | number; default []) - `derived_virtual_row_ids` indicates the row IDs in the order in which + ///they appear after being filtered and sorted. + ///`derived_viewport_row_ids` contains IDs for the current page, + ///while `derived_virtual_row_ids` contains IDs across all pages. + /// + ///• derived_virtual_selected_rows (list with values of type: number; default []) - `derived_virtual_selected_rows` represents the indices of the + /// `selected_rows` from the perspective of the `derived_virtual_indices`. + /// + ///• derived_virtual_selected_row_ids (list with values of type: string | number; default []) - `derived_virtual_selected_row_ids` represents the IDs of the + ///`selected_rows` as they appear after filtering and sorting, + ///across all pages. + /// + ///• loading_state (record with the fields: 'is_loading: boolean (optional)', 'prop_name: string (optional)', 'component_name: string (optional)') - Object that holds the loading state object coming from dash-renderer + /// + ///• persistence (boolean | string | number) - Used to allow user interactions in this component to be persisted when + ///the component - or the page - is refreshed. If `persisted` is truthy and + ///hasn't changed from its previous value, any `persisted_props` that the + ///user has changed while using the app will keep those changes, as long as + ///the new prop value also matches what was given originally. + ///Used in conjunction with `persistence_type` and `persisted_props`. + /// + ///• persisted_props (list with values of type: value equal to: 'columns_name', 'data', 'filter_query', 'hidden_columns', 'selected_columns', 'selected_rows', 'sort_by'; default [ + /// 'columns_name', + /// 'filter_query', + /// 'hidden_columns', + /// 'selected_columns', + /// 'selected_rows', + /// 'sort_by' + ///]) - Properties whose user interactions will persist after refreshing the + ///component or the page. + /// + ///• persistence_type (value equal to: 'local', 'session', 'memory'; default local) - Where persisted user changes will be stored: + ///memory: only kept in memory, reset on page refresh. + ///local: window.localStorage, data is kept after the browser quit. + ///session: window.sessionStorage, data is cleared once the browser quit. + /// + let dataTable (id: string) (attrs: Attr list) = + let props, children = + attrs + |> List.fold (fun (props, children) (a: Attr) -> + match a with + | Prop prop -> prop :: props, children + | Children child -> props, child @ children + ) ([], []) + + let dataTable = DataTable.init (id, children) + + let componentProps = + match dataTable.TryGetTypedValue "props" with + | Option.Some p -> p + | Option.None -> DashComponentProps() + + props + |> Seq.iter (fun (prop: Prop) -> + let fieldName, boxedProp = Prop.toDynamicMemberDef prop + DynObj.setValue componentProps fieldName boxedProp + ) + + DynObj.setValue dataTable "props" componentProps + dataTable :> DashComponent From d89836805c0515991acbcdfa9e73afa22656462f Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Wed, 22 Sep 2021 17:19:40 -0400 Subject: [PATCH 2/7] DashTable: JSON fix for layout data names --- src/Dash.NET.Giraffe/DashApp.fs | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/Dash.NET.Giraffe/DashApp.fs b/src/Dash.NET.Giraffe/DashApp.fs index ed65db3..2d91203 100644 --- a/src/Dash.NET.Giraffe/DashApp.fs +++ b/src/Dash.NET.Giraffe/DashApp.fs @@ -15,6 +15,7 @@ open Microsoft.Extensions.Logging open Microsoft.Extensions.DependencyInjection open System.Reflection open Dash.NET +open Newtonsoft.Json //Giraffe, Logging and ASP.NET specific type DashGiraffeConfig = { @@ -241,6 +242,13 @@ type DashApp = services.AddCors() |> ignore services.AddGiraffe() |> ignore + JsonSerializerSettings( + ContractResolver = Serialization.DefaultContractResolver(NamingStrategy = new Serialization.DefaultNamingStrategy()) + ) + |> NewtonsoftJson.Serializer + |> services.AddSingleton + |> ignore + let configureLogging (builder : ILoggingBuilder) = builder.AddFilter(fun l -> l.Equals config.LogLevel) .AddConsole() From 2a3e4bfb170b67661135150c283b2d84b7d407f1 Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Thu, 23 Sep 2021 10:17:53 -0400 Subject: [PATCH 3/7] DashTable: Working with Sauve --- src/Dash.NET.Giraffe/DashApp.fs | 4 +--- src/Dash.NET.Giraffe/Views.fs | 2 +- src/Dash.NET.Suave/App.fs | 3 +-- src/Dash.NET.Suave/Views.fs | 1 + src/Dash.NET/Common.fs | 13 +++++++++++++ src/Dash.NET/Dash.NET.fsproj | 2 ++ src/Dash.NET/DashComponents/DashTable.fs | 3 +++ 7 files changed, 22 insertions(+), 6 deletions(-) create mode 100644 src/Dash.NET/Common.fs diff --git a/src/Dash.NET.Giraffe/DashApp.fs b/src/Dash.NET.Giraffe/DashApp.fs index 2d91203..25180f7 100644 --- a/src/Dash.NET.Giraffe/DashApp.fs +++ b/src/Dash.NET.Giraffe/DashApp.fs @@ -242,9 +242,7 @@ type DashApp = services.AddCors() |> ignore services.AddGiraffe() |> ignore - JsonSerializerSettings( - ContractResolver = Serialization.DefaultContractResolver(NamingStrategy = new Serialization.DefaultNamingStrategy()) - ) + Common.Json.mkSerializerSettings() |> NewtonsoftJson.Serializer |> services.AddSingleton |> ignore diff --git a/src/Dash.NET.Giraffe/Views.fs b/src/Dash.NET.Giraffe/Views.fs index e4ed3cf..1618b31 100644 --- a/src/Dash.NET.Giraffe/Views.fs +++ b/src/Dash.NET.Giraffe/Views.fs @@ -38,7 +38,7 @@ module Views = script [_type "application/javascript"; _crossorigin " "; _src "https://unpkg.com/dash-core-components@1.11.0/dash_core_components/dash_core_components.min.js"] [] script [_type "application/javascript"; _crossorigin " "; _src "https://cdn.jsdelivr.net/npm/dash-html-components@1.1.0/dash_html_components/dash_html_components.min.js"] [] script [_type "application/javascript"; _crossorigin " "; _src "https://cdn.plot.ly/plotly-latest.min.js"] [] - script [_type "application/javascript"; _crossorigin " "; _src "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js"] [] + script [_type "application/javascript"; _crossorigin " "; _src DashTable.CdnLink ] [] ] let createIndex metas appTitle faviconPath css appEntry config scripts renderer = diff --git a/src/Dash.NET.Suave/App.fs b/src/Dash.NET.Suave/App.fs index 081699c..b5b9303 100644 --- a/src/Dash.NET.Suave/App.fs +++ b/src/Dash.NET.Suave/App.fs @@ -13,8 +13,7 @@ open Newtonsoft.Json open Newtonsoft.Json.Serialization module Util = - let settings = new JsonSerializerSettings() - settings.ContractResolver <- CamelCasePropertyNamesContractResolver() + let settings = Common.Json.mkSerializerSettings() let json o = JsonConvert.SerializeObject(o, settings) let unjson<'T> str = JsonConvert.DeserializeObject<'T>(str,settings) diff --git a/src/Dash.NET.Suave/Views.fs b/src/Dash.NET.Suave/Views.fs index 510c781..d85ad8f 100644 --- a/src/Dash.NET.Suave/Views.fs +++ b/src/Dash.NET.Suave/Views.fs @@ -35,6 +35,7 @@ module Views = script ["type", "application/javascript"; "crossorigin", " "; "src", "https://unpkg.com/dash-core-components@1.11.0/dash_core_components/dash_core_components.min.js"] [] script ["type", "application/javascript"; "crossorigin", " "; "src", "https://cdn.jsdelivr.net/npm/dash-html-components@1.1.0/dash_html_components/dash_html_components.min.js"] [] script ["type", "application/javascript"; "crossorigin", " "; "src", "https://cdn.plot.ly/plotly-latest.min.js"] [] + script ["type", "application/javascript"; "crossorigin", " "; "src", DashTable.CdnLink ] [] ] let createIndex metas appTitle faviconPath css appEntry config scripts renderer = diff --git a/src/Dash.NET/Common.fs b/src/Dash.NET/Common.fs new file mode 100644 index 0000000..869f50c --- /dev/null +++ b/src/Dash.NET/Common.fs @@ -0,0 +1,13 @@ +namespace Dash.NET.Common + +[] +module Json = + + open Newtonsoft.Json + open Newtonsoft.Json.Serialization + + let mkSerializerSettings () = + JsonSerializerSettings( + ContractResolver = DefaultContractResolver(NamingStrategy = new DefaultNamingStrategy()) + ) + diff --git a/src/Dash.NET/Dash.NET.fsproj b/src/Dash.NET/Dash.NET.fsproj index 78e5a49..0c1d3ee 100644 --- a/src/Dash.NET/Dash.NET.fsproj +++ b/src/Dash.NET/Dash.NET.fsproj @@ -56,6 +56,7 @@ + @@ -63,6 +64,7 @@ + diff --git a/src/Dash.NET/DashComponents/DashTable.fs b/src/Dash.NET/DashComponents/DashTable.fs index a374abd..703b299 100644 --- a/src/Dash.NET/DashComponents/DashTable.fs +++ b/src/Dash.NET/DashComponents/DashTable.fs @@ -4,6 +4,9 @@ open System open Plotly.NET open Dash.NET +[] +let CdnLink = "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js" + /// ///Dash DataTable is an interactive table component designed for ///designed for viewing, editing, and exploring large datasets. From 7ca1ed48c9d1334689e410396e32507a38b92622 Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Thu, 23 Sep 2021 15:23:07 -0400 Subject: [PATCH 4/7] DashTable: Refactor to clean - fix Null tooltip --- src/Dash.NET/DashComponents/DashTable.fs | 534 +++++++++++------------ 1 file changed, 248 insertions(+), 286 deletions(-) diff --git a/src/Dash.NET/DashComponents/DashTable.fs b/src/Dash.NET/DashComponents/DashTable.fs index 703b299..406f6bf 100644 --- a/src/Dash.NET/DashComponents/DashTable.fs +++ b/src/Dash.NET/DashComponents/DashTable.fs @@ -20,7 +20,7 @@ let CdnLink = "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js" module DataTable = let inline convertOptional convert = function | Some v -> convert v - | Option.None -> null + | None -> null /// ///value equal to: 'first', 'last' @@ -360,7 +360,6 @@ module DataTable = ///value equal to: 'custom', 'native', 'none' | record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)' /// type FilterAction = - // TODO: Might be able to use Option type here: ActionType of FilterActionType option | Type of MaybeActionType | Conditional of ConditionalFilterAction static member convert = @@ -412,8 +411,7 @@ module DataTable = /// ///value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' /// - // TODO: Might be able to use Option type here: Tooltip option - type MaybeTooltipValue = + type MaybeTooltip = | Text of string | Value of TooltipValue | Null @@ -421,7 +419,7 @@ module DataTable = function | Text v -> box v | Value v -> TooltipValue.convert v - | Null -> box "null" + | Null -> null /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' | list with values of type: value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' @@ -429,13 +427,12 @@ module DataTable = type HeaderTooltip = | Text of string | Value of TooltipValue - // TODO: Might be able to use Option type here: Values of Tooltip option list - | Values of MaybeTooltipValue list + | Values of MaybeTooltip list static member convert = function | Text v -> box v | Value v -> TooltipValue.convert v - | Values v -> v |> List.map MaybeTooltipValue.convert |> box + | Values v -> v |> List.map MaybeTooltip.convert |> box /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' @@ -503,18 +500,6 @@ module DataTable = ``type`` = convertOptional TooltipValueType.convert this.Type |} - // TODO: Might be able to use like this, to prevent duplication - //type ConditionalTooltip = - // { If: TooltipConditionalIf - // TooltipValue: TooltipValue } - // static member convert this = - // box - // {| ``if`` = (this.If |> TooltipConditionalIf.convert) - // value = this.TooltipValue.Value - // delay = this.TooltipValue.Delay - // duration = this.TooltipValue.Duration - // ``type`` = (this.TooltipValue.Type |> TooltipValueType.convert) |} - /// ///value equal to: 'both', 'data', 'header' /// @@ -560,17 +545,6 @@ module DataTable = delay = convertOptional box this.Delay duration = convertOptional box this.Duration |} - // TODO: Might be able to use like this to prevent duplication - //type UseWithTooltipValue = - // { UseWith: TooltipUseWith - // TooltipValue: TooltipValue } - // static member convert this = - // box - // {| delay = this.TooltipValue.Delay - // duration = this.TooltipValue.Duration - // ``type`` = (this.TooltipValue.Type |> TooltipValueType.convert) - // use_with = (this.UseWith |> TooltipUseWith.convert) - // value = this.TooltipValue.Value |} /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)' @@ -721,7 +695,6 @@ module DataTable = /// ///value equal to: 'none', 'ids', 'names', 'display' /// - // TODO: Might be able to use Option type type MaybeExportHeaders = | None | Ids @@ -738,7 +711,6 @@ module DataTable = /// ///value equal to: 'csv', 'xlsx', 'none' /// - // TODO: Might be able to use Option type type MaybeExportFormat = | Csv | Xlsx @@ -919,13 +891,13 @@ module DataTable = /// type MaybeOnChangeAction = | Coerce - | Validate | None + | Validate static member convert = function | Coerce -> "coerce" - | Validate -> "validate" | None -> "none" + | Validate -> "validate" >> box /// @@ -1674,7 +1646,6 @@ module DataTable = | EndCell of Cell | ExportColumns of ExportColumns | ExportFormat of MaybeExportFormat - // TODO: Might be able to use Option type: ExportHeaders of ExportHeaders option | ExportHeaders of MaybeExportHeaders | FillWidth of bool | HiddenColumns of seq @@ -1812,7 +1783,7 @@ module DataTable = | DerivedVirtualRowIds p -> box p | DerivedVirtualSelectedRows p -> box p | DerivedVirtualSelectedRowIds p -> box p - | LoadingState p -> box p + | LoadingState p -> LoadingState.convert p | Persistence p -> box p | PersistedProps p -> box p | PersistenceType p -> PersistenceTypeOptions.convert p @@ -2537,88 +2508,89 @@ module DataTable = /// type DataTable() = inherit DashComponent() + static member applyMembers ( id: string, children: seq, - ?activeCell: ActiveCell, - ?columns: seq, - ?includeHeadersOnCopyPaste: bool, - ?localeFormat: LocaleFormat, - ?markdownOptions: MarkdownOptions, - ?css: seq, - ?data: seq, - ?dataPrevious: seq, - ?dataTimestamp: int64, - ?editable: bool, - ?endCell: Cell, - ?exportColumns: ExportColumns, - ?exportFormat: MaybeExportFormat, - ?exportHeaders: MaybeExportHeaders, - ?fillWidth: bool, - ?hiddenColumns: seq, - ?isFocused: bool, - ?mergeDuplicateHeaders: bool, - ?fixedColumns: Fixed, - ?fixedRows: Fixed, - ?columnSelectable: Select, - ?rowDeletable: bool, - ?cellSelectable: bool, - ?rowSelectable: Select, - ?selectedCells: seq, - ?selectedRows: seq, - ?selectedColumns: seq, - ?selectedRowIds: seq, - ?startCell: Cell, - ?styleAsListView: bool, - ?pageAction: MaybeActionType, - ?pageCurrent: int, - ?pageCount: int, - ?pageSize: int, - ?dropdown: Map, - ?dropdownConditional: seq, - ?dropdownData: seq>, - ?tooltip: Map, - ?tooltipConditional: seq, - ?tooltipData: seq>, - ?tooltipHeader: Map, - ?tooltipDelay: int, - ?tooltipDuration: int, - ?filterQuery: string, - ?filterAction: FilterAction, - ?filterOptions: FilterOption, - ?sortAction: MaybeActionType, - ?sortMode: SortMode, - ?sortBy: seq, - ?sortAsNull: seq, - ?styleTable: DashComponentStyle, - ?styleCell: DashComponentStyle, - ?styleData: DashComponentStyle, - ?styleFilter: DashComponentStyle, - ?styleHeader: DashComponentStyle, - ?styleCellConditional: seq, - ?styleDataConditional: seq, - ?styleFilterConditional: seq, - ?styleHeaderConditional: seq, - ?virtualization: bool, - ?derivedFilterQueryStructure: obj, - ?derivedViewportData: seq, - ?derivedViewportIndices: seq, - ?derivedViewportRowIds: seq, - ?derivedViewportSelectedColumns: seq, - ?derivedViewportSelectedRows: seq, - ?derivedViewportSelectedRowIds: seq, - ?derivedVirtualData: seq, - ?derivedVirtualIndices: seq, - ?derivedVirtualRowIds: seq, - ?derivedVirtualSelectedRows: seq, - ?derivedVirtualSelectedRowIds: seq, - ?loadingState: LoadingState, - ?persistence: IConvertible, - ?persistedProps: string [], - ?persistenceType: PersistenceTypeOptions + ?activeCell, + ?columns, + ?includeHeadersOnCopyPaste, + ?localeFormat, + ?markdownOptions, + ?css, + ?data, + ?dataPrevious, + ?dataTimestamp, + ?editable, + ?endCell, + ?exportColumns, + ?exportFormat, + ?exportHeaders, + ?fillWidth, + ?hiddenColumns, + ?isFocused, + ?mergeDuplicateHeaders, + ?fixedColumns, + ?fixedRows, + ?columnSelectable, + ?rowDeletable, + ?cellSelectable, + ?rowSelectable, + ?selectedCells, + ?selectedRows, + ?selectedColumns, + ?selectedRowIds, + ?startCell, + ?styleAsListView, + ?pageAction, + ?pageCurrent, + ?pageCount, + ?pageSize, + ?dropdown, + ?dropdownConditional, + ?dropdownData, + ?tooltip, + ?tooltipConditional, + ?tooltipData, + ?tooltipHeader, + ?tooltipDelay, + ?tooltipDuration, + ?filterQuery, + ?filterAction, + ?filterOptions, + ?sortAction, + ?sortMode, + ?sortBy, + ?sortAsNull, + ?styleTable, + ?styleCell, + ?styleData, + ?styleFilter, + ?styleHeader, + ?styleCellConditional, + ?styleDataConditional, + ?styleFilterConditional, + ?styleHeaderConditional, + ?virtualization, + ?derivedFilterQueryStructure, + ?derivedViewportData, + ?derivedViewportIndices, + ?derivedViewportRowIds, + ?derivedViewportSelectedColumns, + ?derivedViewportSelectedRows, + ?derivedViewportSelectedRowIds, + ?derivedVirtualData, + ?derivedVirtualIndices, + ?derivedVirtualRowIds, + ?derivedVirtualSelectedRows, + ?derivedVirtualSelectedRowIds, + ?loadingState, + ?persistence, + ?persistedProps, + ?persistenceType ) = - (fun (t: DataTable) -> + fun (dataTable: DataTable) -> let props = DashComponentProps() DynObj.setValue props "id" id @@ -2699,182 +2671,172 @@ module DataTable = Prop.setValueOpt props Persistence "persistence" persistence Prop.setValueOpt props PersistedProps "persistedProps" persistedProps Prop.setValueOpt props PersistenceType "persistenceType" persistenceType - DynObj.setValue t "namespace" "dash_table" - DynObj.setValue t "props" props - DynObj.setValue t "type" "DataTable" - t) + DynObj.setValue dataTable "namespace" "dash_table" + DynObj.setValue dataTable "props" props + DynObj.setValue dataTable "type" "DataTable" + dataTable static member init ( - id: string, - children: seq, - ?activeCell: ActiveCell, - ?columns: seq, - ?includeHeadersOnCopyPaste: bool, - ?localeFormat: LocaleFormat, - ?markdownOptions: MarkdownOptions, - ?css: seq, - ?data: seq, - ?dataPrevious: seq, - ?dataTimestamp: int64, - ?editable: bool, - ?endCell: Cell, - ?exportColumns: ExportColumns, - ?exportFormat: MaybeExportFormat, - ?exportHeaders: MaybeExportHeaders, - ?fillWidth: bool, - ?hiddenColumns: seq, - ?isFocused: bool, - ?mergeDuplicateHeaders: bool, - ?fixedColumns: Fixed, - ?fixedRows: Fixed, - ?columnSelectable: Select, - ?rowDeletable: bool, - ?cellSelectable: bool, - ?rowSelectable: Select, - ?selectedCells: seq, - ?selectedRows: seq, - ?selectedColumns: seq, - ?selectedRowIds: seq, - ?startCell: Cell, - ?styleAsListView: bool, - ?pageAction: MaybeActionType, - ?pageCurrent: int, - ?pageCount: int, - ?pageSize: int, - ?dropdown: Map, - ?dropdownConditional: seq, - ?dropdownData: seq>, - ?tooltip: Map, - ?tooltipConditional: seq, - ?tooltipData: seq>, - ?tooltipHeader: Map, - ?tooltipDelay: int, - ?tooltipDuration: int, - ?filterQuery: string, - ?filterAction: FilterAction, - ?filterOptions: FilterOption, - ?sortAction: MaybeActionType, - ?sortMode: SortMode, - ?sortBy: seq, - ?sortAsNull: seq, - ?styleTable: DashComponentStyle, - ?styleCell: DashComponentStyle, - ?styleData: DashComponentStyle, - ?styleFilter: DashComponentStyle, - ?styleHeader: DashComponentStyle, - ?styleCellConditional: seq, - ?styleDataConditional: seq, - ?styleFilterConditional: seq, - ?styleHeaderConditional: seq, - ?virtualization: bool, - ?derivedFilterQueryStructure: obj, - ?derivedViewportData: seq, - ?derivedViewportIndices: seq, - ?derivedViewportRowIds: seq, - ?derivedViewportSelectedColumns: seq, - ?derivedViewportSelectedRows: seq, - ?derivedViewportSelectedRowIds: seq, - ?derivedVirtualData: seq, - ?derivedVirtualIndices: seq, - ?derivedVirtualRowIds: seq, - ?derivedVirtualSelectedRows: seq, - ?derivedVirtualSelectedRowIds: seq, - ?loadingState: LoadingState, - ?persistence: IConvertible, - ?persistedProps: string [], - ?persistenceType: PersistenceTypeOptions + id, + children, + ?activeCell, + ?columns, + ?includeHeadersOnCopyPaste, + ?localeFormat, + ?markdownOptions, + ?css, + ?data, + ?dataPrevious, + ?dataTimestamp, + ?editable, + ?endCell, + ?exportColumns, + ?exportFormat, + ?exportHeaders, + ?fillWidth, + ?hiddenColumns, + ?isFocused, + ?mergeDuplicateHeaders, + ?fixedColumns, + ?fixedRows, + ?columnSelectable, + ?rowDeletable, + ?cellSelectable, + ?rowSelectable, + ?selectedCells, + ?selectedRows, + ?selectedColumns, + ?selectedRowIds, + ?startCell, + ?styleAsListView, + ?pageAction, + ?pageCurrent, + ?pageCount, + ?pageSize, + ?dropdown, + ?dropdownConditional, + ?dropdownData, + ?tooltip, + ?tooltipConditional, + ?tooltipData, + ?tooltipHeader, + ?tooltipDelay, + ?tooltipDuration, + ?filterQuery, + ?filterAction, + ?filterOptions, + ?sortAction, + ?sortMode, + ?sortBy, + ?sortAsNull, + ?styleTable, + ?styleCell, + ?styleData, + ?styleFilter, + ?styleHeader, + ?styleCellConditional, + ?styleDataConditional, + ?styleFilterConditional, + ?styleHeaderConditional, + ?virtualization, + ?derivedFilterQueryStructure, + ?derivedViewportData, + ?derivedViewportIndices, + ?derivedViewportRowIds, + ?derivedViewportSelectedColumns, + ?derivedViewportSelectedRows, + ?derivedViewportSelectedRowIds, + ?derivedVirtualData, + ?derivedVirtualIndices, + ?derivedVirtualRowIds, + ?derivedVirtualSelectedRows, + ?derivedVirtualSelectedRowIds, + ?loadingState, + ?persistence, + ?persistedProps, + ?persistenceType ) = - DataTable.applyMembers - (id, - children, - ?activeCell = activeCell, - ?columns = columns, - ?includeHeadersOnCopyPaste = includeHeadersOnCopyPaste, - ?localeFormat = localeFormat, - ?markdownOptions = markdownOptions, - ?css = css, - ?data = data, - ?dataPrevious = dataPrevious, - ?dataTimestamp = dataTimestamp, - ?editable = editable, - ?endCell = endCell, - ?exportColumns = exportColumns, - ?exportFormat = exportFormat, - ?exportHeaders = exportHeaders, - ?fillWidth = fillWidth, - ?hiddenColumns = hiddenColumns, - ?isFocused = isFocused, - ?mergeDuplicateHeaders = mergeDuplicateHeaders, - ?fixedColumns = fixedColumns, - ?fixedRows = fixedRows, - ?columnSelectable = columnSelectable, - ?rowDeletable = rowDeletable, - ?cellSelectable = cellSelectable, - ?rowSelectable = rowSelectable, - ?selectedCells = selectedCells, - ?selectedRows = selectedRows, - ?selectedColumns = selectedColumns, - ?selectedRowIds = selectedRowIds, - ?startCell = startCell, - ?styleAsListView = styleAsListView, - ?pageAction = pageAction, - ?pageCurrent = pageCurrent, - ?pageCount = pageCount, - ?pageSize = pageSize, - ?dropdown = dropdown, - ?dropdownConditional = dropdownConditional, - ?dropdownData = dropdownData, - ?tooltip = tooltip, - ?tooltipConditional = tooltipConditional, - ?tooltipData = tooltipData, - ?tooltipHeader = tooltipHeader, - ?tooltipDelay = tooltipDelay, - ?tooltipDuration = tooltipDuration, - ?filterQuery = filterQuery, - ?filterAction = filterAction, - ?filterOptions = filterOptions, - ?sortAction = sortAction, - ?sortMode = sortMode, - ?sortBy = sortBy, - ?sortAsNull = sortAsNull, - ?styleTable = styleTable, - ?styleCell = styleCell, - ?styleData = styleData, - ?styleFilter = styleFilter, - ?styleHeader = styleHeader, - ?styleCellConditional = styleCellConditional, - ?styleDataConditional = styleDataConditional, - ?styleFilterConditional = styleFilterConditional, - ?styleHeaderConditional = styleHeaderConditional, - ?virtualization = virtualization, - ?derivedFilterQueryStructure = derivedFilterQueryStructure, - ?derivedViewportData = derivedViewportData, - ?derivedViewportIndices = derivedViewportIndices, - ?derivedViewportRowIds = derivedViewportRowIds, - ?derivedViewportSelectedColumns = derivedViewportSelectedColumns, - ?derivedViewportSelectedRows = derivedViewportSelectedRows, - ?derivedViewportSelectedRowIds = derivedViewportSelectedRowIds, - ?derivedVirtualData = derivedVirtualData, - ?derivedVirtualIndices = derivedVirtualIndices, - ?derivedVirtualRowIds = derivedVirtualRowIds, - ?derivedVirtualSelectedRows = derivedVirtualSelectedRows, - ?derivedVirtualSelectedRowIds = derivedVirtualSelectedRowIds, - ?loadingState = loadingState, - ?persistence = persistence, - ?persistedProps = persistedProps, - ?persistenceType = persistenceType) - (DataTable()) - - // TODO: Are these required? - //static member definition: LoadableComponentDefinition = - // { ComponentName = "DataTable" - // ComponentJavascript = - // [ "components\\DashTable\\async-export.js" - // "components\\DashTable\\async-highlight.js" - // "components\\DashTable\\async-table.js" - // "components\\DashTable\\bundle.js" - // "components\\DashTable\\demo.js" ] } + DataTable.applyMembers ( + id, + children, + ?activeCell = activeCell, + ?columns = columns, + ?includeHeadersOnCopyPaste = includeHeadersOnCopyPaste, + ?localeFormat = localeFormat, + ?markdownOptions = markdownOptions, + ?css = css, + ?data = data, + ?dataPrevious = dataPrevious, + ?dataTimestamp = dataTimestamp, + ?editable = editable, + ?endCell = endCell, + ?exportColumns = exportColumns, + ?exportFormat = exportFormat, + ?exportHeaders = exportHeaders, + ?fillWidth = fillWidth, + ?hiddenColumns = hiddenColumns, + ?isFocused = isFocused, + ?mergeDuplicateHeaders = mergeDuplicateHeaders, + ?fixedColumns = fixedColumns, + ?fixedRows = fixedRows, + ?columnSelectable = columnSelectable, + ?rowDeletable = rowDeletable, + ?cellSelectable = cellSelectable, + ?rowSelectable = rowSelectable, + ?selectedCells = selectedCells, + ?selectedRows = selectedRows, + ?selectedColumns = selectedColumns, + ?selectedRowIds = selectedRowIds, + ?startCell = startCell, + ?styleAsListView = styleAsListView, + ?pageAction = pageAction, + ?pageCurrent = pageCurrent, + ?pageCount = pageCount, + ?pageSize = pageSize, + ?dropdown = dropdown, + ?dropdownConditional = dropdownConditional, + ?dropdownData = dropdownData, + ?tooltip = tooltip, + ?tooltipConditional = tooltipConditional, + ?tooltipData = tooltipData, + ?tooltipHeader = tooltipHeader, + ?tooltipDelay = tooltipDelay, + ?tooltipDuration = tooltipDuration, + ?filterQuery = filterQuery, + ?filterAction = filterAction, + ?filterOptions = filterOptions, + ?sortAction = sortAction, + ?sortMode = sortMode, + ?sortBy = sortBy, + ?sortAsNull = sortAsNull, + ?styleTable = styleTable, + ?styleCell = styleCell, + ?styleData = styleData, + ?styleFilter = styleFilter, + ?styleHeader = styleHeader, + ?styleCellConditional = styleCellConditional, + ?styleDataConditional = styleDataConditional, + ?styleFilterConditional = styleFilterConditional, + ?styleHeaderConditional = styleHeaderConditional, + ?virtualization = virtualization, + ?derivedFilterQueryStructure = derivedFilterQueryStructure, + ?derivedViewportData = derivedViewportData, + ?derivedViewportIndices = derivedViewportIndices, + ?derivedViewportRowIds = derivedViewportRowIds, + ?derivedViewportSelectedColumns = derivedViewportSelectedColumns, + ?derivedViewportSelectedRows = derivedViewportSelectedRows, + ?derivedViewportSelectedRowIds = derivedViewportSelectedRowIds, + ?derivedVirtualData = derivedVirtualData, + ?derivedVirtualIndices = derivedVirtualIndices, + ?derivedVirtualRowIds = derivedVirtualRowIds, + ?derivedVirtualSelectedRows = derivedVirtualSelectedRows, + ?derivedVirtualSelectedRowIds = derivedVirtualSelectedRowIds, + ?loadingState = loadingState, + ?persistence = persistence, + ?persistedProps = persistedProps, + ?persistenceType = persistenceType + ) (DataTable()) /// ///Dash DataTable is an interactive table component designed for From 2b215402a615f288db3fe9225b17bc5d55d8f11e Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Thu, 23 Sep 2021 15:24:48 -0400 Subject: [PATCH 5/7] DashTable: Use anonymous records for converted records --- src/Dash.NET/DashComponents/ComponentBase.fs | 41 ++++++++++++++++--- .../CoreComponents/Checklist.fs | 8 ++-- .../DashComponents/CoreComponents/Dropdown.fs | 6 +-- .../DashComponents/CoreComponents/Graph.fs | 4 +- .../DashComponents/CoreComponents/Input.fs | 4 +- .../DashComponents/CoreComponents/Markdown.fs | 4 +- .../CoreComponents/RadioItems.fs | 8 ++-- .../DashComponents/CoreComponents/Slider.fs | 8 +++- .../DashComponents/CoreComponents/Tab.fs | 4 +- .../DashComponents/CoreComponents/Tabs.fs | 8 ++-- .../DashComponents/CoreComponents/Upload.fs | 4 +- 11 files changed, 67 insertions(+), 32 deletions(-) diff --git a/src/Dash.NET/DashComponents/ComponentBase.fs b/src/Dash.NET/DashComponents/ComponentBase.fs index 88a344c..753c3b0 100644 --- a/src/Dash.NET/DashComponents/ComponentBase.fs +++ b/src/Dash.NET/DashComponents/ComponentBase.fs @@ -101,6 +101,12 @@ module ComponentPropTypes = ComponentName : string } static member create isLoading propName componentName = {IsLoading=isLoading; PropName=propName; ComponentName=componentName} + static member convert this = + box {| + isLoading = this.IsLoading + propName = this.PropName + componentName = this.ComponentName + |} type PersistenceTypeOptions = | Local @@ -120,6 +126,13 @@ module ComponentPropTypes = Title:string } static member create label value disabled title = {Label=label; Value=value; Disabled=disabled; Title=title} + static member convert this = + box {| + label = this.Label + value = this.Value + disabled = this.Disabled + title= this.Title + |} type RadioItemsOption = { @@ -128,14 +141,26 @@ module ComponentPropTypes = Disabled:bool } static member create label value disabled = {Label=label; Value=value; Disabled=disabled} - - type TabColors = + static member convert this = + box {| + label = this.Label + value = this.Value + disabled = this.Disabled + |} + + type TabColors = { Border : string Primary : string Background : string } static member create border primary background = {Border=border; Primary=primary; Background=background} + static member convert this = + box {| + border = this.Border + primary = this.Primary + background = this.Background + |} type ChecklistOption = { @@ -145,10 +170,16 @@ module ComponentPropTypes = } static member create label value disabled = { - Label=label - Value=value - Disabled=disabled + Label = label + Value = value + Disabled = disabled } + static member convert this = + box {| + label = this.Label + value = this.Value + disabled = this.Disabled + |} type ComponentProperty = | Children diff --git a/src/Dash.NET/DashComponents/CoreComponents/Checklist.fs b/src/Dash.NET/DashComponents/CoreComponents/Checklist.fs index 8070c67..b55aa18 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Checklist.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Checklist.fs @@ -64,7 +64,7 @@ module Checklist = | PersistenceType of PersistenceTypeOptions static member toDynamicMemberDef(prop: Prop) = match prop with - | Options p -> "options", box p + | Options p -> "options", p |> Seq.map ChecklistOption.convert |> box | Value p -> "value", box p | ClassName p -> "className", box p | Style p -> "style", box p @@ -72,7 +72,7 @@ module Checklist = | InputClassName p -> "inputClassName", box p | LabelStyle p -> "labelStyle", box p | LabelClassName p -> "labelClassName", box p - | LoadingState p -> "loading_state", box p + | LoadingState p -> "loading_state", LoadingState.convert p | Persistence p -> "persistence", box p | PersistedProps p -> "persisted_props", box p | PersistenceType p -> "persistence_type", PersistenceTypeOptions.convert p @@ -201,7 +201,7 @@ module Checklist = let props = DashComponentProps() DynObj.setValue props "id" id DynObj.setValue props "children" children - DynObj.setValueOpt props "options" (options |> Option.map box) + DynObj.setValueOpt props "options" (options |> Option.map (Seq.map ChecklistOption.convert >> box)) DynObj.setValueOpt props "value" (value |> Option.map box) DynObj.setValueOpt props "className" (className |> Option.map box) DynObj.setValueOpt props "style" (style |> Option.map box) @@ -209,7 +209,7 @@ module Checklist = DynObj.setValueOpt props "inputClassName" (inputClassName |> Option.map box) DynObj.setValueOpt props "labelStyle" (labelStyle |> Option.map box) DynObj.setValueOpt props "labelClassName" (labelClassName |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Dropdown.fs b/src/Dash.NET/DashComponents/CoreComponents/Dropdown.fs index e5225e7..13625b1 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Dropdown.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Dropdown.fs @@ -95,7 +95,7 @@ module Dropdown = static member toDynamicMemberDef (prop:Prop) = match prop with | ClassName p -> "className", box p - | Options p -> "options", box p + | Options p -> "options", p |> Seq.map DropdownOption.convert |> box | Value p -> "value", p |> DropdownValue.convert | OptionHeight p -> "optionHeight", box p | Clearable p -> "clearable", box p @@ -105,7 +105,7 @@ module Dropdown = | Searchable p -> "searchable", box p | SearchValue p -> "search_value", box p | Style p -> "style", box p - | LoadingState p -> "loading_state", box p + | LoadingState p -> "loading_state", LoadingState.convert p | Persistence p -> "persistence", box p | PersistedProps p -> "persisted_props", box p | PersistenceType p -> "persistence_type", PersistenceTypeOptions.convert p @@ -282,7 +282,7 @@ module Dropdown = DynObj.setValueOpt props "searchable" (searchable |> Option.map box) DynObj.setValueOpt props "searchValue" (searchValue |> Option.map box) DynObj.setValueOpt props "style" (style |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Graph.fs b/src/Dash.NET/DashComponents/CoreComponents/Graph.fs index dcc7882..e77a81e 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Graph.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Graph.fs @@ -137,7 +137,7 @@ module Graph = | Animate p -> "animate" , box p | AnimationOptions p -> "animation_options" , box p | Config p -> "config" , box p - | LoadingState p -> "loading_state" , box p + | LoadingState p -> "loading_state" , LoadingState.convert p /// ///A list of children or a property for this dash component @@ -320,7 +320,7 @@ module Graph = DynObj.setValueOpt props "animate" (animate |> Option.map box) DynObj.setValueOpt props "animationOptions" (animationOptions |> Option.map box) DynObj.setValueOpt props "config" (config |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValue t "namespace" "dash_core_components" DynObj.setValue t "props" props DynObj.setValue t "type" "Graph" diff --git a/src/Dash.NET/DashComponents/CoreComponents/Input.fs b/src/Dash.NET/DashComponents/CoreComponents/Input.fs index aa8afed..37c3e6f 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Input.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Input.fs @@ -179,7 +179,7 @@ module Input = | NBlur p -> "n_blur", box p | NBlurTimestamp p -> "n_blur_timestamp", box p | SetProps p -> "setProps", box p - | LoadingState p -> "loading_state", box p + | LoadingState p -> "loading_state", LoadingState.convert p | Persistence p -> "persistence", box p | PersistedProps p -> "persisted_props", box p | PersistenceType p -> "persistence_type", PersistenceTypeOptions.convert p @@ -473,7 +473,7 @@ module Input = DynObj.setValueOpt props "nBlur" (nBlur |> Option.map box) DynObj.setValueOpt props "nBlurTimestamp" (nBlurTimestamp |> Option.map box) DynObj.setValueOpt props "setProps" (setProps |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Markdown.fs b/src/Dash.NET/DashComponents/CoreComponents/Markdown.fs index ce52079..5cdf933 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Markdown.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Markdown.fs @@ -67,7 +67,7 @@ module Markdown = | DangerouslyAllowHtml (p) -> "dangerously_allow_html", box p | Dedent (p) -> "dedent", box p | HighlightConfig (p) -> "highlight_config", HighlightConfig.convert p - | LoadingState (p) -> "loading_state", box p + | LoadingState (p) -> "loading_state", LoadingState.convert p | Style (p) -> "style", box p /// @@ -149,7 +149,7 @@ module Markdown = DynObj.setValueOpt props "dangerouslyAllowHtml" (dangerouslyAllowHtml |> Option.map box) DynObj.setValueOpt props "dedent" (dedent |> Option.map box) DynObj.setValueOpt props "highlightConfig" (highlightConfig |> Option.map HighlightConfig.convert) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "style" (style |> Option.map box) DynObj.setValue t "namespace" "dash_core_components" DynObj.setValue t "props" props diff --git a/src/Dash.NET/DashComponents/CoreComponents/RadioItems.fs b/src/Dash.NET/DashComponents/CoreComponents/RadioItems.fs index 28b9488..f2774a2 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/RadioItems.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/RadioItems.fs @@ -67,13 +67,13 @@ module RadioItems = match prop with | ClassName p -> "className" , box p | Style p -> "style" , box p - | Options p -> "options" , box p + | Options p -> "options" , p |> Seq.map RadioItemsOption.convert |> box | Value p -> "value" , box p | InputClassName p -> "inputClassName" , box p | InputStyle p -> "inputStyle" , box p | LabelClassName p -> "labelClassName" , box p | LabelStyle p -> "labelStyle" , box p - | LoadingState p -> "loading_state" , box p + | LoadingState p -> "loading_state" , LoadingState.convert p | Persistence p -> "persistence" , box p | PersistedProps p -> "persisted_props" , box p | PersistenceType p -> "persistence_type" , PersistenceTypeOptions.convert p @@ -205,7 +205,7 @@ module RadioItems = let props = DashComponentProps() DynObj.setValue props "id" id DynObj.setValue props "children" children - DynObj.setValueOpt props "options" (options |> Option.map box) + DynObj.setValueOpt props "options" (options |> Option.map (Seq.map RadioItemsOption.convert >> box)) DynObj.setValueOpt props "value" (value |> Option.map box) DynObj.setValueOpt props "style" (style |> Option.map box) DynObj.setValueOpt props "className" (className |> Option.map box) @@ -213,7 +213,7 @@ module RadioItems = DynObj.setValueOpt props "inputClassName" (inputClassName |> Option.map box) DynObj.setValueOpt props "labelStyle" (labelStyle |> Option.map box) DynObj.setValueOpt props "labelClassName" (labelClassName |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Slider.fs b/src/Dash.NET/DashComponents/CoreComponents/Slider.fs index 583803f..001232b 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Slider.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Slider.fs @@ -62,6 +62,10 @@ module Slider = box {| always_visible = this.AlwaysVisible placement = this.Placement |} + static member convert2 this = + box + {| always_visible = this.AlwaysVisible + placement = this.Placement |> TooltipPlacement.convert |} /// ///record with the fields: 'label: string (optional)', 'style: record (optional)' @@ -195,7 +199,7 @@ module Slider = | Vertical (p) -> "vertical", box p | VerticalHeight (p) -> "verticalHeight", box p | UpdateMode (p) -> "updatemode", UpdateModeType.convert p - | LoadingState (p) -> "loading_state", box p + | LoadingState (p) -> "loading_state", LoadingState.convert p | Persistence (p) -> "persistence", box p | PersistedProps (p) -> "persisted_props", box p | PersistenceType (p) -> "persistence_type", PersistenceTypeOptions.convert p @@ -380,7 +384,7 @@ module Slider = DynObj.setValueOpt props "vertical" (vertical |> Option.map box) DynObj.setValueOpt props "verticalHeight" (verticalHeight |> Option.map box) DynObj.setValueOpt props "updatemode" (updatemode |> Option.map UpdateModeType.convert) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Tab.fs b/src/Dash.NET/DashComponents/CoreComponents/Tab.fs index 138dd3e..3dc5b35 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Tab.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Tab.fs @@ -58,7 +58,7 @@ module Tab = | DisabledClassName p -> "disabled_className", box p | SelectedClassName p -> "selected_className", box p | SelectedStyle p -> "selected_style", box p - | LoadingState p -> "loading_state", box p + | LoadingState p -> "loading_state", LoadingState.convert p /// ///A list of children or a property for this dash component @@ -169,7 +169,7 @@ module Tab = DynObj.setValueOpt props "selectedClassName" (selectedClassName |> Option.map box) DynObj.setValueOpt props "style" (style |> Option.map box) DynObj.setValueOpt props "selectedStyle" (selectedStyle |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValue t "namespace" "dash_core_components" DynObj.setValue t "props" props DynObj.setValue t "type" "Tab" diff --git a/src/Dash.NET/DashComponents/CoreComponents/Tabs.fs b/src/Dash.NET/DashComponents/CoreComponents/Tabs.fs index acf57e0..992b407 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Tabs.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Tabs.fs @@ -89,8 +89,8 @@ module Tabs = | ContentStyle p -> "content_style" , box p | Vertical p -> "vertical" , box p | MobileBreakpoint p -> "mobile_breakpoint" , box p - | Colors p -> "colors" , box p - | LoadingState p -> "loading_state", box p + | Colors p -> "colors" , TabColors.convert p + | LoadingState p -> "loading_state", LoadingState.convert p | Persistence p -> "persistence", box p | PersistedProps p -> "persisted_props", box p | PersistenceType p -> "persistence_type", PersistenceTypeOptions.convert p @@ -242,8 +242,8 @@ module Tabs = DynObj.setValueOpt props "contentStyle" (contentStyle |> Option.map box) DynObj.setValueOpt props "vertical" (vertical |> Option.map box) DynObj.setValueOpt props "mobileBreakpoint" (mobileBreakpoint |> Option.map box) - DynObj.setValueOpt props "colors" (colors |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "colors" (colors |> Option.map TabColors.convert) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValueOpt props "persistence" (persistence |> Option.map box) DynObj.setValueOpt props "persistedProps" (persistedProps |> Option.map box) DynObj.setValueOpt props "persistenceType" (persistenceType |> Option.map PersistenceTypeOptions.convert) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Upload.fs b/src/Dash.NET/DashComponents/CoreComponents/Upload.fs index a50c766..071c3f0 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Upload.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Upload.fs @@ -127,7 +127,7 @@ module Upload = | StyleActive p -> "style_active" , box p | StyleReject p -> "style_reject" , box p | StyleDisabled p -> "style_disabled" , box p - | LoadingState p -> "loading_state" , box p + | LoadingState p -> "loading_state" , LoadingState.convert p /// ///A list of children or a property for this dash component @@ -297,7 +297,7 @@ module Upload = DynObj.setValueOpt props "styleActive" (styleActive |> Option.map box) DynObj.setValueOpt props "styleReject" (styleReject |> Option.map box) DynObj.setValueOpt props "styleDisabled" (styleDisabled |> Option.map box) - DynObj.setValueOpt props "loadingState" (loadingState |> Option.map box) + DynObj.setValueOpt props "loadingState" (loadingState |> Option.map LoadingState.convert) DynObj.setValue t "namespace" "dash_core_components" DynObj.setValue t "props" props DynObj.setValue t "type" "Upload" From 4ef538fc1a1cf5edb906b63dce55b33858368aa4 Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Thu, 23 Sep 2021 15:38:32 -0400 Subject: [PATCH 6/7] DashTable: Fixed slider --- src/Dash.NET/DashComponents/CoreComponents/Slider.fs | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/Dash.NET/DashComponents/CoreComponents/Slider.fs b/src/Dash.NET/DashComponents/CoreComponents/Slider.fs index 001232b..48d022e 100644 --- a/src/Dash.NET/DashComponents/CoreComponents/Slider.fs +++ b/src/Dash.NET/DashComponents/CoreComponents/Slider.fs @@ -59,10 +59,6 @@ module Slider = { AlwaysVisible: bool Placement: TooltipPlacement } static member convert this = - box - {| always_visible = this.AlwaysVisible - placement = this.Placement |} - static member convert2 this = box {| always_visible = this.AlwaysVisible placement = this.Placement |> TooltipPlacement.convert |} From 9f97643e856bb3725f89cf5926a11e501fedd45d Mon Sep 17 00:00:00 2001 From: Marius Coetzee Date: Thu, 30 Sep 2021 15:34:54 -0400 Subject: [PATCH 7/7] DashTable: Replace anonymous record with JSON attributes * Also get property name from Prop --- src/Dash.NET/DashComponents/DashTable.fs | 1051 ++++++---------------- 1 file changed, 279 insertions(+), 772 deletions(-) diff --git a/src/Dash.NET/DashComponents/DashTable.fs b/src/Dash.NET/DashComponents/DashTable.fs index 406f6bf..64f0231 100644 --- a/src/Dash.NET/DashComponents/DashTable.fs +++ b/src/Dash.NET/DashComponents/DashTable.fs @@ -3,6 +3,7 @@ open System open Plotly.NET open Dash.NET +open Newtonsoft.Json [] let CdnLink = "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js" @@ -18,9 +19,63 @@ let CdnLink = "https://unpkg.com/dash-table@4.12.1/dash_table/bundle.js" /// [] module DataTable = - let inline convertOptional convert = function - | Some v -> convert v - | None -> null + let private extractName prop = + prop + |> sprintf "%O" + |> fun s -> s.Replace('\n', ' ').Split(' ') + |> Array.head + + let private toCase (ns: Serialization.NamingStrategy) name = + ns.GetPropertyName(name, false) + + let private toSnakeCase name = toCase (Serialization.SnakeCaseNamingStrategy()) name + let private toCamelCase name = toCase (Serialization.CamelCaseNamingStrategy()) name + let private toKebabCase name = toCase (Serialization.KebabCaseNamingStrategy()) name + + let private duToCasedName du = + let s = du |> sprintf "%A" + let ss = s.Split(' ') + let rss = ss |> Array.rev + let h = rss |> Array.head + let k = h |> toKebabCase + k + + let private convertDu du = + du + |> duToCasedName + |> box + + let private mappedDuToCaseName dus = + dus + |> Map.map (fun _ -> duToCasedName) + + let private convertMappedDu dus = + dus + |> mappedDuToCaseName + |> box + + type DUConverter () = + inherit JsonConverter () + override _.WriteJson(writer, value, serializer) = + if isNull value then writer.WriteNull() + else serializer.Serialize(writer, duToCasedName value); + + override _.ReadJson(reader, objectType, existingValue, serializer) = + let duConverter = new Converters.DiscriminatedUnionConverter() + duConverter.ReadJson(reader, objectType, existingValue, serializer) + + override _.CanConvert(objectType) = + let duConverter = new Converters.DiscriminatedUnionConverter() + duConverter.CanConvert(objectType) + + type OptionConverter<'T> () = + inherit JsonConverter<'T option> () + override _.WriteJson(writer: JsonWriter, value: 'T option, serializer: JsonSerializer) = + match value with + | Some v -> serializer.Serialize(writer, v); + | None -> writer.WriteNull() + override _.ReadJson(reader: JsonReader, objectType: Type, existingValue: 'T option, _ : bool, serializer: JsonSerializer) = + raise <| new NotImplementedException() /// ///value equal to: 'first', 'last' @@ -28,21 +83,11 @@ module DataTable = type ColumnTogglePosition = | First | Last - static member convert = - function - | First -> "first" - | Last -> "last" - >> box type TogglableColumn = | Position of ColumnTogglePosition | Bool of bool | MergedMultiHeader of bool list - static member convert = - function - | Position v -> ColumnTogglePosition.convert v - | Bool v -> box v - | MergedMultiHeader v -> box v /// ///value equal to: 'odd', 'even' @@ -50,11 +95,6 @@ module DataTable = type Alternate = | Odd | Even - static member convert = - function - | Odd -> "odd" - | Even -> "even" - >> box /// ///number | list with values of type: number | value equal to: 'odd', 'even' @@ -63,10 +103,6 @@ module DataTable = | Index of int | Indices of int list | Alternate of Alternate - static member convert = function - | Index v -> box v - | Indices v -> box v - | Alternate v -> Alternate.convert v /// ///value equal to: 'any', 'numeric', 'text', 'datetime' @@ -94,13 +130,6 @@ module DataTable = | Numeric | Text | Datetime - static member convert = - function - | Any -> "any" - | Numeric -> "numeric" - | Text -> "text" - | Datetime -> "datetime" - >> box /// ///string | list with values of type: string @@ -108,63 +137,27 @@ module DataTable = type StyleColumn = | Id of string | Ids of string list - static member convert = function - | Id v -> box v - | Ids v -> box v /// ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'header_index: number | list with values of type: number | value equal to: 'odd', 'even' (optional)', 'column_editable: boolean (optional)' (optional)' /// type ConditionalHeaderStyle = { - ColumnId: StyleColumn option - ColumnType: ColumnType option - HeaderIndex: SelectRowBy option - ColumnEditable: bool option + [)>] ColumnId: StyleColumn option + [)>] ColumnType: ColumnType option + [)>] HeaderIndex: SelectRowBy option + [>)>] ColumnEditable: bool option } - static member init () = - { - ColumnId = None - ColumnType = None - HeaderIndex = None - ColumnEditable = None - } - static member convert this = - box {| - ``if`` = - box {| - column_id = convertOptional StyleColumn.convert this.ColumnId - column_type = convertOptional ColumnType.convert this.ColumnType - header_index = convertOptional SelectRowBy.convert this.HeaderIndex - column_editable = convertOptional box this.ColumnEditable - |} - |} - /// ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'column_editable: boolean (optional)' (optional)' /// type ConditionalFilterStyle = { - ColumnId: StyleColumn option - ColumnType: ColumnType option - ColumnEditable: bool option + [)>] ColumnId: StyleColumn option + [)>] ColumnType: ColumnType option + [>)>] ColumnEditable: bool option } - static member init () = - { - ColumnId = None - ColumnType = None - ColumnEditable = None - } - static member convert this = - box {| - ``if`` = - box {| - column_id = convertOptional StyleColumn.convert this.ColumnId - column_type = convertOptional ColumnType.convert this.ColumnType - column_editable = convertOptional box this.ColumnEditable - |} - |} /// ///value equal to: 'active', 'selected' @@ -172,67 +165,28 @@ module DataTable = type DataStyleState = | Active | Selected - static member convert = - function - | Active -> "active" - | Selected -> "selected" - >> box /// ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)', 'filter_query: string (optional)', 'state: value equal to: 'active', 'selected' (optional)', 'row_index: number | value equal to: 'odd', 'even' | list with values of type: number (optional)', 'column_editable: boolean (optional)' (optional)' /// type ConditionalDataStyle = { - ColumnId: StyleColumn option - ColumnType: ColumnType option - FilterQuery: string option - State: DataStyleState option - RowIndex: SelectRowBy option - ColumnEditable: bool option + [)>] ColumnId: StyleColumn option + [)>] ColumnType: ColumnType option + [>)>] FilterQuery: string option + [)>] State: DataStyleState option + [)>] RowIndex: SelectRowBy option + [>)>] ColumnEditable: bool option } - static member init () = - { - ColumnId = None - ColumnType = None - FilterQuery = None - State = None - RowIndex = None - ColumnEditable = None - } - static member convert this = - box {| - ``if`` = - box {| - column_id = convertOptional StyleColumn.convert this.ColumnId - column_type = convertOptional ColumnType.convert this.ColumnType - filter_query = convertOptional box this.FilterQuery - state = convertOptional DataStyleState.convert this.State - row_index = convertOptional SelectRowBy.convert this.RowIndex - column_editable = convertOptional box this.ColumnEditable - |} - |} /// ///record with the field: 'if: record with the fields: 'column_id: string | list with values of type: string (optional)', 'column_type: value equal to: 'any', 'numeric', 'text', 'datetime' (optional)' (optional)' /// type ConditionalCellStyle = { - ColumnId: StyleColumn option - ColumnType: ColumnType option + [)>] ColumnId: StyleColumn option + [)>] ColumnType: ColumnType option } - static member init () = - { - ColumnId = None - ColumnType = None - } - static member convert this = - box {| - ``if`` = - box {| - column_id = convertOptional StyleColumn.convert this.ColumnId - column_type = convertOptional ColumnType.convert this.ColumnType - |} - |} /// ///value equal to: 'asc', 'desc' @@ -240,30 +194,16 @@ module DataTable = type SortDirection = | Asc | Desc - static member convert = - function - | Asc -> "asc" - | Desc -> "desc" - >> box + | AscDesc /// ///record with the fields: 'column_id: string (required)', 'direction: value equal to: 'asc', 'desc' (required)' /// type SortBy = { - ColumnId: string - Direction: SortDirection + [] ColumnId: string + [)>] Direction: SortDirection } - static member create columnId direction = - { - ColumnId = columnId - Direction = direction - } - static member convert this = - box {| - column_id = this.ColumnId - direction = SortDirection.convert this.Direction - |} /// ///value equal to: 'single', 'multi' @@ -271,11 +211,6 @@ module DataTable = type SortMode = | Single | Multi - static member convert = - function - | Single -> "single" - | Multi -> "multi" - >> box /// ///value equal to: 'custom', 'native', 'none' @@ -284,12 +219,6 @@ module DataTable = | Custom | Native | None - static member convert = - function - | Custom -> "custom" - | Native -> "native" - | None -> "none" - >> box /// ///value equal to: 'sensitive', 'insensitive' @@ -297,21 +226,14 @@ module DataTable = type FilterOptionCase = | Sensitive | Insensitive - static member convert = - function - | Sensitive -> "sensitive" - | Insensitive -> "insensitive" - >> box /// ///record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' /// type FilterOption = - { Case: FilterOptionCase option } - static member create () = - { Case = Option.None } - static member convert this = - box {| case = convertOptional FilterOptionCase.convert this.Case |} + { + [)>] Case: FilterOptionCase option + } /// ///value equal to: 'and', 'or' @@ -319,11 +241,6 @@ module DataTable = type FilterActionOperator = | And | Or - static member convert = - function - | And -> "and" - | Or -> "or" - >> box /// ///value equal to: 'custom', 'native' @@ -331,30 +248,15 @@ module DataTable = type FilterActionType = | Custom | Native - static member convert = - function - | Custom -> "custom" - | Native -> "native" - >> box /// ///record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)' /// type ConditionalFilterAction = { - Type: FilterActionType - Operator: FilterActionOperator option + [)>] Type: FilterActionType + [)>] Operator: FilterActionOperator option } - static member create ``type`` = - { - Type = ``type`` - Operator = Option.None - } - static member convert this = - box {| - ``type`` = FilterActionType.convert this.Type - operator = convertOptional FilterActionOperator.convert this.Operator - |} /// ///value equal to: 'custom', 'native', 'none' | record with the fields: 'type: value equal to: 'custom', 'native' (required)', 'operator: value equal to: 'and', 'or' (optional)' @@ -362,10 +264,6 @@ module DataTable = type FilterAction = | Type of MaybeActionType | Conditional of ConditionalFilterAction - static member convert = - function - | Type v -> v |> MaybeActionType.convert - | Conditional v -> v |> ConditionalFilterAction.convert /// ///value equal to: 'text', 'markdown' @@ -377,36 +275,17 @@ module DataTable = type TooltipValueType = | Text | Markdown - static member convert = - function - | Text -> "text" - | Markdown -> "markdown" - >> box /// ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' /// type TooltipValue = { - Value: string - Type: TooltipValueType option - Delay: int option - Duration: int option + [] Value: string + [)>] Type: TooltipValueType option + [>)>] Delay: int option + [>)>] Duration: int option } - static member create value = - { - Value = value - Type = Option.None - Delay = Option.None - Duration = Option.None - } - static member convert this = - box {| - value = this.Value - ``type`` = convertOptional TooltipValueType.convert this.Type - delay = convertOptional box this.Delay - duration = convertOptional box this.Duration - |} /// ///value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' @@ -415,11 +294,6 @@ module DataTable = | Text of string | Value of TooltipValue | Null - static member convert = - function - | Text v -> box v - | Value v -> TooltipValue.convert v - | Null -> null /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' | list with values of type: value equal to: 'null' | string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' @@ -428,11 +302,6 @@ module DataTable = | Text of string | Value of TooltipValue | Values of MaybeTooltip list - static member convert = - function - | Text v -> box v - | Value v -> TooltipValue.convert v - | Values v -> v |> List.map MaybeTooltip.convert |> box /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' @@ -440,10 +309,6 @@ module DataTable = type DataTooltip = | Text of string | Value of TooltipValue - static member convert = - function - | Text v -> box v - | Value v -> TooltipValue.convert v /// ///record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' @@ -455,50 +320,22 @@ module DataTable = /// type TooltipCondition = { - ColumnId: string option - FilterQuery: string option - RowIndex: SelectRowBy option + [>)>] ColumnId: string option + [>)>] FilterQuery: string option + [)>] RowIndex: SelectRowBy option } - static member create () = - { - ColumnId = Option.None - FilterQuery = Option.None - RowIndex = Option.None - } - static member convert this = - box {| - column_id = convertOptional box this.ColumnId - filter_query = convertOptional box this.FilterQuery - row_index = convertOptional SelectRowBy.convert this.RowIndex - |} /// ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)', 'row_index: number | value equal to: 'odd', 'even' (optional)' (required)', 'type: value equal to: 'text', 'markdown' (optional)', 'value: string (required)' /// type ConditionalTooltip = { - Value: string - If: TooltipCondition option - Type: TooltipValueType option - Delay: int option - Duration: int option + [] Value: string + [>)>] If: TooltipCondition option + [)>] Type: TooltipValueType option + [>)>] Delay: int option + [>)>] Duration: int option } - static member create value = - { - Value = value - If = Option.None - Type = Option.None - Delay = Option.None - Duration = Option.None - } - static member convert this = - box {| - value = this.Value - ``if`` = convertOptional TooltipCondition.convert this.If - delay = convertOptional box this.Delay - duration = convertOptional box this.Duration - ``type`` = convertOptional TooltipValueType.convert this.Type - |} /// ///value equal to: 'both', 'data', 'header' @@ -511,155 +348,73 @@ module DataTable = | Both | Data | Header - static member convert = - function - | Both -> "both" - | Data -> "data" - | Header -> "header" - >> box /// ///record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)' /// type UseWithTooltipValue = { - Value: string - UseWith: TooltipUseWith option - Type: TooltipValueType option - Delay: int option - Duration: int option + [] Value: string + [)>] UseWith: TooltipUseWith option + [)>] Type: TooltipValueType option + [>)>] Delay: int option + [>)>] Duration: int option } - static member create value = - { - Value = value - UseWith = Option.None - Type = Option.None - Delay = Option.None - Duration = Option.None - } - static member convert this = - box {| - value = this.Value - use_with = convertOptional TooltipUseWith.convert this.UseWith - ``type`` = convertOptional TooltipValueType.convert this.Type - delay = convertOptional box this.Delay - duration = convertOptional box this.Duration - |} /// ///string | record with the fields: 'delay: number (optional)', 'duration: number (optional)', 'type: value equal to: 'text', 'markdown' (optional)', 'use_with: value equal to: 'both', 'data', 'header' (optional)', 'value: string (required)' /// - type Tooltip = + type ColumnTooltip = | Text of string | UseWithValue of UseWithTooltipValue - static member convert = - function - | Text v -> box v - | UseWithValue v -> UseWithTooltipValue.convert v /// ///record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' /// type DropdownCondition = { - ColumnId: string option - FilterQuery: string option + [>)>] ColumnId: string option + [>)>] FilterQuery: string option } - static member create () = - { - ColumnId = Option.None - FilterQuery = Option.None - } - static member convert this = - box {| - column_id = convertOptional box this.ColumnId - filter_query = convertOptional box this.FilterQuery - |} /// ///record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' /// type DropdownOption = { - Label: string - Value: IConvertible + [] Label: string + [] Value: IConvertible } - static member create label value = - { - Label = label - Value = value - } - static member convert this = - box {| - label = this.Label - value = this.Value - |} /// ///record with the fields: 'clearable: boolean (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)' /// type Dropdown = { - Options: DropdownOption list - Clearable: bool option + [] Options: DropdownOption list + [>)>] Clearable: bool option } - static member create options = - { - Options = options - Clearable = Option.None - } - static member convert this = - box {| - options = this.Options |> List.map DropdownOption.convert - clearable = convertOptional box this.Clearable - |} /// ///record with the fields: 'clearable: boolean (optional)', 'if: record with the fields: 'column_id: string (optional)', 'filter_query: string (optional)' (optional)', 'options: list with values of type: record with the fields: 'label: string (required)', 'value: number | string | boolean (required)' (required)' /// type ConditionalDropdown = { - Clearable: bool option - If: DropdownCondition option - Options: DropdownOption list + [>)>] Clearable: bool option + [>)>] If: DropdownCondition option + [>)>] Options: DropdownOption list } - static member create options = - { - Clearable = Option.None - If = Option.None - Options = options - } - static member convert this = - box {| - clearable = convertOptional box this.Clearable - ``if`` = convertOptional DropdownCondition.convert this.If - options = this.Options |> List.map DropdownOption.convert - |} /// ///record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)' /// type Cell = { - Row: int option - Column: int option - RowId: IConvertible option - ColumnId: string option + [>)>] Row: int option + [>)>] Column: int option + [>)>] RowId: IConvertible option + [>)>] ColumnId: string option } - static member create () = - { - Row = Option.None - Column = Option.None - RowId = Option.None - ColumnId = Option.None - } - static member convert this = - box {| - row = convertOptional box this.Row - column = convertOptional box this.Column - row_id = convertOptional box this.RowId - column_id = convertOptional box this.ColumnId - |} /// ///value equal to: 'single', 'multi', 'false' @@ -668,29 +423,13 @@ module DataTable = | Single | Multi | False - static member convert = - function - | Single -> "single" - | Multi -> "multi" - | False -> "false" - >> box ///• fixed_columns/fixed_headers (record with the fields: 'data: value equal to: '0' (optional)', 'headers: value equal to: 'false' (optional)' | record with the fields: 'data: number (optional)', 'headers: value equal to: 'true' (required)'; default { type Fixed = { - Data: uint option - Headers: bool option + [>)>] Data: uint option + [>)>] Headers: bool option } - static member create () = - { - Data = Option.None - Headers = Option.None - } - static member convert this = - box {| - data = convertOptional box this.Data - headers = convertOptional box this.Headers - |} /// ///value equal to: 'none', 'ids', 'names', 'display' @@ -700,13 +439,6 @@ module DataTable = | Ids | Names | Display - static member convert = - function - | None -> "none" - | Ids -> "ids" - | Names -> "names" - | Display -> "display" - >> box /// ///value equal to: 'csv', 'xlsx', 'none' @@ -715,12 +447,6 @@ module DataTable = | Csv | Xlsx | None - static member convert = - function - | Csv -> "csv" - | Xlsx -> "xlsx" - | None -> "none" - >> box /// ///value equal to: 'all', 'visible' @@ -728,30 +454,15 @@ module DataTable = type ExportColumns = | All | Visible - static member convert = - function - | All -> "all" - | Visible -> "visible" - >> box /// ///record with the fields: 'selector: string (required)', 'rule: string (required)' /// type Css = { - Selector: string - Rule: string + [] Selector: string + [] Rule: string } - static member create selector rule = - { - Selector = selector - Rule = rule - } - static member convert this = - box {| - selector = this.Selector - rule = this.Rule - |} /// ///value equal to: '_blank', '_parent', '_self', '_top' @@ -761,13 +472,6 @@ module DataTable = | Parent | Self | Top - static member convert = - function - | Blank -> "_blank" - | Parent -> "_parent" - | Self -> "_self" - | Top -> "_top" - >> box /// ///string | value equal to: '_blank', '_parent', '_self', '_top' @@ -779,63 +483,29 @@ module DataTable = type LinkTarget = | Text of string | Behaviour of LinkBehaviour - static member convert = - function - | Text v -> box v - | Behaviour v -> v |> LinkBehaviour.convert /// ///record with the fields: 'link_target: string | value equal to: '_blank', '_parent', '_self', '_top' (optional)', 'html: boolean (optional)' /// type MarkdownOptions = { - LinkTarget: LinkTarget option - Html: bool option + [)>] LinkTarget: LinkTarget option + [>)>] Html: bool option } - static member create () = - { - LinkTarget = Option.None - Html = Option.None - } - static member convert this = - box {| - link_target = convertOptional LinkTarget.convert this.LinkTarget - html = convertOptional box this.Html - |} /// ///record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' /// type LocaleFormat = { - Symbol: string list option - Decimal: string option - Group: string option - Grouping: int list option - Numerals: string list option - Percent: string option - Separate4digits: bool option + [>)>] Symbol: string list option + [>)>] Decimal: string option + [>)>] Group: string option + [>)>] Grouping: int list option + [>)>] Numerals: string list option + [>)>] Percent: string option + [>)>] Separate4digits: bool option } - static member create () = - { - Symbol = Option.None - Decimal = Option.None - Group = Option.None - Grouping = Option.None - Numerals = Option.None - Percent = Option.None - Separate4digits = Option.None - } - static member convert this = - box {| - symbol = convertOptional box this.Symbol - decimal = convertOptional box this.Decimal - group = convertOptional box this.Group - grouping = convertOptional box this.Grouping - numerals = convertOptional box this.Numerals - percent = convertOptional box this.Percent - separate_4digits = convertOptional box this.Separate4digits - |} /// ///record with the fields: 'allow_null: boolean (optional)', 'default: boolean | number | string | record | list (optional)', 'allow_YY: boolean (optional)' @@ -845,22 +515,10 @@ module DataTable = /// type ColumnValidation = { - AllowNull: bool option - Default: obj option - AllowYY: bool option + [>)>] AllowNull: bool option + [>)>] Default: obj option + [>)>] AllowYY: bool option } - static member create () = - { - AllowNull = Option.None - Default = Option.None - AllowYY = Option.None - } - static member convert this = - box {| - allow_null = convertOptional box this.AllowNull - ``default`` = convertOptional box this.Default - allow_YY = convertOptional box this.AllowYY - |} /// ///value equal to: 'accept', 'default', 'reject' @@ -874,12 +532,6 @@ module DataTable = | Accept | Default | Reject - static member convert = - function - | Accept -> "accept" - | Default -> "default" - | Reject -> "reject" - >> box /// ///value equal to: 'coerce', 'none', 'validate' @@ -893,12 +545,6 @@ module DataTable = | Coerce | None | Validate - static member convert = - function - | Coerce -> "coerce" - | None -> "none" - | Validate -> "validate" - >> box /// ///record with the fields: 'action: value equal to: 'coerce', 'none', 'validate' (optional)', 'failure: value equal to: 'accept', 'default', 'reject' (optional)' @@ -907,19 +553,9 @@ module DataTable = /// type ColumnOnChange = { - Action: MaybeOnChangeAction option - Failure: FailureAction option + [)>] Action: MaybeOnChangeAction option + [)>] Failure: FailureAction option } - static member create () = - { - Action = Option.None - Failure = Option.None - } - static member convert this = - box {| - action = convertOptional MaybeOnChangeAction.convert this.Action - failure = convertOptional FailureAction.convert this.Failure - |} /// ///value equal to: 'input', 'dropdown', 'markdown' @@ -932,12 +568,6 @@ module DataTable = | Input | Dropdown | Markdown - static member convert = - function - | Input -> "input" - | Dropdown -> "dropdown" - | Markdown -> "markdown" - >> box /// ///record with the fields: 'locale: record with the fields: 'symbol: list with values of type: string (optional)', 'decimal: string (optional)', 'group: string (optional)', 'grouping: list with values of type: number (optional)', 'numerals: list with values of type: string (optional)', 'percent: string (optional)', 'separate_4digits: boolean (optional)' (optional)', 'nully: boolean | number | string | record | list (optional)', 'prefix: number (optional)', 'specifier: string (optional)' @@ -949,25 +579,11 @@ module DataTable = /// type ColumnFormat = { - Locale: LocaleFormat option - Nully: obj option - Prefix: int option - Specifier: string option + [>)>] Locale: LocaleFormat option + [>)>] Nully: obj option + [>)>] Prefix: int option + [>)>] Specifier: string option } - static member create () = - { - Locale = Option.None - Nully = Option.None - Prefix = Option.None - Specifier = Option.None - } - static member convert this = - box {| - locale = convertOptional LocaleFormat.convert this.Locale - nully = convertOptional box this.Nully - prefix = convertOptional box this.Prefix - specifier = convertOptional box this.Specifier - |} /// ///value equal to: 'first', 'last' | boolean | list with values of type: boolean @@ -1035,11 +651,6 @@ module DataTable = type FilterSensitifity = | Sensitive | Insensitive - static member convert = - function - | Sensitive -> "sensitive" - | Insensitive -> "insensitive" - >> box /// ///record with the field: 'case: value equal to: 'sensitive', 'insensitive' (optional)' @@ -1053,11 +664,9 @@ module DataTable = ///the table-level `filter_options` prop for that column. /// type ColumnFilterOption = - { Case: FilterSensitifity option } - static member create () = - { Case = Option.None } - static member convert this = - box {| case = convertOptional FilterSensitifity.convert this.Case |} + { + [)>] Case: FilterSensitifity option + } /// ///value equal to: 'first', 'last' | boolean | list with values of type: boolean @@ -1106,21 +715,21 @@ module DataTable = /// type Column = { - Name: string list - Id: string - Type: ColumnType option - Clearable: ColumnClearable option - Deletable: ColumnDeletable option - Editable: bool option - FilterOptions: ColumnFilterOption option - Hideable: ColumnHideable option - Renamable: ColumnRenamable option - Selectable: ColumnSelectable option - Format: ColumnFormat option - Presentation: ColumnPresentation option - OnChange: ColumnOnChange option - SortAsNull: IConvertible list option - Validation: ColumnValidation option + [] Name: string list + [] Id: string + [)>] Type: ColumnType option + [)>] Clearable: ColumnClearable option + [)>] Deletable: ColumnDeletable option + [>)>] Editable: bool option + [>)>] FilterOptions: ColumnFilterOption option + [)>] Hideable: ColumnHideable option + [)>] Renamable: ColumnRenamable option + [)>] Selectable: ColumnSelectable option + [>)>] Format: ColumnFormat option + [>)>] Presentation: ColumnPresentation option + [>)>] OnChange: ColumnOnChange option + [>)>] SortAsNull: IConvertible list option + [>)>] Validation: ColumnValidation option } static member create name id = { @@ -1140,49 +749,17 @@ module DataTable = SortAsNull = Option.None Validation = Option.None } - static member convert this = - box {| - name = this.Name - id = this.Id - ``type`` = convertOptional ColumnType.convert this.Type - clearable = convertOptional ColumnClearable.convert this.Clearable - deletable = convertOptional ColumnDeletable.convert this.Deletable - editable = convertOptional box this.Editable - filter_options = convertOptional ColumnFilterOption.convert this.FilterOptions - hideable = convertOptional ColumnHideable.convert this.Hideable - renamable = convertOptional ColumnRenamable.convert this.Renamable - selectable = convertOptional ColumnSelectable.convert this.Selectable - format = convertOptional ColumnFormat.convert this.Format - presentation = convertOptional ColumnPresentation.convert this.Presentation - on_change = convertOptional ColumnOnChange.convert this.OnChange - sort_as_null = convertOptional box this.SortAsNull - validation = convertOptional ColumnValidation.convert this.Validation - |} /// ///record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)' /// type ActiveCell = { - Row: int option - Column: int option - RowId: IConvertible option - ColumnId: string option + [>)>] Row: int option + [>)>] Column: int option + [>)>] RowId: IConvertible option + [>)>] ColumnId: string option } - static member create () = - { - Row = Option.None - Column = Option.None - RowId = Option.None - ColumnId = Option.None - } - static member convert this = - box {| - row = convertOptional box this.Row - column = convertOptional box this.Column - row_id = convertOptional box this.RowId - column_id = convertOptional box this.ColumnId - |} /// ///• active_cell (record with the fields: 'row: number (optional)', 'column: number (optional)', 'row_id: string | number (optional)', 'column_id: string (optional)') - The row and column indices and IDs of the currently active cell. @@ -1670,7 +1247,7 @@ module DataTable = | Dropdown of Map | DropdownConditional of seq | DropdownData of seq> - | Tooltip of Map + | Tooltip of Map | TooltipConditional of seq | TooltipData of seq> | TooltipHeader of Map @@ -1711,65 +1288,65 @@ module DataTable = | PersistenceType of PersistenceTypeOptions static member convert = function - | ActiveCell p -> ActiveCell.convert p - | Columns p -> p |> Seq.map Column.convert |> box + | ActiveCell p -> box p + | Columns p -> box p | IncludeHeadersOnCopyPaste p -> box p - | LocaleFormat p -> LocaleFormat.convert p - | MarkdownOptions p -> MarkdownOptions.convert p - | Css p -> p |> Seq.map Css.convert |> box + | LocaleFormat p -> box p + | MarkdownOptions p -> box p + | Css p -> box p | Data p -> box p | DataPrevious p -> box p | DataTimestamp p -> box p | Editable p -> box p - | EndCell p -> Cell.convert p - | ExportColumns p -> ExportColumns.convert p - | ExportFormat p -> MaybeExportFormat.convert p - | ExportHeaders p -> MaybeExportHeaders.convert p + | EndCell p -> box p + | ExportColumns p -> convertDu p + | ExportFormat p -> convertDu p + | ExportHeaders p -> convertDu p | FillWidth p -> box p | HiddenColumns p -> box p | IsFocused p -> box p | MergeDuplicateHeaders p -> box p - | FixedColumns p -> Fixed.convert p - | FixedRows p -> Fixed.convert p - | ColumnSelectable p -> Select.convert p + | FixedColumns p -> box p + | FixedRows p -> box p + | ColumnSelectable p -> convertDu p | RowDeletable p -> box p | CellSelectable p -> box p - | RowSelectable p -> Select.convert p - | SelectedCells p -> p |> Seq.map Cell.convert |> box + | RowSelectable p -> convertDu p + | SelectedCells p -> box p | SelectedRows p -> box p | SelectedColumns p -> box p | SelectedRowIds p -> box p - | StartCell p -> Cell.convert p + | StartCell p -> box p | StyleAsListView p -> box p - | PageAction p -> MaybeActionType.convert p + | PageAction p -> convertDu p | PageCurrent p -> box p | PageCount p -> box p | PageSize p -> box p - | Dropdown p -> p |> Map.map (fun _ -> Dropdown.convert) |> box - | DropdownConditional p -> p |> Seq.map ConditionalDropdown.convert |> box - | DropdownData p -> p |> Seq.map (Map.map (fun _ -> Dropdown.convert)) |> box - | Tooltip p -> p |> Map.map (fun _ -> Tooltip.convert) |> box + | Dropdown p -> box p + | DropdownConditional p -> box p + | DropdownData p -> box p + | Tooltip p -> convertMappedDu p | TooltipConditional p -> box p - | TooltipData p -> p |> Seq.map (Map.map (fun _ -> DataTooltip.convert)) |> box - | TooltipHeader p -> p |> Map.map (fun _ -> HeaderTooltip.convert) |> box + | TooltipData p -> p |> Seq.map mappedDuToCaseName |> box + | TooltipHeader p -> convertMappedDu p | TooltipDelay p -> box p | TooltipDuration p -> box p | FilterQuery p -> box p - | FilterAction p -> FilterAction.convert p - | FilterOptions p -> FilterOption.convert p - | SortAction p -> MaybeActionType.convert p - | SortMode p -> SortMode.convert p - | SortBy p -> p |> Seq.map SortBy.convert |> box + | FilterAction p -> convertDu p + | FilterOptions p -> box p + | SortAction p -> convertDu p + | SortMode p -> convertDu p + | SortBy p -> box p | SortAsNull p -> box p | StyleTable p -> box p | StyleCell p -> box p | StyleData p -> box p | StyleFilter p -> box p | StyleHeader p -> box p - | StyleCellConditional p -> p |> Seq.map ConditionalCellStyle.convert |> box - | StyleDataConditional p -> p |> Seq.map ConditionalDataStyle.convert |> box - | StyleFilterConditional p -> p |> Seq.map ConditionalFilterStyle.convert |> box - | StyleHeaderConditional p -> p |> Seq.map ConditionalHeaderStyle.convert |> box + | StyleCellConditional p -> box p + | StyleDataConditional p -> box p + | StyleFilterConditional p -> box p + | StyleHeaderConditional p -> box p | Virtualization p -> box p | DerivedFilterQueryStructure p -> box p | DerivedViewportData p -> box p @@ -1783,96 +1360,17 @@ module DataTable = | DerivedVirtualRowIds p -> box p | DerivedVirtualSelectedRows p -> box p | DerivedVirtualSelectedRowIds p -> box p - | LoadingState p -> LoadingState.convert p + | LoadingState p -> box p | Persistence p -> box p | PersistedProps p -> box p - | PersistenceType p -> PersistenceTypeOptions.convert p - - static member toNameOf = function - | ActiveCell _ -> "active_cell" - | Columns _ -> "columns" - | IncludeHeadersOnCopyPaste _ -> "include_headers_on_copy_paste" - | LocaleFormat _ -> "locale_format" - | MarkdownOptions _ -> "markdown_options" - | Css _ -> "css" - | Data _ -> "data" - | DataPrevious _ -> "data_previous" - | DataTimestamp _ -> "data_timestamp" - | Editable _ -> "editable" - | EndCell _ -> "end_cell" - | ExportColumns _ -> "export_columns" - | ExportFormat _ -> "export_format" - | ExportHeaders _ -> "export_headers" - | FillWidth _ -> "fill_width" - | HiddenColumns _ -> "hidden_columns" - | IsFocused _ -> "is_focused" - | MergeDuplicateHeaders _ -> "merge_duplicate_headers" - | FixedColumns _ -> "fixed_columns" - | FixedRows _ -> "fixed_rows" - | ColumnSelectable _ -> "column_selectable" - | RowDeletable _ -> "row_deletable" - | CellSelectable _ -> "cell_selectable" - | RowSelectable _ -> "row_selectable" - | SelectedCells _ -> "selected_cells" - | SelectedRows _ -> "selected_rows" - | SelectedColumns _ -> "selected_columns" - | SelectedRowIds _ -> "selected_row_ids" - | StartCell _ -> "start_cell" - | StyleAsListView _ -> "style_as_list_view" - | PageAction _ -> "page_action" - | PageCurrent _ -> "page_current" - | PageCount _ -> "page_count" - | PageSize _ -> "page_size" - | Dropdown _ -> "dropdown" - | DropdownConditional _ -> "dropdown_conditional" - | DropdownData _ -> "dropdown_data" - | Tooltip _ -> "tooltip" - | TooltipConditional _ -> "tooltip_conditional" - | TooltipData _ -> "tooltip_data" - | TooltipHeader _ -> "tooltip_header" - | TooltipDelay _ -> "tooltip_delay" - | TooltipDuration _ -> "tooltip_duration" - | FilterQuery _ -> "filter_query" - | FilterAction _ -> "filter_action" - | FilterOptions _ -> "filter_options" - | SortAction _ -> "sort_action" - | SortMode _ -> "sort_mode" - | SortBy _ -> "sort_by" - | SortAsNull _ -> "sort_as_null" - | StyleTable _ -> "style_table" - | StyleCell _ -> "style_cell" - | StyleData _ -> "style_data" - | StyleFilter _ -> "style_filter" - | StyleHeader _ -> "style_header" - | StyleCellConditional _ -> "style_cell_conditional" - | StyleDataConditional _ -> "style_data_conditional" - | StyleFilterConditional _ -> "style_filter_conditional" - | StyleHeaderConditional _ -> "style_header_conditional" - | Virtualization _ -> "virtualization" - | DerivedFilterQueryStructure _ -> "derived_filter_query_structure" - | DerivedViewportData _ -> "derived_viewport_data" - | DerivedViewportIndices _ -> "derived_viewport_indices" - | DerivedViewportRowIds _ -> "derived_viewport_row_ids" - | DerivedViewportSelectedColumns _ -> "derived_viewport_selected_columns" - | DerivedViewportSelectedRows _ -> "derived_viewport_selected_rows" - | DerivedViewportSelectedRowIds _ -> "derived_viewport_selected_row_ids" - | DerivedVirtualData _ -> "derived_virtual_data" - | DerivedVirtualIndices _ -> "derived_virtual_indices" - | DerivedVirtualRowIds _ -> "derived_virtual_row_ids" - | DerivedVirtualSelectedRows _ -> "derived_virtual_selected_rows" - | DerivedVirtualSelectedRowIds _ -> "derived_virtual_selected_row_ids" - | LoadingState _ -> "loading_state" - | Persistence _ -> "persistence" - | PersistedProps _ -> "persisted_props" - | PersistenceType _ -> "persistence_type" + | PersistenceType p -> convertDu p + + static member toNameOf : Prop -> string = + extractName >> toSnakeCase static member toDynamicMemberDef(prop: Prop) = prop |> Prop.toNameOf, prop |> Prop.convert - static member setValueOpt dynamicObj toProp propName = - Option.map (toProp >> Prop.convert) - >> DynObj.setValueOpt dynamicObj propName - /// ///A list of children or a property for this dash component /// @@ -2174,7 +1672,7 @@ module DataTable = /// id and the value is a tooltip configuration. ///Example: {i: {'value': i, 'use_with: 'both'} for i in df.columns} /// - static member tooltip(p: Map) = Prop(Tooltip p) + static member tooltip(p: Map) = Prop(Tooltip p) /// ///`tooltip_conditional` represents the tooltip shown ///for different columns and cells. @@ -2592,85 +2090,94 @@ module DataTable = ) = fun (dataTable: DataTable) -> let props = DashComponentProps() + let inline mkPropName prop = + prop |> extractName |> toCamelCase + let inline setValueOpt prop maybeValue = + prop + |> mkPropName + |> fun propName -> + maybeValue + |> Option.map (prop >> Prop.convert) + |> DynObj.setValueOpt props propName DynObj.setValue props "id" id DynObj.setValue props "children" children - Prop.setValueOpt props ActiveCell "activeCell" activeCell - Prop.setValueOpt props Columns "columns" columns - Prop.setValueOpt props IncludeHeadersOnCopyPaste "includeHeadersOnCopyPaste" includeHeadersOnCopyPaste - Prop.setValueOpt props LocaleFormat "localeFormat" localeFormat - Prop.setValueOpt props MarkdownOptions "markdownOptions" markdownOptions - Prop.setValueOpt props Css "css" css - Prop.setValueOpt props Data "data" data - Prop.setValueOpt props DataPrevious "dataPrevious" dataPrevious - Prop.setValueOpt props DataTimestamp "dataTimestamp" dataTimestamp - Prop.setValueOpt props Editable "editable" editable - Prop.setValueOpt props EndCell "endCell" endCell - Prop.setValueOpt props ExportColumns "exportColumns" exportColumns - Prop.setValueOpt props ExportFormat "exportFormat" exportFormat - Prop.setValueOpt props ExportHeaders "exportHeaders" exportHeaders - Prop.setValueOpt props FillWidth "fillWidth" fillWidth - Prop.setValueOpt props HiddenColumns "hiddenColumns" hiddenColumns - Prop.setValueOpt props IsFocused "isFocused" isFocused - Prop.setValueOpt props MergeDuplicateHeaders "mergeDuplicateHeaders" mergeDuplicateHeaders - Prop.setValueOpt props FixedColumns "fixedColumns" fixedColumns - Prop.setValueOpt props FixedRows "fixedRows" fixedRows - Prop.setValueOpt props ColumnSelectable "columnSelectable" columnSelectable - Prop.setValueOpt props RowDeletable "rowDeletable" rowDeletable - Prop.setValueOpt props CellSelectable "cellSelectable" cellSelectable - Prop.setValueOpt props RowSelectable "rowSelectable" rowSelectable - Prop.setValueOpt props SelectedCells "selectedCells" selectedCells - Prop.setValueOpt props SelectedRows "selectedRows" selectedRows - Prop.setValueOpt props SelectedColumns "selectedColumns" selectedColumns - Prop.setValueOpt props SelectedRowIds "selectedRowIds" selectedRowIds - Prop.setValueOpt props StartCell "startCell" startCell - Prop.setValueOpt props StyleAsListView "styleAsListView" styleAsListView - Prop.setValueOpt props PageAction "pageAction" pageAction - Prop.setValueOpt props PageCurrent "pageCurrent" pageCurrent - Prop.setValueOpt props PageCount "pageCount" pageCount - Prop.setValueOpt props PageSize "pageSize" pageSize - Prop.setValueOpt props Dropdown "dropdown" dropdown - Prop.setValueOpt props DropdownConditional "dropdownConditional" dropdownConditional - Prop.setValueOpt props DropdownData "dropdownData" dropdownData - Prop.setValueOpt props Tooltip "tooltip" tooltip - Prop.setValueOpt props TooltipConditional "tooltipConditional" tooltipConditional - Prop.setValueOpt props TooltipData "tooltipData" tooltipData - Prop.setValueOpt props TooltipHeader "tooltipHeader" tooltipHeader - Prop.setValueOpt props TooltipDelay "tooltipDelay" tooltipDelay - Prop.setValueOpt props TooltipDuration "tooltipDuration" tooltipDuration - Prop.setValueOpt props FilterQuery "filterQuery" filterQuery - Prop.setValueOpt props FilterAction "filterAction" filterAction - Prop.setValueOpt props FilterOptions "filterOptions" filterOptions - Prop.setValueOpt props SortAction "sortAction" sortAction - Prop.setValueOpt props SortMode "sortMode" sortMode - Prop.setValueOpt props SortBy "sortBy" sortBy - Prop.setValueOpt props SortAsNull "sortAsNull" sortAsNull - Prop.setValueOpt props StyleTable "styleTable" styleTable - Prop.setValueOpt props StyleCell "styleCell" styleCell - Prop.setValueOpt props StyleData "styleData" styleData - Prop.setValueOpt props StyleFilter "styleFilter" styleFilter - Prop.setValueOpt props StyleHeader "styleHeader" styleHeader - Prop.setValueOpt props StyleCellConditional "styleCellConditional" styleCellConditional - Prop.setValueOpt props StyleDataConditional "styleDataConditional" styleDataConditional - Prop.setValueOpt props StyleFilterConditional "styleFilterConditional" styleFilterConditional - Prop.setValueOpt props StyleHeaderConditional "styleHeaderConditional" styleHeaderConditional - Prop.setValueOpt props Virtualization "virtualization" virtualization - Prop.setValueOpt props DerivedFilterQueryStructure "derivedFilterQueryStructure" derivedFilterQueryStructure - Prop.setValueOpt props DerivedViewportData "derivedViewportData" derivedViewportData - Prop.setValueOpt props DerivedViewportIndices "derivedViewportIndices" derivedViewportIndices - Prop.setValueOpt props DerivedViewportRowIds "derivedViewportRowIds" derivedViewportRowIds - Prop.setValueOpt props DerivedViewportSelectedColumns "derivedViewportSelectedColumns" derivedViewportSelectedColumns - Prop.setValueOpt props DerivedViewportSelectedRows "derivedViewportSelectedRows" derivedViewportSelectedRows - Prop.setValueOpt props DerivedViewportSelectedRowIds "derivedViewportSelectedRowIds" derivedViewportSelectedRowIds - Prop.setValueOpt props DerivedVirtualData "derivedVirtualData" derivedVirtualData - Prop.setValueOpt props DerivedVirtualIndices "derivedVirtualIndices" derivedVirtualIndices - Prop.setValueOpt props DerivedVirtualRowIds "derivedVirtualRowIds" derivedVirtualRowIds - Prop.setValueOpt props DerivedVirtualSelectedRows "derivedVirtualSelectedRows" derivedVirtualSelectedRows - Prop.setValueOpt props DerivedVirtualSelectedRowIds "derivedVirtualSelectedRowIds" derivedVirtualSelectedRowIds - Prop.setValueOpt props LoadingState "loadingState" loadingState - Prop.setValueOpt props Persistence "persistence" persistence - Prop.setValueOpt props PersistedProps "persistedProps" persistedProps - Prop.setValueOpt props PersistenceType "persistenceType" persistenceType + setValueOpt ActiveCell activeCell + setValueOpt Columns columns + setValueOpt IncludeHeadersOnCopyPaste includeHeadersOnCopyPaste + setValueOpt LocaleFormat localeFormat + setValueOpt MarkdownOptions markdownOptions + setValueOpt Css css + setValueOpt Data data + setValueOpt DataPrevious dataPrevious + setValueOpt DataTimestamp dataTimestamp + setValueOpt Editable editable + setValueOpt EndCell endCell + setValueOpt ExportColumns exportColumns + setValueOpt ExportFormat exportFormat + setValueOpt ExportHeaders exportHeaders + setValueOpt FillWidth fillWidth + setValueOpt HiddenColumns hiddenColumns + setValueOpt IsFocused isFocused + setValueOpt MergeDuplicateHeaders mergeDuplicateHeaders + setValueOpt FixedColumns fixedColumns + setValueOpt FixedRows fixedRows + setValueOpt ColumnSelectable columnSelectable + setValueOpt RowDeletable rowDeletable + setValueOpt CellSelectable cellSelectable + setValueOpt RowSelectable rowSelectable + setValueOpt SelectedCells selectedCells + setValueOpt SelectedRows selectedRows + setValueOpt SelectedColumns selectedColumns + setValueOpt SelectedRowIds selectedRowIds + setValueOpt StartCell startCell + setValueOpt StyleAsListView styleAsListView + setValueOpt PageAction pageAction + setValueOpt PageCurrent pageCurrent + setValueOpt PageCount pageCount + setValueOpt PageSize pageSize + setValueOpt Dropdown dropdown + setValueOpt DropdownConditional dropdownConditional + setValueOpt DropdownData dropdownData + setValueOpt Tooltip tooltip + setValueOpt TooltipConditional tooltipConditional + setValueOpt TooltipData tooltipData + setValueOpt TooltipHeader tooltipHeader + setValueOpt TooltipDelay tooltipDelay + setValueOpt TooltipDuration tooltipDuration + setValueOpt FilterQuery filterQuery + setValueOpt FilterAction filterAction + setValueOpt FilterOptions filterOptions + setValueOpt SortAction sortAction + setValueOpt SortMode sortMode + setValueOpt SortBy sortBy + setValueOpt SortAsNull sortAsNull + setValueOpt StyleTable styleTable + setValueOpt StyleCell styleCell + setValueOpt StyleData styleData + setValueOpt StyleFilter styleFilter + setValueOpt StyleHeader styleHeader + setValueOpt StyleCellConditional styleCellConditional + setValueOpt StyleDataConditional styleDataConditional + setValueOpt StyleFilterConditional styleFilterConditional + setValueOpt StyleHeaderConditional styleHeaderConditional + setValueOpt Virtualization virtualization + setValueOpt DerivedFilterQueryStructure derivedFilterQueryStructure + setValueOpt DerivedViewportData derivedViewportData + setValueOpt DerivedViewportIndices derivedViewportIndices + setValueOpt DerivedViewportRowIds derivedViewportRowIds + setValueOpt DerivedViewportSelectedColumns derivedViewportSelectedColumns + setValueOpt DerivedViewportSelectedRows derivedViewportSelectedRows + setValueOpt DerivedViewportSelectedRowIds derivedViewportSelectedRowIds + setValueOpt DerivedVirtualData derivedVirtualData + setValueOpt DerivedVirtualIndices derivedVirtualIndices + setValueOpt DerivedVirtualRowIds derivedVirtualRowIds + setValueOpt DerivedVirtualSelectedRows derivedVirtualSelectedRows + setValueOpt DerivedVirtualSelectedRowIds derivedVirtualSelectedRowIds + setValueOpt LoadingState loadingState + setValueOpt Persistence persistence + setValueOpt PersistedProps persistedProps + setValueOpt PersistenceType persistenceType DynObj.setValue dataTable "namespace" "dash_table" DynObj.setValue dataTable "props" props DynObj.setValue dataTable "type" "DataTable"