diff --git a/public/docs/docsGenOutput/docsGenOutput.d.ts b/public/docs/docsGenOutput/docsGenOutput.d.ts index 2e8c3a4784..fe288924c5 100644 --- a/public/docs/docsGenOutput/docsGenOutput.d.ts +++ b/public/docs/docsGenOutput/docsGenOutput.d.ts @@ -177,10 +177,10 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:PickerEmptyBodyProps' | '@epam/uui-core:PickerFilterConfig' | '@epam/uui-core:PickerFooterProps' | +'@epam/uui-core:PickerInputBaseProps' | '@epam/uui-core:PickerInputEditMode' | '@epam/uui-core:PickerInputElement' | '@epam/uui-core:PickerInputSearchPosition' | -'@epam/uui-core:PickerShowSelectedOnly' | '@epam/uui-core:Position' | '@epam/uui-core:PositionType' | '@epam/uui-core:ProcessRequestMethod' | @@ -267,7 +267,6 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-components:PickerBindingProps' | '@epam/uui-components:PickerBindingValueType' | '@epam/uui-components:PickerBodyBaseProps' | -'@epam/uui-components:PickerInputBaseProps' | '@epam/uui-components:PickerListBaseProps' | '@epam/uui-components:PickerModalArrayProps' | '@epam/uui-components:PickerModalOptions' | diff --git a/public/docs/docsGenOutput/docsGenOutput.json b/public/docs/docsGenOutput/docsGenOutput.json index 3a51170f6d..f8d6f64833 100644 --- a/public/docs/docsGenOutput/docsGenOutput.json +++ b/public/docs/docsGenOutput/docsGenOutput.json @@ -1,5 +1,5 @@ { - "version": "5.11.1-rc.0", + "version": "5.12.1", "docsGenTypes": { "@epam/uui-core:AcceptDropParams": { "summary": { @@ -11139,7 +11139,7 @@ " renderTarget: (props: IDropdownTogglerProps) => React.ReactNode;", " /** Render callback for the dropdown body */", " renderBody: (props: DropdownBodyProps) => React.ReactNode;", - " /** Called when dropdown was closed */", + " /** Call to close the dropdown body */", " onClose?: () => void;", " /** Disable dropdown opening */", " isNotUnfoldable?: boolean;", @@ -11240,7 +11240,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { @@ -16350,7 +16350,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & { type: 'singlePicker' | 'multiPicker'; showSearch?: boolean | undefined; maxBodyHeight?: number | undefined; highlightSearchMatches?: boolean | undefined; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & Pick & { type: 'datePicker'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & { type: 'numeric'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & Pick & { type: 'rangeDatePicker'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & { type: 'custom'; render: (props: IFilterItemBodyProps) => React.ReactElement>; getTogglerValue: (props: IFilterItemBodyProps) => React.ReactNode; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; }", + "raw": "FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow' | 'renderFooter' | 'minCharsToSearch'> & { type: 'singlePicker' | 'multiPicker'; showSearch?: boolean | undefined; maxBodyHeight?: number | undefined; highlightSearchMatches?: boolean | undefined; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & Pick & { type: 'datePicker'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & { type: 'numeric'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & Pick & { type: 'rangeDatePicker'; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; } | FilterConfigBase & { type: 'custom'; render: (props: IFilterItemBodyProps) => React.ReactElement>; getTogglerValue: (props: IFilterItemBodyProps) => React.ReactNode; } & IEditable & IDropdownBodyProps & { selectedPredicate?: string | undefined; }", "print": [ "type IFilterItemBodyProps = TableFiltersConfig & IEditable & IDropdownBodyProps & {", " /** Name of currently selected predicate */", @@ -16522,6 +16522,43 @@ "from": "@epam/uui-core:PickerBaseOptions", "required": false }, + { + "uid": "renderFooter", + "name": "renderFooter", + "comment": { + "raw": [ + "Adds custom footer to the dropdown body" + ] + }, + "typeValue": { + "raw": "(props: PickerInputFooterProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:PickerInputBaseProps", + "required": false + }, + { + "uid": "minCharsToSearch", + "name": "minCharsToSearch", + "comment": { + "raw": [ + "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " By default search triggers after input value is changed.", + "", + " Note: defined minCharsToSearch isn't compatible with searchPosition=body." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:PickerInputBaseProps", + "required": false + }, { "uid": "type", "name": "type", @@ -25017,9 +25054,9 @@ "details": { "kind": 265, "typeValue": { - "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly", + "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange", "print": [ - "type PickerBaseProps = PickerBaseOptions & PickerBindingProps & IAnalyticableOnChange & PickerShowSelectedOnly;" + "type PickerBaseProps = PickerBaseOptions & PickerBindingProps & IAnalyticableOnChange;" ] }, "props": [ @@ -25460,11 +25497,247 @@ "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "valueType_2", + "name": "valueType", + "comment": { + "raw": [ + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + ] + }, + "typeValue": { + "raw": "'entity'" + }, + "editor": { + "type": "oneOf", + "options": [ + "entity" + ] + }, + "from": "@epam/uui-core:SinglePickerProps", + "required": true + }, + { + "uid": "value_2", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] + }, + "typeValue": { + "raw": "TItem" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange_2", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TItem) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "selectionMode_3", + "name": "selectionMode", + "comment": { + "raw": [ + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + ] + }, + "typeValue": { + "raw": "'multi'" + }, + "editor": { + "type": "oneOf", + "options": [ + "multi" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", + "required": true + }, + { + "uid": "valueType_3", + "name": "valueType", + "comment": { + "raw": [ + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + ] + }, + "typeValue": { + "raw": "'id'" + }, + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", + "required": false + }, + { + "uid": "value_3", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] + }, + "typeValue": { + "raw": "TId[]" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange_3", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TId[]) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "valueType_4", + "name": "valueType", + "comment": { + "raw": [ + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + ] + }, + "typeValue": { + "raw": "'entity'" + }, + "editor": { + "type": "oneOf", + "options": [ + "entity" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", + "required": true + }, + { + "uid": "value_4", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] + }, + "typeValue": { + "raw": "TItem[]" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange_4", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TItem[]) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + } + ], + "propsFromUnion": true + } + }, + "@epam/uui-core:PickerBindingProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerBindingProps", + "nameFull": "PickerBindingProps" + }, + "src": "uui-core/src/types/pickers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "{ selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable | { selectionMode: 'single'; valueType: 'entity'; } & IEditable | { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "print": [ + "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" + ] + }, + "props": [ + { + "uid": "selectionMode", + "name": "selectionMode", "comment": { "raw": [ - "Enables/disables selected rows only in Picker." + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + ] + }, + "typeValue": { + "raw": "'single'" + }, + "editor": { + "type": "oneOf", + "options": [ + "single" + ] + }, + "from": "@epam/uui-core:SinglePickerProps", + "required": true + }, + { + "uid": "valueType", + "name": "valueType", + "comment": { + "raw": [ + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + ] + }, + "typeValue": { + "raw": "'id'" + }, + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "from": "@epam/uui-core:SinglePickerProps", + "required": false + }, + { + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" ] }, "typeValue": { @@ -25473,343 +25746,90 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:PickerShowSelectedOnly", + "from": "@epam/uui-core:ICanBeInvalid", "required": false - }, - { - "uid": "valueType_2", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" - ] - }, - "from": "@epam/uui-core:SinglePickerProps", - "required": true - }, - { - "uid": "value_2", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TItem" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_2", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TItem) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "selectionMode_3", - "name": "selectionMode", - "comment": { - "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" - ] - }, - "typeValue": { - "raw": "'multi'" - }, - "editor": { - "type": "oneOf", - "options": [ - "multi" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true - }, - { - "uid": "valueType_3", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'id'" - }, - "editor": { - "type": "oneOf", - "options": [ - "id" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": false - }, - { - "uid": "value_3", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TId[]" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_3", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TId[]) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "valueType_4", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true - }, - { - "uid": "value_4", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TItem[]" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_4", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TItem[]) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - } - ], - "propsFromUnion": true - } - }, - "@epam/uui-core:PickerBindingProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerBindingProps", - "nameFull": "PickerBindingProps" - }, - "src": "uui-core/src/types/pickers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "{ selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable | { selectionMode: 'single'; valueType: 'entity'; } & IEditable | { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", - "print": [ - "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" - ] - }, - "props": [ - { - "uid": "selectionMode", - "name": "selectionMode", - "comment": { - "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" - ] - }, - "typeValue": { - "raw": "'single'" - }, - "editor": { - "type": "oneOf", - "options": [ - "single" - ] - }, - "from": "@epam/uui-core:SinglePickerProps", - "required": true - }, - { - "uid": "valueType", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'id'" - }, - "editor": { - "type": "oneOf", - "options": [ - "id" - ] - }, - "from": "@epam/uui-core:SinglePickerProps", - "required": false - }, - { - "uid": "isInvalid", - "name": "isInvalid", - "comment": { - "raw": [ - "True if component contains invalid input" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false - }, - { - "uid": "isDisabled", - "name": "isDisabled", - "comment": { - "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IDisableable", - "required": false - }, - { - "uid": "isReadonly", - "name": "isReadonly", - "comment": { - "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false - }, - { - "uid": "isRequired", - "name": "isRequired", - "comment": { - "raw": [ - "Marks that component's value is required and shouldn't be empty" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false - }, - { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TId" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TId) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true + }, + { + "uid": "isDisabled", + "name": "isDisabled", + "comment": { + "raw": [ + "Disable editing, and visually de-emphasize value of the component" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDisableable", + "required": false + }, + { + "uid": "isReadonly", + "name": "isReadonly", + "comment": { + "raw": [ + "Disable editing. Unlike isDisabled, keep component's value readable." + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeReadonly", + "required": false + }, + { + "uid": "isRequired", + "name": "isRequired", + "comment": { + "raw": [ + "Marks that component's value is required and shouldn't be empty" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", + "required": false + }, + { + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] + }, + "typeValue": { + "raw": "TId" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TId) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { "uid": "valueType_2", @@ -26105,7 +26125,7 @@ "typeValue": { "raw": "PickerFilterConfig", "print": [ - "type PickerFilterConfig = FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & {", + "type PickerFilterConfig = FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow' | 'renderFooter' | 'minCharsToSearch'> & {", " /** Type of the filter */", " type: 'singlePicker' | 'multiPicker';", " /**", @@ -26286,6 +26306,43 @@ "from": "@epam/uui-core:PickerBaseOptions", "required": false }, + { + "uid": "renderFooter", + "name": "renderFooter", + "comment": { + "raw": [ + "Adds custom footer to the dropdown body" + ] + }, + "typeValue": { + "raw": "(props: PickerInputFooterProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:PickerInputBaseProps", + "required": false + }, + { + "uid": "minCharsToSearch", + "name": "minCharsToSearch", + "comment": { + "raw": [ + "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " By default search triggers after input value is changed.", + "", + " Note: defined minCharsToSearch isn't compatible with searchPosition=body." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:PickerInputBaseProps", + "required": false + }, { "uid": "type", "name": "type", @@ -26525,88 +26582,109 @@ "propsFromUnion": false } }, - "@epam/uui-core:PickerInputEditMode": { + "@epam/uui-core:PickerInputBaseProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "PickerInputEditMode", - "nameFull": "PickerInputEditMode" + "name": "PickerInputBaseProps", + "nameFull": "PickerInputBaseProps" }, "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "Options for displaying content in PickerInput." - ] - }, "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "'dropdown' | 'modal'", - "print": [ - "/**", - " * Options for displaying content in PickerInput.", - " */", - "type PickerInputEditMode = 'dropdown' | 'modal';" - ] - } - } - }, - "@epam/uui-core:PickerInputElement": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerInputElement", - "nameFull": "PickerInputElement" - }, - "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "PickerInput element API. Is used to describe ref to the PickerInput component." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "PickerInputElement", + "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; }", "print": [ - "/**", - " * PickerInput element API. Is used to describe ref to the PickerInput component.", - " */", - "interface PickerInputElement extends HTMLElement {", + "type PickerInputBaseProps = PickerBaseProps & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & {", + " /** dropdown (default) - show selection in dropdown; modal - opens modal window to select items */", + " editMode?: PickerInputEditMode;", + " /** Maximum number of tags to display in input, before collapsing to \"N items selected\" mode */", + " maxItems?: number;", + " /** Minimum width of dropdown body */", + " minBodyWidth?: number;", + " /** Prevents selected items tags to occupy multiple lines */", + " isSingleLine?: boolean;", + " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", + " dropdownPlacement?: Placement;", " /**", - " * Closes PickerInput body.", + " * Defines where search field is:", + " * 'input' - try to place search inside the toggler (default for single-select),", + " * 'body' - put search inside the dropdown (default for multi-select)", + " * 'none' - disables search completely", + " *", + " * Note: 'searchPosition' cannot be 'input' if 'editMode' is 'modal'", " */", - " closePickerBody?: () => void;", - "}" + " searchPosition?: PickerInputSearchPosition;", + " /** Disallow to clear Picker value (cross icon) */", + " disableClear?: boolean;", + " /**", + " * Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " * By default search triggers after input value is changed.", + " *", + " * Note: defined minCharsToSearch isn't compatible with searchPosition=body.", + " */", + " minCharsToSearch?: number;", + " /** Overrides default height of the dropdown body */", + " dropdownHeight?: number;", + " /** Sets focus to component when it's mounted */", + " autoFocus?: boolean;", + " /** HTML attributes to put directly to the PickerInput parts */", + " rawProps?: {", + " /** HTML attributes to put directly to the input element */", + " input?: IHasRawProps>['rawProps'];", + " /** HTML attributes to put directly to the body root element */", + " body?: IHasRawProps>['rawProps'];", + " };", + " /** Adds custom footer to the dropdown body */", + " renderFooter?: (props: PickerInputFooterProps) => React.ReactNode;", + " /** Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter. */", + " fixedBodyPosition?: boolean;", + " /**", + " * Node of portal target, where to render the dropdown body.", + " * By default, will be used global portal node.", + " */", + " portalTarget?: HTMLElement;", + " /** CSS class(es) to put on input-part component. See https://github.com/JedWatson/classnames#usage for details */", + " inputCx?: CX;", + " /** CSS class(es) to put on body-part component. See https://github.com/JedWatson/classnames#usage for details */", + " bodyCx?: CX;", + " /**", + " * Enables highlighting of the items' text with search-matching results.", + " * */", + " highlightSearchMatches?: boolean;", + " /** Search input debounce delay in ms. Default value is 500ms */", + " searchDebounceDelay?: number;", + " /** HTML ID attribute for the input in toggler */", + " id?: string;", + "};" ] }, "props": [ { - "uid": "closePickerBody", - "name": "closePickerBody", + "uid": "entityName", + "name": "entityName", "comment": { "raw": [ - "Closes PickerInput body." + "Name of the entity being selected. Affects wording like \"Please select [entity]\"" ] }, "typeValue": { - "raw": "() => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "accessKey", - "name": "accessKey", + "uid": "entityPluralName", + "name": "entityPluralName", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/accessKey)" + "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" ] }, "typeValue": { @@ -26615,517 +26693,540 @@ "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "accessKeyLabel", - "name": "accessKeyLabel", + "uid": "dataSource", + "name": "dataSource", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/accessKeyLabel)" + "Datasource to get data for the picker" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "IDataSource" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:PickerBaseOptions", "required": true }, { - "uid": "autocapitalize", - "name": "autocapitalize", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true - }, - { - "uid": "dir", - "name": "dir", + "uid": "getName", + "name": "getName", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dir)" + "A pure function that gets entity name from entity object.", + " Default: (item) => item.name." ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem) => string" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "draggable", - "name": "draggable", + "uid": "renderRow", + "name": "renderRow", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/draggable)" + "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "hidden", - "name": "hidden", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/hidden)" + "Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks." ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem, index: number) => DataRowOptions" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "inert", - "name": "inert", + "uid": "renderNotFound", + "name": "renderNotFound", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/inert)" - ] + "@deprecated in favor of `renderEmpty` method.", + " Overrides the default 'no records found' banner.", + " The 'search' callback parameter allows to distinguish cases when there's no records at all, and when current search doesn't find anything." + ], + "tags": { + "@deprecated": "in favor of" + } }, "typeValue": { - "raw": "boolean" + "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "innerText", - "name": "innerText", + "uid": "renderEmpty", + "name": "renderEmpty", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/innerText)" + "Overrides the rendering of PickerBody content when it is empty.", + " It's used for different empty reasons, like: no record find, no record at all, there is not enough search length to start loading(minCharsToSearch prop provided).", + " Consider this all cases where a custom callback is provided.", + " If not provided, default implementation is used." ] }, "typeValue": { - "raw": "string" + "raw": "(props: PickerEmptyBodyProps) => React.ReactNode" }, "editor": { - "type": "string" + "type": "component" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "lang", - "name": "lang", + "uid": "emptyValue", + "name": "emptyValue", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/lang)" + "Defines which value is to set on clear. E.g. you can put an empty array instead of null for empty multi-select Pickers" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | []" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "offsetHeight", - "name": "offsetHeight", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetHeight)" + "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" ] }, "typeValue": { - "raw": "number" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "offsetLeft", - "name": "offsetLeft", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetLeft)" + "Additional filter to apply to the DataSource. Can be used to limit selection somehow, w/o re-building the DataSource. E.g. in the linked pickers scenario." ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "any" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "offsetParent", - "name": "offsetParent", + "uid": "sorting", + "name": "sorting", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetParent)" + "Defines sorting to pass to the DataSource" ] }, "typeValue": { - "raw": "null | Element" + "raw": "SortingOption" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "offsetTop", - "name": "offsetTop", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetTop)" + "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", + " - false: All nodes are selected independently (default).", + " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", + " - 'implicit': Selecting a parent node means that all children are considered checked.", + " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", + " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", + " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", + " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." ] }, "typeValue": { - "raw": "number" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "offsetWidth", - "name": "offsetWidth", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetWidth)" + "You can return true for all, or some items to fold them." ] }, "typeValue": { - "raw": "number" + "raw": "(item: TItem) => boolean" }, "editor": { - "type": "number" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "outerText", - "name": "outerText", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/outerText)" + "Given an item, should return an array of string fields to search on. By default, the search is performed on item.name field." ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem) => string[]" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "popover", - "name": "popover", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/popover)" + "Component ref" ] }, "typeValue": { - "raw": "null | string" - }, - "editor": { - "type": "string" + "raw": "null | (instance: PickerInputElement | null) => void | React.RefObject" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "spellcheck", - "name": "spellcheck", + "uid": "selectionMode", + "name": "selectionMode", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/spellcheck)" + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "boolean" + "raw": "'single'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "single" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:SinglePickerProps", "required": true }, { - "uid": "title", - "name": "title", + "uid": "valueType", + "name": "valueType", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/title)" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "string" + "raw": "'id'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "id" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:SinglePickerProps", + "required": false }, { - "uid": "translate", - "name": "translate", + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:ICanBeInvalid", + "required": false }, { - "uid": "attachInternals", - "name": "attachInternals", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/attachInternals)" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "() => ElementInternals" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:IDisableable", + "required": false }, { - "uid": "click", - "name": "click", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/click)" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:ICanBeReadonly", + "required": false }, { - "uid": "hidePopover", - "name": "hidePopover", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/hidePopover)" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:ICanBeRequired", + "required": false }, { - "uid": "showPopover", - "name": "showPopover", + "uid": "value", + "name": "value", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/showPopover)" + "The current value of component" ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "TId" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "togglePopover", - "name": "togglePopover", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/togglePopover)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(force?: boolean | undefined) => void" + "raw": "(newValue: TId) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "addEventListener", - "name": "addEventListener", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", + "comment": { + "raw": [ + "Given a value, returns an analytics event to send when component is edited.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + ] + }, "typeValue": { - "raw": "{ (type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void; (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void; }" + "raw": "(newValue: any, oldValue: any) => AnalyticsEvent" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:IAnalyticableOnChange", + "required": false }, { - "uid": "removeEventListener", - "name": "removeEventListener", + "uid": "onFocus", + "name": "onFocus", + "comment": { + "raw": [ + "Called when component gets input focus" + ] + }, "typeValue": { - "raw": "{ (type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined): void; (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void; }" + "raw": "(e: React.FocusEvent) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", - "required": true + "from": "@epam/uui-core:ICanFocus", + "required": false }, { - "uid": "attributes", - "name": "attributes", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/attributes)" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "NamedNodeMap" + "raw": "(e: React.FocusEvent) => void" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ICanFocus", + "required": false }, { - "uid": "classList", - "name": "classList", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "Allows for manipulation of element's class content attribute as a set of whitespace-separated tokens through a DOMTokenList object.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/classList)" + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "DOMTokenList" + "raw": "any" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "@epam/uui-core:IHasPlaceholder", + "required": false }, { - "uid": "className", - "name": "className", + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "Returns the value of element's class content attribute. Can be set to change it.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/className)" + "Icon can be a React element (usually an SVG element)" ] }, "typeValue": { - "raw": "string" + "raw": "Icon" }, "editor": { - "type": "string" + "type": "component" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "@epam/uui-core:IHasIcon", + "required": false }, { - "uid": "clientHeight", - "name": "clientHeight", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientHeight)" + "Position of the icon (left of right)" ] }, "typeValue": { - "raw": "number" + "raw": "'right' | 'left'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "right", + "left" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "@epam/uui-core:IHasIcon", + "required": false }, { - "uid": "clientLeft", - "name": "clientLeft", + "uid": "onIconClick", + "name": "onIconClick", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientLeft)" + "Click handler for the icon" ] }, "typeValue": { - "raw": "number" + "raw": "() => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "@epam/uui-core:IHasIcon", + "required": false }, { - "uid": "clientTop", - "name": "clientTop", + "uid": "editMode", + "name": "editMode", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientTop)" + "dropdown (default) - show selection in dropdown; modal - opens modal window to select items" ] }, "typeValue": { - "raw": "number" + "raw": "'dropdown' | 'modal'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "dropdown", + "modal" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "clientWidth", - "name": "clientWidth", + "uid": "maxItems", + "name": "maxItems", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientWidth)" + "Maximum number of tags to display in input, before collapsing to \"N items selected\" mode" ] }, "typeValue": { @@ -27134,988 +27235,1011 @@ "editor": { "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "id", - "name": "id", + "uid": "minBodyWidth", + "name": "minBodyWidth", "comment": { "raw": [ - "Returns the value of element's id content attribute. Can be set to change it.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/id)" + "Minimum width of dropdown body" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "localName", - "name": "localName", + "uid": "isSingleLine", + "name": "isSingleLine", "comment": { "raw": [ - "Returns the local name.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/localName)" + "Prevents selected items tags to occupy multiple lines" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "namespaceURI", - "name": "namespaceURI", + "uid": "dropdownPlacement", + "name": "dropdownPlacement", "comment": { "raw": [ - "Returns the namespace.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/namespaceURI)" + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "null | string" + "raw": "'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'right' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "right", + "left", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "onfullscreenchange", - "name": "onfullscreenchange", + "uid": "searchPosition", + "name": "searchPosition", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/fullscreenchange_event)" + "Defines where search field is:", + " 'input' - try to place search inside the toggler (default for single-select),", + " 'body' - put search inside the dropdown (default for multi-select)", + " 'none' - disables search completely", + "", + " Note: 'searchPosition' cannot be 'input' if 'editMode' is 'modal'" ] }, "typeValue": { - "raw": "null | (this: Element, ev: Event) => any" + "raw": "'input' | 'body' | 'none'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "input", + "body", + "none" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "onfullscreenerror", - "name": "onfullscreenerror", + "uid": "disableClear", + "name": "disableClear", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/fullscreenerror_event)" + "Disallow to clear Picker value (cross icon)" ] }, "typeValue": { - "raw": "null | (this: Element, ev: Event) => any" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "outerHTML", - "name": "outerHTML", + "uid": "minCharsToSearch", + "name": "minCharsToSearch", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/outerHTML)" + "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " By default search triggers after input value is changed.", + "", + " Note: defined minCharsToSearch isn't compatible with searchPosition=body." ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" - }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true - }, - { - "uid": "ownerDocument", - "name": "ownerDocument", - "typeValue": { - "raw": "Document" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "part", - "name": "part", + "uid": "dropdownHeight", + "name": "dropdownHeight", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/part)" + "Overrides default height of the dropdown body" ] }, "typeValue": { - "raw": "DOMTokenList" + "raw": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "editor": { + "type": "number" + }, + "required": false }, { - "uid": "prefix", - "name": "prefix", + "uid": "autoFocus", + "name": "autoFocus", "comment": { "raw": [ - "Returns the namespace prefix.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/prefix)" + "Sets focus to component when it's mounted" ] }, "typeValue": { - "raw": "null | string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "scrollHeight", - "name": "scrollHeight", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollHeight)" + "HTML attributes to put directly to the PickerInput parts" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "scrollLeft", - "name": "scrollLeft", + "uid": "renderFooter", + "name": "renderFooter", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollLeft)" + "Adds custom footer to the dropdown body" ] }, "typeValue": { - "raw": "number" + "raw": "(props: PickerInputFooterProps) => React.ReactNode" }, "editor": { - "type": "number" + "type": "component" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "scrollTop", - "name": "scrollTop", + "uid": "fixedBodyPosition", + "name": "fixedBodyPosition", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollTop)" + "Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter." ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "scrollWidth", - "name": "scrollWidth", + "uid": "portalTarget", + "name": "portalTarget", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollWidth)" + "Node of portal target, where to render the dropdown body.", + " By default, will be used global portal node." ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "HTMLElement" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "shadowRoot", - "name": "shadowRoot", + "uid": "inputCx", + "name": "inputCx", "comment": { "raw": [ - "Returns element's shadow root, if any, and if shadow root's mode is \"open\", and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/shadowRoot)" + "CSS class(es) to put on input-part component. See https://github.com/JedWatson/classnames#usage for details" ] }, "typeValue": { - "raw": "null | ShadowRoot" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "typeValueRef": "@epam/uui-core:ClassValue", "required": false }, { - "uid": "slot", - "name": "slot", + "uid": "bodyCx", + "name": "bodyCx", "comment": { "raw": [ - "Returns the value of element's slot content attribute. Can be set to change it.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/slot)" + "CSS class(es) to put on body-part component. See https://github.com/JedWatson/classnames#usage for details" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "typeValueRef": "@epam/uui-core:ClassValue", + "required": false }, { - "uid": "tagName", - "name": "tagName", + "uid": "highlightSearchMatches", + "name": "highlightSearchMatches", "comment": { "raw": [ - "Returns the HTML-uppercased qualified name.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/tagName)" + "Enables highlighting of the items' text with search-matching results." ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "attachShadow", - "name": "attachShadow", + "uid": "searchDebounceDelay", + "name": "searchDebounceDelay", "comment": { "raw": [ - "Creates a shadow root for element and returns it.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/attachShadow)" + "Search input debounce delay in ms. Default value is 500ms" ] }, "typeValue": { - "raw": "(init: ShadowRootInit) => ShadowRoot" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "checkVisibility", - "name": "checkVisibility", + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "HTML ID attribute for the input in toggler" + ] + }, "typeValue": { - "raw": "(options?: CheckVisibilityOptions | undefined) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "closest", - "name": "closest", + "uid": "valueType_2", + "name": "valueType", "comment": { "raw": [ - "Returns the first (starting at element) inclusive ancestor that matches selectors, and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/closest)" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "{ (selector: K): HTMLElementTagNameMap[K] | null; (selector: K): SVGElementTagNameMap[K] | null; (selector: K): MathMLElementTagNameMap[K] | null; (selectors: string): E | null; }" + "raw": "'entity'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "entity" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:SinglePickerProps", "required": true }, { - "uid": "computedStyleMap", - "name": "computedStyleMap", + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/computedStyleMap)" + "The current value of component" ] }, "typeValue": { - "raw": "() => StylePropertyMapReadOnly" - }, - "editor": { - "type": "func" + "raw": "TItem" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getAttribute", - "name": "getAttribute", + "uid": "onValueChange_2", + "name": "onValueChange", "comment": { "raw": [ - "Returns element's first attribute whose qualified name is qualifiedName, and null if there is no such attribute otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttribute)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(qualifiedName: string) => string | null" + "raw": "(newValue: TItem) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getAttributeNS", - "name": "getAttributeNS", + "uid": "selectionMode_3", + "name": "selectionMode", "comment": { "raw": [ - "Returns element's attribute whose namespace is namespace and local name is localName, and null if there is no such attribute otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNS)" + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "(namespace: string | null, localName: string) => string | null" + "raw": "'multi'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "multi" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:ArrayPickerProps", "required": true }, { - "uid": "getAttributeNames", - "name": "getAttributeNames", + "uid": "valueType_3", + "name": "valueType", "comment": { "raw": [ - "Returns the qualified names of all element's attributes. Can contain duplicates.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNames)" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "() => string[]" + "raw": "'id'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "id" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "@epam/uui-core:ArrayPickerProps", + "required": false }, { - "uid": "getAttributeNode", - "name": "getAttributeNode", + "uid": "value_3", + "name": "value", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNode)" + "The current value of component" ] }, "typeValue": { - "raw": "(qualifiedName: string) => Attr | null" - }, - "editor": { - "type": "func" + "raw": "TId[]" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getAttributeNodeNS", - "name": "getAttributeNodeNS", + "uid": "onValueChange_3", + "name": "onValueChange", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNodeNS)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(namespace: string | null, localName: string) => Attr | null" + "raw": "(newValue: TId[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getBoundingClientRect", - "name": "getBoundingClientRect", + "uid": "valueType_4", + "name": "valueType", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getBoundingClientRect)" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "() => DOMRect" + "raw": "'entity'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "entity" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:ArrayPickerProps", "required": true }, { - "uid": "getClientRects", - "name": "getClientRects", + "uid": "value_4", + "name": "value", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getClientRects)" + "The current value of component" ] }, "typeValue": { - "raw": "() => DOMRectList" - }, - "editor": { - "type": "func" + "raw": "TItem[]" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getElementsByClassName", - "name": "getElementsByClassName", + "uid": "onValueChange_4", + "name": "onValueChange", "comment": { "raw": [ - "Returns a HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classNames. The classNames argument is interpreted as a space-separated list of classes.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByClassName)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(classNames: string) => HTMLCollectionOf" + "raw": "(newValue: TItem[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "@epam/uui-core:IControlled", "required": true - }, + } + ], + "propsFromUnion": true + } + }, + "@epam/uui-core:PickerInputEditMode": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerInputEditMode", + "nameFull": "PickerInputEditMode" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "Options for displaying content in PickerInput." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'dropdown' | 'modal'", + "print": [ + "/**", + " * Options for displaying content in PickerInput.", + " */", + "type PickerInputEditMode = 'dropdown' | 'modal';" + ] + } + } + }, + "@epam/uui-core:PickerInputElement": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerInputElement", + "nameFull": "PickerInputElement" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "PickerInput element API. Is used to describe ref to the PickerInput component." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "PickerInputElement", + "print": [ + "/**", + " * PickerInput element API. Is used to describe ref to the PickerInput component.", + " */", + "interface PickerInputElement extends HTMLElement {", + " /**", + " * Closes PickerInput body.", + " */", + " closePickerBody?: () => void;", + "}" + ] + }, + "props": [ { - "uid": "getElementsByTagName", - "name": "getElementsByTagName", + "uid": "closePickerBody", + "name": "closePickerBody", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByTagName)" + "Closes PickerInput body." ] }, "typeValue": { - "raw": "{ (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: string): HTMLCollectionOf; }" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "required": false }, { - "uid": "getElementsByTagNameNS", - "name": "getElementsByTagNameNS", + "uid": "accessKey", + "name": "accessKey", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByTagNameNS)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/accessKey)" ] }, "typeValue": { - "raw": "{ (namespaceURI: 'http://www.w3.org/1999/xhtml', localName: string): HTMLCollectionOf; (namespaceURI: 'http://www.w3.org/2000/svg', localName: string): HTMLCollectionOf; (namespaceURI: 'http://www.w3.org/1998/Math/MathML', localName: string): HTMLCollectionOf; (namespace: string | null, localName: string): HTMLCollectionOf; }" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "hasAttribute", - "name": "hasAttribute", + "uid": "accessKeyLabel", + "name": "accessKeyLabel", "comment": { "raw": [ - "Returns true if element has an attribute whose qualified name is qualifiedName, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttribute)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/accessKeyLabel)" ] }, "typeValue": { - "raw": "(qualifiedName: string) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "hasAttributeNS", - "name": "hasAttributeNS", - "comment": { - "raw": [ - "Returns true if element has an attribute whose namespace is namespace and local name is localName.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttributeNS)" - ] - }, + "uid": "autocapitalize", + "name": "autocapitalize", "typeValue": { - "raw": "(namespace: string | null, localName: string) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "hasAttributes", - "name": "hasAttributes", + "uid": "dir", + "name": "dir", "comment": { "raw": [ - "Returns true if element has attributes, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttributes)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dir)" ] }, "typeValue": { - "raw": "() => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "hasPointerCapture", - "name": "hasPointerCapture", + "uid": "draggable", + "name": "draggable", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasPointerCapture)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/draggable)" ] }, "typeValue": { - "raw": "(pointerId: number) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "insertAdjacentElement", - "name": "insertAdjacentElement", + "uid": "hidden", + "name": "hidden", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentElement)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/hidden)" ] }, "typeValue": { - "raw": "(where: InsertPosition, element: Element) => Element | null" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "insertAdjacentHTML", - "name": "insertAdjacentHTML", + "uid": "inert", + "name": "inert", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentHTML)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/inert)" ] }, "typeValue": { - "raw": "(position: InsertPosition, text: string) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "insertAdjacentText", - "name": "insertAdjacentText", + "uid": "innerText", + "name": "innerText", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentText)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/innerText)" ] }, "typeValue": { - "raw": "(where: InsertPosition, data: string) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "matches", - "name": "matches", + "uid": "lang", + "name": "lang", "comment": { "raw": [ - "Returns true if matching selectors against element's root yields element, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/matches)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/lang)" ] }, "typeValue": { - "raw": "(selectors: string) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "releasePointerCapture", - "name": "releasePointerCapture", + "uid": "offsetHeight", + "name": "offsetHeight", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/releasePointerCapture)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetHeight)" ] }, "typeValue": { - "raw": "(pointerId: number) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "removeAttribute", - "name": "removeAttribute", + "uid": "offsetLeft", + "name": "offsetLeft", "comment": { "raw": [ - "Removes element's first attribute whose qualified name is qualifiedName.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttribute)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetLeft)" ] }, "typeValue": { - "raw": "(qualifiedName: string) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "removeAttributeNS", - "name": "removeAttributeNS", + "uid": "offsetParent", + "name": "offsetParent", "comment": { "raw": [ - "Removes element's attribute whose namespace is namespace and local name is localName.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttributeNS)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetParent)" ] }, "typeValue": { - "raw": "(namespace: string | null, localName: string) => void" - }, - "editor": { - "type": "func" + "raw": "null | Element" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "required": false }, { - "uid": "removeAttributeNode", - "name": "removeAttributeNode", + "uid": "offsetTop", + "name": "offsetTop", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttributeNode)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetTop)" ] }, "typeValue": { - "raw": "(attr: Attr) => Attr" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "requestFullscreen", - "name": "requestFullscreen", + "uid": "offsetWidth", + "name": "offsetWidth", "comment": { "raw": [ - "Displays element fullscreen and resolves promise when done.", - "", - " When supplied, options's navigationUI member indicates whether showing navigation UI while in fullscreen is preferred or not. If set to \"show\", navigation simplicity is preferred over screen space, and if set to \"hide\", more screen space is preferred. User agents are always free to honor user preference over the application's. The default value \"auto\" indicates no application preference.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/requestFullscreen)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/offsetWidth)" ] }, "typeValue": { - "raw": "(options?: FullscreenOptions | undefined) => Promise" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "requestPointerLock", - "name": "requestPointerLock", + "uid": "outerText", + "name": "outerText", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/requestPointerLock)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/outerText)" ] }, "typeValue": { - "raw": "() => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "scroll", - "name": "scroll", + "uid": "popover", + "name": "popover", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scroll)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/popover)" ] }, "typeValue": { - "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "required": false }, { - "uid": "scrollBy", - "name": "scrollBy", + "uid": "spellcheck", + "name": "spellcheck", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollBy)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/spellcheck)" ] }, "typeValue": { - "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "scrollIntoView", - "name": "scrollIntoView", + "uid": "title", + "name": "title", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollIntoView)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/title)" ] }, "typeValue": { - "raw": "(arg?: boolean | ScrollIntoViewOptions | undefined) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "scrollTo", - "name": "scrollTo", + "uid": "translate", + "name": "translate", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "required": true + }, + { + "uid": "attachInternals", + "name": "attachInternals", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollTo)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/attachInternals)" ] }, "typeValue": { - "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" + "raw": "() => ElementInternals" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "setAttribute", - "name": "setAttribute", + "uid": "click", + "name": "click", "comment": { "raw": [ - "Sets the value of element's first attribute whose qualified name is qualifiedName to value.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttribute)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/click)" ] }, "typeValue": { - "raw": "(qualifiedName: string, value: string) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "setAttributeNS", - "name": "setAttributeNS", + "uid": "hidePopover", + "name": "hidePopover", "comment": { "raw": [ - "Sets the value of element's attribute whose namespace is namespace and local name is localName to value.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNS)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/hidePopover)" ] }, "typeValue": { - "raw": "(namespace: string | null, qualifiedName: string, value: string) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "setAttributeNode", - "name": "setAttributeNode", + "uid": "showPopover", + "name": "showPopover", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNode)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/showPopover)" ] }, "typeValue": { - "raw": "(attr: Attr) => Attr | null" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "setAttributeNodeNS", - "name": "setAttributeNodeNS", + "uid": "togglePopover", + "name": "togglePopover", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNodeNS)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/togglePopover)" ] }, "typeValue": { - "raw": "(attr: Attr) => Attr | null" + "raw": "(force?: boolean | undefined) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "setPointerCapture", - "name": "setPointerCapture", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setPointerCapture)" - ] + "uid": "addEventListener", + "name": "addEventListener", + "typeValue": { + "raw": "{ (type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void; (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void; }" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", + "required": true + }, + { + "uid": "removeEventListener", + "name": "removeEventListener", "typeValue": { - "raw": "(pointerId: number) => void" + "raw": "{ (type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined): void; (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void; }" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLElement", "required": true }, { - "uid": "toggleAttribute", - "name": "toggleAttribute", + "uid": "attributes", + "name": "attributes", "comment": { "raw": [ - "If force is not given, \"toggles\" qualifiedName, removing it if it is present and adding it if it is not present. If force is true, adds qualifiedName. If force is false, removes qualifiedName.", - "", - " Returns true if qualifiedName is now present, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/toggleAttribute)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/attributes)" ] }, "typeValue": { - "raw": "(qualifiedName: string, force?: boolean | undefined) => boolean" - }, - "editor": { - "type": "func" + "raw": "NamedNodeMap" }, "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "webkitMatchesSelector", - "name": "webkitMatchesSelector", + "uid": "classList", + "name": "classList", "comment": { "raw": [ - "@deprecated This is a legacy alias of `matches`.", + "Allows for manipulation of element's class content attribute as a set of whitespace-separated tokens through a DOMTokenList object.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/matches)" - ], - "tags": { - "@deprecated": "This is a legacy alias of" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/classList)" + ] }, "typeValue": { - "raw": "(selectors: string) => boolean" - }, - "editor": { - "type": "func" + "raw": "DOMTokenList" }, "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "baseURI", - "name": "baseURI", + "uid": "className", + "name": "className", "comment": { "raw": [ - "Returns node's node document's document base URL.", + "Returns the value of element's class content attribute. Can be set to change it.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/baseURI)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/className)" ] }, "typeValue": { @@ -28124,100 +28248,104 @@ "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "childNodes", - "name": "childNodes", + "uid": "clientHeight", + "name": "clientHeight", "comment": { "raw": [ - "Returns the children.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/childNodes)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientHeight)" ] }, "typeValue": { - "raw": "NodeListOf" + "raw": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "editor": { + "type": "number" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "firstChild", - "name": "firstChild", + "uid": "clientLeft", + "name": "clientLeft", "comment": { "raw": [ - "Returns the first child.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/firstChild)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientLeft)" ] }, "typeValue": { - "raw": "null | ChildNode" + "raw": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": false + "editor": { + "type": "number" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "isConnected", - "name": "isConnected", + "uid": "clientTop", + "name": "clientTop", "comment": { "raw": [ - "Returns true if node is connected and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isConnected)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientTop)" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "lastChild", - "name": "lastChild", + "uid": "clientWidth", + "name": "clientWidth", "comment": { "raw": [ - "Returns the last child.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lastChild)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/clientWidth)" ] }, "typeValue": { - "raw": "null | ChildNode" + "raw": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": false + "editor": { + "type": "number" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "nextSibling", - "name": "nextSibling", + "uid": "id", + "name": "id", "comment": { "raw": [ - "Returns the next sibling.", + "Returns the value of element's id content attribute. Can be set to change it.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nextSibling)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/id)" ] }, "typeValue": { - "raw": "null | ChildNode" + "raw": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": false + "editor": { + "type": "string" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "nodeName", - "name": "nodeName", + "uid": "localName", + "name": "localName", "comment": { "raw": [ - "Returns a string appropriate for the type of node.", + "Returns the local name.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeName)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/localName)" ] }, "typeValue": { @@ -28226,99 +28354,110 @@ "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "nodeType", - "name": "nodeType", + "uid": "namespaceURI", + "name": "namespaceURI", "comment": { "raw": [ - "Returns the type of node.", + "Returns the namespace.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeType)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/namespaceURI)" ] }, "typeValue": { - "raw": "number" + "raw": "null | string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": false }, { - "uid": "nodeValue", - "name": "nodeValue", + "uid": "onfullscreenchange", + "name": "onfullscreenchange", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeValue)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/fullscreenchange_event)" ] }, "typeValue": { - "raw": "null | string" + "raw": "null | (this: Element, ev: Event) => any" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "parentElement", - "name": "parentElement", + "uid": "onfullscreenerror", + "name": "onfullscreenerror", "comment": { "raw": [ - "Returns the parent element.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/parentElement)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/fullscreenerror_event)" ] }, "typeValue": { - "raw": "null | HTMLElement" + "raw": "null | (this: Element, ev: Event) => any" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "parentNode", - "name": "parentNode", + "uid": "outerHTML", + "name": "outerHTML", "comment": { "raw": [ - "Returns the parent.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/parentNode)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/outerHTML)" ] }, "typeValue": { - "raw": "null | ParentNode" + "raw": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": false + "editor": { + "type": "string" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "previousSibling", - "name": "previousSibling", + "uid": "ownerDocument", + "name": "ownerDocument", + "typeValue": { + "raw": "Document" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true + }, + { + "uid": "part", + "name": "part", "comment": { "raw": [ - "Returns the previous sibling.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/previousSibling)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/part)" ] }, "typeValue": { - "raw": "null | ChildNode" + "raw": "DOMTokenList" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "textContent", - "name": "textContent", + "uid": "prefix", + "name": "prefix", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/textContent)" + "Returns the namespace prefix.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/prefix)" ] }, "typeValue": { @@ -28327,2557 +28466,2536 @@ "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": false }, { - "uid": "appendChild", - "name": "appendChild", + "uid": "scrollHeight", + "name": "scrollHeight", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/appendChild)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollHeight)" ] }, "typeValue": { - "raw": "(node: T) => T" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "cloneNode", - "name": "cloneNode", + "uid": "scrollLeft", + "name": "scrollLeft", "comment": { "raw": [ - "Returns a copy of node. If deep is true, the copy also includes the node's descendants.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/cloneNode)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollLeft)" ] }, "typeValue": { - "raw": "(deep?: boolean | undefined) => Node" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "compareDocumentPosition", - "name": "compareDocumentPosition", + "uid": "scrollTop", + "name": "scrollTop", "comment": { "raw": [ - "Returns a bitmask indicating the position of other relative to node.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/compareDocumentPosition)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollTop)" ] }, "typeValue": { - "raw": "(other: Node) => number" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "contains", - "name": "contains", + "uid": "scrollWidth", + "name": "scrollWidth", "comment": { "raw": [ - "Returns true if other is an inclusive descendant of node, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/contains)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollWidth)" ] }, "typeValue": { - "raw": "(other: Node | null) => boolean" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "getRootNode", - "name": "getRootNode", + "uid": "shadowRoot", + "name": "shadowRoot", "comment": { "raw": [ - "Returns node's root.", + "Returns element's shadow root, if any, and if shadow root's mode is \"open\", and null otherwise.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/getRootNode)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/shadowRoot)" ] }, "typeValue": { - "raw": "(options?: GetRootNodeOptions | undefined) => Node" - }, - "editor": { - "type": "func" + "raw": "null | ShadowRoot" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": false }, { - "uid": "hasChildNodes", - "name": "hasChildNodes", + "uid": "slot", + "name": "slot", "comment": { "raw": [ - "Returns whether node has children.", + "Returns the value of element's slot content attribute. Can be set to change it.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/hasChildNodes)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/slot)" ] }, "typeValue": { - "raw": "() => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "insertBefore", - "name": "insertBefore", + "uid": "tagName", + "name": "tagName", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/insertBefore)" + "Returns the HTML-uppercased qualified name.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/tagName)" ] }, "typeValue": { - "raw": "(node: T, child: Node | null) => T" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "isDefaultNamespace", - "name": "isDefaultNamespace", + "uid": "attachShadow", + "name": "attachShadow", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isDefaultNamespace)" + "Creates a shadow root for element and returns it.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/attachShadow)" ] }, "typeValue": { - "raw": "(namespace: string | null) => boolean" + "raw": "(init: ShadowRootInit) => ShadowRoot" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "isEqualNode", - "name": "isEqualNode", + "uid": "checkVisibility", + "name": "checkVisibility", + "typeValue": { + "raw": "(options?: CheckVisibilityOptions | undefined) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true + }, + { + "uid": "closest", + "name": "closest", "comment": { "raw": [ - "Returns whether node and otherNode have the same properties.", + "Returns the first (starting at element) inclusive ancestor that matches selectors, and null otherwise.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isEqualNode)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/closest)" ] }, "typeValue": { - "raw": "(otherNode: Node | null) => boolean" + "raw": "{ (selector: K): HTMLElementTagNameMap[K] | null; (selector: K): SVGElementTagNameMap[K] | null; (selector: K): MathMLElementTagNameMap[K] | null; (selectors: string): E | null; }" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "isSameNode", - "name": "isSameNode", + "uid": "computedStyleMap", + "name": "computedStyleMap", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isSameNode)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/computedStyleMap)" ] }, "typeValue": { - "raw": "(otherNode: Node | null) => boolean" + "raw": "() => StylePropertyMapReadOnly" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "lookupNamespaceURI", - "name": "lookupNamespaceURI", + "uid": "getAttribute", + "name": "getAttribute", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lookupNamespaceURI)" + "Returns element's first attribute whose qualified name is qualifiedName, and null if there is no such attribute otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttribute)" ] }, "typeValue": { - "raw": "(prefix: string | null) => string | null" + "raw": "(qualifiedName: string) => string | null" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "lookupPrefix", - "name": "lookupPrefix", + "uid": "getAttributeNS", + "name": "getAttributeNS", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lookupPrefix)" + "Returns element's attribute whose namespace is namespace and local name is localName, and null if there is no such attribute otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNS)" ] }, "typeValue": { - "raw": "(namespace: string | null) => string | null" + "raw": "(namespace: string | null, localName: string) => string | null" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "normalize", - "name": "normalize", + "uid": "getAttributeNames", + "name": "getAttributeNames", "comment": { "raw": [ - "Removes empty exclusive Text nodes and concatenates the data of remaining contiguous exclusive Text nodes into the first of their nodes.", + "Returns the qualified names of all element's attributes. Can contain duplicates.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/normalize)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNames)" ] }, "typeValue": { - "raw": "() => void" + "raw": "() => string[]" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "removeChild", - "name": "removeChild", + "uid": "getAttributeNode", + "name": "getAttributeNode", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/removeChild)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNode)" ] }, "typeValue": { - "raw": "(child: T) => T" + "raw": "(qualifiedName: string) => Attr | null" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "replaceChild", - "name": "replaceChild", + "uid": "getAttributeNodeNS", + "name": "getAttributeNodeNS", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/replaceChild)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAttributeNodeNS)" ] }, "typeValue": { - "raw": "(node: Node, child: T) => T" + "raw": "(namespace: string | null, localName: string) => Attr | null" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "ELEMENT_NODE", - "name": "ELEMENT_NODE", + "uid": "getBoundingClientRect", + "name": "getBoundingClientRect", "comment": { "raw": [ - "node is an element." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getBoundingClientRect)" ] }, "typeValue": { - "raw": "1" + "raw": "() => DOMRect" }, "editor": { - "type": "oneOf", - "options": [ - 1 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "ATTRIBUTE_NODE", - "name": "ATTRIBUTE_NODE", + "uid": "getClientRects", + "name": "getClientRects", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getClientRects)" + ] + }, "typeValue": { - "raw": "2" + "raw": "() => DOMRectList" }, "editor": { - "type": "oneOf", - "options": [ - 2 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "TEXT_NODE", - "name": "TEXT_NODE", + "uid": "getElementsByClassName", + "name": "getElementsByClassName", "comment": { "raw": [ - "node is a Text node." + "Returns a HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classNames. The classNames argument is interpreted as a space-separated list of classes.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByClassName)" ] }, "typeValue": { - "raw": "3" + "raw": "(classNames: string) => HTMLCollectionOf" }, "editor": { - "type": "oneOf", - "options": [ - 3 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "CDATA_SECTION_NODE", - "name": "CDATA_SECTION_NODE", + "uid": "getElementsByTagName", + "name": "getElementsByTagName", "comment": { "raw": [ - "node is a CDATASection node." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByTagName)" ] }, "typeValue": { - "raw": "4" + "raw": "{ (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: K): HTMLCollectionOf; (qualifiedName: string): HTMLCollectionOf; }" }, "editor": { - "type": "oneOf", - "options": [ - 4 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "ENTITY_REFERENCE_NODE", - "name": "ENTITY_REFERENCE_NODE", + "uid": "getElementsByTagNameNS", + "name": "getElementsByTagNameNS", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getElementsByTagNameNS)" + ] + }, "typeValue": { - "raw": "5" + "raw": "{ (namespaceURI: 'http://www.w3.org/1999/xhtml', localName: string): HTMLCollectionOf; (namespaceURI: 'http://www.w3.org/2000/svg', localName: string): HTMLCollectionOf; (namespaceURI: 'http://www.w3.org/1998/Math/MathML', localName: string): HTMLCollectionOf; (namespace: string | null, localName: string): HTMLCollectionOf; }" }, "editor": { - "type": "oneOf", - "options": [ - 5 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "ENTITY_NODE", - "name": "ENTITY_NODE", + "uid": "hasAttribute", + "name": "hasAttribute", + "comment": { + "raw": [ + "Returns true if element has an attribute whose qualified name is qualifiedName, and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttribute)" + ] + }, "typeValue": { - "raw": "6" + "raw": "(qualifiedName: string) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - 6 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "PROCESSING_INSTRUCTION_NODE", - "name": "PROCESSING_INSTRUCTION_NODE", + "uid": "hasAttributeNS", + "name": "hasAttributeNS", "comment": { "raw": [ - "node is a ProcessingInstruction node." + "Returns true if element has an attribute whose namespace is namespace and local name is localName.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttributeNS)" ] }, "typeValue": { - "raw": "7" + "raw": "(namespace: string | null, localName: string) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - 7 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "COMMENT_NODE", - "name": "COMMENT_NODE", + "uid": "hasAttributes", + "name": "hasAttributes", "comment": { "raw": [ - "node is a Comment node." + "Returns true if element has attributes, and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasAttributes)" ] }, "typeValue": { - "raw": "8" + "raw": "() => boolean" }, "editor": { - "type": "oneOf", - "options": [ - 8 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_NODE", - "name": "DOCUMENT_NODE", + "uid": "hasPointerCapture", + "name": "hasPointerCapture", "comment": { "raw": [ - "node is a document." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/hasPointerCapture)" ] }, "typeValue": { - "raw": "9" + "raw": "(pointerId: number) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - 9 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_TYPE_NODE", - "name": "DOCUMENT_TYPE_NODE", + "uid": "insertAdjacentElement", + "name": "insertAdjacentElement", "comment": { "raw": [ - "node is a doctype." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentElement)" ] }, "typeValue": { - "raw": "10" + "raw": "(where: InsertPosition, element: Element) => Element | null" }, "editor": { - "type": "oneOf", - "options": [ - 10 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_FRAGMENT_NODE", - "name": "DOCUMENT_FRAGMENT_NODE", + "uid": "insertAdjacentHTML", + "name": "insertAdjacentHTML", "comment": { "raw": [ - "node is a DocumentFragment node." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentHTML)" ] }, "typeValue": { - "raw": "11" + "raw": "(position: InsertPosition, text: string) => void" }, "editor": { - "type": "oneOf", - "options": [ - 11 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "NOTATION_NODE", - "name": "NOTATION_NODE", + "uid": "insertAdjacentText", + "name": "insertAdjacentText", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/insertAdjacentText)" + ] + }, "typeValue": { - "raw": "12" + "raw": "(where: InsertPosition, data: string) => void" }, "editor": { - "type": "oneOf", - "options": [ - 12 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_DISCONNECTED", - "name": "DOCUMENT_POSITION_DISCONNECTED", + "uid": "matches", + "name": "matches", "comment": { "raw": [ - "Set when node and other are not in the same tree." + "Returns true if matching selectors against element's root yields element, and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/matches)" ] }, "typeValue": { - "raw": "1" + "raw": "(selectors: string) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - 1 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_PRECEDING", - "name": "DOCUMENT_POSITION_PRECEDING", + "uid": "releasePointerCapture", + "name": "releasePointerCapture", "comment": { "raw": [ - "Set when other is preceding node." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/releasePointerCapture)" ] }, "typeValue": { - "raw": "2" + "raw": "(pointerId: number) => void" }, "editor": { - "type": "oneOf", - "options": [ - 2 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_FOLLOWING", - "name": "DOCUMENT_POSITION_FOLLOWING", + "uid": "removeAttribute", + "name": "removeAttribute", "comment": { "raw": [ - "Set when other is following node." + "Removes element's first attribute whose qualified name is qualifiedName.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttribute)" ] }, "typeValue": { - "raw": "4" + "raw": "(qualifiedName: string) => void" }, "editor": { - "type": "oneOf", - "options": [ - 4 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_CONTAINS", - "name": "DOCUMENT_POSITION_CONTAINS", + "uid": "removeAttributeNS", + "name": "removeAttributeNS", "comment": { "raw": [ - "Set when other is an ancestor of node." + "Removes element's attribute whose namespace is namespace and local name is localName.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttributeNS)" ] }, "typeValue": { - "raw": "8" + "raw": "(namespace: string | null, localName: string) => void" }, "editor": { - "type": "oneOf", - "options": [ - 8 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_CONTAINED_BY", - "name": "DOCUMENT_POSITION_CONTAINED_BY", + "uid": "removeAttributeNode", + "name": "removeAttributeNode", "comment": { "raw": [ - "Set when other is a descendant of node." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/removeAttributeNode)" ] }, "typeValue": { - "raw": "16" + "raw": "(attr: Attr) => Attr" }, "editor": { - "type": "oneOf", - "options": [ - 16 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", - "name": "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", + "uid": "requestFullscreen", + "name": "requestFullscreen", + "comment": { + "raw": [ + "Displays element fullscreen and resolves promise when done.", + "", + " When supplied, options's navigationUI member indicates whether showing navigation UI while in fullscreen is preferred or not. If set to \"show\", navigation simplicity is preferred over screen space, and if set to \"hide\", more screen space is preferred. User agents are always free to honor user preference over the application's. The default value \"auto\" indicates no application preference.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/requestFullscreen)" + ] + }, "typeValue": { - "raw": "32" + "raw": "(options?: FullscreenOptions | undefined) => Promise" }, "editor": { - "type": "oneOf", - "options": [ - 32 - ] + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "dispatchEvent", - "name": "dispatchEvent", + "uid": "requestPointerLock", + "name": "requestPointerLock", "comment": { "raw": [ - "Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/requestPointerLock)" ] }, "typeValue": { - "raw": "(event: Event) => boolean" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:EventTarget", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", "required": true }, { - "uid": "ariaAtomic", - "name": "ariaAtomic", + "uid": "scroll", + "name": "scroll", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scroll)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaAutoComplete", - "name": "ariaAutoComplete", + "uid": "scrollBy", + "name": "scrollBy", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollBy)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaBusy", - "name": "ariaBusy", + "uid": "scrollIntoView", + "name": "scrollIntoView", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollIntoView)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(arg?: boolean | ScrollIntoViewOptions | undefined) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaChecked", - "name": "ariaChecked", + "uid": "scrollTo", + "name": "scrollTo", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/scrollTo)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "{ (options?: ScrollToOptions | undefined): void; (x: number, y: number): void; }" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaColCount", - "name": "ariaColCount", + "uid": "setAttribute", + "name": "setAttribute", + "comment": { + "raw": [ + "Sets the value of element's first attribute whose qualified name is qualifiedName to value.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttribute)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(qualifiedName: string, value: string) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaColIndex", - "name": "ariaColIndex", + "uid": "setAttributeNS", + "name": "setAttributeNS", + "comment": { + "raw": [ + "Sets the value of element's attribute whose namespace is namespace and local name is localName to value.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNS)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(namespace: string | null, qualifiedName: string, value: string) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaColSpan", - "name": "ariaColSpan", + "uid": "setAttributeNode", + "name": "setAttributeNode", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNode)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(attr: Attr) => Attr | null" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaCurrent", - "name": "ariaCurrent", + "uid": "setAttributeNodeNS", + "name": "setAttributeNodeNS", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setAttributeNodeNS)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(attr: Attr) => Attr | null" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaDisabled", - "name": "ariaDisabled", + "uid": "setPointerCapture", + "name": "setPointerCapture", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/setPointerCapture)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(pointerId: number) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaExpanded", - "name": "ariaExpanded", + "uid": "toggleAttribute", + "name": "toggleAttribute", + "comment": { + "raw": [ + "If force is not given, \"toggles\" qualifiedName, removing it if it is present and adding it if it is not present. If force is true, adds qualifiedName. If force is false, removes qualifiedName.", + "", + " Returns true if qualifiedName is now present, and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/toggleAttribute)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(qualifiedName: string, force?: boolean | undefined) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaHasPopup", - "name": "ariaHasPopup", + "uid": "webkitMatchesSelector", + "name": "webkitMatchesSelector", + "comment": { + "raw": [ + "@deprecated This is a legacy alias of `matches`.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/matches)" + ], + "tags": { + "@deprecated": "This is a legacy alias of" + } + }, "typeValue": { - "raw": "null | string" + "raw": "(selectors: string) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Element", + "required": true }, { - "uid": "ariaHidden", - "name": "ariaHidden", + "uid": "baseURI", + "name": "baseURI", + "comment": { + "raw": [ + "Returns node's node document's document base URL.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/baseURI)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "string" }, "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaInvalid", - "name": "ariaInvalid", - "typeValue": { - "raw": "null | string" + "uid": "childNodes", + "name": "childNodes", + "comment": { + "raw": [ + "Returns the children.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/childNodes)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "NodeListOf" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaKeyShortcuts", - "name": "ariaKeyShortcuts", - "typeValue": { - "raw": "null | string" + "uid": "firstChild", + "name": "firstChild", + "comment": { + "raw": [ + "Returns the first child.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/firstChild)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | ChildNode" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaLabel", - "name": "ariaLabel", + "uid": "isConnected", + "name": "isConnected", + "comment": { + "raw": [ + "Returns true if node is connected and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isConnected)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaLevel", - "name": "ariaLevel", - "typeValue": { - "raw": "null | string" + "uid": "lastChild", + "name": "lastChild", + "comment": { + "raw": [ + "Returns the last child.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lastChild)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | ChildNode" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaLive", - "name": "ariaLive", - "typeValue": { - "raw": "null | string" + "uid": "nextSibling", + "name": "nextSibling", + "comment": { + "raw": [ + "Returns the next sibling.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nextSibling)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | ChildNode" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaModal", - "name": "ariaModal", + "uid": "nodeName", + "name": "nodeName", + "comment": { + "raw": [ + "Returns a string appropriate for the type of node.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeName)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "string" }, "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaMultiLine", - "name": "ariaMultiLine", + "uid": "nodeType", + "name": "nodeType", + "comment": { + "raw": [ + "Returns the type of node.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeType)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaMultiSelectable", - "name": "ariaMultiSelectable", + "uid": "nodeValue", + "name": "nodeValue", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/nodeValue)" + ] + }, "typeValue": { "raw": "null | string" }, "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaOrientation", - "name": "ariaOrientation", - "typeValue": { - "raw": "null | string" + "uid": "parentElement", + "name": "parentElement", + "comment": { + "raw": [ + "Returns the parent element.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/parentElement)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | HTMLElement" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaPlaceholder", - "name": "ariaPlaceholder", - "typeValue": { - "raw": "null | string" + "uid": "parentNode", + "name": "parentNode", + "comment": { + "raw": [ + "Returns the parent.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/parentNode)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | ParentNode" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaPosInSet", - "name": "ariaPosInSet", - "typeValue": { - "raw": "null | string" + "uid": "previousSibling", + "name": "previousSibling", + "comment": { + "raw": [ + "Returns the previous sibling.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/previousSibling)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | ChildNode" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaPressed", - "name": "ariaPressed", + "uid": "textContent", + "name": "textContent", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/textContent)" + ] + }, "typeValue": { "raw": "null | string" }, "editor": { "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": false }, { - "uid": "ariaReadOnly", - "name": "ariaReadOnly", + "uid": "appendChild", + "name": "appendChild", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/appendChild)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(node: T) => T" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaRequired", - "name": "ariaRequired", + "uid": "cloneNode", + "name": "cloneNode", + "comment": { + "raw": [ + "Returns a copy of node. If deep is true, the copy also includes the node's descendants.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/cloneNode)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(deep?: boolean | undefined) => Node" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaRoleDescription", - "name": "ariaRoleDescription", + "uid": "compareDocumentPosition", + "name": "compareDocumentPosition", + "comment": { + "raw": [ + "Returns a bitmask indicating the position of other relative to node.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/compareDocumentPosition)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(other: Node) => number" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaRowCount", - "name": "ariaRowCount", + "uid": "contains", + "name": "contains", + "comment": { + "raw": [ + "Returns true if other is an inclusive descendant of node, and false otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/contains)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(other: Node | null) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaRowIndex", - "name": "ariaRowIndex", + "uid": "getRootNode", + "name": "getRootNode", + "comment": { + "raw": [ + "Returns node's root.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/getRootNode)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(options?: GetRootNodeOptions | undefined) => Node" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaRowSpan", - "name": "ariaRowSpan", + "uid": "hasChildNodes", + "name": "hasChildNodes", + "comment": { + "raw": [ + "Returns whether node has children.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/hasChildNodes)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "() => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaSelected", - "name": "ariaSelected", + "uid": "insertBefore", + "name": "insertBefore", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/insertBefore)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(node: T, child: Node | null) => T" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaSetSize", - "name": "ariaSetSize", - "typeValue": { - "raw": "null | string" - }, - "editor": { - "type": "string" + "uid": "isDefaultNamespace", + "name": "isDefaultNamespace", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isDefaultNamespace)" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false - }, - { - "uid": "ariaSort", - "name": "ariaSort", "typeValue": { - "raw": "null | string" + "raw": "(namespace: string | null) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaValueMax", - "name": "ariaValueMax", - "typeValue": { - "raw": "null | string" - }, - "editor": { - "type": "string" + "uid": "isEqualNode", + "name": "isEqualNode", + "comment": { + "raw": [ + "Returns whether node and otherNode have the same properties.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isEqualNode)" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false - }, - { - "uid": "ariaValueMin", - "name": "ariaValueMin", "typeValue": { - "raw": "null | string" + "raw": "(otherNode: Node | null) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "ariaValueNow", - "name": "ariaValueNow", - "typeValue": { - "raw": "null | string" - }, - "editor": { - "type": "string" + "uid": "isSameNode", + "name": "isSameNode", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/isSameNode)" + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false - }, - { - "uid": "ariaValueText", - "name": "ariaValueText", "typeValue": { - "raw": "null | string" + "raw": "(otherNode: Node | null) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "role", - "name": "role", + "uid": "lookupNamespaceURI", + "name": "lookupNamespaceURI", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lookupNamespaceURI)" + ] + }, "typeValue": { - "raw": "null | string" + "raw": "(prefix: string | null) => string | null" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "animate", - "name": "animate", + "uid": "lookupPrefix", + "name": "lookupPrefix", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/lookupPrefix)" + ] + }, "typeValue": { - "raw": "(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined) => Animation" + "raw": "(namespace: string | null) => string | null" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Animatable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "getAnimations", - "name": "getAnimations", + "uid": "normalize", + "name": "normalize", + "comment": { + "raw": [ + "Removes empty exclusive Text nodes and concatenates the data of remaining contiguous exclusive Text nodes into the first of their nodes.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/normalize)" + ] + }, "typeValue": { - "raw": "(options?: GetAnimationsOptions | undefined) => Animation[]" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Animatable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "after", - "name": "after", + "uid": "removeChild", + "name": "removeChild", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/removeChild)" + ] + }, "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "(child: T) => T" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "before", - "name": "before", + "uid": "replaceChild", + "name": "replaceChild", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/replaceChild)" + ] + }, "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "(node: Node, child: T) => T" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "remove", - "name": "remove", + "uid": "ELEMENT_NODE", + "name": "ELEMENT_NODE", + "comment": { + "raw": [ + "node is an element." + ] + }, "typeValue": { - "raw": "() => void" + "raw": "1" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 1 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "replaceWith", - "name": "replaceWith", + "uid": "ATTRIBUTE_NODE", + "name": "ATTRIBUTE_NODE", "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "2" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 2 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "innerHTML", - "name": "innerHTML", + "uid": "TEXT_NODE", + "name": "TEXT_NODE", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/innerHTML)" + "node is a Text node." ] }, "typeValue": { - "raw": "string" + "raw": "3" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + 3 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:InnerHTML", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "nextElementSibling", - "name": "nextElementSibling", + "uid": "CDATA_SECTION_NODE", + "name": "CDATA_SECTION_NODE", "comment": { "raw": [ - "Returns the first following sibling that is an element, and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/CharacterData/nextElementSibling)" + "node is a CDATASection node." ] }, "typeValue": { - "raw": "null | Element" + "raw": "4" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:NonDocumentTypeChildNode", - "required": false - }, - { - "uid": "previousElementSibling", - "name": "previousElementSibling", - "comment": { - "raw": [ - "Returns the first preceding sibling that is an element, and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/CharacterData/previousElementSibling)" + "editor": { + "type": "oneOf", + "options": [ + 4 ] }, - "typeValue": { - "raw": "null | Element" - }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:NonDocumentTypeChildNode", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "childElementCount", - "name": "childElementCount", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/childElementCount)" - ] - }, + "uid": "ENTITY_REFERENCE_NODE", + "name": "ENTITY_REFERENCE_NODE", "typeValue": { - "raw": "number" + "raw": "5" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + 5 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "Returns the child elements.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/children)" - ] - }, + "uid": "ENTITY_NODE", + "name": "ENTITY_NODE", "typeValue": { - "raw": "HTMLCollection" + "raw": "6" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "editor": { + "type": "oneOf", + "options": [ + 6 + ] + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "firstElementChild", - "name": "firstElementChild", + "uid": "PROCESSING_INSTRUCTION_NODE", + "name": "PROCESSING_INSTRUCTION_NODE", "comment": { "raw": [ - "Returns the first child that is an element, and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/firstElementChild)" + "node is a ProcessingInstruction node." ] }, "typeValue": { - "raw": "null | Element" + "raw": "7" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", - "required": false - }, - { - "uid": "lastElementChild", - "name": "lastElementChild", - "comment": { - "raw": [ - "Returns the last child that is an element, and null otherwise.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/lastElementChild)" + "editor": { + "type": "oneOf", + "options": [ + 7 ] }, - "typeValue": { - "raw": "null | Element" - }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", + "required": true }, { - "uid": "append", - "name": "append", + "uid": "COMMENT_NODE", + "name": "COMMENT_NODE", "comment": { "raw": [ - "Inserts nodes after the last child of node, while replacing strings in nodes with equivalent Text nodes.", - "", - " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/append)" + "node is a Comment node." ] }, "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "8" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 8 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "prepend", - "name": "prepend", + "uid": "DOCUMENT_NODE", + "name": "DOCUMENT_NODE", "comment": { "raw": [ - "Inserts nodes before the first child of node, while replacing strings in nodes with equivalent Text nodes.", - "", - " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/prepend)" + "node is a document." ] }, "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "9" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 9 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "querySelector", - "name": "querySelector", + "uid": "DOCUMENT_TYPE_NODE", + "name": "DOCUMENT_TYPE_NODE", "comment": { "raw": [ - "Returns the first element that is a descendant of node that matches selectors.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/querySelector)" + "node is a doctype." ] }, "typeValue": { - "raw": "{ (selectors: K): HTMLElementTagNameMap[K] | null; (selectors: K): SVGElementTagNameMap[K] | null; (selectors: K): MathMLElementTagNameMap[K] | null; (selectors: K): HTMLElementDeprecatedTagNameMap[K] | null; (selectors: string): E | null; }" + "raw": "10" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 10 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "querySelectorAll", - "name": "querySelectorAll", + "uid": "DOCUMENT_FRAGMENT_NODE", + "name": "DOCUMENT_FRAGMENT_NODE", "comment": { "raw": [ - "Returns all element descendants of node that match selectors.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/querySelectorAll)" + "node is a DocumentFragment node." ] }, "typeValue": { - "raw": "{ (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: string): NodeListOf; }" + "raw": "11" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 11 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "replaceChildren", - "name": "replaceChildren", - "comment": { - "raw": [ - "Replace all children of node with nodes, while replacing strings in nodes with equivalent Text nodes.", - "", - " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/replaceChildren)" - ] - }, + "uid": "NOTATION_NODE", + "name": "NOTATION_NODE", "typeValue": { - "raw": "(...nodes: (string | Node)[]) => void" + "raw": "12" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + 12 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "assignedSlot", - "name": "assignedSlot", + "uid": "DOCUMENT_POSITION_DISCONNECTED", + "name": "DOCUMENT_POSITION_DISCONNECTED", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/assignedSlot)" + "Set when node and other are not in the same tree." ] }, "typeValue": { - "raw": "null | HTMLSlotElement" + "raw": "1" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:Slottable", - "required": false - }, - { - "uid": "attributeStyleMap", - "name": "attributeStyleMap", - "typeValue": { - "raw": "StylePropertyMap" + "editor": { + "type": "oneOf", + "options": [ + 1 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementCSSInlineStyle", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "style", - "name": "style", + "uid": "DOCUMENT_POSITION_PRECEDING", + "name": "DOCUMENT_POSITION_PRECEDING", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/style)" + "Set when other is preceding node." ] }, "typeValue": { - "raw": "CSSStyleDeclaration" + "raw": "2" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementCSSInlineStyle", + "editor": { + "type": "oneOf", + "options": [ + 2 + ] + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "contentEditable", - "name": "contentEditable", + "uid": "DOCUMENT_POSITION_FOLLOWING", + "name": "DOCUMENT_POSITION_FOLLOWING", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/contentEditable)" + "Set when other is following node." ] }, "typeValue": { - "raw": "string" + "raw": "4" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + 4 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "enterKeyHint", - "name": "enterKeyHint", + "uid": "DOCUMENT_POSITION_CONTAINS", + "name": "DOCUMENT_POSITION_CONTAINS", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/enterKeyHint)" + "Set when other is an ancestor of node." ] }, "typeValue": { - "raw": "string" + "raw": "8" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + 8 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "inputMode", - "name": "inputMode", + "uid": "DOCUMENT_POSITION_CONTAINED_BY", + "name": "DOCUMENT_POSITION_CONTAINED_BY", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/inputMode)" + "Set when other is a descendant of node." ] }, "typeValue": { - "raw": "string" + "raw": "16" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + 16 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "isContentEditable", - "name": "isContentEditable", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/isContentEditable)" - ] - }, + "uid": "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", + "name": "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", "typeValue": { - "raw": "boolean" + "raw": "32" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + 32 + ] }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Node", "required": true }, { - "uid": "onabort", - "name": "onabort", + "uid": "dispatchEvent", + "name": "dispatchEvent", "comment": { "raw": [ - "Fires when the user aborts the download.", - " @param ev The event.", + "Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/abort_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: UIEvent) => any" + "raw": "(event: Event) => boolean" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:EventTarget", + "required": true }, { - "uid": "onanimationcancel", - "name": "onanimationcancel", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationcancel_event)" - ] - }, + "uid": "ariaAtomic", + "name": "ariaAtomic", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onanimationend", - "name": "onanimationend", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationend_event)" - ] - }, + "uid": "ariaAutoComplete", + "name": "ariaAutoComplete", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onanimationiteration", - "name": "onanimationiteration", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationiteration_event)" - ] - }, + "uid": "ariaBusy", + "name": "ariaBusy", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onanimationstart", - "name": "onanimationstart", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationstart_event)" - ] - }, + "uid": "ariaChecked", + "name": "ariaChecked", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onauxclick", - "name": "onauxclick", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/auxclick_event)" - ] - }, + "uid": "ariaColCount", + "name": "ariaColCount", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onbeforeinput", - "name": "onbeforeinput", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/beforeinput_event)" - ] - }, + "uid": "ariaColIndex", + "name": "ariaColIndex", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: InputEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onblur", - "name": "onblur", - "comment": { - "raw": [ - "Fires when the object loses the input focus.", - " @param ev The focus event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/blur_event)" - ] - }, + "uid": "ariaColSpan", + "name": "ariaColSpan", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: FocusEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncancel", - "name": "oncancel", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDialogElement/cancel_event)" - ] - }, + "uid": "ariaCurrent", + "name": "ariaCurrent", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncanplay", - "name": "oncanplay", - "comment": { - "raw": [ - "Occurs when playback is possible, but would require further buffering.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/canplay_event)" - ] - }, + "uid": "ariaDisabled", + "name": "ariaDisabled", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncanplaythrough", - "name": "oncanplaythrough", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/canplaythrough_event)" - ] - }, + "uid": "ariaExpanded", + "name": "ariaExpanded", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onchange", - "name": "onchange", - "comment": { - "raw": [ - "Fires when the contents of the object or selection have changed.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/change_event)" - ] - }, + "uid": "ariaHasPopup", + "name": "ariaHasPopup", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onclick", - "name": "onclick", - "comment": { - "raw": [ - "Fires when the user clicks the left mouse button on the object", - " @param ev The mouse event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/click_event)" - ] - }, + "uid": "ariaHidden", + "name": "ariaHidden", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onclose", - "name": "onclose", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDialogElement/close_event)" - ] - }, + "uid": "ariaInvalid", + "name": "ariaInvalid", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncontextmenu", - "name": "oncontextmenu", - "comment": { - "raw": [ - "Fires when the user clicks the right mouse button in the client area, opening the context menu.", - " @param ev The mouse event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/contextmenu_event)" - ] - }, + "uid": "ariaKeyShortcuts", + "name": "ariaKeyShortcuts", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncopy", - "name": "oncopy", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/copy_event)" - ] - }, + "uid": "ariaLabel", + "name": "ariaLabel", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncuechange", - "name": "oncuechange", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLTrackElement/cuechange_event)" - ] - }, + "uid": "ariaLevel", + "name": "ariaLevel", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oncut", - "name": "oncut", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/cut_event)" - ] - }, + "uid": "ariaLive", + "name": "ariaLive", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondblclick", - "name": "ondblclick", - "comment": { - "raw": [ - "Fires when the user double-clicks the object.", - " @param ev The mouse event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/dblclick_event)" - ] - }, + "uid": "ariaModal", + "name": "ariaModal", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondrag", - "name": "ondrag", - "comment": { - "raw": [ - "Fires on the source object continuously during a drag operation.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/drag_event)" - ] - }, + "uid": "ariaMultiLine", + "name": "ariaMultiLine", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondragend", - "name": "ondragend", - "comment": { - "raw": [ - "Fires on the source object when the user releases the mouse at the close of a drag operation.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragend_event)" - ] - }, + "uid": "ariaMultiSelectable", + "name": "ariaMultiSelectable", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondragenter", - "name": "ondragenter", - "comment": { - "raw": [ - "Fires on the target element when the user drags the object to a valid drop target.", - " @param ev The drag event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragenter_event)" - ] - }, + "uid": "ariaOrientation", + "name": "ariaOrientation", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondragleave", - "name": "ondragleave", - "comment": { - "raw": [ - "Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation.", - " @param ev The drag event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragleave_event)" - ] - }, + "uid": "ariaPlaceholder", + "name": "ariaPlaceholder", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondragover", - "name": "ondragover", - "comment": { - "raw": [ - "Fires on the target element continuously while the user drags the object over a valid drop target.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragover_event)" - ] - }, + "uid": "ariaPosInSet", + "name": "ariaPosInSet", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondragstart", - "name": "ondragstart", - "comment": { - "raw": [ - "Fires on the source object when the user starts to drag a text selection or selected object.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragstart_event)" - ] - }, + "uid": "ariaPressed", + "name": "ariaPressed", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondrop", - "name": "ondrop", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/drop_event)" - ] - }, + "uid": "ariaReadOnly", + "name": "ariaReadOnly", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ondurationchange", - "name": "ondurationchange", - "comment": { - "raw": [ - "Occurs when the duration attribute is updated.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/durationchange_event)" - ] - }, + "uid": "ariaRequired", + "name": "ariaRequired", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onemptied", - "name": "onemptied", - "comment": { - "raw": [ - "Occurs when the media element is reset to its initial state.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/emptied_event)" - ] - }, + "uid": "ariaRoleDescription", + "name": "ariaRoleDescription", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onended", - "name": "onended", - "comment": { - "raw": [ - "Occurs when the end of playback is reached.", - " @param ev The event", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/ended_event)" - ] - }, + "uid": "ariaRowCount", + "name": "ariaRowCount", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onerror", - "name": "onerror", - "comment": { - "raw": [ - "Fires when an error occurs during object loading.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/error_event)" - ] - }, + "uid": "ariaRowIndex", + "name": "ariaRowIndex", "typeValue": { - "raw": "OnErrorEventHandler" + "raw": "null | string" }, - "typeValueRef": "node_modules/typescript/lib/lib.dom.d.ts:OnErrorEventHandler", - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "editor": { + "type": "string" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onfocus", - "name": "onfocus", - "comment": { - "raw": [ - "Fires when the object receives focus.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/focus_event)" - ] - }, + "uid": "ariaRowSpan", + "name": "ariaRowSpan", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: FocusEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onformdata", - "name": "onformdata", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/formdata_event)" - ] - }, + "uid": "ariaSelected", + "name": "ariaSelected", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: FormDataEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "ongotpointercapture", - "name": "ongotpointercapture", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/gotpointercapture_event)" - ] - }, + "uid": "ariaSetSize", + "name": "ariaSetSize", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oninput", - "name": "oninput", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/input_event)" - ] + "uid": "ariaSort", + "name": "ariaSort", + "typeValue": { + "raw": "null | string" + }, + "editor": { + "type": "string" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "required": false + }, + { + "uid": "ariaValueMax", + "name": "ariaValueMax", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "oninvalid", - "name": "oninvalid", - "comment": { - "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLInputElement/invalid_event)" - ] + "uid": "ariaValueMin", + "name": "ariaValueMin", + "typeValue": { + "raw": "null | string" + }, + "editor": { + "type": "string" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "required": false + }, + { + "uid": "ariaValueNow", + "name": "ariaValueNow", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onkeydown", - "name": "onkeydown", - "comment": { - "raw": [ - "Fires when the user presses a key.", - " @param ev The keyboard event", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keydown_event)" - ] + "uid": "ariaValueText", + "name": "ariaValueText", + "typeValue": { + "raw": "null | string" + }, + "editor": { + "type": "string" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", + "required": false + }, + { + "uid": "role", + "name": "role", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ARIAMixin", "required": false }, { - "uid": "onkeypress", - "name": "onkeypress", - "comment": { - "raw": [ - "Fires when the user presses an alphanumeric key.", - " @param ev The event.", - " @deprecated", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keypress_event)" - ] + "uid": "animate", + "name": "animate", + "typeValue": { + "raw": "(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined) => Animation" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:Animatable", + "required": true + }, + { + "uid": "getAnimations", + "name": "getAnimations", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" + "raw": "(options?: GetAnimationsOptions | undefined) => Animation[]" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:Animatable", + "required": true }, { - "uid": "onkeyup", - "name": "onkeyup", - "comment": { - "raw": [ - "Fires when the user releases a key.", - " @param ev The keyboard event", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keyup_event)" - ] + "uid": "after", + "name": "after", + "typeValue": { + "raw": "(...nodes: (string | Node)[]) => void" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "required": true + }, + { + "uid": "before", + "name": "before", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" + "raw": "(...nodes: (string | Node)[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "required": true }, { - "uid": "onload", - "name": "onload", - "comment": { - "raw": [ - "Fires immediately after the browser loads the object.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/SVGElement/load_event)" - ] + "uid": "remove", + "name": "remove", + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "required": true + }, + { + "uid": "replaceWith", + "name": "replaceWith", "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "(...nodes: (string | Node)[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ChildNode", + "required": true }, { - "uid": "onloadeddata", - "name": "onloadeddata", + "uid": "innerHTML", + "name": "innerHTML", "comment": { "raw": [ - "Occurs when media data is loaded at the current playback position.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadeddata_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/innerHTML)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:InnerHTML", + "required": true }, { - "uid": "onloadedmetadata", - "name": "onloadedmetadata", + "uid": "nextElementSibling", + "name": "nextElementSibling", "comment": { "raw": [ - "Occurs when the duration and dimensions of the media have been determined.", - " @param ev The event.", + "Returns the first following sibling that is an element, and null otherwise.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadedmetadata_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/CharacterData/nextElementSibling)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" - }, - "editor": { - "type": "func" + "raw": "null | Element" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:NonDocumentTypeChildNode", "required": false }, { - "uid": "onloadstart", - "name": "onloadstart", + "uid": "previousElementSibling", + "name": "previousElementSibling", "comment": { "raw": [ - "Occurs when Internet Explorer begins looking for media data.", - " @param ev The event.", + "Returns the first preceding sibling that is an element, and null otherwise.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadstart_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/CharacterData/previousElementSibling)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" - }, - "editor": { - "type": "func" + "raw": "null | Element" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:NonDocumentTypeChildNode", "required": false }, { - "uid": "onlostpointercapture", - "name": "onlostpointercapture", + "uid": "childElementCount", + "name": "childElementCount", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/lostpointercapture_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/childElementCount)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onmousedown", - "name": "onmousedown", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Fires when the user clicks the object with either mouse button.", - " @param ev The mouse event.", + "Returns the child elements.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mousedown_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/children)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" - }, - "editor": { - "type": "func" + "raw": "HTMLCollection" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onmouseenter", - "name": "onmouseenter", + "uid": "firstElementChild", + "name": "firstElementChild", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseenter_event)" + "Returns the first child that is an element, and null otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/firstElementChild)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" - }, - "editor": { - "type": "func" + "raw": "null | Element" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", "required": false }, { - "uid": "onmouseleave", - "name": "onmouseleave", + "uid": "lastElementChild", + "name": "lastElementChild", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseleave_event)" + "Returns the last child that is an element, and null otherwise.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/lastElementChild)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" - }, - "editor": { - "type": "func" + "raw": "null | Element" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", "required": false }, { - "uid": "onmousemove", - "name": "onmousemove", + "uid": "append", + "name": "append", "comment": { "raw": [ - "Fires when the user moves the mouse over the object.", - " @param ev The mouse event.", + "Inserts nodes after the last child of node, while replacing strings in nodes with equivalent Text nodes.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mousemove_event)" + " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/append)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "(...nodes: (string | Node)[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onmouseout", - "name": "onmouseout", + "uid": "prepend", + "name": "prepend", "comment": { "raw": [ - "Fires when the user moves the mouse pointer outside the boundaries of the object.", - " @param ev The mouse event.", + "Inserts nodes before the first child of node, while replacing strings in nodes with equivalent Text nodes.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseout_event)" + " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/prepend)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "(...nodes: (string | Node)[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onmouseover", - "name": "onmouseover", + "uid": "querySelector", + "name": "querySelector", "comment": { "raw": [ - "Fires when the user moves the mouse pointer into the object.", - " @param ev The mouse event.", + "Returns the first element that is a descendant of node that matches selectors.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseover_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/querySelector)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "{ (selectors: K): HTMLElementTagNameMap[K] | null; (selectors: K): SVGElementTagNameMap[K] | null; (selectors: K): MathMLElementTagNameMap[K] | null; (selectors: K): HTMLElementDeprecatedTagNameMap[K] | null; (selectors: string): E | null; }" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onmouseup", - "name": "onmouseup", + "uid": "querySelectorAll", + "name": "querySelectorAll", "comment": { "raw": [ - "Fires when the user releases a mouse button while the mouse is over the object.", - " @param ev The mouse event.", + "Returns all element descendants of node that match selectors.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseup_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/querySelectorAll)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + "raw": "{ (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: K): NodeListOf; (selectors: string): NodeListOf; }" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onpaste", - "name": "onpaste", + "uid": "replaceChildren", + "name": "replaceChildren", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/paste_event)" + "Replace all children of node with nodes, while replacing strings in nodes with equivalent Text nodes.", + "", + " Throws a \"HierarchyRequestError\" DOMException if the constraints of the node tree are violated.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/replaceChildren)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" + "raw": "(...nodes: (string | Node)[]) => void" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ParentNode", + "required": true }, { - "uid": "onpause", - "name": "onpause", + "uid": "assignedSlot", + "name": "assignedSlot", "comment": { "raw": [ - "Occurs when playback is paused.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/pause_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/assignedSlot)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" - }, - "editor": { - "type": "func" + "raw": "null | HTMLSlotElement" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "from": "node_modules/typescript/lib/lib.dom.d.ts:Slottable", "required": false }, { - "uid": "onplay", - "name": "onplay", + "uid": "attributeStyleMap", + "name": "attributeStyleMap", + "typeValue": { + "raw": "StylePropertyMap" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementCSSInlineStyle", + "required": true + }, + { + "uid": "style", + "name": "style", "comment": { "raw": [ - "Occurs when the play method is requested.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/play_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/style)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" - }, - "editor": { - "type": "func" + "raw": "CSSStyleDeclaration" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementCSSInlineStyle", + "required": true }, { - "uid": "onplaying", - "name": "onplaying", + "uid": "contentEditable", + "name": "contentEditable", "comment": { "raw": [ - "Occurs when the audio or video has started playing.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/playing_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/contentEditable)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "required": true }, { - "uid": "onpointercancel", - "name": "onpointercancel", + "uid": "enterKeyHint", + "name": "enterKeyHint", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointercancel_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/enterKeyHint)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "required": true }, { - "uid": "onpointerdown", - "name": "onpointerdown", + "uid": "inputMode", + "name": "inputMode", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerdown_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/inputMode)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "required": true }, { - "uid": "onpointerenter", - "name": "onpointerenter", + "uid": "isContentEditable", + "name": "isContentEditable", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerenter_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/isContentEditable)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:ElementContentEditable", + "required": true }, { - "uid": "onpointerleave", - "name": "onpointerleave", + "uid": "onabort", + "name": "onabort", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerleave_event)" + "Fires when the user aborts the download.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/abort_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: UIEvent) => any" }, "editor": { "type": "func" @@ -30886,15 +31004,15 @@ "required": false }, { - "uid": "onpointermove", - "name": "onpointermove", + "uid": "onanimationcancel", + "name": "onanimationcancel", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointermove_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationcancel_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" }, "editor": { "type": "func" @@ -30903,15 +31021,15 @@ "required": false }, { - "uid": "onpointerout", - "name": "onpointerout", + "uid": "onanimationend", + "name": "onanimationend", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerout_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationend_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" }, "editor": { "type": "func" @@ -30920,15 +31038,15 @@ "required": false }, { - "uid": "onpointerover", - "name": "onpointerover", + "uid": "onanimationiteration", + "name": "onanimationiteration", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerover_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationiteration_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" }, "editor": { "type": "func" @@ -30937,15 +31055,15 @@ "required": false }, { - "uid": "onpointerup", - "name": "onpointerup", + "uid": "onanimationstart", + "name": "onanimationstart", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerup_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationstart_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: AnimationEvent) => any" }, "editor": { "type": "func" @@ -30954,18 +31072,15 @@ "required": false }, { - "uid": "onprogress", - "name": "onprogress", + "uid": "onauxclick", + "name": "onauxclick", "comment": { "raw": [ - "Occurs to indicate progress while downloading media data.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/progress_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/auxclick_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: ProgressEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" @@ -30974,14 +31089,48 @@ "required": false }, { - "uid": "onratechange", - "name": "onratechange", + "uid": "onbeforeinput", + "name": "onbeforeinput", "comment": { "raw": [ - "Occurs when the playback rate is increased or decreased.", - " @param ev The event.", + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/beforeinput_event)" + ] + }, + "typeValue": { + "raw": "null | (this: GlobalEventHandlers, ev: InputEvent) => any" + }, + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false + }, + { + "uid": "onblur", + "name": "onblur", + "comment": { + "raw": [ + "Fires when the object loses the input focus.", + " @param ev The focus event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/ratechange_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/blur_event)" + ] + }, + "typeValue": { + "raw": "null | (this: GlobalEventHandlers, ev: FocusEvent) => any" + }, + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false + }, + { + "uid": "oncancel", + "name": "oncancel", + "comment": { + "raw": [ + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDialogElement/cancel_event)" ] }, "typeValue": { @@ -30994,14 +31143,14 @@ "required": false }, { - "uid": "onreset", - "name": "onreset", + "uid": "oncanplay", + "name": "oncanplay", "comment": { "raw": [ - "Fires when the user resets a form.", + "Occurs when playback is possible, but would require further buffering.", " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/reset_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/canplay_event)" ] }, "typeValue": { @@ -31014,15 +31163,15 @@ "required": false }, { - "uid": "onresize", - "name": "onresize", + "uid": "oncanplaythrough", + "name": "oncanplaythrough", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLVideoElement/resize_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/canplaythrough_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: UIEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31031,14 +31180,14 @@ "required": false }, { - "uid": "onscroll", - "name": "onscroll", + "uid": "onchange", + "name": "onchange", "comment": { "raw": [ - "Fires when the user repositions the scroll box in the scroll bar on the object.", + "Fires when the contents of the object or selection have changed.", " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/scroll_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/change_event)" ] }, "typeValue": { @@ -31051,15 +31200,18 @@ "required": false }, { - "uid": "onscrollend", - "name": "onscrollend", + "uid": "onclick", + "name": "onclick", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/scrollend_event)" + "Fires when the user clicks the left mouse button on the object", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/click_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" @@ -31068,15 +31220,15 @@ "required": false }, { - "uid": "onsecuritypolicyviolation", - "name": "onsecuritypolicyviolation", + "uid": "onclose", + "name": "onclose", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/securitypolicyviolation_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDialogElement/close_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31085,18 +31237,18 @@ "required": false }, { - "uid": "onseeked", - "name": "onseeked", + "uid": "oncontextmenu", + "name": "oncontextmenu", "comment": { "raw": [ - "Occurs when the seek operation ends.", - " @param ev The event.", + "Fires when the user clicks the right mouse button in the client area, opening the context menu.", + " @param ev The mouse event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/seeked_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/contextmenu_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" @@ -31105,18 +31257,15 @@ "required": false }, { - "uid": "onseeking", - "name": "onseeking", + "uid": "oncopy", + "name": "oncopy", "comment": { "raw": [ - "Occurs when the current playback position is moved.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/seeking_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/copy_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" }, "editor": { "type": "func" @@ -31125,14 +31274,11 @@ "required": false }, { - "uid": "onselect", - "name": "onselect", + "uid": "oncuechange", + "name": "oncuechange", "comment": { "raw": [ - "Fires when the current selection changes.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLInputElement/select_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLTrackElement/cuechange_event)" ] }, "typeValue": { @@ -31145,15 +31291,15 @@ "required": false }, { - "uid": "onselectionchange", - "name": "onselectionchange", + "uid": "oncut", + "name": "oncut", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/selectionchange_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/cut_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" }, "editor": { "type": "func" @@ -31162,15 +31308,18 @@ "required": false }, { - "uid": "onselectstart", - "name": "onselectstart", + "uid": "ondblclick", + "name": "ondblclick", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/selectstart_event)" + "Fires when the user double-clicks the object.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/dblclick_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" @@ -31179,15 +31328,18 @@ "required": false }, { - "uid": "onslotchange", - "name": "onslotchange", + "uid": "ondrag", + "name": "ondrag", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLSlotElement/slotchange_event)" + "Fires on the source object continuously during a drag operation.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/drag_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31196,18 +31348,18 @@ "required": false }, { - "uid": "onstalled", - "name": "onstalled", + "uid": "ondragend", + "name": "ondragend", "comment": { "raw": [ - "Occurs when the download has stopped.", + "Fires on the source object when the user releases the mouse at the close of a drag operation.", " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/stalled_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragend_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31216,15 +31368,18 @@ "required": false }, { - "uid": "onsubmit", - "name": "onsubmit", + "uid": "ondragenter", + "name": "ondragenter", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/submit_event)" + "Fires on the target element when the user drags the object to a valid drop target.", + " @param ev The drag event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragenter_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: SubmitEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31233,18 +31388,18 @@ "required": false }, { - "uid": "onsuspend", - "name": "onsuspend", + "uid": "ondragleave", + "name": "ondragleave", "comment": { "raw": [ - "Occurs if the load operation has been intentionally halted.", - " @param ev The event.", + "Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation.", + " @param ev The drag event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/suspend_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragleave_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31253,18 +31408,18 @@ "required": false }, { - "uid": "ontimeupdate", - "name": "ontimeupdate", + "uid": "ondragover", + "name": "ondragover", "comment": { "raw": [ - "Occurs to indicate the current playback position.", + "Fires on the target element continuously while the user drags the object over a valid drop target.", " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/timeupdate_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragover_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31273,15 +31428,18 @@ "required": false }, { - "uid": "ontoggle", - "name": "ontoggle", + "uid": "ondragstart", + "name": "ondragstart", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDetailsElement/toggle_event)" + "Fires on the source object when the user starts to drag a text selection or selected object.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dragstart_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31290,15 +31448,15 @@ "required": false }, { - "uid": "ontouchcancel", - "name": "ontouchcancel", + "uid": "ondrop", + "name": "ondrop", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchcancel_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/drop_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: DragEvent) => any" }, "editor": { "type": "func" @@ -31307,15 +31465,18 @@ "required": false }, { - "uid": "ontouchend", - "name": "ontouchend", + "uid": "ondurationchange", + "name": "ondurationchange", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchend_event)" + "Occurs when the duration attribute is updated.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/durationchange_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31324,15 +31485,18 @@ "required": false }, { - "uid": "ontouchmove", - "name": "ontouchmove", + "uid": "onemptied", + "name": "onemptied", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchmove_event)" + "Occurs when the media element is reset to its initial state.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/emptied_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31341,15 +31505,18 @@ "required": false }, { - "uid": "ontouchstart", - "name": "ontouchstart", + "uid": "onended", + "name": "onended", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchstart_event)" + "Occurs when the end of playback is reached.", + " @param ev The event", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/ended_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31358,15 +31525,36 @@ "required": false }, { - "uid": "ontransitioncancel", - "name": "ontransitioncancel", + "uid": "onerror", + "name": "onerror", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitioncancel_event)" + "Fires when an error occurs during object loading.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/error_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" + "raw": "OnErrorEventHandler" + }, + "typeValueRef": "node_modules/typescript/lib/lib.dom.d.ts:OnErrorEventHandler", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false + }, + { + "uid": "onfocus", + "name": "onfocus", + "comment": { + "raw": [ + "Fires when the object receives focus.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/focus_event)" + ] + }, + "typeValue": { + "raw": "null | (this: GlobalEventHandlers, ev: FocusEvent) => any" }, "editor": { "type": "func" @@ -31375,15 +31563,15 @@ "required": false }, { - "uid": "ontransitionend", - "name": "ontransitionend", + "uid": "onformdata", + "name": "onformdata", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionend_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/formdata_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: FormDataEvent) => any" }, "editor": { "type": "func" @@ -31392,15 +31580,15 @@ "required": false }, { - "uid": "ontransitionrun", - "name": "ontransitionrun", + "uid": "ongotpointercapture", + "name": "ongotpointercapture", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionrun_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/gotpointercapture_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { "type": "func" @@ -31409,15 +31597,15 @@ "required": false }, { - "uid": "ontransitionstart", - "name": "ontransitionstart", + "uid": "oninput", + "name": "oninput", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionstart_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/input_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31426,14 +31614,11 @@ "required": false }, { - "uid": "onvolumechange", - "name": "onvolumechange", + "uid": "oninvalid", + "name": "oninvalid", "comment": { "raw": [ - "Occurs when the volume is changed, or playback is muted or unmuted.", - " @param ev The event.", - "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/volumechange_event)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLInputElement/invalid_event)" ] }, "typeValue": { @@ -31446,18 +31631,18 @@ "required": false }, { - "uid": "onwaiting", - "name": "onwaiting", + "uid": "onkeydown", + "name": "onkeydown", "comment": { "raw": [ - "Occurs when playback stops because the next frame of a video resource is not available.", - " @param ev The event.", + "Fires when the user presses a key.", + " @param ev The keyboard event", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/waiting_event)" + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keydown_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" }, "editor": { "type": "func" @@ -31466,20 +31651,19 @@ "required": false }, { - "uid": "onwebkitanimationend", - "name": "onwebkitanimationend", + "uid": "onkeypress", + "name": "onkeypress", "comment": { "raw": [ - "@deprecated This is a legacy alias of `onanimationend`.", + "Fires when the user presses an alphanumeric key.", + " @param ev The event.", + " @deprecated", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationend_event)" - ], - "tags": { - "@deprecated": "This is a legacy alias of" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keypress_event)" + ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" }, "editor": { "type": "func" @@ -31488,20 +31672,18 @@ "required": false }, { - "uid": "onwebkitanimationiteration", - "name": "onwebkitanimationiteration", + "uid": "onkeyup", + "name": "onkeyup", "comment": { "raw": [ - "@deprecated This is a legacy alias of `onanimationiteration`.", + "Fires when the user releases a key.", + " @param ev The keyboard event", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationiteration_event)" - ], - "tags": { - "@deprecated": "This is a legacy alias of" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/keyup_event)" + ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" + "raw": "null | (this: GlobalEventHandlers, ev: KeyboardEvent) => any" }, "editor": { "type": "func" @@ -31510,17 +31692,15 @@ "required": false }, { - "uid": "onwebkitanimationstart", - "name": "onwebkitanimationstart", + "uid": "onload", + "name": "onload", "comment": { "raw": [ - "@deprecated This is a legacy alias of `onanimationstart`.", + "Fires immediately after the browser loads the object.", + " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationstart_event)" - ], - "tags": { - "@deprecated": "This is a legacy alias of" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/SVGElement/load_event)" + ] }, "typeValue": { "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" @@ -31532,17 +31712,15 @@ "required": false }, { - "uid": "onwebkittransitionend", - "name": "onwebkittransitionend", + "uid": "onloadeddata", + "name": "onloadeddata", "comment": { "raw": [ - "@deprecated This is a legacy alias of `ontransitionend`.", + "Occurs when media data is loaded at the current playback position.", + " @param ev The event.", "", - " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionend_event)" - ], - "tags": { - "@deprecated": "This is a legacy alias of" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadeddata_event)" + ] }, "typeValue": { "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" @@ -31554,15 +31732,18 @@ "required": false }, { - "uid": "onwheel", - "name": "onwheel", + "uid": "onloadedmetadata", + "name": "onloadedmetadata", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/wheel_event)" + "Occurs when the duration and dimensions of the media have been determined.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadedmetadata_event)" ] }, "typeValue": { - "raw": "null | (this: GlobalEventHandlers, ev: WheelEvent) => any" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" @@ -31571,1712 +31752,1055 @@ "required": false }, { - "uid": "autofocus", - "name": "autofocus", + "uid": "onloadstart", + "name": "onloadstart", + "comment": { + "raw": [ + "Occurs when Internet Explorer begins looking for media data.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/loadstart_event)" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "dataset", - "name": "dataset", + "uid": "onlostpointercapture", + "name": "onlostpointercapture", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dataset)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/lostpointercapture_event)" ] }, "typeValue": { - "raw": "DOMStringMap" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "nonce", - "name": "nonce", + "uid": "onmousedown", + "name": "onmousedown", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/nonce)" + "Fires when the user clicks the object with either mouse button.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mousedown_event)" ] }, "typeValue": { - "raw": "string" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { - "type": "string" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "onmouseenter", + "name": "onmouseenter", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/tabIndex)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseenter_event)" ] }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "blur", - "name": "blur", + "uid": "onmouseleave", + "name": "onmouseleave", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/blur)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseleave_event)" ] }, "typeValue": { - "raw": "() => void" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "focus", - "name": "focus", + "uid": "onmousemove", + "name": "onmousemove", "comment": { "raw": [ - "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/focus)" + "Fires when the user moves the mouse over the object.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mousemove_event)" ] }, "typeValue": { - "raw": "(options?: FocusOptions | undefined) => void" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { "type": "func" }, - "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:PickerInputSearchPosition": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerInputSearchPosition", - "nameFull": "PickerInputSearchPosition" - }, - "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "Options for positioning the search input within PickerInput." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'body' | 'input' | 'none'", - "print": [ - "/**", - " * Options for positioning the search input within PickerInput.", - " */", - "type PickerInputSearchPosition = 'input' | 'body' | 'none';" - ] - } - } - }, - "@epam/uui-core:PickerShowSelectedOnly": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerShowSelectedOnly", - "nameFull": "PickerShowSelectedOnly" - }, - "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "Show selected rows only in Picker." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "PickerShowSelectedOnly", - "print": [ - "/**", - " * Show selected rows only in Picker.", - " */", - "interface PickerShowSelectedOnly {", - " /**", - " * Enables/disables selected rows only in Picker.", - " */", - " showSelectedOnly?: boolean;", - "}" - ] - }, - "props": [ + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false + }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "onmouseout", + "name": "onmouseout", "comment": { "raw": [ - "Enables/disables selected rows only in Picker." + "Fires when the user moves the mouse pointer outside the boundaries of the object.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseout_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:Position": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "Position", - "nameFull": "Position" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Position an item should be placed to." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'top' | 'bottom' | 'initial' | { after: TId; }", - "print": [ - "/**", - " * Position an item should be placed to.", - " */", - "type Position = PositionType | {", - " after: TId;", - "};" - ] - } - } - }, - "@epam/uui-core:PositionType": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PositionType", - "nameFull": "PositionType" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Type of the position an item to be placed to." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'top' | 'bottom' | 'initial'", - "print": [ - "/**", - " * Type of the position an item to be placed to.", - " */", - "type PositionType = 'initial' | 'top' | 'bottom';" - ] - } - } - }, - "@epam/uui-core:ProcessRequestMethod": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ProcessRequestMethod", - "nameFull": "ProcessRequestMethod" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "string & {} | 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE'", - "print": [ - "/*", - " Inspired by: https://stackoverflow.com/a/74376991", - " Provides suggestions for some request methods (to avoid typos) while allowing to assign any string.", - "*/", - "type ProcessRequestMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE' | string & {};" - ] - } - } - }, - "@epam/uui-core:RecordStatus": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RecordStatus", - "nameFull": "RecordStatus" - }, - "src": "uui-core/src/data/processing/views/tree/types.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "typeof NOT_FOUND_RECORD | typeof PENDING_RECORD | typeof LOADING_RECORD | typeof LOADED_RECORD | typeof FAILED_RECORD", - "print": [ - "type RecordStatus = typeof PENDING_RECORD | typeof LOADING_RECORD | typeof LOADED_RECORD | typeof NOT_FOUND_RECORD | typeof FAILED_RECORD;" - ] - } - } - }, - "@epam/uui-core:RenderCellProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RenderCellProps", - "nameFull": "RenderCellProps" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "RenderCellProps", - "print": [ - "interface RenderCellProps extends DataTableCellOptions {", - " /**", - " * Lens instance, wrapping IEditable on the row, to help binding to row's value.", - " * E.g. ", - " */", - " rowLens: ILens;", - " /**", - " * Drag'n'drop marker event handlers.", - " */", - " eventHandlers?: DndEventHandlers;", - "}" - ] - }, - "props": [ + }, { - "uid": "rowLens", - "name": "rowLens", + "uid": "onmouseover", + "name": "onmouseover", "comment": { "raw": [ - "Lens instance, wrapping IEditable on the row, to help binding to row's value.", - " E.g. " + "Fires when the user moves the mouse pointer into the object.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseover_event)" ] }, "typeValue": { - "raw": "ILens" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" }, - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "eventHandlers", - "name": "eventHandlers", + "uid": "onmouseup", + "name": "onmouseup", "comment": { "raw": [ - "Drag'n'drop marker event handlers." + "Fires when the user releases a mouse button while the mouse is over the object.", + " @param ev The mouse event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/mouseup_event)" ] }, "typeValue": { - "raw": "DndEventHandlers" + "raw": "null | (this: GlobalEventHandlers, ev: MouseEvent) => any" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "key", - "name": "key", + "uid": "onpaste", + "name": "onpaste", "comment": { "raw": [ - "Key to use as component's key" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/paste_event)" ] }, "typeValue": { - "raw": "string" + "raw": "null | (this: GlobalEventHandlers, ev: ClipboardEvent) => any" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "onpause", + "name": "onpause", "comment": { "raw": [ - "DataTableRowsProps object for the table row the cell is at" + "Occurs when playback is paused.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/pause_event)" ] }, "typeValue": { - "raw": "DataTableRowProps" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "column", - "name": "column", + "uid": "onplay", + "name": "onplay", "comment": { "raw": [ - "DataColumnProps object for the column the cell is at" + "Occurs when the play method is requested.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/play_event)" ] }, "typeValue": { - "raw": "DataColumnProps" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "index", - "name": "index", + "uid": "onplaying", + "name": "onplaying", "comment": { "raw": [ - "Column index in table" + "Occurs when the audio or video has started playing.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/playing_event)" ] }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isFirstColumn", - "name": "isFirstColumn", + "uid": "onpointercancel", + "name": "onpointercancel", "comment": { "raw": [ - "True if the cell is in the first column" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointercancel_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "isLastColumn", - "name": "isLastColumn", + "uid": "onpointerdown", + "name": "onpointerdown", "comment": { "raw": [ - "True if the cell is in the last column" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerdown_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "onpointerenter", + "name": "onpointerenter", "comment": { "raw": [ - "HTML tabIndex attribute to set on the cell" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerenter_event)" ] }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:RenderEditorProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RenderEditorProps", - "nameFull": "RenderEditorProps" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "RenderEditorProps", - "print": [ - "interface RenderEditorProps extends IEditable, IHasValidationMessage, ICanFocus {", - " /** DataRowProps object of rendered row */", - " rowProps: DataRowProps;", - " /** Cell mode signal the editor component to adapt it's visuals to cell editor */", - " mode: 'cell';", - " /** Ref to pass to the editor component.", - " * It's required for correct focus/blur behavior.", - " * */", - " ref?: ForwardedRef;", - "}" - ] - }, - "props": [ + }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "onpointerleave", + "name": "onpointerleave", "comment": { "raw": [ - "DataRowProps object of rendered row" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerleave_event)" ] }, "typeValue": { - "raw": "DataRowProps" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, - "typeValueRef": "@epam/uui-core:DataRowProps", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "mode", - "name": "mode", + "uid": "onpointermove", + "name": "onpointermove", "comment": { "raw": [ - "Cell mode signal the editor component to adapt it's visuals to cell editor" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointermove_event)" ] }, "typeValue": { - "raw": "'cell'" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "oneOf", - "options": [ - "cell" - ] + "type": "func" }, - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "onpointerout", + "name": "onpointerout", "comment": { "raw": [ - "Ref to pass to the editor component.", - " It's required for correct focus/blur behavior." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerout_event)" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" + }, + "editor": { + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "onpointerover", + "name": "onpointerover", "comment": { "raw": [ - "True if component contains invalid input" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerover_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "onpointerup", + "name": "onpointerup", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/pointerup_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: PointerEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "onprogress", + "name": "onprogress", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Occurs to indicate progress while downloading media data.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/progress_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: ProgressEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "onratechange", + "name": "onratechange", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Occurs when the playback rate is increased or decreased.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/ratechange_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "value", - "name": "value", + "uid": "onreset", + "name": "onreset", "comment": { "raw": [ - "The current value of component" + "Fires when the user resets a form.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/reset_event)" ] }, "typeValue": { - "raw": "TCellValue" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "onresize", + "name": "onresize", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLVideoElement/resize_event)" ] }, "typeValue": { - "raw": "(newValue: TCellValue) => void" + "raw": "null | (this: GlobalEventHandlers, ev: UIEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "onscroll", + "name": "onscroll", "comment": { "raw": [ - "Message describing why the value is invalid" + "Fires when the user repositions the scroll box in the scroll bar on the object.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/scroll_event)" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "onscrollend", + "name": "onscrollend", "comment": { "raw": [ - "Called when component gets input focus" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/scrollend_event)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "onsecuritypolicyviolation", + "name": "onsecuritypolicyviolation", "comment": { "raw": [ - "Called when component looses input focus" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/securitypolicyviolation_event)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "null | (this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ScrollAlign": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ScrollAlign", - "nameFull": "ScrollAlign" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'top' | 'nearest'", - "print": [ - "type ScrollAlign = 'top' | 'nearest';" - ] - } - } - }, - "@epam/uui-core:ScrollToConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ScrollToConfig", - "nameFull": "ScrollToConfig" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Holds configuration of the force scrolling behavior." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ScrollToConfig", - "print": [ - "/**", - " * Holds configuration of the force scrolling behavior.", - " */", - "interface ScrollToConfig {", - " /** Index of the row to be scrolled to. */", - " index?: number;", - " /** Scrolling movement behavior. */", - " behavior?: ScrollBehavior;", - " /** Alignment behavior. This property specifies, to which position a row with an index should be scrolled to.", - " * @default 'top'", - " *", - " * If `nearest` is specified, a list will be scrolled to a row in the nearest position only if row is not visible.", - " * If a row is closer to the bottom, the list will be scrolled to the row in the bottom position of a scroll container.", - " * If closer to the top, will be scrolled to the row in the top position.", - " *", - " * If `top` is specified, scrolling a list to a row to the top part of the container will happen in any case.", - " */", - " align?: ScrollAlign;", - "}" - ] - }, - "props": [ + }, { - "uid": "index", - "name": "index", + "uid": "onseeked", + "name": "onseeked", "comment": { "raw": [ - "Index of the row to be scrolled to." + "Occurs when the seek operation ends.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/seeked_event)" ] }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "number" + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "behavior", - "name": "behavior", + "uid": "onseeking", + "name": "onseeking", "comment": { "raw": [ - "Scrolling movement behavior." + "Occurs when the current playback position is moved.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/seeking_event)" ] }, "typeValue": { - "raw": "'auto' | 'instant' | 'smooth'" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "oneOf", - "options": [ - "auto", - "instant", - "smooth" - ] + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "align", - "name": "align", + "uid": "onselect", + "name": "onselect", "comment": { "raw": [ - "Alignment behavior. This property specifies, to which position a row with an index should be scrolled to.", - " @default 'top'", - "", - " If `nearest` is specified, a list will be scrolled to a row in the nearest position only if row is not visible.", - " If a row is closer to the bottom, the list will be scrolled to the row in the bottom position of a scroll container.", - " If closer to the top, will be scrolled to the row in the top position.", + "Fires when the current selection changes.", + " @param ev The event.", "", - " If `top` is specified, scrolling a list to a row to the top part of the container will happen in any case." - ], - "tags": { - "@default": "top" - } + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLInputElement/select_event)" + ] }, "typeValue": { - "raw": "'top' | 'nearest'" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "oneOf", - "options": [ - "top", - "nearest" - ] + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:SearchConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SearchConfig", - "nameFull": "SearchConfig" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "SearchConfig", - "print": [ - "interface SearchConfig {", - " /**", - " * A pure function that gets search value for each item.", - " * @default (item) => item.name.", - " */", - " getSearchFields?(item: TItem): string[];", - " /**", - " * Enables sorting of search results by relevance.", - " * - The highest priority has records, which have a full match with a search keyword.", - " * - The lower one has records, which have a search keyword at the 0 position, but not the full match.", - " * - Then, records, which contain a search keyword as a separate word, but not at the beginning.", - " * - And the lowest one - any other match of the search keyword.", - " *", - " * Example:", - " * - `search`: 'some'", - " * - `record string`: 'some word', `rank` = 4", - " * - `record string`: 'someone', `rank` = 3", - " * - `record string`: 'I know some guy', `rank` = 2", - " * - `record string`: 'awesome', `rank` = 1", - " *", - " * @default true", - " */", - " sortSearchByRelevance?: boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "onselectionchange", + "name": "onselectionchange", "comment": { "raw": [ - "A pure function that gets search value for each item.", - " @default (item) => item.name." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Document/selectionchange_event)" ] }, "typeValue": { - "raw": "(item: TItem) => string[]" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "sortSearchByRelevance", - "name": "sortSearchByRelevance", + "uid": "onselectstart", + "name": "onselectstart", "comment": { "raw": [ - "Enables sorting of search results by relevance.", - " - The highest priority has records, which have a full match with a search keyword.", - " - The lower one has records, which have a search keyword at the 0 position, but not the full match.", - " - Then, records, which contain a search keyword as a separate word, but not at the beginning.", - " - And the lowest one - any other match of the search keyword.", - "", - " Example:", - " - `search`: 'some'", - " - `record string`: 'some word', `rank` = 4", - " - `record string`: 'someone', `rank` = 3", - " - `record string`: 'I know some guy', `rank` = 2", - " - `record string`: 'awesome', `rank` = 1", - "", - " @default true" - ], - "tags": { - "@default": true - } + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Node/selectstart_event)" + ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:SetDataSourceState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SetDataSourceState", - "nameFull": "SetDataSourceState" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "DataSource state update handler." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "SetDataSourceState", - "print": [ - "/**", - " * DataSource state update handler.", - " */", - "type SetDataSourceState, TId = any> = (updateState: (prevState: DataSourceState) => DataSourceState) => void;" - ] - } - } - }, - "@epam/uui-core:SinglePickerProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SinglePickerProps", - "nameFull": "SinglePickerProps" - }, - "src": "uui-core/src/types/pickers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "{ selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable | { selectionMode: 'single'; valueType: 'entity'; } & IEditable", - "print": [ - "type SinglePickerProps = ({", - " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", - " selectionMode: 'single';", - " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", - " valueType?: 'id';", - "} & IEditable) | ({", - " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", - " selectionMode: 'single';", - " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", - " valueType: 'entity';", - "} & IEditable);" - ] - }, - "props": [ + }, { - "uid": "selectionMode", - "name": "selectionMode", + "uid": "onslotchange", + "name": "onslotchange", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLSlotElement/slotchange_event)" ] }, "typeValue": { - "raw": "'single'" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "oneOf", - "options": [ - "single" - ] + "type": "func" }, - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "valueType", - "name": "valueType", + "uid": "onstalled", + "name": "onstalled", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "Occurs when the download has stopped.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/stalled_event)" ] }, "typeValue": { - "raw": "'id'" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "oneOf", - "options": [ - "id" - ] + "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "onsubmit", + "name": "onsubmit", "comment": { "raw": [ - "True if component contains invalid input" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLFormElement/submit_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: SubmitEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "onsuspend", + "name": "onsuspend", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Occurs if the load operation has been intentionally halted.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/suspend_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "ontimeupdate", + "name": "ontimeupdate", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Occurs to indicate the current playback position.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/timeupdate_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "ontoggle", + "name": "ontoggle", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLDetailsElement/toggle_event)" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "value", - "name": "value", + "uid": "ontouchcancel", + "name": "ontouchcancel", "comment": { "raw": [ - "The current value of component" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchcancel_event)" ] }, "typeValue": { - "raw": "TId" + "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "ontouchend", + "name": "ontouchend", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchend_event)" ] }, "typeValue": { - "raw": "(newValue: TId) => void" + "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "valueType_2", - "name": "valueType", + "uid": "ontouchmove", + "name": "ontouchmove", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchmove_event)" ] }, "typeValue": { - "raw": "'entity'" + "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" }, "editor": { - "type": "oneOf", - "options": [ - "entity" - ] + "type": "func" }, - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "value_2", - "name": "value", + "uid": "ontouchstart", + "name": "ontouchstart", "comment": { "raw": [ - "The current value of component" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/touchstart_event)" ] }, "typeValue": { - "raw": "TItem" + "raw": "null | (this: GlobalEventHandlers, ev: TouchEvent) => any" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "onValueChange_2", - "name": "onValueChange", + "uid": "ontransitioncancel", + "name": "ontransitioncancel", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitioncancel_event)" ] }, "typeValue": { - "raw": "(newValue: TItem) => void" + "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true - } - ], - "propsFromUnion": true - } - }, - "@epam/uui-core:SortConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SortConfig", - "nameFull": "SortConfig" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "SortConfig", - "print": [ - "interface SortConfig {", - " /**", - " * A pure function that gets sorting value for current sorting value", - " */", - " sortBy?(item: TItem, sorting: SortingOption): any;", - "}" - ] - }, - "props": [ + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false + }, { - "uid": "sortBy", - "name": "sortBy", + "uid": "ontransitionend", + "name": "ontransitionend", "comment": { "raw": [ - "A pure function that gets sorting value for current sorting value" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionend_event)" ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" + "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" }, "editor": { "type": "func" }, + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:SortDirection": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SortDirection", - "nameFull": "SortDirection" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'asc' | 'desc'", - "print": [ - "type SortDirection = 'asc' | 'desc';" - ] - } - } - }, - "@epam/uui-core:SortedPatchByParentId": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SortedPatchByParentId", - "nameFull": "SortedPatchByParentId" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "SortedPatchByParentId", - "print": [ - "type SortedPatchByParentId = IMap;", - " newItems: TItem[];", - "}>;" - ] - }, - "props": [ - { - "uid": "constructor", - "name": "constructor", - "comment": { - "raw": [ - "Must implement multiple constructors:", - " - constructor with empty arguments or initial data (optional);", - " - constructor, which accepts an argument of IMap type and clones its value (mandatory)." - ] - }, - "typeValue": { - "raw": "Function" - }, - "from": "@epam/uui-core:IMap", - "required": true - }, - { - "uid": "get", - "name": "get", - "typeValue": { - "raw": "(key: TId) => { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; } | undefined" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IMap", - "required": true }, { - "uid": "set", - "name": "set", + "uid": "ontransitionrun", + "name": "ontransitionrun", "comment": { "raw": [ - "Should set data to the existing map. This operation is mutable.", - " @param key - key of a map.", - " @param value - value, to be set into a map, using the key." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionrun_event)" ] }, "typeValue": { - "raw": "(key: TId, value?: { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; } | undefined) => IMap; newItems: TItem[]; }>" + "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IMap", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "delete", - "name": "delete", + "uid": "ontransitionstart", + "name": "ontransitionstart", "comment": { "raw": [ - "Should delete an element, located in a map by key. This operation is mutable.", - " @param key" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionstart_event)" ] }, "typeValue": { - "raw": "(key: TId) => boolean" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IMap", - "required": true - }, - { - "uid": "has", - "name": "has", - "typeValue": { - "raw": "(key: TId) => boolean" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IMap", - "required": true - }, - { - "uid": "size", - "name": "size", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-core:IMap", - "required": true - }, - { - "uid": "[Symbol.iterator]", - "name": "[Symbol.iterator]", - "typeValue": { - "raw": "() => IterableIterator<[TId, { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; }]>" + "raw": "null | (this: GlobalEventHandlers, ev: TransitionEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IMap", - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:SortingOption": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SortingOption", - "nameFull": "SortingOption" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "SortingOption", - "print": [ - "interface SortingOption {", - " /** Field of sorted entity under which sorting is performed */", - " field: keyof T;", - " /** Direction of a sorting */", - " direction?: SortDirection;", - "}" - ] - }, - "props": [ - { - "uid": "field", - "name": "field", - "comment": { - "raw": [ - "Field of sorted entity under which sorting is performed" - ] - }, - "typeValue": { - "raw": "keyof T" - }, - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "direction", - "name": "direction", + "uid": "onvolumechange", + "name": "onvolumechange", "comment": { "raw": [ - "Direction of a sorting" + "Occurs when the volume is changed, or playback is muted or unmuted.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/volumechange_event)" ] }, "typeValue": { - "raw": "'asc' | 'desc'" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "oneOf", - "options": [ - "asc", - "desc" - ] - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:SpinnerCoreProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SpinnerCoreProps", - "nameFull": "SpinnerCoreProps" - }, - "src": "uui-core/src/types/components/Spinner.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "SpinnerCoreProps", - "print": [ - "interface SpinnerCoreProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", - "}" - ] - }, - "props": [ - { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, - "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" - }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false - }, - { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, - "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "type": "func" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", - "comment": { - "raw": [ - "this ref is passed to the underlying component" - ] - }, - "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" - }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:TableFiltersConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "TableFiltersConfig", - "nameFull": "TableFiltersConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig", - "print": [ - "type TableFiltersConfig = PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig;" - ] - }, - "props": [ - { - "uid": "title", - "name": "title", + "uid": "onwaiting", + "name": "onwaiting", "comment": { "raw": [ - "Title of the filter, displayed in filter toggler and filter body" + "Occurs when playback stops because the next frame of a video resource is not available.", + " @param ev The event.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLMediaElement/waiting_event)" ] }, "typeValue": { - "raw": "string" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "string" - }, - "from": "@epam/uui-core:FilterConfigBase", - "required": true - }, - { - "uid": "field", - "name": "field", - "comment": { - "raw": [ - "Field of filters object, where store the filter value" - ] - }, - "typeValue": { - "raw": "keyof TFilter" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": true + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", + "required": false }, { - "uid": "columnKey", - "name": "columnKey", + "uid": "onwebkitanimationend", + "name": "onwebkitanimationend", "comment": { "raw": [ - "Key of the column to which the filter is attached.", - " If omitted, filter won't be attached to the column." - ] + "@deprecated This is a legacy alias of `onanimationend`.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationend_event)" + ], + "tags": { + "@deprecated": "This is a legacy alias of" + } }, "typeValue": { - "raw": "string" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "isAlwaysVisible", - "name": "isAlwaysVisible", + "uid": "onwebkitanimationiteration", + "name": "onwebkitanimationiteration", "comment": { "raw": [ - "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" - ] + "@deprecated This is a legacy alias of `onanimationiteration`.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationiteration_event)" + ], + "tags": { + "@deprecated": "This is a legacy alias of" + } }, "typeValue": { - "raw": "boolean" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false - }, - { - "uid": "predicates", - "name": "predicates", - "comment": { - "raw": [ - "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." - ] - }, - "typeValue": { - "raw": "IFilterPredicate[]" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "maxCount", - "name": "maxCount", + "uid": "onwebkitanimationstart", + "name": "onwebkitanimationstart", "comment": { "raw": [ - "Count of words to show in the Filter toggler. By default, 2 item will be shown." - ] + "@deprecated This is a legacy alias of `onanimationstart`.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animationstart_event)" + ], + "tags": { + "@deprecated": "This is a legacy alias of" + } }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "togglerWidth", - "name": "togglerWidth", + "uid": "onwebkittransitionend", + "name": "onwebkittransitionend", "comment": { "raw": [ - "Defines maxWidth of the filter toggler" - ] + "@deprecated This is a legacy alias of `ontransitionend`.", + "", + " [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/transitionend_event)" + ], + "tags": { + "@deprecated": "This is a legacy alias of" + } }, "typeValue": { - "raw": "number" + "raw": "null | (this: GlobalEventHandlers, ev: Event) => any" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "dataSource", - "name": "dataSource", - "comment": { - "raw": [ - "Datasource to get data for the picker" - ] - }, - "typeValue": { - "raw": "IDataSource" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": true - }, - { - "uid": "getName", - "name": "getName", + "uid": "onwheel", + "name": "onwheel", "comment": { "raw": [ - "A pure function that gets entity name from entity object.", - " Default: (item) => item.name." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/wheel_event)" ] }, "typeValue": { - "raw": "(item: any) => string" + "raw": "null | (this: GlobalEventHandlers, ev: WheelEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "node_modules/typescript/lib/lib.dom.d.ts:GlobalEventHandlers", "required": false }, { - "uid": "renderRow", - "name": "renderRow", - "comment": { - "raw": [ - "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." - ] - }, + "uid": "autofocus", + "name": "autofocus", "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", + "required": true }, { - "uid": "type", - "name": "type", + "uid": "dataset", + "name": "dataset", "comment": { "raw": [ - "Type of the filter" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/dataset)" ] }, "typeValue": { - "raw": "'singlePicker' | 'multiPicker'" - }, - "editor": { - "type": "oneOf", - "options": [ - "singlePicker", - "multiPicker" - ] + "raw": "DOMStringMap" }, - "from": "@epam/uui-core:PickerFilterConfig", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", "required": true }, { - "uid": "showSearch", - "name": "showSearch", + "uid": "nonce", + "name": "nonce", "comment": { "raw": [ - "Pass false to hide search in picker body.", - " If omitted, true value will be used." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/nonce)" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:PickerFilterConfig", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", "required": false }, { - "uid": "maxBodyHeight", - "name": "maxBodyHeight", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/tabIndex)" ] }, "typeValue": { @@ -33285,272 +32809,431 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:PickerFilterConfig", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", + "required": true }, { - "uid": "highlightSearchMatches", - "name": "highlightSearchMatches", + "uid": "blur", + "name": "blur", "comment": { "raw": [ - "Enables highlighting of the items' text with search-matching results." + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/blur)" ] }, "typeValue": { - "raw": "boolean" + "raw": "() => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:PickerFilterConfig", - "required": false + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", + "required": true }, { - "uid": "filter", - "name": "filter", + "uid": "focus", + "name": "focus", "comment": { "raw": [ - "Filter selectable days. Days, for which this callback returns false - will be disabled" + "[MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLElement/focus)" ] }, "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "(options?: FocusOptions | undefined) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:CommonDatePickerProps", - "required": false - }, - { - "uid": "format", - "name": "format", + "from": "node_modules/typescript/lib/lib.dom.d.ts:HTMLOrSVGElement", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:PickerInputSearchPosition": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerInputSearchPosition", + "nameFull": "PickerInputSearchPosition" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "Options for positioning the search input within PickerInput." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'input' | 'body' | 'none'", + "print": [ + "/**", + " * Options for positioning the search input within PickerInput.", + " */", + "type PickerInputSearchPosition = 'input' | 'body' | 'none';" + ] + } + } + }, + "@epam/uui-core:Position": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "Position", + "nameFull": "Position" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Position an item should be placed to." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'top' | 'bottom' | 'initial' | { after: TId; }", + "print": [ + "/**", + " * Position an item should be placed to.", + " */", + "type Position = PositionType | {", + " after: TId;", + "};" + ] + } + } + }, + "@epam/uui-core:PositionType": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PositionType", + "nameFull": "PositionType" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Type of the position an item to be placed to." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'top' | 'bottom' | 'initial'", + "print": [ + "/**", + " * Type of the position an item to be placed to.", + " */", + "type PositionType = 'initial' | 'top' | 'bottom';" + ] + } + } + }, + "@epam/uui-core:ProcessRequestMethod": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ProcessRequestMethod", + "nameFull": "ProcessRequestMethod" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "string & {} | 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE'", + "print": [ + "/*", + " Inspired by: https://stackoverflow.com/a/74376991", + " Provides suggestions for some request methods (to avoid typos) while allowing to assign any string.", + "*/", + "type ProcessRequestMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE' | string & {};" + ] + } + } + }, + "@epam/uui-core:RecordStatus": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RecordStatus", + "nameFull": "RecordStatus" + }, + "src": "uui-core/src/data/processing/views/tree/types.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "typeof NOT_FOUND_RECORD | typeof PENDING_RECORD | typeof LOADING_RECORD | typeof LOADED_RECORD | typeof FAILED_RECORD", + "print": [ + "type RecordStatus = typeof PENDING_RECORD | typeof LOADING_RECORD | typeof LOADED_RECORD | typeof NOT_FOUND_RECORD | typeof FAILED_RECORD;" + ] + } + } + }, + "@epam/uui-core:RenderCellProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RenderCellProps", + "nameFull": "RenderCellProps" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "RenderCellProps", + "print": [ + "interface RenderCellProps extends DataTableCellOptions {", + " /**", + " * Lens instance, wrapping IEditable on the row, to help binding to row's value.", + " * E.g. ", + " */", + " rowLens: ILens;", + " /**", + " * Drag'n'drop marker event handlers.", + " */", + " eventHandlers?: DndEventHandlers;", + "}" + ] + }, + "props": [ + { + "uid": "rowLens", + "name": "rowLens", "comment": { "raw": [ - "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + "Lens instance, wrapping IEditable on the row, to help binding to row's value.", + " E.g. " ] }, "typeValue": { - "raw": "string" + "raw": "ILens" }, - "editor": { - "type": "string" + "required": true + }, + { + "uid": "eventHandlers", + "name": "eventHandlers", + "comment": { + "raw": [ + "Drag'n'drop marker event handlers." + ] + }, + "typeValue": { + "raw": "DndEventHandlers" }, - "from": "@epam/uui-core:CommonDatePickerProps", "required": false }, { - "uid": "type_2", - "name": "type", + "uid": "key", + "name": "key", "comment": { "raw": [ - "Type of the filter" + "Key to use as component's key" ] }, "typeValue": { - "raw": "'datePicker'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "datePicker" - ] + "type": "string" }, - "from": "@epam/uui-core:DatePickerFilterConfig", + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "type_3", - "name": "type", + "uid": "rowProps", + "name": "rowProps", "comment": { "raw": [ - "Type of the filter" + "DataTableRowsProps object for the table row the cell is at" ] }, "typeValue": { - "raw": "'numeric'" + "raw": "DataTableRowProps" }, - "editor": { - "type": "oneOf", - "options": [ - "numeric" + "from": "@epam/uui-core:DataTableCellOptions", + "required": true + }, + { + "uid": "column", + "name": "column", + "comment": { + "raw": [ + "DataColumnProps object for the column the cell is at" ] }, - "from": "@epam/uui-core:NumericFilterConfig", + "typeValue": { + "raw": "DataColumnProps" + }, + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "type_4", - "name": "type", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Type of the filter" + "Column index in table" ] }, "typeValue": { - "raw": "'rangeDatePicker'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "rangeDatePicker" - ] + "type": "number" }, - "from": "@epam/uui-core:RangeDatePickerFilterConfig", - "required": true + "from": "@epam/uui-core:DataTableCellOptions", + "required": false }, { - "uid": "type_5", - "name": "type", + "uid": "isFirstColumn", + "name": "isFirstColumn", "comment": { "raw": [ - "Type of the filter" + "True if the cell is in the first column" ] }, "typeValue": { - "raw": "'custom'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "custom" - ] + "type": "bool" }, - "from": "@epam/uui-core:CustomFilterConfig", + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "render", - "name": "render", + "uid": "isLastColumn", + "name": "isLastColumn", "comment": { "raw": [ - "Render callback for filter body" + "True if the cell is in the last column" ] }, "typeValue": { - "raw": "(props: IFilterItemBodyProps) => React.ReactElement>" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-core:CustomFilterConfig", + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "getTogglerValue", - "name": "getTogglerValue", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "A pure function that gets value to display in filter toggler" + "HTML tabIndex attribute to set on the cell" ] }, "typeValue": { - "raw": "(props: IFilterItemBodyProps) => React.ReactNode" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, - "from": "@epam/uui-core:CustomFilterConfig", - "required": true + "from": "@epam/uui-core:DataTableCellOptions", + "required": false } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-core:TextInputCoreProps": { + "@epam/uui-core:RenderEditorProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "TextInputCoreProps", - "nameFull": "TextInputCoreProps" + "name": "RenderEditorProps", + "nameFull": "RenderEditorProps" }, - "src": "uui-core/src/types/components/TextInput.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "TextInputCoreProps", + "raw": "RenderEditorProps", "print": [ - "interface TextInputCoreProps extends IHasCX, IClickable, IDisableable, IEditable, IHasPlaceholder, IHasIcon, ICanBeReadonly, IDropdownToggler, IAnalyticableOnChange, IHasRawProps>, ICanFocus, IHasTabIndex {", - " /** Enables cancel (cross) icon, and fires when the icon is clicked */", - " onCancel?(): void;", - " /** Enables accept (check) icon, and fires when the icon is clicked */", - " onAccept?(): void;", - " /** keydown event handler to put on the HTML input element */", - " onKeyDown?(e?: React.KeyboardEvent): void;", - " /** Put focus on the element, when component is mounted */", - " autoFocus?: boolean;", - " /** Standard 'type' attribute to put on the HTML input element (e.g. 'password') */", - " type?: string;", - " /** Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp} */", - " autoComplete?: string;", - " /** Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp} */", - " name?: string;", - " /** Maximum input length in characters */", - " maxLength?: number;", - " /** Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode} */", - " inputMode?: React.InputHTMLAttributes['inputMode'];", - " /** HTML ID attribute for input */", - " id?: string;", + "interface RenderEditorProps extends IEditable, IHasValidationMessage, ICanFocus {", + " /** DataRowProps object of rendered row */", + " rowProps: DataRowProps;", + " /** Cell mode signal the editor component to adapt it's visuals to cell editor */", + " mode: 'cell';", + " /** Ref to pass to the editor component.", + " * It's required for correct focus/blur behavior.", + " * */", + " ref?: ForwardedRef;", "}" ] }, "props": [ { - "uid": "onCancel", - "name": "onCancel", + "uid": "rowProps", + "name": "rowProps", "comment": { "raw": [ - "Enables cancel (cross) icon, and fires when the icon is clicked" + "DataRowProps object of rendered row" ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "DataRowProps" }, - "required": false + "typeValueRef": "@epam/uui-core:DataRowProps", + "required": true }, { - "uid": "onAccept", - "name": "onAccept", + "uid": "mode", + "name": "mode", "comment": { "raw": [ - "Enables accept (check) icon, and fires when the icon is clicked" + "Cell mode signal the editor component to adapt it's visuals to cell editor" ] }, "typeValue": { - "raw": "() => void" + "raw": "'cell'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "cell" + ] }, - "required": false + "required": true }, { - "uid": "onKeyDown", - "name": "onKeyDown", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "keydown event handler to put on the HTML input element" + "Ref to pass to the editor component.", + " It's required for correct focus/blur behavior." ] }, "typeValue": { - "raw": "(e?: React.KeyboardEvent | undefined) => void" - }, - "editor": { - "type": "func" + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" }, "required": false }, { - "uid": "autoFocus", - "name": "autoFocus", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Put focus on the element, when component is mounted" + "True if component contains invalid input" ] }, "typeValue": { @@ -33559,323 +33242,490 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "type", - "name": "type", - "comment": { - "raw": [ - "Standard 'type' attribute to put on the HTML input element (e.g. 'password')" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "autoComplete", - "name": "autoComplete", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp}" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "name", - "name": "name", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp}" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "maxLength", - "name": "maxLength", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Maximum input length in characters" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "inputMode", - "name": "inputMode", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode}" + "The current value of component" ] }, "typeValue": { - "raw": "'search' | 'numeric' | 'text' | 'none' | 'tel' | 'url' | 'email' | 'decimal'" - }, - "editor": { - "type": "oneOf", - "options": [ - "search", - "numeric", - "text", - "none", - "tel", - "url", - "email", - "decimal" - ] + "raw": "TCellValue" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "id", - "name": "id", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "HTML ID attribute for input" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "string" + "raw": "(newValue: TCellValue) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "cx", - "name": "cx", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "React.ReactNode" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Called when component is clicked" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "(e: React.FocusEvent) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:ICanFocus", "required": false - }, - { - "uid": "isInvalid", - "name": "isInvalid", - "comment": { - "raw": [ - "True if component contains invalid input" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ScrollAlign": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ScrollAlign", + "nameFull": "ScrollAlign" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'top' | 'nearest'", + "print": [ + "type ScrollAlign = 'top' | 'nearest';" + ] + } + } + }, + "@epam/uui-core:ScrollToConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ScrollToConfig", + "nameFull": "ScrollToConfig" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Holds configuration of the force scrolling behavior." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ScrollToConfig", + "print": [ + "/**", + " * Holds configuration of the force scrolling behavior.", + " */", + "interface ScrollToConfig {", + " /** Index of the row to be scrolled to. */", + " index?: number;", + " /** Scrolling movement behavior. */", + " behavior?: ScrollBehavior;", + " /** Alignment behavior. This property specifies, to which position a row with an index should be scrolled to.", + " * @default 'top'", + " *", + " * If `nearest` is specified, a list will be scrolled to a row in the nearest position only if row is not visible.", + " * If a row is closer to the bottom, the list will be scrolled to the row in the bottom position of a scroll container.", + " * If closer to the top, will be scrolled to the row in the top position.", + " *", + " * If `top` is specified, scrolling a list to a row to the top part of the container will happen in any case.", + " */", + " align?: ScrollAlign;", + "}" + ] + }, + "props": [ { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Index of the row to be scrolled to." ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "behavior", + "name": "behavior", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Scrolling movement behavior." ] }, "typeValue": { - "raw": "boolean" + "raw": "'auto' | 'instant' | 'smooth'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "auto", + "instant", + "smooth" + ] }, - "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "value", - "name": "value", + "uid": "align", + "name": "align", "comment": { "raw": [ - "The current value of component" - ] + "Alignment behavior. This property specifies, to which position a row with an index should be scrolled to.", + " @default 'top'", + "", + " If `nearest` is specified, a list will be scrolled to a row in the nearest position only if row is not visible.", + " If a row is closer to the bottom, the list will be scrolled to the row in the bottom position of a scroll container.", + " If closer to the top, will be scrolled to the row in the top position.", + "", + " If `top` is specified, scrolling a list to a row to the top part of the container will happen in any case." + ], + "tags": { + "@default": "top" + } }, "typeValue": { - "raw": "string" + "raw": "'top' | 'nearest'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "top", + "nearest" + ] }, - "from": "@epam/uui-core:IControlled", - "required": true - }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:SearchConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SearchConfig", + "nameFull": "SearchConfig" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "SearchConfig", + "print": [ + "interface SearchConfig {", + " /**", + " * A pure function that gets search value for each item.", + " * @default (item) => item.name.", + " */", + " getSearchFields?(item: TItem): string[];", + " /**", + " * Enables sorting of search results by relevance.", + " * - The highest priority has records, which have a full match with a search keyword.", + " * - The lower one has records, which have a search keyword at the 0 position, but not the full match.", + " * - Then, records, which contain a search keyword as a separate word, but not at the beginning.", + " * - And the lowest one - any other match of the search keyword.", + " *", + " * Example:", + " * - `search`: 'some'", + " * - `record string`: 'some word', `rank` = 4", + " * - `record string`: 'someone', `rank` = 3", + " * - `record string`: 'I know some guy', `rank` = 2", + " * - `record string`: 'awesome', `rank` = 1", + " *", + " * @default true", + " */", + " sortSearchByRelevance?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "(newValue: string | undefined) => void" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", "comment": { "raw": [ - "Placeholder to display when empty" - ] + "Enables sorting of search results by relevance.", + " - The highest priority has records, which have a full match with a search keyword.", + " - The lower one has records, which have a search keyword at the 0 position, but not the full match.", + " - Then, records, which contain a search keyword as a separate word, but not at the beginning.", + " - And the lowest one - any other match of the search keyword.", + "", + " Example:", + " - `search`: 'some'", + " - `record string`: 'some word', `rank` = 4", + " - `record string`: 'someone', `rank` = 3", + " - `record string`: 'I know some guy', `rank` = 2", + " - `record string`: 'awesome', `rank` = 1", + "", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "any" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:IHasPlaceholder", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:SetDataSourceState": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SetDataSourceState", + "nameFull": "SetDataSourceState" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "DataSource state update handler." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "SetDataSourceState", + "print": [ + "/**", + " * DataSource state update handler.", + " */", + "type SetDataSourceState, TId = any> = (updateState: (prevState: DataSourceState) => DataSourceState) => void;" + ] + } + } + }, + "@epam/uui-core:SinglePickerProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SinglePickerProps", + "nameFull": "SinglePickerProps" + }, + "src": "uui-core/src/types/pickers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "{ selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable | { selectionMode: 'single'; valueType: 'entity'; } & IEditable", + "print": [ + "type SinglePickerProps = ({", + " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", + " selectionMode: 'single';", + " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", + " valueType?: 'id';", + "} & IEditable) | ({", + " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", + " selectionMode: 'single';", + " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", + " valueType: 'entity';", + "} & IEditable);" + ] + }, + "props": [ { - "uid": "icon", - "name": "icon", + "uid": "selectionMode", + "name": "selectionMode", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "Icon" + "raw": "'single'" }, "editor": { - "type": "component" + "type": "oneOf", + "options": [ + "single" + ] }, - "from": "@epam/uui-core:IHasIcon", - "required": false + "required": true }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "valueType", + "name": "valueType", "comment": { "raw": [ - "Position of the icon (left of right)" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "'right' | 'left'" + "raw": "'id'" }, "editor": { "type": "oneOf", "options": [ - "right", - "left" + "id" ] }, - "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "onIconClick", - "name": "onIconClick", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Click handler for the icon" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IHasIcon", + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -33884,15 +33734,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -33901,866 +33751,717 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Given a value, returns an analytics event to send when component is edited.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "The current value of component" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "TId" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Called when component gets input focus" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "(newValue: TId) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "valueType_2", + "name": "valueType", "comment": { "raw": [ - "Called when component looses input focus" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "'entity'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "entity" + ] }, - "from": "@epam/uui-core:ICanFocus", - "required": false + "required": true }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "The current value of component" ] }, "typeValue": { - "raw": "number" + "raw": "TItem" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange_2", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TItem) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IHasTabIndex", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:TooltipCoreProps": { + "@epam/uui-core:SortConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "TooltipCoreProps", - "nameFull": "TooltipCoreProps" + "name": "SortConfig", + "nameFull": "SortConfig" }, - "src": "uui-core/src/types/components/Tooltip.ts", + "src": "uui-core/src/types/dataSources.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "TooltipCoreProps", + "raw": "SortConfig", "print": [ - "interface TooltipCoreProps extends IHasCX, IHasChildren, IHasRawProps>, Partial>, Pick {", - " /** Content to show in the tooltip (ReactNode) */", - " content?: any;", - " /** Alternative to 'content' prop, you can pass a render function.", - " * The function will only be called when content is shown, this can save performance. */", - " renderContent?(): any;", - " /** See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/} */", - " offset?: Options['offset'];", - " /** React Node(s) to show tooltip for */", - " children?: React.ReactNode;", - " /** Max width of tooltip */", - " maxWidth?: number;", + "interface SortConfig {", + " /**", + " * A pure function that gets sorting value for current sorting value", + " */", + " sortBy?(item: TItem, sorting: SortingOption): any;", "}" ] }, "props": [ { - "uid": "content", - "name": "content", - "comment": { - "raw": [ - "Content to show in the tooltip (ReactNode)" - ] - }, - "typeValue": { - "raw": "any" - }, - "required": false - }, - { - "uid": "renderContent", - "name": "renderContent", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Alternative to 'content' prop, you can pass a render function.", - " The function will only be called when content is shown, this can save performance." + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "() => any" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { "type": "func" }, "required": false - }, - { - "uid": "offset", - "name": "offset", - "comment": { - "raw": [ - "See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/}" - ] - }, - "typeValue": { - "raw": "OffsetsFunction | [number | null | undefined, number | null | undefined]" - }, - "required": false - }, - { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "React Node(s) to show tooltip for" - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "required": false - }, - { - "uid": "maxWidth", - "name": "maxWidth", - "comment": { - "raw": [ - "Max width of tooltip" - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false - }, - { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, - "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" - }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false - }, - { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, - "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" - }, - "from": "@epam/uui-core:IHasRawProps", - "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:SortDirection": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SortDirection", + "nameFull": "SortDirection" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'asc' | 'desc'", + "print": [ + "type SortDirection = 'asc' | 'desc';" + ] + } + } + }, + "@epam/uui-core:SortedPatchByParentId": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SortedPatchByParentId", + "nameFull": "SortedPatchByParentId" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "SortedPatchByParentId", + "print": [ + "type SortedPatchByParentId = IMap;", + " newItems: TItem[];", + "}>;" + ] + }, + "props": [ { - "uid": "value", - "name": "value", + "uid": "constructor", + "name": "constructor", "comment": { "raw": [ - "The current value of component" + "Must implement multiple constructors:", + " - constructor with empty arguments or initial data (optional);", + " - constructor, which accepts an argument of IMap type and clones its value (mandatory)." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Function" }, - "from": "@epam/uui-core:IControlled", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "onValueChange", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, + "uid": "get", + "name": "get", "typeValue": { - "raw": "(newValue: boolean) => void" + "raw": "(key: TId) => { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; } | undefined" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "onClose", - "name": "onClose", + "uid": "set", + "name": "set", "comment": { "raw": [ - "Called when dropdown was closed" + "Should set data to the existing map. This operation is mutable.", + " @param key - key of a map.", + " @param value - value, to be set into a map, using the key." ] }, "typeValue": { - "raw": "() => void" + "raw": "(key: TId, value?: { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; } | undefined) => IMap; newItems: TItem[]; }>" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "placement", - "name": "placement", + "uid": "delete", + "name": "delete", "comment": { "raw": [ - "Defines dropdown body placement relative to target" + "Should delete an element, located in a map by key. This operation is mutable.", + " @param key" ] }, "typeValue": { - "raw": "'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'right' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "(key: TId) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "right", - "left", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] - }, - "from": "@epam/uui-core:DropdownProps", - "required": false - }, - { - "uid": "modifiers", - "name": "modifiers", - "comment": { - "raw": [ - "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" - ] - }, - "typeValue": { - "raw": "(StrictModifier | Partial>)[]" + "type": "func" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "openDelay", - "name": "openDelay", - "comment": { - "raw": [ - "Defines how much 'ms' user should hold mouse over target to open the dropdown", - " This prop work only with openOnHover={true}", - " @default 0" - ], - "tags": { - "@default": 0 - } - }, + "uid": "has", + "name": "has", "typeValue": { - "raw": "number" + "raw": "(key: TId) => boolean" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "closeDelay", - "name": "closeDelay", - "comment": { - "raw": [ - "Defines after which delay dropdown will be closed, if user leave mouse from target.", - " This prop work only with openOnHover={true}", - " @default 0" - ], - "tags": { - "@default": 0 - } - }, + "uid": "size", + "name": "size", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "closeOnMouseLeave", - "name": "closeOnMouseLeave", - "comment": { - "raw": [ - "Defined when to close dropdown in case of openOnHover={ true }", - " toggler — dropdown will be closed when a mouse leaves the target component", - " boundary — will not to close the dropdown when a mouse is on target or in 30px around target area", - " false — will not close dropdown by mouse move event", - " @default 'toggler'" - ], - "tags": { - "@default": "toggler" - } - }, + "uid": "[Symbol.iterator]", + "name": "[Symbol.iterator]", "typeValue": { - "raw": "false | 'toggler' | 'boundary'" + "raw": "() => IterableIterator<[TId, { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; }]>" }, "editor": { - "type": "oneOf", - "options": [ - false, - "toggler", - "boundary" - ] + "type": "func" }, - "from": "@epam/uui-core:DropdownProps", - "required": false - }, + "from": "@epam/uui-core:IMap", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:SortingOption": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SortingOption", + "nameFull": "SortingOption" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "SortingOption", + "print": [ + "interface SortingOption {", + " /** Field of sorted entity under which sorting is performed */", + " field: keyof T;", + " /** Direction of a sorting */", + " direction?: SortDirection;", + "}" + ] + }, + "props": [ { - "uid": "portalTarget", - "name": "portalTarget", + "uid": "field", + "name": "field", "comment": { "raw": [ - "Node of portal target, where to render the dropdown body.", - " By default, will be used global portal node." + "Field of sorted entity under which sorting is performed" ] }, "typeValue": { - "raw": "HTMLElement" + "raw": "keyof T" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "required": true }, { - "uid": "boundaryElement", - "name": "boundaryElement", + "uid": "direction", + "name": "direction", "comment": { "raw": [ - "Element relative to which dropdown will calculate position" + "Direction of a sorting" ] }, "typeValue": { - "raw": "HTMLElement | HTMLElement[] | 'clippingParents'" - }, - "from": "@epam/uui-core:DropdownProps", - "required": false - }, - { - "uid": "closeBodyOnTogglerHidden", - "name": "closeBodyOnTogglerHidden", - "comment": { - "raw": [ - "Pass false, if you do not want to close the dropdown in case Toggler move out of viewport.", - " @default true" - ], - "tags": { - "@default": true - } - }, - "typeValue": { - "raw": "boolean" + "raw": "'asc' | 'desc'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "asc", + "desc" + ] }, - "from": "@epam/uui-core:DropdownProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:UseCascadeSelectionServiceProps": { + "@epam/uui-core:SpinnerCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseCascadeSelectionServiceProps", - "nameFull": "UseCascadeSelectionServiceProps" - }, - "src": "uui-core/src/data/processing/views/dataRows/services/useCascadeSelectionService.ts", - "comment": { - "raw": [ - "Cascade selection service configuration." - ] + "name": "SpinnerCoreProps", + "nameFull": "SpinnerCoreProps" }, + "src": "uui-core/src/types/components/Spinner.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "UseCascadeSelectionServiceProps", + "raw": "SpinnerCoreProps", "print": [ - "/**", - " * Cascade selection service configuration.", - " */", - "interface UseCascadeSelectionServiceProps extends LoadMissingRecords {", - " /**", - " * Tree-like data, cascade selection should be performed on.", - " */", - " tree: ITree;", + "interface SpinnerCoreProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", "}" ] }, "props": [ { - "uid": "tree", - "name": "tree", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Tree-like data, cascade selection should be performed on." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "ITree" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "required": true + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "required": false }, { - "uid": "loadMissingRecordsOnCheck", - "name": "loadMissingRecordsOnCheck", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Loads missing records and provides a fulfilled tree.", - " @param id - id of an item, which is checked and records should be loaded for.", - " @param isChecked - checking status of the record.", - " @param isRoot - a flag, which marks if all records should be checked/unchecked.", - " @returns fulfilled tree with missing records, those required to be loaded for checking." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "editor": { - "type": "func" + "from": "@epam/uui-core:IHasRawProps", + "required": false + }, + { + "uid": "forwardedRef", + "name": "forwardedRef", + "comment": { + "raw": [ + "this ref is passed to the underlying component" + ] }, - "from": "@epam/uui-core:LoadMissingRecords", + "typeValue": { + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + }, + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:UseDataRowsProps": { + "@epam/uui-core:TableFiltersConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseDataRowsProps", - "nameFull": "UseDataRowsProps" - }, - "src": "uui-core/src/data/processing/views/dataRows/useDataRows.ts", - "comment": { - "raw": [ - "`useDataRows` configuration." - ] + "name": "TableFiltersConfig", + "nameFull": "TableFiltersConfig" }, + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "UseDataRowsProps", + "raw": "PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig", "print": [ - "/**", - " * `useDataRows` configuration.", - " */", - "interface UseDataRowsProps extends Omit, 'patch'>, ITreeLoadingState, Partial>, GetItemStatus {", - " /**", - " * Tree-like data, rows to be built from.", - " */", - " tree: ITree;", - "}" + "type TableFiltersConfig = PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig;" ] }, "props": [ { - "uid": "tree", - "name": "tree", + "uid": "title", + "name": "title", "comment": { "raw": [ - "Tree-like data, rows to be built from." + "Title of the filter, displayed in filter toggler and filter body" ] }, "typeValue": { - "raw": "ITree" + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "dataSourceState", - "name": "dataSourceState", + "uid": "field", + "name": "field", "comment": { "raw": [ - "State of the dataSource." + "Field of filters object, where store the filter value" ] }, "typeValue": { - "raw": "DataSourceState" + "raw": "keyof TFilter" }, - "from": "@epam/uui-core:CommonTreeConfig", + "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "setDataSourceState", - "name": "setDataSourceState", + "uid": "columnKey", + "name": "columnKey", "comment": { "raw": [ - "DataSource state update handler." + "Key of the column to which the filter is attached.", + " If omitted, filter won't be attached to the column." ] }, "typeValue": { - "raw": "SetDataSourceState" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:CommonTreeConfig", - "required": true + "from": "@epam/uui-core:FilterConfigBase", + "required": false }, { - "uid": "getId", - "name": "getId", + "uid": "isAlwaysVisible", + "name": "isAlwaysVisible", "comment": { "raw": [ - "Should return unique ID of the TItem", - " If omitted, we assume that every TItem has and unique id in its 'id' field.", - " @param item - record, which id should be returned.", - " @returns item id." + "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" ] }, "typeValue": { - "raw": "(item: TItem) => TId" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "predicates", + "name": "predicates", "comment": { "raw": [ - "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", - " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." + "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IFilterPredicate[]" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "getParentId", - "name": "getParentId", + "uid": "maxCount", + "name": "maxCount", "comment": { "raw": [ - "Should return ID of the Item's parent. Usually it's i => i.parentId.", - " If specified, Data Source will build items hierarchy.", - "", - " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", - " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", - " to highlight parents with selected children", - " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", - " We need to load parents with a separate call (if backend doesn't pre-fetch them)", - "", - " @param item - record, which paretnId should be returned.", - " @returns item parentId." + "Count of words to show in the Filter toggler. By default, 2 item will be shown." ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "rowOptions", - "name": "rowOptions", + "uid": "togglerWidth", + "name": "togglerWidth", "comment": { "raw": [ - "Specifies if rows are selectable, checkable, draggable, clickable, and more.", - " See DataRowOptions for more details.", - " If options depends on the item itself, use getRowOptions.", - " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item An item to get options for" + "Defines maxWidth of the filter toggler" ] }, "typeValue": { - "raw": "DataRowOptions" + "raw": "number" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "dataSource", + "name": "dataSource", "comment": { "raw": [ - "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", - " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", - " See DataRowOptions for more details.", - " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item - record, configuration should be returned for.", - " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." + "Datasource to get data for the picker" ] }, "typeValue": { - "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" - }, - "editor": { - "type": "func" + "raw": "IDataSource" }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false + "from": "@epam/uui-core:PickerBaseOptions", + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "getName", + "name": "getName", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded.", - " @param item - record, folding value should be returned for.", - " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." + "A pure function that gets entity name from entity object.", + " Default: (item) => item.name." ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" + "raw": "(item: any) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "renderRow", + "name": "renderRow", "comment": { "raw": [ - "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", - " - false: All nodes are selected independently (default).", - " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", - " - 'implicit': Selecting a parent node means that all children are considered checked.", - " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", - " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", - " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", - " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." + "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "component" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "renderFooter", + "name": "renderFooter", "comment": { "raw": [ - "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", - " @default true" - ], - "tags": { - "@default": true - } + "Adds custom footer to the dropdown body" + ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: PickerInputFooterProps) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "minCharsToSearch", + "name": "minCharsToSearch", "comment": { "raw": [ - "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", - " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." + "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " By default search triggers after input value is changed.", + "", + " Note: defined minCharsToSearch isn't compatible with searchPosition=body." ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { - "uid": "isDeleted", - "name": "isDeleted", + "uid": "type", + "name": "type", "comment": { "raw": [ - "To enable deleting of the items, it is required to specify getter for deleted state." + "Type of the filter" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "'singlePicker' | 'multiPicker'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "singlePicker", + "multiPicker" + ] }, - "from": "@epam/uui-core:PatchOptions", - "required": false + "from": "@epam/uui-core:PickerFilterConfig", + "required": true }, { - "uid": "getNewItemPosition", - "name": "getNewItemPosition", + "uid": "showSearch", + "name": "showSearch", "comment": { "raw": [ - "Provides information about the relative position of the new item.", - " @param item - new item, position should be got for.", - " @returns relative position in the list of items.", - " @default PatchOrdering.TOP" + "Pass false to hide search in picker body.", + " If omitted, true value will be used." ] }, "typeValue": { - "raw": "(item: TItem) => symbol" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:PickerFilterConfig", "required": false }, { - "uid": "getItemTemporaryOrder", - "name": "getItemTemporaryOrder", + "uid": "maxBodyHeight", + "name": "maxBodyHeight", "comment": { "raw": [ - "Provides information about the temporary order of the new item.", - " @param item - new item, temporary order should be got for.", - " @returns temporary order", - "", - " @experimental The API of this feature can be changed in the future releases." + "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" ] }, "typeValue": { - "raw": "(item: TItem) => string" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:PickerFilterConfig", "required": false }, { - "uid": "fixItemBetweenSortings", - "name": "fixItemBetweenSortings", + "uid": "highlightSearchMatches", + "name": "highlightSearchMatches", "comment": { "raw": [ - "If enabled, items position is fixed between sorting.", - " @default true" - ], - "tags": { - "@default": true - } + "Enables highlighting of the items' text with search-matching results." + ] }, "typeValue": { "raw": "boolean" @@ -34768,545 +34469,426 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:PickerFilterConfig", "required": false }, { - "uid": "sortBy", - "name": "sortBy", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "A pure function that gets sorting value for current sorting value" + "Filter selectable days. Days, for which this callback returns false - will be disabled" ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" + "raw": "(day: Dayjs) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:SortConfig", + "from": "@epam/uui-core:CommonDatePickerProps", "required": false }, { - "uid": "isFetching", - "name": "isFetching", + "uid": "format", + "name": "format", "comment": { "raw": [ - "Are tree records loading silently." + "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:ITreeLoadingState", + "from": "@epam/uui-core:CommonDatePickerProps", "required": false }, { - "uid": "isLoading", - "name": "isLoading", + "uid": "type_2", + "name": "type", "comment": { "raw": [ - "Are tree records loading loadly (show loading placeholders, etc)." + "Type of the filter" ] }, "typeValue": { - "raw": "boolean" + "raw": "'datePicker'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "datePicker" + ] }, - "from": "@epam/uui-core:ITreeLoadingState", - "required": false + "from": "@epam/uui-core:DatePickerFilterConfig", + "required": true }, { - "uid": "getCompleteTreeForCascadeSelection", - "name": "getCompleteTreeForCascadeSelection", + "uid": "type_3", + "name": "type", "comment": { "raw": [ - "Provides a cascade selection functionality.", - " @param isChecked - checking state of the item.", - " @param checkedId - ID of the item to be checked. If `undefined` - root is checked.", - " @param isRoot - marks if cascade selection should be performed on all the items.", - " @param checked - current state of checked items.", - " @returns new checked items." + "Type of the filter" ] }, "typeValue": { - "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" + "raw": "'numeric'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "numeric" + ] }, - "from": "@epam/uui-core:CascadeSelectionService", - "required": false + "from": "@epam/uui-core:NumericFilterConfig", + "required": true }, { - "uid": "getItemStatus", - "name": "getItemStatus", + "uid": "type_4", + "name": "type", "comment": { "raw": [ - "Provides a status of the given item.", - " @param id - id of an item, status to be provided for.", - " @returns status of the item." + "Type of the filter" ] }, "typeValue": { - "raw": "(id: TId) => RecordStatus" + "raw": "'rangeDatePicker'" }, "editor": { - "type": "func" - }, - "from": "@epam/uui-core:GetItemStatus", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UseFoldingServiceProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseFoldingServiceProps", - "nameFull": "UseFoldingServiceProps" - }, - "src": "uui-core/src/data/processing/views/dataRows/services/useFoldingService.ts", - "comment": { - "raw": [ - "Folding service configuration." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "UseFoldingServiceProps", - "print": [ - "/**", - " * Folding service configuration.", - " */", - "type UseFoldingServiceProps = Pick, 'getId' | 'dataSourceState' | 'setDataSourceState' | 'isFoldedByDefault'>;" - ] - }, - "props": [ - { - "uid": "dataSourceState", - "name": "dataSourceState", - "comment": { - "raw": [ - "State of the dataSource." + "type": "oneOf", + "options": [ + "rangeDatePicker" ] }, - "typeValue": { - "raw": "DataSourceState" - }, - "from": "@epam/uui-core:CommonTreeConfig", + "from": "@epam/uui-core:RangeDatePickerFilterConfig", "required": true }, { - "uid": "setDataSourceState", - "name": "setDataSourceState", + "uid": "type_5", + "name": "type", "comment": { "raw": [ - "DataSource state update handler." + "Type of the filter" ] }, "typeValue": { - "raw": "SetDataSourceState" + "raw": "'custom'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "custom" + ] }, - "from": "@epam/uui-core:CommonTreeConfig", + "from": "@epam/uui-core:CustomFilterConfig", "required": true }, { - "uid": "getId", - "name": "getId", + "uid": "render", + "name": "render", "comment": { "raw": [ - "Should return unique ID of the TItem", - " If omitted, we assume that every TItem has and unique id in its 'id' field.", - " @param item - record, which id should be returned.", - " @returns item id." + "Render callback for filter body" ] }, "typeValue": { - "raw": "(item: TItem) => TId" + "raw": "(props: IFilterItemBodyProps) => React.ReactElement>" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false + "from": "@epam/uui-core:CustomFilterConfig", + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "getTogglerValue", + "name": "getTogglerValue", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded.", - " @param item - record, folding value should be returned for.", - " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." + "A pure function that gets value to display in filter toggler" ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" + "raw": "(props: IFilterItemBodyProps) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false + "from": "@epam/uui-core:CustomFilterConfig", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:UseFormProps": { + "@epam/uui-core:TextInputCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseFormProps", - "nameFull": "UseFormProps" + "name": "TextInputCoreProps", + "nameFull": "TextInputCoreProps" }, - "src": "uui-core/src/data/forms/useForm.ts", + "src": "uui-core/src/types/components/TextInput.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "UseFormProps", + "raw": "TextInputCoreProps", "print": [ - "type UseFormProps = Omit, 'renderForm'>;" + "interface TextInputCoreProps extends IHasCX, IClickable, IDisableable, IEditable, IHasPlaceholder, IHasIcon, ICanBeReadonly, IDropdownToggler, IAnalyticableOnChange, IHasRawProps>, ICanFocus, IHasTabIndex {", + " /** Enables cancel (cross) icon, and fires when the icon is clicked */", + " onCancel?(): void;", + " /** Enables accept (check) icon, and fires when the icon is clicked */", + " onAccept?(): void;", + " /** keydown event handler to put on the HTML input element */", + " onKeyDown?(e?: React.KeyboardEvent): void;", + " /** Put focus on the element, when component is mounted */", + " autoFocus?: boolean;", + " /** Standard 'type' attribute to put on the HTML input element (e.g. 'password') */", + " type?: string;", + " /** Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp} */", + " autoComplete?: string;", + " /** Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp} */", + " name?: string;", + " /** Maximum input length in characters */", + " maxLength?: number;", + " /** Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode} */", + " inputMode?: React.InputHTMLAttributes['inputMode'];", + " /** HTML ID attribute for input */", + " id?: string;", + "}" ] }, "props": [ { - "uid": "value", - "name": "value", + "uid": "onCancel", + "name": "onCancel", "comment": { "raw": [ - "Current value of the form state" + "Enables cancel (cross) icon, and fires when the icon is clicked" ] }, "typeValue": { - "raw": "T" + "raw": "() => void" }, - "from": "@epam/uui-core:FormProps", - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "getMetadata", - "name": "getMetadata", + "uid": "onAccept", + "name": "onAccept", "comment": { "raw": [ - "Returns form metadata - information used to validate the form.", - " @param state Metadata can depend on state, and will be re-computed on updates" + "Enables accept (check) icon, and fires when the icon is clicked" ] }, "typeValue": { - "raw": "(state: T) => Metadata" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "onSave", - "name": "onSave", + "uid": "onKeyDown", + "name": "onKeyDown", "comment": { "raw": [ - "Occurs when 'save' function is called on Form.", - " Should save form data (usually with API call to server).", - " Server can also reject form, and provide validation errors in response.", - " @param state Form state to save" + "keydown event handler to put on the HTML input element" ] }, "typeValue": { - "raw": "(state: T) => Promise>" + "raw": "(e?: React.KeyboardEvent | undefined) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", - "required": true + "required": false }, { - "uid": "beforeLeave", - "name": "beforeLeave", + "uid": "autoFocus", + "name": "autoFocus", "comment": { "raw": [ - "Called when form is unmounted, but user still have unsaved changes.", - " Accepts a Promise to be returned.", - " If promise resolves to true - save procedure is performed.", - " If promise resolves to false - localStorage will be cleaned.", - " If promise resolves to 'remain' - localStorage remain as was and changes in form not saves.", - " The common use-case is to show a modal with \"Save Changes?\" dialog", - " Skins usually implement this as default behavior. To prevent it, you can pass null to this prop to override it." + "Put focus on the element, when component is mounted" ] }, "typeValue": { - "raw": "null | (nextLocation: Link, currentLocation: Link) => Promise" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "loadUnsavedChanges", - "name": "loadUnsavedChanges", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Used to restore unsaved user edits from the last session (usually to localstorage, via uuiUserSettings context)", - " If unsaved changes are detected, this callback is called. If it is resolved - the form restores unsaved edits.", - " The common use-case is to show a modal with \"You have unsaved changes, restore them?\" dialog", - " Skins usually implement this as default behavior. To prevent it, you can pass null to this prop to override it." + "Standard 'type' attribute to put on the HTML input element (e.g. 'password')" ] }, "typeValue": { - "raw": "() => Promise" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "onSuccess", - "name": "onSuccess", + "uid": "autoComplete", + "name": "autoComplete", "comment": { "raw": [ - "Called after successful save.", - " @param state Saved state", - " @param isSavedBeforeLeave true, if save is triggered via leaving the page, and \"Save Changes?\" dialog" + "Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp}" ] }, "typeValue": { - "raw": "(state: T, isSavedBeforeLeave?: boolean | undefined) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "onError", - "name": "onError", + "uid": "name", + "name": "name", "comment": { "raw": [ - "Called when save fails" + "Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp}" ] }, "typeValue": { - "raw": "(error: any) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "settingsKey", - "name": "settingsKey", + "uid": "maxLength", + "name": "maxLength", "comment": { "raw": [ - "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" + "Maximum input length in characters" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "validationOn", - "name": "validationOn", + "uid": "inputMode", + "name": "inputMode", "comment": { "raw": [ - "Controls when form validation occurs:", - " save (default, recommended) - form is validated on save. If form is invalid - it will be revalidated on every change, until become valid", - " change - form is validated on every user change. Only fields changes in current edit session are validated" + "Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode}" ] }, "typeValue": { - "raw": "'change' | 'save'" + "raw": "'search' | 'none' | 'numeric' | 'text' | 'tel' | 'url' | 'email' | 'decimal'" }, "editor": { "type": "oneOf", "options": [ - "change", - "save" + "search", + "none", + "numeric", + "text", + "tel", + "url", + "email", + "decimal" ] }, - "from": "@epam/uui-core:FormProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UseLazyFetchingAdvisorProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseLazyFetchingAdvisorProps", - "nameFull": "UseLazyFetchingAdvisorProps" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/lazyTree/useLazyFetchingAdvisor.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UseLazyFetchingAdvisorProps", - "print": [ - "interface UseLazyFetchingAdvisorProps {", - " dataSourceState: DataSourceState;", - " filter?: TFilter;", - " forceReload?: boolean;", - " backgroundReload?: boolean;", - " showSelectedOnly?: boolean;", - " /**", - " * Fetching function, which should be called if fetch is required.", - " * @param lazyLoadingAdvice - fetching advice.", - " */", - " onFetch?: (lazyLoadingAdvice: LazyFetchingAdvice) => void;", - "}" - ] - }, - "props": [ - { - "uid": "dataSourceState", - "name": "dataSourceState", - "typeValue": { - "raw": "DataSourceState" - }, - "required": true }, { - "uid": "filter", - "name": "filter", - "typeValue": { - "raw": "TFilter" + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "HTML ID attribute for input" + ] }, - "required": false - }, - { - "uid": "forceReload", - "name": "forceReload", "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", - "typeValue": { - "raw": "boolean" + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] }, - "editor": { - "type": "bool" + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Called when component is clicked" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "(e?: any) => void" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "onFetch", - "name": "onFetch", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Fetching function, which should be called if fetch is required.", - " @param lazyLoadingAdvice - fetching advice." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "(lazyLoadingAdvice: LazyFetchingAdvice) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UsePreviousConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UsePreviousConfig", - "nameFull": "UsePreviousConfig" - }, - "src": "uui-core/src/hooks/usePrevious.ts", - "comment": { - "raw": [ - "Hook configuration, which defines if previous value will be deeply compared with new value to be saved or not." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UsePreviousConfig", - "print": [ - "/**", - " * Hook configuration, which defines if previous value will be deeply compared with new value to be saved or not.", - " */", - "interface UsePreviousConfig {", - " /**", - " * If compare is set to true, previous value will be deeply compared with the new value,", - " * and previous value will be updated only if value is changed (not the link to the object).", - " * Otherwise, previous value will be returned.", - " * If compare is false, previous value will be changed on every rerender.", - " */", - " compare?: boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "compare", - "name": "compare", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "If compare is set to true, previous value will be deeply compared with the new value,", - " and previous value will be updated only if value is changed (not the link to the object).", - " Otherwise, previous value will be returned.", - " If compare is false, previous value will be changed on every rerender." + "True if component contains invalid input" ] }, "typeValue": { @@ -35315,223 +34897,169 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UseResizeObserverProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseResizeObserverProps", - "nameFull": "UseResizeObserverProps" - }, - "src": "uui-core/src/hooks/useResizeObserver.ts", - "comment": { - "raw": [ - "Props of useResizeObserver hook." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UseResizeObserverProps", - "print": [ - "/**", - " * Props of useResizeObserver hook.", - " */", - "interface UseResizeObserverProps {", - " /**", - " * The handler for the resizing event, called when the size of any observed elements changes.", - " */", - " onResize: ResizeObserverCallback;", - " /**", - " * Elements whose size changes should be tracked.", - " */", - " observables: Element[];", - " /**", - " * Delay (in milliseconds) before calling the onResize handler.", - " */", - " delay?: number;", - "}" - ] - }, - "props": [ + }, { - "uid": "onResize", - "name": "onResize", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "The handler for the resizing event, called when the size of any observed elements changes." + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "ResizeObserverCallback" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:ICanBeReadonly", + "required": false }, { - "uid": "observables", - "name": "observables", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Elements whose size changes should be tracked." + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "Element[]" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", + "required": false }, { - "uid": "delay", - "name": "delay", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Delay (in milliseconds) before calling the onResize handler." + "The current value of component" ] }, "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UseTableStateHookParams": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseTableStateHookParams", - "nameFull": "UseTableStateHookParams" - }, - "src": "uui-core/src/hooks/useTableState/useTableState.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UseTableStateHookParams", - "print": [ - "interface UseTableStateHookParams, TViewState = any> extends UseTableStateHookBaseParams, Partial>> {", - "}" - ] - }, - "props": [ + "from": "@epam/uui-core:IControlled", + "required": true + }, { - "uid": "filters", - "name": "filters", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Filters configuration, can be omitted if you don't need filters" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "TableFiltersConfig[]" + "raw": "(newValue: string | undefined) => void" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "initialPresets", - "name": "initialPresets", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "Initial presets array" + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "ITablePreset[]" + "raw": "any" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:IHasPlaceholder", "required": false }, { - "uid": "onPresetCreate", - "name": "onPresetCreate", + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "Called when preset was created. Should return the ID of new preset" + "Icon can be a React element (usually an SVG element)" ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" + "raw": "Icon" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "onPresetUpdate", - "name": "onPresetUpdate", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Called when preset was updated" + "Position of the icon (left of right)" ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" + "raw": "'right' | 'left'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "right", + "left" + ] }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "onPresetDelete", - "name": "onPresetDelete", + "uid": "onIconClick", + "name": "onIconClick", "comment": { "raw": [ - "Called when preset was deleted" + "Click handler for the icon" ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "initialVisibleCount", - "name": "initialVisibleCount", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "Initial visibleCount table state value" + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "True if component contains invalid input" + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { @@ -35540,496 +35068,436 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Given a value, returns an analytics event to send when component is edited.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "value", - "name": "value", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "The current value of component" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "DataTableState" + "raw": "(e: React.FocusEvent) => void" }, - "from": "@epam/uui-core:IControlled", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Controls the order of keyboard navigation between components" ] }, "typeValue": { - "raw": "(newValue: DataTableState) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:IHasTabIndex", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:UseTreeProps": { + "@epam/uui-core:TooltipCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseTreeProps", - "nameFull": "UseTreeProps" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", - "comment": { - "raw": [ - "useTree hook configuration." - ] + "name": "TooltipCoreProps", + "nameFull": "TooltipCoreProps" }, + "src": "uui-core/src/types/components/Tooltip.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "SyncTreeProps | AsyncTreeProps | LazyTreeProps", + "raw": "TooltipCoreProps", "print": [ - "/**", - " * useTree hook configuration.", - " */", - "type UseTreeProps = (SyncTreeProps | AsyncTreeProps | LazyTreeProps);" + "interface TooltipCoreProps extends IHasCX, IHasChildren, IHasRawProps>, Partial>, Pick {", + " /** Content to show in the tooltip (ReactNode) */", + " content?: any;", + " /** Alternative to 'content' prop, you can pass a render function.", + " * The function will only be called when content is shown, this can save performance. */", + " renderContent?(): any;", + " /** See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/} */", + " offset?: Options['offset'];", + " /** React Node(s) to show tooltip for */", + " children?: React.ReactNode;", + " /** Max width of tooltip */", + " maxWidth?: number;", + "}" ] }, "props": [ { - "uid": "dataSourceState", - "name": "dataSourceState", + "uid": "content", + "name": "content", "comment": { "raw": [ - "State of the dataSource." + "Content to show in the tooltip (ReactNode)" ] }, "typeValue": { - "raw": "DataSourceState" + "raw": "any" }, - "from": "@epam/uui-core:CommonTreeConfig", - "required": true + "required": false }, { - "uid": "setDataSourceState", - "name": "setDataSourceState", + "uid": "renderContent", + "name": "renderContent", "comment": { "raw": [ - "DataSource state update handler." + "Alternative to 'content' prop, you can pass a render function.", + " The function will only be called when content is shown, this can save performance." ] }, "typeValue": { - "raw": "SetDataSourceState" + "raw": "() => any" }, - "typeValueRef": "@epam/uui-core:SetDataSourceState", "editor": { "type": "func" }, - "from": "@epam/uui-core:CommonTreeConfig", - "required": true + "required": false }, { - "uid": "getId", - "name": "getId", + "uid": "offset", + "name": "offset", "comment": { "raw": [ - "Should return unique ID of the TItem", - " If omitted, we assume that every TItem has and unique id in its 'id' field.", - " @param item - record, which id should be returned.", - " @returns item id." + "See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/}" ] }, "typeValue": { - "raw": "(item: TItem) => TId" - }, - "editor": { - "type": "func" + "raw": "OffsetsFunction | [number | null | undefined, number | null | undefined]" }, - "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", - " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." + "React Node(s) to show tooltip for" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "getParentId", - "name": "getParentId", + "uid": "maxWidth", + "name": "maxWidth", "comment": { "raw": [ - "Should return ID of the Item's parent. Usually it's i => i.parentId.", - " If specified, Data Source will build items hierarchy.", - "", - " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", - " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", - " to highlight parents with selected children", - " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", - " We need to load parents with a separate call (if backend doesn't pre-fetch them)", - "", - " @param item - record, which paretnId should be returned.", - " @returns item parentId." + "Max width of tooltip" ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "rowOptions", - "name": "rowOptions", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Specifies if rows are selectable, checkable, draggable, clickable, and more.", - " See DataRowOptions for more details.", - " If options depends on the item itself, use getRowOptions.", - " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item An item to get options for" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "DataRowOptions" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", - " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", - " See DataRowOptions for more details.", - " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item - record, configuration should be returned for.", - " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" - }, - "editor": { - "type": "func" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded.", - " @param item - record, folding value should be returned for.", - " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." + "The current value of component" ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", - " - false: All nodes are selected independently (default).", - " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", - " - 'implicit': Selecting a parent node means that all children are considered checked.", - " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", - " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", - " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", - " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "(newValue: boolean) => void" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", - " @default true" - ], - "tags": { - "@default": true - } + "Call to close the dropdown body" + ] }, "typeValue": { - "raw": "boolean" + "raw": "() => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", - " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." + "Defines dropdown body placement relative to target" ] }, "typeValue": { - "raw": "boolean" + "raw": "'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'right' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false - }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." + "type": "oneOf", + "options": [ + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "right", + "left", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" ] }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "isDeleted", - "name": "isDeleted", + "uid": "modifiers", + "name": "modifiers", "comment": { "raw": [ - "To enable deleting of the items, it is required to specify getter for deleted state." + "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" - }, - "editor": { - "type": "func" + "raw": "(StrictModifier | Partial>)[]" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "getNewItemPosition", - "name": "getNewItemPosition", + "uid": "openDelay", + "name": "openDelay", "comment": { "raw": [ - "Provides information about the relative position of the new item.", - " @param item - new item, position should be got for.", - " @returns relative position in the list of items.", - " @default PatchOrdering.TOP" - ] + "Defines how much 'ms' user should hold mouse over target to open the dropdown", + " This prop work only with openOnHover={true}", + " @default 0" + ], + "tags": { + "@default": 0 + } }, "typeValue": { - "raw": "(item: TItem) => symbol" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "getItemTemporaryOrder", - "name": "getItemTemporaryOrder", + "uid": "closeDelay", + "name": "closeDelay", "comment": { "raw": [ - "Provides information about the temporary order of the new item.", - " @param item - new item, temporary order should be got for.", - " @returns temporary order", - "", - " @experimental The API of this feature can be changed in the future releases." - ] + "Defines after which delay dropdown will be closed, if user leave mouse from target.", + " This prop work only with openOnHover={true}", + " @default 0" + ], + "tags": { + "@default": 0 + } }, "typeValue": { - "raw": "(item: TItem) => string" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "fixItemBetweenSortings", - "name": "fixItemBetweenSortings", + "uid": "closeOnMouseLeave", + "name": "closeOnMouseLeave", "comment": { "raw": [ - "If enabled, items position is fixed between sorting.", - " @default true" + "Defined when to close dropdown in case of openOnHover={ true }", + " toggler — dropdown will be closed when a mouse leaves the target component", + " boundary — will not to close the dropdown when a mouse is on target or in 30px around target area", + " false — will not close dropdown by mouse move event", + " @default 'toggler'" ], "tags": { - "@default": true + "@default": "toggler" } }, "typeValue": { - "raw": "boolean" + "raw": "false | 'toggler' | 'boundary'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + false, + "toggler", + "boundary" + ] }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "sortBy", - "name": "sortBy", + "uid": "portalTarget", + "name": "portalTarget", "comment": { "raw": [ - "A pure function that gets sorting value for current sorting value" + "Node of portal target, where to render the dropdown body.", + " By default, will be used global portal node." ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" + "raw": "HTMLElement" }, - "from": "@epam/uui-core:SortConfig", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "boundaryElement", + "name": "boundaryElement", "comment": { "raw": [ - "A pure function that gets search value for each item.", - " @default (item) => item.name." + "Element relative to which dropdown will calculate position" ] }, "typeValue": { - "raw": "(item: TItem) => string[]" - }, - "editor": { - "type": "func" + "raw": "HTMLElement | HTMLElement[] | 'clippingParents'" }, - "from": "@epam/uui-core:SearchConfig", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "sortSearchByRelevance", - "name": "sortSearchByRelevance", + "uid": "closeBodyOnTogglerHidden", + "name": "closeBodyOnTogglerHidden", "comment": { "raw": [ - "Enables sorting of search results by relevance.", - " - The highest priority has records, which have a full match with a search keyword.", - " - The lower one has records, which have a search keyword at the 0 position, but not the full match.", - " - Then, records, which contain a search keyword as a separate word, but not at the beginning.", - " - And the lowest one - any other match of the search keyword.", - "", - " Example:", - " - `search`: 'some'", - " - `record string`: 'some word', `rank` = 4", - " - `record string`: 'someone', `rank` = 3", - " - `record string`: 'I know some guy', `rank` = 2", - " - `record string`: 'awesome', `rank` = 1", - "", + "Pass false, if you do not want to close the dropdown in case Toggler move out of viewport.", " @default true" ], "tags": { @@ -36042,456 +35510,557 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:SearchConfig", + "from": "@epam/uui-core:DropdownProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseCascadeSelectionServiceProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseCascadeSelectionServiceProps", + "nameFull": "UseCascadeSelectionServiceProps" + }, + "src": "uui-core/src/data/processing/views/dataRows/services/useCascadeSelectionService.ts", + "comment": { + "raw": [ + "Cascade selection service configuration." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UseCascadeSelectionServiceProps", + "print": [ + "/**", + " * Cascade selection service configuration.", + " */", + "interface UseCascadeSelectionServiceProps extends LoadMissingRecords {", + " /**", + " * Tree-like data, cascade selection should be performed on.", + " */", + " tree: ITree;", + "}" + ] + }, + "props": [ { - "uid": "getFilter", - "name": "getFilter", + "uid": "tree", + "name": "tree", "comment": { "raw": [ - "A pure function that returns filter callback to be applied for each item.", - " The callback should return true, if item passed the filter." + "Tree-like data, cascade selection should be performed on." ] }, "typeValue": { - "raw": "(filter: TFilter) => (item: TItem) => boolean" - }, - "editor": { - "type": "func" + "raw": "ITree" }, - "from": "@epam/uui-core:FilterConfig", - "required": false + "required": true }, { - "uid": "setItems", - "name": "setItems", + "uid": "loadMissingRecordsOnCheck", + "name": "loadMissingRecordsOnCheck", "comment": { "raw": [ - "Items updating listener, which fires on items loading/reloading/reset." + "Loads missing records and provides a fulfilled tree.", + " @param id - id of an item, which is checked and records should be loaded for.", + " @param isChecked - checking status of the record.", + " @param isRoot - a flag, which marks if all records should be checked/unchecked.", + " @returns fulfilled tree with missing records, those required to be loaded for checking." ] }, "typeValue": { - "raw": "(items: TItem[], options?: ModificationOptions | undefined) => ItemsMap" + "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:SharedItemsState", + "from": "@epam/uui-core:LoadMissingRecords", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseDataRowsProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseDataRowsProps", + "nameFull": "UseDataRowsProps" + }, + "src": "uui-core/src/data/processing/views/dataRows/useDataRows.ts", + "comment": { + "raw": [ + "`useDataRows` configuration." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UseDataRowsProps", + "print": [ + "/**", + " * `useDataRows` configuration.", + " */", + "interface UseDataRowsProps extends Omit, 'patch'>, ITreeLoadingState, Partial>, GetItemStatus {", + " /**", + " * Tree-like data, rows to be built from.", + " */", + " tree: ITree;", + "}" + ] + }, + "props": [ { - "uid": "items", - "name": "items", + "uid": "tree", + "name": "tree", "comment": { "raw": [ - "Data, which should be represented by a DataSource." + "Tree-like data, rows to be built from." ] }, "typeValue": { - "raw": "TItem[]" + "raw": "ITree" }, - "from": "@epam/uui-core:ArrayDataSourceConfig", - "required": false + "required": true }, { - "uid": "type", - "name": "type", + "uid": "dataSourceState", + "name": "dataSourceState", "comment": { "raw": [ - "Type of the tree to be supported." + "State of the dataSource." ] }, "typeValue": { - "raw": "'sync'" - }, - "editor": { - "type": "oneOf", - "options": [ - "sync" - ] + "raw": "DataSourceState" }, - "from": "@epam/uui-core:SyncTreeProps", + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "type_2", - "name": "type", + "uid": "setDataSourceState", + "name": "setDataSourceState", "comment": { "raw": [ - "Type of the tree to be supported." + "DataSource state update handler." ] }, "typeValue": { - "raw": "'async'" + "raw": "SetDataSourceState" }, "editor": { - "type": "oneOf", - "options": [ - "async" - ] + "type": "func" }, - "from": "@epam/uui-core:AsyncTreeProps", + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "isLoaded", - "name": "isLoaded", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Disables loading of records, if isLoaded = true.", - " If isLoaded = true, items are taken from itemsMap.", - " @internal" + "Should return unique ID of the TItem", + " If omitted, we assume that every TItem has and unique id in its 'id' field.", + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem) => TId" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:AsyncTreeProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "itemsMap", - "name": "itemsMap", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Map of shared items." + "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", + " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." ] }, "typeValue": { - "raw": "ItemsMap" + "raw": "boolean" }, - "from": "@epam/uui-core:SharedItemsState", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "itemsStatusMap", - "name": "itemsStatusMap", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Map of items statuses." + "Should return ID of the Item's parent. Usually it's i => i.parentId.", + " If specified, Data Source will build items hierarchy.", + "", + " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", + " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", + " to highlight parents with selected children", + " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", + " We need to load parents with a separate call (if backend doesn't pre-fetch them)", + "", + " @param item - record, which paretnId should be returned.", + " @returns item parentId." ] }, "typeValue": { - "raw": "IMap" + "raw": "(item: TItem) => TId | undefined" }, - "from": "@epam/uui-core:ItemsStatuses", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "itemsStatusCollector", - "name": "itemsStatusCollector", + "uid": "rowOptions", + "name": "rowOptions", + "comment": { + "raw": [ + "Specifies if rows are selectable, checkable, draggable, clickable, and more.", + " See DataRowOptions for more details.", + " If options depends on the item itself, use getRowOptions.", + " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item An item to get options for" + ] + }, "typeValue": { - "raw": "ItemsStatusCollector" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:ItemsStatuses", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "api", - "name": "api", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "A function to retrieve the data, asynchronously. This function usually performs a REST API call.", - " Should return the array of items, which will be processed by dataSource.", - " This api called only once during the initialization and assumed to return the full amount of data.", - " For lazy loading cases, use LazyDataSource" + "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", + " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", + " See DataRowOptions for more details.", + " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item - record, configuration should be returned for.", + " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." ] }, "typeValue": { - "raw": "() => Promise" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:AsyncDataSourceConfig", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "api_2", - "name": "api", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "A function to retrieve the data, asynchronously.", - " This function usually performs a REST API call.", - " API is used to retrieve lists of items.", - " It is expected to:", - " - be able to handle paging (via from/count params)", - " - be able to retrieve specific items by the list of their ids", - " - be able to retrieve children by parents (when getChildCount is specified, and ctx.parentId is passed)" + "Can be specified to unfold all or some items at start.", + " If not specified, all rows would be folded.", + " @param item - record, folding value should be returned for.", + " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." ] }, "typeValue": { - "raw": "LazyDataSourceApi" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, - "typeValueRef": "@epam/uui-core:LazyDataSourceApi", "editor": { "type": "func" }, - "from": "@epam/uui-core:LazyDataSourceConfig", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getChildCount", - "name": "getChildCount", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Should return number of children of the item.", - " If it returns > 0, the item is assumed to have children and to be foldable.", - " Usually, this value should be returned from API, as a field of a parent, e.g. { id: 1, name: 'London', childCount: 12 }.", - " In this case, you can implement getChildCount as (i) => i.childCount.", - "", - " If you can't get number of children via API, you can return a guess value (avg number of children for this type of entity).", - " Note, that this can lead to more API calls, and increased load times in the 'parallel' fetch mode." + "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", + " - false: All nodes are selected independently (default).", + " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", + " - 'implicit': Selecting a parent node means that all children are considered checked.", + " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", + " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", + " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", + " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." ] }, "typeValue": { - "raw": "(item: TItem) => number" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, - "from": "@epam/uui-core:LazyDataSourceConfig", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "A filter to pass to API.", - " Note, that the DataSourceState also has a filter fields. These two filters are merged before API calls.", - " Use this prop if you need to apply some filter in any case.", - " Prefer to use filter in the DataSourceState for end-user editable filters." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "TFilter" + "raw": "boolean" }, - "from": "@epam/uui-core:LazyDataSourceConfig", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "fetchStrategy", - "name": "fetchStrategy", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Defines how to fetch children:", - " sequential (default) - fetch children for each parent one-by-one. Makes minimal over-querying, at cost of some speed.", - " parallel - fetch children for several parents simultaneously. Can make a lot of over-querying for deep trees.", - " Recommended for 2 level trees (grouping), as it makes no over-querying in this case, and is faster than sequential strategy." + "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", + " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." ] }, "typeValue": { - "raw": "'sequential' | 'parallel'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "sequential", - "parallel" + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false + }, + { + "uid": "isDeleted", + "name": "isDeleted", + "comment": { + "raw": [ + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, - "from": "@epam/uui-core:LazyDataSourceConfig", + "typeValue": { + "raw": "(item: TItem) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Enables background reloading of data on search/sort/filter/reload, which turns off the rows placeholders displaying while data loading.", - " During data reloading, previous data is displayed. To prevent any interaction with visible not actual rows, a blocker/spinner should be displayed.", - " In UUI components, such as `PickerInput`, `PickerList`, `PickerModal` and `DataTable`, blockers are added.", - " It is required to add blockers/spinners to the components, built on your own.", - " If reloading is started, `view.getListProps` returns `isReloading` flag, set to `true`." + "Provides information about the relative position of the new item.", + " @param item - new item, position should be got for.", + " @returns relative position in the list of items.", + " @default PatchOrdering.TOP" ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem) => symbol" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:LazyDataSourceConfig", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Falls back to plain list from tree, if there's search.", - " Default is true.", - "", - " If enabled, and search is active:", - " - API will be called with parentId and parent undefined", - " - getChildCount is ignored, all nodes are assumed to have no children", + "Provides information about the temporary order of the new item.", + " @param item - new item, temporary order should be got for.", + " @returns temporary order", "", - " See more here: https://github.com/epam/UUI/issues/8" + " @experimental The API of this feature can be changed in the future releases." ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem) => string" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:FlattenSearchResultsConfig", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "type_3", - "name": "type", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "Type of the tree to be supported." - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "'lazy'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "lazy" - ] + "type": "bool" }, - "from": "@epam/uui-core:LazyTreeProps", - "required": true - } - ], - "propsFromUnion": true - } - }, - "@epam/uui-core:UseTreeResult": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseTreeResult", - "nameFull": "UseTreeResult" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/types.ts", - "comment": { - "raw": [ - "Result of the useTree hook." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UseTreeResult", - "print": [ - "/**", - " * Result of the useTree hook.", - " */", - "interface UseTreeResult extends Omit, 'patch'>, ITreeLoadingState, ITreeActions, LoadMissingRecords, GetItemStatus, FlattenSearchResultsConfig {", - " /**", - " * Tree-like data, rows to be build from.", - " */", - " tree: ITree;", - " /**", - " * Tree-like data, selected rows to be build from and cascade selection should be performed on.", - " */", - " selectionTree: ITree;", - " /**", - " * Version of the tree before applying patch to it.", - " */", - " treeWithoutPatch: ITree;", - " /**", - " * Total count of the rows.", - " */", - " totalCount?: number;", - " /**", - " * Allows patching an existing tree with updated data multiple times without affecting the original tree.", - " * It can be used while adding subtotals or making other changes to the data, based on update results before setting data to the form.", - " * @param modifiedItems Map of updated, deleted, or added items to be applied to the existing tree.", - " * @returns A new tree patched with the modified items.", - " */", - " applyPatch: (modifiedItems: IMap | IImmutableMap) => ITree;", - "}" - ] - }, - "props": [ + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { - "uid": "tree", - "name": "tree", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Tree-like data, rows to be build from." + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "ITree" + "raw": "(item: TItem, sorting: SortingOption) => any" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:SortConfig", + "required": false }, { - "uid": "selectionTree", - "name": "selectionTree", + "uid": "isFetching", + "name": "isFetching", "comment": { "raw": [ - "Tree-like data, selected rows to be build from and cascade selection should be performed on." + "Are tree records loading silently." ] }, "typeValue": { - "raw": "ITree" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ITreeLoadingState", + "required": false }, { - "uid": "treeWithoutPatch", - "name": "treeWithoutPatch", + "uid": "isLoading", + "name": "isLoading", "comment": { "raw": [ - "Version of the tree before applying patch to it." + "Are tree records loading loadly (show loading placeholders, etc)." ] }, "typeValue": { - "raw": "ITree" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ITreeLoadingState", + "required": false }, { - "uid": "totalCount", - "name": "totalCount", + "uid": "getCompleteTreeForCascadeSelection", + "name": "getCompleteTreeForCascadeSelection", "comment": { "raw": [ - "Total count of the rows." + "Provides a cascade selection functionality.", + " @param isChecked - checking state of the item.", + " @param checkedId - ID of the item to be checked. If `undefined` - root is checked.", + " @param isRoot - marks if cascade selection should be performed on all the items.", + " @param checked - current state of checked items.", + " @returns new checked items." ] }, "typeValue": { - "raw": "number" + "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" }, "editor": { - "type": "number" + "type": "func" }, + "from": "@epam/uui-core:CascadeSelectionService", "required": false }, { - "uid": "applyPatch", - "name": "applyPatch", + "uid": "getItemStatus", + "name": "getItemStatus", "comment": { "raw": [ - "Allows patching an existing tree with updated data multiple times without affecting the original tree.", - " It can be used while adding subtotals or making other changes to the data, based on update results before setting data to the form.", - " @param modifiedItems Map of updated, deleted, or added items to be applied to the existing tree.", - " @returns A new tree patched with the modified items." + "Provides a status of the given item.", + " @param id - id of an item, status to be provided for.", + " @returns status of the item." ] }, "typeValue": { - "raw": "(modifiedItems: IMap | IImmutableMap) => ITree" + "raw": "(id: TId) => RecordStatus" }, "editor": { "type": "func" }, - "required": true - }, + "from": "@epam/uui-core:GetItemStatus", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseFoldingServiceProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseFoldingServiceProps", + "nameFull": "UseFoldingServiceProps" + }, + "src": "uui-core/src/data/processing/views/dataRows/services/useFoldingService.ts", + "comment": { + "raw": [ + "Folding service configuration." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "UseFoldingServiceProps", + "print": [ + "/**", + " * Folding service configuration.", + " */", + "type UseFoldingServiceProps = Pick, 'getId' | 'dataSourceState' | 'setDataSourceState' | 'isFoldedByDefault'>;" + ] + }, + "props": [ { "uid": "dataSourceState", "name": "dataSourceState", @@ -36544,449 +36113,374 @@ "required": false }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", - " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." + "Can be specified to unfold all or some items at start.", + " If not specified, all rows would be folded.", + " @param item - record, folding value should be returned for.", + " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, "editor": { - "type": "bool" + "type": "func" }, "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseFormProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseFormProps", + "nameFull": "UseFormProps" + }, + "src": "uui-core/src/data/forms/useForm.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "UseFormProps", + "print": [ + "type UseFormProps = Omit, 'renderForm'>;" + ] + }, + "props": [ { - "uid": "getParentId", - "name": "getParentId", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Should return ID of the Item's parent. Usually it's i => i.parentId.", - " If specified, Data Source will build items hierarchy.", - "", - " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", - " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", - " to highlight parents with selected children", - " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", - " We need to load parents with a separate call (if backend doesn't pre-fetch them)", - "", - " @param item - record, which paretnId should be returned.", - " @returns item parentId." + "Current value of the form state" ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" - }, - "editor": { - "type": "func" + "raw": "T" }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false + "from": "@epam/uui-core:FormProps", + "required": true }, { - "uid": "rowOptions", - "name": "rowOptions", + "uid": "getMetadata", + "name": "getMetadata", "comment": { "raw": [ - "Specifies if rows are selectable, checkable, draggable, clickable, and more.", - " See DataRowOptions for more details.", - " If options depends on the item itself, use getRowOptions.", - " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item An item to get options for" + "Returns form metadata - information used to validate the form.", + " @param state Metadata can depend on state, and will be re-computed on updates" ] }, "typeValue": { - "raw": "DataRowOptions" + "raw": "(state: T) => Metadata" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "onSave", + "name": "onSave", "comment": { "raw": [ - "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", - " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", - " See DataRowOptions for more details.", - " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", - " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", - " @param item - record, configuration should be returned for.", - " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." + "Occurs when 'save' function is called on Form.", + " Should save form data (usually with API call to server).", + " Server can also reject form, and provide validation errors in response.", + " @param state Form state to save" ] }, "typeValue": { - "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" + "raw": "(state: T) => Promise>" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", - "required": false + "from": "@epam/uui-core:FormProps", + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "beforeLeave", + "name": "beforeLeave", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded.", - " @param item - record, folding value should be returned for.", - " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." + "Called when form is unmounted, but user still have unsaved changes.", + " Accepts a Promise to be returned.", + " If promise resolves to true - save procedure is performed.", + " If promise resolves to false - localStorage will be cleaned.", + " If promise resolves to 'remain' - localStorage remain as was and changes in form not saves.", + " The common use-case is to show a modal with \"Save Changes?\" dialog", + " Skins usually implement this as default behavior. To prevent it, you can pass null to this prop to override it." ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" + "raw": "null | (nextLocation: Link, currentLocation: Link) => Promise" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "loadUnsavedChanges", + "name": "loadUnsavedChanges", "comment": { "raw": [ - "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", - " - false: All nodes are selected independently (default).", - " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", - " - 'implicit': Selecting a parent node means that all children are considered checked.", - " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", - " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", - " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", - " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." + "Used to restore unsaved user edits from the last session (usually to localstorage, via uuiUserSettings context)", + " If unsaved changes are detected, this callback is called. If it is resolved - the form restores unsaved edits.", + " The common use-case is to show a modal with \"You have unsaved changes, restore them?\" dialog", + " Skins usually implement this as default behavior. To prevent it, you can pass null to this prop to override it." ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "() => Promise" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "onSuccess", + "name": "onSuccess", "comment": { "raw": [ - "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", - " @default true" - ], - "tags": { - "@default": true - } + "Called after successful save.", + " @param state Saved state", + " @param isSavedBeforeLeave true, if save is triggered via leaving the page, and \"Save Changes?\" dialog" + ] }, "typeValue": { - "raw": "boolean" + "raw": "(state: T, isSavedBeforeLeave?: boolean | undefined) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "onError", + "name": "onError", "comment": { "raw": [ - "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", - " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." + "Called when save fails" ] }, "typeValue": { - "raw": "boolean" + "raw": "(error: any) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:BaseDataSourceConfig", + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "isDeleted", - "name": "isDeleted", + "uid": "settingsKey", + "name": "settingsKey", "comment": { "raw": [ - "To enable deleting of the items, it is required to specify getter for deleted state." + "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "getNewItemPosition", - "name": "getNewItemPosition", + "uid": "validationOn", + "name": "validationOn", "comment": { "raw": [ - "Provides information about the relative position of the new item.", - " @param item - new item, position should be got for.", - " @returns relative position in the list of items.", - " @default PatchOrdering.TOP" + "Controls when form validation occurs:", + " save (default, recommended) - form is validated on save. If form is invalid - it will be revalidated on every change, until become valid", + " change - form is validated on every user change. Only fields changes in current edit session are validated" ] }, "typeValue": { - "raw": "(item: TItem) => symbol" + "raw": "'change' | 'save'" }, "editor": { - "type": "func" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, - { - "uid": "getItemTemporaryOrder", - "name": "getItemTemporaryOrder", - "comment": { - "raw": [ - "Provides information about the temporary order of the new item.", - " @param item - new item, temporary order should be got for.", - " @returns temporary order", - "", - " @experimental The API of this feature can be changed in the future releases." + "type": "oneOf", + "options": [ + "change", + "save" ] }, - "typeValue": { - "raw": "(item: TItem) => string" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:PatchOptions", + "from": "@epam/uui-core:FormProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseLazyFetchingAdvisorProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseLazyFetchingAdvisorProps", + "nameFull": "UseLazyFetchingAdvisorProps" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/lazyTree/useLazyFetchingAdvisor.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UseLazyFetchingAdvisorProps", + "print": [ + "interface UseLazyFetchingAdvisorProps {", + " dataSourceState: DataSourceState;", + " filter?: TFilter;", + " forceReload?: boolean;", + " backgroundReload?: boolean;", + " showSelectedOnly?: boolean;", + " /**", + " * Fetching function, which should be called if fetch is required.", + " * @param lazyLoadingAdvice - fetching advice.", + " */", + " onFetch?: (lazyLoadingAdvice: LazyFetchingAdvice) => void;", + "}" + ] + }, + "props": [ { - "uid": "fixItemBetweenSortings", - "name": "fixItemBetweenSortings", - "comment": { - "raw": [ - "If enabled, items position is fixed between sorting.", - " @default true" - ], - "tags": { - "@default": true - } - }, + "uid": "dataSourceState", + "name": "dataSourceState", "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataSourceState" }, - "from": "@epam/uui-core:PatchOptions", - "required": false + "required": true }, { - "uid": "sortBy", - "name": "sortBy", - "comment": { - "raw": [ - "A pure function that gets sorting value for current sorting value" - ] - }, + "uid": "filter", + "name": "filter", "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" + "raw": "TFilter" }, - "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "isFetching", - "name": "isFetching", - "comment": { - "raw": [ - "Are tree records loading silently." - ] - }, + "uid": "forceReload", + "name": "forceReload", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "isLoading", - "name": "isLoading", - "comment": { - "raw": [ - "Are tree records loading loadly (show loading placeholders, etc)." - ] - }, + "uid": "backgroundReload", + "name": "backgroundReload", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "reload", - "name": "reload", - "comment": { - "raw": [ - "Tree reloading handler." - ] - }, - "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:ITreeActions", - "required": true - }, - { - "uid": "loadMissingRecordsOnCheck", - "name": "loadMissingRecordsOnCheck", - "comment": { - "raw": [ - "Loads missing records and provides a fulfilled tree.", - " @param id - id of an item, which is checked and records should be loaded for.", - " @param isChecked - checking status of the record.", - " @param isRoot - a flag, which marks if all records should be checked/unchecked.", - " @returns fulfilled tree with missing records, those required to be loaded for checking." - ] - }, + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "typeValue": { - "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:LoadMissingRecords", "required": false }, { - "uid": "getItemStatus", - "name": "getItemStatus", + "uid": "onFetch", + "name": "onFetch", "comment": { "raw": [ - "Provides a status of the given item.", - " @param id - id of an item, status to be provided for.", - " @returns status of the item." + "Fetching function, which should be called if fetch is required.", + " @param lazyLoadingAdvice - fetching advice." ] }, "typeValue": { - "raw": "(id: TId) => RecordStatus" + "raw": "(lazyLoadingAdvice: LazyFetchingAdvice) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:GetItemStatus", - "required": false - }, - { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", - "comment": { - "raw": [ - "Falls back to plain list from tree, if there's search.", - " Default is true.", - "", - " If enabled, and search is active:", - " - API will be called with parentId and parent undefined", - " - getChildCount is ignored, all nodes are assumed to have no children", - "", - " See more here: https://github.com/epam/UUI/issues/8" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:FlattenSearchResultsConfig", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:UseUuiErrorOptions": { + "@epam/uui-core:UsePreviousConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseUuiErrorOptions", - "nameFull": "UseUuiErrorOptions" + "name": "UsePreviousConfig", + "nameFull": "UsePreviousConfig" + }, + "src": "uui-core/src/hooks/usePrevious.ts", + "comment": { + "raw": [ + "Hook configuration, which defines if previous value will be deeply compared with new value to be saved or not." + ] }, - "src": "uui-core/src/hooks/useUuiError.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "UseUuiErrorOptions", + "raw": "UsePreviousConfig", "print": [ - "interface UseUuiErrorOptions {", - " /** Config with information which data will be displayed in case of particular API error.", - " * If omitted, default config will be used.", - " * */", - " errorConfig?: Record;", - " /** Config with information which data will be displayed in case recovery errors.", - " * If omitted, default config will be used.", - " * */", - " recoveryConfig?: Record;", + "/**", + " * Hook configuration, which defines if previous value will be deeply compared with new value to be saved or not.", + " */", + "interface UsePreviousConfig {", + " /**", + " * If compare is set to true, previous value will be deeply compared with the new value,", + " * and previous value will be updated only if value is changed (not the link to the object).", + " * Otherwise, previous value will be returned.", + " * If compare is false, previous value will be changed on every rerender.", + " */", + " compare?: boolean;", "}" ] }, "props": [ { - "uid": "errorConfig", - "name": "errorConfig", + "uid": "compare", + "name": "compare", "comment": { "raw": [ - "Config with information which data will be displayed in case of particular API error.", - " If omitted, default config will be used." + "If compare is set to true, previous value will be deeply compared with the new value,", + " and previous value will be updated only if value is changed (not the link to the object).", + " Otherwise, previous value will be returned.", + " If compare is false, previous value will be changed on every rerender." ] }, "typeValue": { - "raw": "Record" - }, - "required": false - }, - { - "uid": "recoveryConfig", - "name": "recoveryConfig", - "comment": { - "raw": [ - "Config with information which data will be displayed in case recovery errors.", - " If omitted, default config will be used." - ] + "raw": "boolean" }, - "typeValue": { - "raw": "Record" + "editor": { + "type": "bool" }, "required": false } @@ -36994,43 +36488,56 @@ "propsFromUnion": false } }, - "@epam/uui-core:UseUuiErrorProps": { + "@epam/uui-core:UseResizeObserverProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseUuiErrorProps", - "nameFull": "UseUuiErrorProps" + "name": "UseResizeObserverProps", + "nameFull": "UseResizeObserverProps" + }, + "src": "uui-core/src/hooks/useResizeObserver.ts", + "comment": { + "raw": [ + "Props of useResizeObserver hook." + ] }, - "src": "uui-core/src/hooks/useUuiError.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "UseUuiErrorProps", + "raw": "UseResizeObserverProps", "print": [ - "interface UseUuiErrorProps {", - " /** Pure function to get error info for display based on error.", - " * If omitted, error info from default config or options.errorConfig will be used.", + "/**", + " * Props of useResizeObserver hook.", + " */", + "interface UseResizeObserverProps {", + " /**", + " * The handler for the resizing event, called when the size of any observed elements changes.", " */", - " getErrorInfo: (error: any, defaultErrorInfo: ErrorPageInfo) => ErrorPageInfo;", - " /** Error handling options */", - " options?: UseUuiErrorOptions;", + " onResize: ResizeObserverCallback;", + " /**", + " * Elements whose size changes should be tracked.", + " */", + " observables: Element[];", + " /**", + " * Delay (in milliseconds) before calling the onResize handler.", + " */", + " delay?: number;", "}" ] }, "props": [ { - "uid": "getErrorInfo", - "name": "getErrorInfo", + "uid": "onResize", + "name": "onResize", "comment": { "raw": [ - "Pure function to get error info for display based on error.", - " If omitted, error info from default config or options.errorConfig will be used." + "The handler for the resizing event, called when the size of any observed elements changes." ] }, "typeValue": { - "raw": "(error: any, defaultErrorInfo: ErrorPageInfo) => ErrorPageInfo" + "raw": "ResizeObserverCallback" }, "editor": { "type": "func" @@ -37038,15 +36545,31 @@ "required": true }, { - "uid": "options", - "name": "options", + "uid": "observables", + "name": "observables", "comment": { "raw": [ - "Error handling options" + "Elements whose size changes should be tracked." ] }, "typeValue": { - "raw": "UseUuiErrorOptions" + "raw": "Element[]" + }, + "required": true + }, + { + "uid": "delay", + "name": "delay", + "comment": { + "raw": [ + "Delay (in milliseconds) before calling the onResize handler." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" }, "required": false } @@ -37054,326 +36577,159 @@ "propsFromUnion": false } }, - "@epam/uui-core:UseUuiServicesProps": { + "@epam/uui-core:UseTableStateHookParams": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UseUuiServicesProps", - "nameFull": "UseUuiServicesProps" + "name": "UseTableStateHookParams", + "nameFull": "UseTableStateHookParams" }, - "src": "uui-core/src/hooks/useUuiServices.ts", + "src": "uui-core/src/hooks/useTableState/useTableState.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "UseUuiServicesProps", + "raw": "UseTableStateHookParams", "print": [ - "interface UseUuiServicesProps extends UuiServicesProps {", - " /** AppContext value */", - " appContext?: TAppContext;", - " /** Instance of the router */", - " router: IRouterContext;", + "interface UseTableStateHookParams, TViewState = any> extends UseTableStateHookBaseParams, Partial>> {", "}" ] }, "props": [ { - "uid": "appContext", - "name": "appContext", + "uid": "filters", + "name": "filters", "comment": { "raw": [ - "AppContext value" + "Filters configuration, can be omitted if you don't need filters" ] }, "typeValue": { - "raw": "TAppContext" + "raw": "TableFiltersConfig[]" }, + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "router", - "name": "router", + "uid": "initialPresets", + "name": "initialPresets", "comment": { "raw": [ - "Instance of the router" + "Initial presets array" ] }, "typeValue": { - "raw": "IRouterContext" + "raw": "ITablePreset[]" }, - "required": true + "from": "@epam/uui-core:UseTableStateHookBaseParams", + "required": false }, { - "uid": "apiDefinition", - "name": "apiDefinition", + "uid": "onPresetCreate", + "name": "onPresetCreate", "comment": { "raw": [ - "Function to get the api definitions.", - " Usually, api definitions this is an object which contain object with all api requests of the app.", - " Then you can call this requests via 'uuiContext.api.myApi(myData)'" + "Called when preset was created. Should return the ID of new preset" ] }, "typeValue": { - "raw": "(processRequest: IProcessRequest) => TApi" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:UuiServicesProps", + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "apiReloginPath", - "name": "apiReloginPath", + "uid": "onPresetUpdate", + "name": "onPresetUpdate", "comment": { "raw": [ - "Url to the relogin page. Used to open new browser window by this path, in case of auth lost error.", - " Opened by this path page, should process authentication and then post 'authSuccess' cross-window message to the opener, to recover failed requests.", - " @default '/auth/login'" - ], - "tags": { - "@default": "/auth/login" - } + "Called when preset was updated" + ] }, "typeValue": { - "raw": "string" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "apiPingPath", - "name": "apiPingPath", + "uid": "onPresetDelete", + "name": "onPresetDelete", "comment": { "raw": [ - "Url to the api, which ApiContext will start pinging in case of 'connection lost', until it gets 200 status. Then it will retry failed requests.", - " @default '/auth/ping'" - ], - "tags": { - "@default": "/auth/ping" - } + "Called when preset was deleted" + ] }, "typeValue": { - "raw": "string" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "apiServerUrl", - "name": "apiServerUrl", + "uid": "initialVisibleCount", + "name": "initialVisibleCount", "comment": { "raw": [ - "Url to the server api under which all requests will be processed. Usefully for cases, when all api located by some specific url, which is not much app url.", - " @default ''" - ], - "tags": { - "@default": "" - } + "Initial visibleCount table state value" + ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "fetch", - "name": "fetch", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", - " By default, standard fetch will be used." + "True if component contains invalid input" ] }, "typeValue": { - "raw": "typeof fetch" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:ICanBeInvalid", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UseVirtualListProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseVirtualListProps", - "nameFull": "UseVirtualListProps" - }, - "src": "uui-core/src/hooks/useVirtualList/types.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UseVirtualListProps", - "print": [ - "interface UseVirtualListProps extends IEditable {", - " /** Count of list items */", - " rowsCount?: number | undefined;", - " /**", - " * Virtual list will align topIndex and visibleCount to the block size.", - " * E.g. with block size = 10, even if we have rows 2 to 12 visible, the range will be aligned to 0-20", - " * This is done to not re-render rows on each scroll.", - " * When scrolling, re-render will happen only when we scroll over the next blockSize rows.", - " * Default is 20.", - " */", - " blockSize?: number;", - " /**", - " * Number of rows to draw before the top and after the bottom of the list.", - " * This is required to hide blank areas while scrolling.", - " * Default is 20.", - " */", - " overdrawRows?: number;", - " /** Called when list was scrolled */", - " onScroll?(value: HTMLElement): void;", - " /**", - " * Selector to get rows container node.", - " */", - " rowsSelector?: string;", - "}" - ] - }, - "props": [ + }, { - "uid": "rowsCount", - "name": "rowsCount", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Count of list items" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "blockSize", - "name": "blockSize", - "comment": { - "raw": [ - "Virtual list will align topIndex and visibleCount to the block size.", - " E.g. with block size = 10, even if we have rows 2 to 12 visible, the range will be aligned to 0-20", - " This is done to not re-render rows on each scroll.", - " When scrolling, re-render will happen only when we scroll over the next blockSize rows.", - " Default is 20." - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false - }, - { - "uid": "overdrawRows", - "name": "overdrawRows", - "comment": { - "raw": [ - "Number of rows to draw before the top and after the bottom of the list.", - " This is required to hide blank areas while scrolling.", - " Default is 20." - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false - }, - { - "uid": "onScroll", - "name": "onScroll", - "comment": { - "raw": [ - "Called when list was scrolled" - ] - }, - "typeValue": { - "raw": "(value: HTMLElement) => void" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "rowsSelector", - "name": "rowsSelector", - "comment": { - "raw": [ - "Selector to get rows container node." - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "isInvalid", - "name": "isInvalid", - "comment": { - "raw": [ - "True if component contains invalid input" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false - }, - { - "uid": "isDisabled", - "name": "isDisabled", - "comment": { - "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IDisableable", - "required": false - }, - { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ "Disable editing. Unlike isDisabled, keep component's value readable." @@ -37414,10 +36770,10 @@ ] }, "typeValue": { - "raw": "VirtualListState" + "raw": "DataTableState" }, "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { "uid": "onValueChange", @@ -37428,1312 +36784,1524 @@ ] }, "typeValue": { - "raw": "(newValue: VirtualListState) => void" + "raw": "(newValue: DataTableState) => void" }, "editor": { "type": "func" }, "from": "@epam/uui-core:IControlled", - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:UuiContexts": { + "@epam/uui-core:UseTreeProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "UuiContexts", - "nameFull": "UuiContexts" + "name": "UseTreeProps", + "nameFull": "UseTreeProps" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", + "comment": { + "raw": [ + "useTree hook configuration." + ] }, - "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "UuiContexts", + "raw": "SyncTreeProps | AsyncTreeProps | LazyTreeProps", "print": [ - "interface UuiContexts {", - " /** Api service allows you to process requests with an error handling.", - " * See more here - https://uui.epam.com/documents?id=apiContext&category=contexts", - " * */", - " uuiApi: IApiContext;", - " /** Instance of react-router wrapped by UUI adapter */", - " uuiRouter: IRouterContext;", - " /** Modals service allows you to show modal windows over the main content.", - " * See more here - https://uui.epam.com/documents?id=modalContext&category=contexts", - " * */", - " uuiModals: IModalContext;", - " /** Drag and Drop service for dnd operations.", - " * See more here - https://uui.epam.com/documents?id=dragAndDrop", - " * */", - " uuiDnD: IDndContext;", - " /** UserSettings service allows you to store user data in localStorage. */", - " uuiUserSettings: IUserSettingsContext;", - " /** Web analytics service allows you to send user interaction events to the analytics systems.", - " * See more here - https://uui.epam.com/documents?id=analyticsContext&category=contexts", - " * */", - " uuiAnalytics: IAnalyticsContext;", - " /** Error service allows you to report errors.", - " * See more here - https://uui.epam.com/documents?id=apiContext&category=contexts", - " * */", - " uuiErrors: IErrorContext;", - " /** Notifications service allows you to show notifications over the main content.", - " * See more here - https://uui.epam.com/documents?id=notificationContextDoc&category=contexts", - " * */", - " uuiNotifications: INotificationContext;", - " /** Layout service. Used to manage layout for overlays like modals, dropdowns, etc. */", - " uuiLayout: ILayoutContext;", - " /** Lock service.", - " * See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts", - " * */", - " uuiLocks: ILockContext;", - "}" + "/**", + " * useTree hook configuration.", + " */", + "type UseTreeProps = (SyncTreeProps | AsyncTreeProps | LazyTreeProps);" ] }, "props": [ { - "uid": "uuiApi", - "name": "uuiApi", + "uid": "dataSourceState", + "name": "dataSourceState", "comment": { "raw": [ - "Api service allows you to process requests with an error handling.", - " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" + "State of the dataSource." ] }, "typeValue": { - "raw": "IApiContext" + "raw": "DataSourceState" }, + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "uuiRouter", - "name": "uuiRouter", + "uid": "setDataSourceState", + "name": "setDataSourceState", "comment": { "raw": [ - "Instance of react-router wrapped by UUI adapter" + "DataSource state update handler." ] }, "typeValue": { - "raw": "IRouterContext" + "raw": "SetDataSourceState" + }, + "typeValueRef": "@epam/uui-core:SetDataSourceState", + "editor": { + "type": "func" }, + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "uuiModals", - "name": "uuiModals", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Modals service allows you to show modal windows over the main content.", - " See more here - https://uui.epam.com/documents?id=modalContext&category=contexts" + "Should return unique ID of the TItem", + " If omitted, we assume that every TItem has and unique id in its 'id' field.", + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { - "raw": "IModalContext" + "raw": "(item: TItem) => TId" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiDnD", - "name": "uuiDnD", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Drag and Drop service for dnd operations.", - " See more here - https://uui.epam.com/documents?id=dragAndDrop" + "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", + " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." ] }, "typeValue": { - "raw": "IDndContext" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiUserSettings", - "name": "uuiUserSettings", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "UserSettings service allows you to store user data in localStorage." + "Should return ID of the Item's parent. Usually it's i => i.parentId.", + " If specified, Data Source will build items hierarchy.", + "", + " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", + " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", + " to highlight parents with selected children", + " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", + " We need to load parents with a separate call (if backend doesn't pre-fetch them)", + "", + " @param item - record, which paretnId should be returned.", + " @returns item parentId." ] }, "typeValue": { - "raw": "IUserSettingsContext" + "raw": "(item: TItem) => TId | undefined" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiAnalytics", - "name": "uuiAnalytics", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "Web analytics service allows you to send user interaction events to the analytics systems.", - " See more here - https://uui.epam.com/documents?id=analyticsContext&category=contexts" + "Specifies if rows are selectable, checkable, draggable, clickable, and more.", + " See DataRowOptions for more details.", + " If options depends on the item itself, use getRowOptions.", + " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item An item to get options for" ] }, "typeValue": { - "raw": "IAnalyticsContext" + "raw": "DataRowOptions" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiErrors", - "name": "uuiErrors", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Error service allows you to report errors.", - " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" + "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", + " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", + " See DataRowOptions for more details.", + " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item - record, configuration should be returned for.", + " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." ] }, "typeValue": { - "raw": "IErrorContext" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiNotifications", - "name": "uuiNotifications", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Notifications service allows you to show notifications over the main content.", - " See more here - https://uui.epam.com/documents?id=notificationContextDoc&category=contexts" + "Can be specified to unfold all or some items at start.", + " If not specified, all rows would be folded.", + " @param item - record, folding value should be returned for.", + " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." ] }, "typeValue": { - "raw": "INotificationContext" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiLayout", - "name": "uuiLayout", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Layout service. Used to manage layout for overlays like modals, dropdowns, etc." + "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", + " - false: All nodes are selected independently (default).", + " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", + " - 'implicit': Selecting a parent node means that all children are considered checked.", + " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", + " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", + " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", + " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." ] }, "typeValue": { - "raw": "ILayoutContext" + "raw": "boolean | 'implicit' | 'explicit'" }, - "required": true + "editor": { + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "uuiLocks", - "name": "uuiLocks", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "Lock service.", - " See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts" - ] - }, - "typeValue": { - "raw": "ILockContext" + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UuiRecoveryErrorInfo": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UuiRecoveryErrorInfo", - "nameFull": "UuiRecoveryErrorInfo" - }, - "src": "uui-core/src/hooks/useUuiError.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "UuiRecoveryErrorInfo", - "print": [ - "type UuiRecoveryErrorInfo = {", - " title: string;", - " subtitle: string;", - "};" - ] - }, - "props": [ - { - "uid": "title", - "name": "title", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "subtitle", - "name": "subtitle", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:UuiServicesProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UuiServicesProps", - "nameFull": "UuiServicesProps" - }, - "src": "uui-core/src/hooks/useUuiServices.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "UuiServicesProps", - "print": [ - "interface UuiServicesProps extends ApiContextProps {", - " /** Function to get the api definitions.", - " * Usually, api definitions this is an object which contain object with all api requests of the app.", - " * Then you can call this requests via 'uuiContext.api.myApi(myData)'", - " * */", - " apiDefinition?: (processRequest: IProcessRequest) => TApi;", - "}" - ] - }, - "props": [ - { - "uid": "apiDefinition", - "name": "apiDefinition", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Function to get the api definitions.", - " Usually, api definitions this is an object which contain object with all api requests of the app.", - " Then you can call this requests via 'uuiContext.api.myApi(myData)'" + "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", + " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." ] }, "typeValue": { - "raw": "(processRequest: IProcessRequest) => TApi" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "apiReloginPath", - "name": "apiReloginPath", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Url to the relogin page. Used to open new browser window by this path, in case of auth lost error.", - " Opened by this path page, should process authentication and then post 'authSuccess' cross-window message to the opener, to recover failed requests.", - " @default '/auth/login'" - ], - "tags": { - "@default": "/auth/login" - } + "Items, which should be added/updated/deleted from the tree." + ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "IMap | IImmutableMap" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "apiPingPath", - "name": "apiPingPath", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Url to the api, which ApiContext will start pinging in case of 'connection lost', until it gets 200 status. Then it will retry failed requests.", - " @default '/auth/ping'" - ], - "tags": { - "@default": "/auth/ping" - } + "To enable deleting of the items, it is required to specify getter for deleted state." + ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "apiServerUrl", - "name": "apiServerUrl", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Url to the server api under which all requests will be processed. Usefully for cases, when all api located by some specific url, which is not much app url.", - " @default ''" - ], - "tags": { - "@default": "" - } + "Provides information about the relative position of the new item.", + " @param item - new item, position should be got for.", + " @returns relative position in the list of items.", + " @default PatchOrdering.TOP" + ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem) => symbol" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "fetch", - "name": "fetch", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", - " By default, standard fetch will be used." + "Provides information about the temporary order of the new item.", + " @param item - new item, temporary order should be got for.", + " @returns temporary order", + "", + " @experimental The API of this feature can be changed in the future releases." ] }, "typeValue": { - "raw": "typeof fetch" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:PatchOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ValidationMode": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ValidationMode", - "nameFull": "ValidationMode" - }, - "src": "uui-core/src/data/validation/validate.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'change' | 'save'", - "print": [ - "type ValidationMode = 'change' | 'save';" - ] - } - } - }, - "@epam/uui-core:ValidationState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ValidationState", - "nameFull": "ValidationState" - }, - "src": "uui-core/src/data/lenses/types.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ValidationState", - "print": [ - "interface ValidationState extends ICanBeInvalid, IHasValidationMessage {", - " /** If T is a complex value (object or array), this property contains validation states of inner items */", - " validationProps?: {", - " [key: string]: ValidationState;", - " };", - "}" - ] - }, - "props": [ + }, { - "uid": "validationProps", - "name": "validationProps", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "If T is a complex value (object or array), this property contains validation states of inner items" - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "{ [key: string]: ValidationState; }" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "True if component contains invalid input" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "Message describing why the value is invalid" + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(item: TItem) => string[]" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:SearchConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:VirtualListRange": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "VirtualListRange", - "nameFull": "VirtualListRange" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "VirtualListRange", - "print": [ - "interface VirtualListRange {", - " /**", - " * Index of the topmost item, in rendered batch.", - " * Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list", - " */", - " topIndex?: number;", - " /**", - " * Number of currently rendered items.", - " * Virtual list updates this value automatically, if it too small.", - " * Note Virtual List renders more items, that actually visible,", - " * as it need maintain some reserve of rows on top / at the bottom of the list.", - " */", - " visibleCount?: number;", - "}" - ] - }, - "props": [ + }, { - "uid": "topIndex", - "name": "topIndex", + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", "comment": { "raw": [ - "Index of the topmost item, in rendered batch.", - " Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list" + "Enables sorting of search results by relevance.", + " - The highest priority has records, which have a full match with a search keyword.", + " - The lower one has records, which have a search keyword at the 0 position, but not the full match.", + " - Then, records, which contain a search keyword as a separate word, but not at the beginning.", + " - And the lowest one - any other match of the search keyword.", + "", + " Example:", + " - `search`: 'some'", + " - `record string`: 'some word', `rank` = 4", + " - `record string`: 'someone', `rank` = 3", + " - `record string`: 'I know some guy', `rank` = 2", + " - `record string`: 'awesome', `rank` = 1", + "", + " @default true" + ], + "tags": { + "@default": true + } + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:SearchConfig", + "required": false + }, + { + "uid": "getFilter", + "name": "getFilter", + "comment": { + "raw": [ + "A pure function that returns filter callback to be applied for each item.", + " The callback should return true, if item passed the filter." ] }, "typeValue": { - "raw": "number" + "raw": "(filter: TFilter) => (item: TItem) => boolean" }, "editor": { - "type": "number" + "type": "func" }, + "from": "@epam/uui-core:FilterConfig", "required": false }, { - "uid": "visibleCount", - "name": "visibleCount", + "uid": "setItems", + "name": "setItems", "comment": { "raw": [ - "Number of currently rendered items.", - " Virtual list updates this value automatically, if it too small.", - " Note Virtual List renders more items, that actually visible,", - " as it need maintain some reserve of rows on top / at the bottom of the list." + "Items updating listener, which fires on items loading/reloading/reset." ] }, "typeValue": { - "raw": "number" + "raw": "(items: TItem[], options?: ModificationOptions | undefined) => ItemsMap" }, "editor": { - "type": "number" + "type": "func" }, + "from": "@epam/uui-core:SharedItemsState", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:VirtualListState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "VirtualListState", - "nameFull": "VirtualListState" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Holds state of a Virtual List - top visible item index, and estimated count of visible items" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "VirtualListState", - "print": [ - "/** Holds state of a Virtual List - top visible item index, and estimated count of visible items */", - "interface VirtualListState extends VirtualListRange {", - " /**", - " * Virtual list ensures that row with this Index is within the visible area, if not Virtual List .", - " * Virtual list updates this value on scroll to null when appear in the visible area.", - " * If this value is updated manually, Virtual List would scroll to the specified items.", - " * It would attempt to put scroll so this item will be at the top of the list.", - " */", - " scrollTo?: ScrollToConfig;", - "}" - ] - }, - "props": [ + }, { - "uid": "scrollTo", - "name": "scrollTo", + "uid": "items", + "name": "items", "comment": { "raw": [ - "Virtual list ensures that row with this Index is within the visible area, if not Virtual List .", - " Virtual list updates this value on scroll to null when appear in the visible area.", - " If this value is updated manually, Virtual List would scroll to the specified items.", - " It would attempt to put scroll so this item will be at the top of the list." + "Data, which should be represented by a DataSource." ] }, "typeValue": { - "raw": "ScrollToConfig" + "raw": "TItem[]" }, + "from": "@epam/uui-core:ArrayDataSourceConfig", "required": false }, { - "uid": "topIndex", - "name": "topIndex", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Index of the topmost item, in rendered batch.", - " Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list" + "Type of the tree to be supported." ] }, "typeValue": { - "raw": "number" + "raw": "'sync'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "sync" + ] }, - "from": "@epam/uui-core:VirtualListRange", - "required": false + "from": "@epam/uui-core:SyncTreeProps", + "required": true }, { - "uid": "visibleCount", - "name": "visibleCount", + "uid": "type_2", + "name": "type", "comment": { "raw": [ - "Number of currently rendered items.", - " Virtual list updates this value automatically, if it too small.", - " Note Virtual List renders more items, that actually visible,", - " as it need maintain some reserve of rows on top / at the bottom of the list." + "Type of the tree to be supported." ] }, "typeValue": { - "raw": "number" + "raw": "'async'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "async" + ] }, - "from": "@epam/uui-core:VirtualListRange", + "from": "@epam/uui-core:AsyncTreeProps", + "required": true + }, + { + "uid": "isLoaded", + "name": "isLoaded", + "comment": { + "raw": [ + "Disables loading of records, if isLoaded = true.", + " If isLoaded = true, items are taken from itemsMap.", + " @internal" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:AsyncTreeProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:VPanelProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "VPanelProps", - "nameFull": "VPanelProps" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "VPanelProps", - "print": [ - "type VPanelProps = IHasCX & IHasChildren & IClickable & IHasRawProps> & IHasForwardedRef & IAnalyticableClick & {", - " /** Native style attributes */", - " style?: CSSProperties;", - "};" - ] - }, - "props": [ + }, { - "uid": "cx", - "name": "cx", + "uid": "itemsMap", + "name": "itemsMap", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Map of shared items." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "ItemsMap" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "from": "@epam/uui-core:SharedItemsState", "required": false }, { - "uid": "children", - "name": "children", + "uid": "itemsStatusMap", + "name": "itemsStatusMap", "comment": { "raw": [ - "Component children" + "Map of items statuses." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "IMap" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "from": "@epam/uui-core:ItemsStatuses", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "itemsStatusCollector", + "name": "itemsStatusCollector", + "typeValue": { + "raw": "ItemsStatusCollector" + }, + "from": "@epam/uui-core:ItemsStatuses", + "required": false + }, + { + "uid": "api", + "name": "api", "comment": { "raw": [ - "Called when component is clicked" + "A function to retrieve the data, asynchronously. This function usually performs a REST API call.", + " Should return the array of items, which will be processed by dataSource.", + " This api called only once during the initialization and assumed to return the full amount of data.", + " For lazy loading cases, use LazyDataSource" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "() => Promise" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:AsyncDataSourceConfig", + "required": true + }, + { + "uid": "api_2", + "name": "api", + "comment": { + "raw": [ + "A function to retrieve the data, asynchronously.", + " This function usually performs a REST API call.", + " API is used to retrieve lists of items.", + " It is expected to:", + " - be able to handle paging (via from/count params)", + " - be able to retrieve specific items by the list of their ids", + " - be able to retrieve children by parents (when getChildCount is specified, and ctx.parentId is passed)" + ] + }, + "typeValue": { + "raw": "LazyDataSourceApi" + }, + "typeValueRef": "@epam/uui-core:LazyDataSourceApi", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": true + }, + { + "uid": "getChildCount", + "name": "getChildCount", + "comment": { + "raw": [ + "Should return number of children of the item.", + " If it returns > 0, the item is assumed to have children and to be foldable.", + " Usually, this value should be returned from API, as a field of a parent, e.g. { id: 1, name: 'London', childCount: 12 }.", + " In this case, you can implement getChildCount as (i) => i.childCount.", + "", + " If you can't get number of children via API, you can return a guess value (avg number of children for this type of entity).", + " Note, that this can lead to more API calls, and increased load times in the 'parallel' fetch mode." + ] + }, + "typeValue": { + "raw": "(item: TItem) => number" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "A filter to pass to API.", + " Note, that the DataSourceState also has a filter fields. These two filters are merged before API calls.", + " Use this prop if you need to apply some filter in any case.", + " Prefer to use filter in the DataSourceState for end-user editable filters." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "TFilter" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "fetchStrategy", + "name": "fetchStrategy", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Defines how to fetch children:", + " sequential (default) - fetch children for each parent one-by-one. Makes minimal over-querying, at cost of some speed.", + " parallel - fetch children for several parents simultaneously. Can make a lot of over-querying for deep trees.", + " Recommended for 2 level trees (grouping), as it makes no over-querying in this case, and is faster than sequential strategy." ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "'sequential' | 'parallel'" }, - "from": "@epam/uui-core:IHasForwardedRef", + "editor": { + "type": "oneOf", + "options": [ + "sequential", + "parallel" + ] + }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "backgroundReload", + "name": "backgroundReload", "comment": { "raw": [ - "An analytics event to send (via AnalyticsContext) when component is clicked.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "Enables background reloading of data on search/sort/filter/reload, which turns off the rows placeholders displaying while data loading.", + " During data reloading, previous data is displayed. To prevent any interaction with visible not actual rows, a blocker/spinner should be displayed.", + " In UUI components, such as `PickerInput`, `PickerList`, `PickerModal` and `DataTable`, blockers are added.", + " It is required to add blockers/spinners to the components, built on your own.", + " If reloading is started, `view.getListProps` returns `isReloading` flag, set to `true`." ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "boolean" }, - "from": "@epam/uui-core:IAnalyticableClick", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "style", - "name": "style", + "uid": "flattenSearchResults", + "name": "flattenSearchResults", "comment": { "raw": [ - "Native style attributes" + "Falls back to plain list from tree, if there's search.", + " Default is true.", + "", + " If enabled, and search is active:", + " - API will be called with parentId and parent undefined", + " - getChildCount is ignored, all nodes are assumed to have no children", + "", + " See more here: https://github.com/epam/UUI/issues/8" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:FlattenSearchResultsConfig", "required": false + }, + { + "uid": "type_3", + "name": "type", + "comment": { + "raw": [ + "Type of the tree to be supported." + ] + }, + "typeValue": { + "raw": "'lazy'" + }, + "editor": { + "type": "oneOf", + "options": [ + "lazy" + ] + }, + "from": "@epam/uui-core:LazyTreeProps", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:ApiCallStatus": { + "@epam/uui-core:UseTreeResult": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ApiCallStatus", - "nameFull": "ApiCallStatus" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": false - } - }, - "@epam/uui-core:ArrayDataSourceConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ArrayDataSourceConfig", - "nameFull": "ArrayDataSourceConfig" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "exported": false - } - }, - "@epam/uui-core:AsyncDataSourceConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "AsyncDataSourceConfig", - "nameFull": "AsyncDataSourceConfig" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "exported": false - } - }, - "@epam/uui-core:AsyncTreeProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "AsyncTreeProps", - "nameFull": "AsyncTreeProps" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/asyncTree/types.ts", - "comment": { - "raw": [ - "Async tree hook configuration." - ] - }, - "exported": false - } - }, - "@epam/uui-core:CommonTreeConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "CommonTreeConfig", - "nameFull": "CommonTreeConfig" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "comment": { - "raw": [ - "Tree configuration." - ] - }, - "exported": false - } - }, - "@epam/uui-core:CustomFilterConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "CustomFilterConfig", - "nameFull": "CustomFilterConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": false - } - }, - "@epam/uui-core:DatePickerFilterConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DatePickerFilterConfig", - "nameFull": "DatePickerFilterConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": false - } - }, - "@epam/uui-core:FilterConfigBase": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "FilterConfigBase", - "nameFull": "FilterConfigBase" - }, - "src": "uui-core/src/types/tables.ts", - "exported": false - } - }, - "@epam/uui-core:GetItemStatus": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "GetItemStatus", - "nameFull": "GetItemStatus" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", - "comment": { - "raw": [ - "Item status getter." - ] - }, - "exported": false - } - }, - "@epam/uui-core:ItemsStatuses": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ItemsStatuses", - "nameFull": "ItemsStatuses" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "exported": false - } - }, - "@epam/uui-core:ITreeActions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ITreeActions", - "nameFull": "ITreeActions" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "comment": { - "raw": [ - "Actions, allowed to be performed on the tree." - ] - }, - "exported": false - } - }, - "@epam/uui-core:ITreeLoadingState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ITreeLoadingState", - "nameFull": "ITreeLoadingState" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "comment": { - "raw": [ - "Loading state of the tree." - ] - }, - "exported": false - } - }, - "@epam/uui-core:LazyDataSourceConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyDataSourceConfig", - "nameFull": "LazyDataSourceConfig" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "exported": false - } - }, - "@epam/uui-core:LazyTreeProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyTreeProps", - "nameFull": "LazyTreeProps" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/lazyTree/types.ts", - "exported": false - } - }, - "@epam/uui-core:LoadMissingRecords": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LoadMissingRecords", - "nameFull": "LoadMissingRecords" + "name": "UseTreeResult", + "nameFull": "UseTreeResult" }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", + "src": "uui-core/src/data/processing/views/tree/hooks/types.ts", "comment": { "raw": [ - "Load missing records getter." + "Result of the useTree hook." ] }, - "exported": false - } - }, - "@epam/uui-core:NumericFilterConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "NumericFilterConfig", - "nameFull": "NumericFilterConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": false - } - }, - "@epam/uui-core:RangeDatePickerFilterConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RangeDatePickerFilterConfig", - "nameFull": "RangeDatePickerFilterConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": false - } - }, - "@epam/uui-core:RouterState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RouterState", - "nameFull": "RouterState" - }, - "src": "uui-core/src/services/routing/interfaces/IRouter6.ts", - "exported": false - } - }, - "@epam/uui-core:SharedItemsState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SharedItemsState", - "nameFull": "SharedItemsState" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", - "exported": false - } - }, - "@epam/uui-core:SyncTreeProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "SyncTreeProps", - "nameFull": "SyncTreeProps" - }, - "src": "uui-core/src/data/processing/views/tree/hooks/strategies/syncTree/types.ts", - "exported": false - } - }, - "@epam/uui-core:UseTableStateHookBaseParams": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "UseTableStateHookBaseParams", - "nameFull": "UseTableStateHookBaseParams" - }, - "src": "uui-core/src/hooks/useTableState/useTableState.ts", - "exported": false - } - }, - "@epam/uui-components:AccordionProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "AccordionProps", - "nameFull": "AccordionProps" - }, - "src": "uui-components/src/layout/Accordion.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "GeneralAccordionProps | EditableAccordionProps", + "raw": "UseTreeResult", "print": [ - "type AccordionProps = GeneralAccordionProps | EditableAccordionProps;" + "/**", + " * Result of the useTree hook.", + " */", + "interface UseTreeResult extends Omit, 'patch'>, ITreeLoadingState, ITreeActions, LoadMissingRecords, GetItemStatus, FlattenSearchResultsConfig {", + " /**", + " * Tree-like data, rows to be build from.", + " */", + " tree: ITree;", + " /**", + " * Tree-like data, selected rows to be build from and cascade selection should be performed on.", + " */", + " selectionTree: ITree;", + " /**", + " * Version of the tree before applying patch to it.", + " */", + " treeWithoutPatch: ITree;", + " /**", + " * Total count of the rows.", + " */", + " totalCount?: number;", + " /**", + " * Allows patching an existing tree with updated data multiple times without affecting the original tree.", + " * It can be used while adding subtotals or making other changes to the data, based on update results before setting data to the form.", + " * @param modifiedItems Map of updated, deleted, or added items to be applied to the existing tree.", + " * @returns A new tree patched with the modified items.", + " */", + " applyPatch: (modifiedItems: IMap | IImmutableMap) => ITree;", + "}" ] }, "props": [ { - "uid": "title", - "name": "title", + "uid": "tree", + "name": "tree", "comment": { "raw": [ - "Accordion title" + "Tree-like data, rows to be build from." ] }, "typeValue": { - "raw": "string | React.ReactElement>" + "raw": "ITree" + }, + "required": true + }, + { + "uid": "selectionTree", + "name": "selectionTree", + "comment": { + "raw": [ + "Tree-like data, selected rows to be build from and cascade selection should be performed on." + ] + }, + "typeValue": { + "raw": "ITree" + }, + "required": true + }, + { + "uid": "treeWithoutPatch", + "name": "treeWithoutPatch", + "comment": { + "raw": [ + "Version of the tree before applying patch to it." + ] + }, + "typeValue": { + "raw": "ITree" + }, + "required": true + }, + { + "uid": "totalCount", + "name": "totalCount", + "comment": { + "raw": [ + "Total count of the rows." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-components:GeneralAccordionProps", "required": false }, { - "uid": "renderTitle", - "name": "renderTitle", + "uid": "applyPatch", + "name": "applyPatch", "comment": { "raw": [ - "Overrides default title rendering." + "Allows patching an existing tree with updated data multiple times without affecting the original tree.", + " It can be used while adding subtotals or making other changes to the data, based on update results before setting data to the form.", + " @param modifiedItems Map of updated, deleted, or added items to be applied to the existing tree.", + " @returns A new tree patched with the modified items." ] }, "typeValue": { - "raw": "(isOpen: boolean) => React.ReactElement>" + "raw": "(modifiedItems: IMap | IImmutableMap) => ITree" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-components:GeneralAccordionProps", + "required": true + }, + { + "uid": "dataSourceState", + "name": "dataSourceState", + "comment": { + "raw": [ + "State of the dataSource." + ] + }, + "typeValue": { + "raw": "DataSourceState" + }, + "from": "@epam/uui-core:CommonTreeConfig", + "required": true + }, + { + "uid": "setDataSourceState", + "name": "setDataSourceState", + "comment": { + "raw": [ + "DataSource state update handler." + ] + }, + "typeValue": { + "raw": "SetDataSourceState" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:CommonTreeConfig", + "required": true + }, + { + "uid": "getId", + "name": "getId", + "comment": { + "raw": [ + "Should return unique ID of the TItem", + " If omitted, we assume that every TItem has and unique id in its 'id' field.", + " @param item - record, which id should be returned.", + " @returns item id." + ] + }, + "typeValue": { + "raw": "(item: TItem) => TId" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "dropdownIcon", - "name": "dropdownIcon", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Overrides the default dropdown (folding) icon.Pass null to disable the folding icon completely" + "Set to true, if you use IDs which can't act as javascript Map key (objects or arrays).", + " In this case, IDs will be internally JSON.stringify-ed to be used as Maps keys." ] }, "typeValue": { - "raw": "null | Icon" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-components:GeneralAccordionProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "renderAdditionalItems", - "name": "renderAdditionalItems", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Renders additional items to component's header (after the title, and before the folding icon)" + "Should return ID of the Item's parent. Usually it's i => i.parentId.", + " If specified, Data Source will build items hierarchy.", + "", + " Also, it is used by LazyDataSource to pre-fetch missing parents of loaded items. This is required in following cases:", + " - when a child item is pre-selected, but not yet loaded at start. We need to load it's parent chain", + " to highlight parents with selected children", + " - in flattenSearch mode, we usually want to display a path to each item (e.g. Canada/Ontario/Paris),", + " We need to load parents with a separate call (if backend doesn't pre-fetch them)", + "", + " @param item - record, which paretnId should be returned.", + " @returns item parentId." ] }, "typeValue": { - "raw": "(isOpen: boolean) => React.ReactNode" + "raw": "(item: TItem) => TId | undefined" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-components:GeneralAccordionProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Specifies if rows are selectable, checkable, draggable, clickable, and more.", + " See DataRowOptions for more details.", + " If options depends on the item itself, use getRowOptions.", + " Specifying both rowOptions and getRowOptions might help to render better loading skeletons: we use only rowOptions in this case, as we haven't loaded an item yet.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item An item to get options for" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "DataRowOptions" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "For each row, specify if row is selectable, editable, checkable, draggable, clickable, have its own set of columns, and more.", + " To make rows editable, pass IEditable interface to each row. This works the same way as for other editable components.", + " See DataRowOptions for more details.", + " If both getRowOptions and rowOptions specified, we'll use getRowOptions for loaded rows, and rowOptions only for loading rows.", + " Make sure all callbacks are properly memoized, as changing them will trigger re-renders or row, which would impact performance", + " @param item - record, configuration should be returned for.", + " @param index - index of a row. It is optional and should not be expected, that it is provided on every call." ] }, + "typeValue": { + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false + }, + { + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", + "comment": { + "raw": [ + "Can be specified to unfold all or some items at start.", + " If not specified, all rows would be folded.", + " @param item - record, folding value should be returned for.", + " @param dataSourceState - dataSource state with current `foldAll` value. It provides the possibility to respect foldAll change, if `isFoldedByDefault` is implemented." + ] + }, + "typeValue": { + "raw": "(item: TItem, state: DataSourceState) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false + }, + { + "uid": "cascadeSelection", + "name": "cascadeSelection", + "comment": { + "raw": [ + "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", + " - false: All nodes are selected independently (default).", + " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", + " - 'implicit': Selecting a parent node means that all children are considered checked.", + " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", + " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", + " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", + " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." + ] + }, + "typeValue": { + "raw": "boolean | 'implicit' | 'explicit'" + }, + "editor": { + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false + }, + { + "uid": "selectAll", + "name": "selectAll", + "comment": { + "raw": [ + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "children", - "name": "children", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Component children" + "Enables returning only selected rows and loading missing selected/checked rows, if it is required/possible.", + " If enabled, `useView` returns only selected rows from `IDataSourceView.getVisibleRows`." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(item: TItem) => boolean" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, + { + "uid": "getNewItemPosition", + "name": "getNewItemPosition", + "comment": { + "raw": [ + "Provides information about the relative position of the new item.", + " @param item - new item, position should be got for.", + " @returns relative position in the list of items.", + " @default PatchOrdering.TOP" + ] + }, + "typeValue": { + "raw": "(item: TItem) => symbol" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, + { + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", + "comment": { + "raw": [ + "Provides information about the temporary order of the new item.", + " @param item - new item, temporary order should be got for.", + " @returns temporary order", + "", + " @experimental The API of this feature can be changed in the future releases." + ] + }, + "typeValue": { + "raw": "(item: TItem) => string" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, + { + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", + "comment": { + "raw": [ + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, + { + "uid": "sortBy", + "name": "sortBy", + "comment": { + "raw": [ + "A pure function that gets sorting value for current sorting value" + ] + }, + "typeValue": { + "raw": "(item: TItem, sorting: SortingOption) => any" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:SortConfig", + "required": false + }, + { + "uid": "isFetching", + "name": "isFetching", + "comment": { + "raw": [ + "Are tree records loading silently." + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "value", - "name": "value", + "uid": "isLoading", + "name": "isLoading", + "comment": { + "raw": [ + "Are tree records loading loadly (show loading placeholders, etc)." + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ITreeLoadingState", + "required": false + }, + { + "uid": "reload", + "name": "reload", + "comment": { + "raw": [ + "Tree reloading handler." + ] + }, + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ITreeActions", + "required": true + }, + { + "uid": "loadMissingRecordsOnCheck", + "name": "loadMissingRecordsOnCheck", + "comment": { + "raw": [ + "Loads missing records and provides a fulfilled tree.", + " @param id - id of an item, which is checked and records should be loaded for.", + " @param isChecked - checking status of the record.", + " @param isRoot - a flag, which marks if all records should be checked/unchecked.", + " @returns fulfilled tree with missing records, those required to be loaded for checking." + ] + }, + "typeValue": { + "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:LoadMissingRecords", + "required": false + }, + { + "uid": "getItemStatus", + "name": "getItemStatus", + "comment": { + "raw": [ + "Provides a status of the given item.", + " @param id - id of an item, status to be provided for.", + " @returns status of the item." + ] + }, + "typeValue": { + "raw": "(id: TId) => RecordStatus" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:GetItemStatus", + "required": false + }, + { + "uid": "flattenSearchResults", + "name": "flattenSearchResults", + "comment": { + "raw": [ + "Falls back to plain list from tree, if there's search.", + " Default is true.", + "", + " If enabled, and search is active:", + " - API will be called with parentId and parent undefined", + " - getChildCount is ignored, all nodes are assumed to have no children", + "", + " See more here: https://github.com/epam/UUI/issues/8" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:FlattenSearchResultsConfig", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseUuiErrorOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseUuiErrorOptions", + "nameFull": "UseUuiErrorOptions" + }, + "src": "uui-core/src/hooks/useUuiError.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UseUuiErrorOptions", + "print": [ + "interface UseUuiErrorOptions {", + " /** Config with information which data will be displayed in case of particular API error.", + " * If omitted, default config will be used.", + " * */", + " errorConfig?: Record;", + " /** Config with information which data will be displayed in case recovery errors.", + " * If omitted, default config will be used.", + " * */", + " recoveryConfig?: Record;", + "}" + ] + }, + "props": [ + { + "uid": "errorConfig", + "name": "errorConfig", + "comment": { + "raw": [ + "Config with information which data will be displayed in case of particular API error.", + " If omitted, default config will be used." + ] + }, + "typeValue": { + "raw": "Record" + }, + "required": false + }, + { + "uid": "recoveryConfig", + "name": "recoveryConfig", + "comment": { + "raw": [ + "Config with information which data will be displayed in case recovery errors.", + " If omitted, default config will be used." + ] + }, + "typeValue": { + "raw": "Record" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseUuiErrorProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseUuiErrorProps", + "nameFull": "UseUuiErrorProps" + }, + "src": "uui-core/src/hooks/useUuiError.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UseUuiErrorProps", + "print": [ + "interface UseUuiErrorProps {", + " /** Pure function to get error info for display based on error.", + " * If omitted, error info from default config or options.errorConfig will be used.", + " */", + " getErrorInfo: (error: any, defaultErrorInfo: ErrorPageInfo) => ErrorPageInfo;", + " /** Error handling options */", + " options?: UseUuiErrorOptions;", + "}" + ] + }, + "props": [ + { + "uid": "getErrorInfo", + "name": "getErrorInfo", "comment": { "raw": [ - "The current value of component" + "Pure function to get error info for display based on error.", + " If omitted, error info from default config or options.errorConfig will be used." ] }, "typeValue": { - "raw": "boolean" + "raw": "(error: any, defaultErrorInfo: ErrorPageInfo) => ErrorPageInfo" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "options", + "name": "options", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Error handling options" ] }, "typeValue": { - "raw": "(newValue: boolean) => void" - }, - "editor": { - "type": "func" + "raw": "UseUuiErrorOptions" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-components:AdaptiveItemProps": { + "@epam/uui-core:UseUuiServicesProps": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "AdaptiveItemProps", - "nameFull": "AdaptiveItemProps" + "name": "UseUuiServicesProps", + "nameFull": "UseUuiServicesProps" }, - "src": "uui-components/src/adaptivePanel/types.ts", + "src": "uui-core/src/hooks/useUuiServices.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "AdaptiveItemProps", + "raw": "UseUuiServicesProps", "print": [ - "type AdaptiveItemProps = T & {", - " /**", - " * Render callback of the item. It renders items inside the panel and measures their width.", - " * Pay attention that if you want to set some gaps between items, use AdaptivePanel property itemsGap.", - " * */", - " render: (item: AdaptiveItemProps, hiddenItems?: AdaptiveItemProps[], displayedItems?: AdaptiveItemProps[]) => any;", - " /**", - " * Item collapsing priority. Items with lower priority will be hidden first.", - " * If several items have the same priority, they will be hidden together, even if there's a place for one of them.", - " * */", - " priority: number;", - " /** If true, this item will be shown when some other items was hidden; for example, you can use it to render dropdowns with hidden items.", - " * You can provide more than one collapsedContainer item, but will be shown only those which has minimal priority, but this priority can't be less than the last hidden item’s priority. */", - " collapsedContainer?: boolean;", - " /** Unique ID of item */", - " id: string;", - "};" + "interface UseUuiServicesProps extends UuiServicesProps {", + " /** AppContext value */", + " appContext?: TAppContext;", + " /** Instance of the router */", + " router: IRouterContext;", + "}" ] }, "props": [ { - "uid": "render", - "name": "render", + "uid": "appContext", + "name": "appContext", "comment": { "raw": [ - "Render callback of the item. It renders items inside the panel and measures their width.", - " Pay attention that if you want to set some gaps between items, use AdaptivePanel property itemsGap." + "AppContext value" ] }, "typeValue": { - "raw": "(item: AdaptiveItemProps, hiddenItems?: AdaptiveItemProps[] | undefined, displayedItems?: AdaptiveItemProps[] | undefined) => any" - }, - "editor": { - "type": "func" + "raw": "TAppContext" }, - "required": true + "required": false }, { - "uid": "priority", - "name": "priority", + "uid": "router", + "name": "router", "comment": { "raw": [ - "Item collapsing priority. Items with lower priority will be hidden first.", - " If several items have the same priority, they will be hidden together, even if there's a place for one of them." + "Instance of the router" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "IRouterContext" }, "required": true }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "apiDefinition", + "name": "apiDefinition", "comment": { "raw": [ - "If true, this item will be shown when some other items was hidden; for example, you can use it to render dropdowns with hidden items.", - " You can provide more than one collapsedContainer item, but will be shown only those which has minimal priority, but this priority can't be less than the last hidden item’s priority." + "Function to get the api definitions.", + " Usually, api definitions this is an object which contain object with all api requests of the app.", + " Then you can call this requests via 'uuiContext.api.myApi(myData)'" ] }, "typeValue": { - "raw": "boolean" + "raw": "(processRequest: IProcessRequest) => TApi" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:UuiServicesProps", "required": false }, { - "uid": "id", - "name": "id", + "uid": "apiReloginPath", + "name": "apiReloginPath", "comment": { "raw": [ - "Unique ID of item" - ] + "Url to the relogin page. Used to open new browser window by this path, in case of auth lost error.", + " Opened by this path page, should process authentication and then post 'authSuccess' cross-window message to the opener, to recover failed requests.", + " @default '/auth/login'" + ], + "tags": { + "@default": "/auth/login" + } }, "typeValue": { "raw": "string" @@ -38741,163 +38309,159 @@ "editor": { "type": "string" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:AdaptivePanelProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "AdaptivePanelProps", - "nameFull": "AdaptivePanelProps" - }, - "src": "uui-components/src/adaptivePanel/types.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "AdaptivePanelProps", - "print": [ - "interface AdaptivePanelProps extends IHasCX, IHasRawProps> {", - " /** Array of items to be rendered in AdaptivePanel */", - " items: AdaptiveItemProps[];", - " /** Defines size of the gap (gutter) between an element's 'items' in the AdaptivePanel */", - " itemsGap?: number | '6' | '12' | '18' | '24' | '36';", - "}" - ] - }, - "props": [ - { - "uid": "items", - "name": "items", - "comment": { - "raw": [ - "Array of items to be rendered in AdaptivePanel" - ] - }, - "typeValue": { - "raw": "{ render: (item: any, hiddenItems?: any[] | undefined, displayedItems?: any[] | undefined) => any; priority: number; collapsedContainer?: boolean | undefined; id: string; }[]" - }, - "required": true + "from": "@epam/uui-core:ApiContextProps", + "required": false }, { - "uid": "itemsGap", - "name": "itemsGap", + "uid": "apiPingPath", + "name": "apiPingPath", "comment": { "raw": [ - "Defines size of the gap (gutter) between an element's 'items' in the AdaptivePanel" - ] + "Url to the api, which ApiContext will start pinging in case of 'connection lost', until it gets 200 status. Then it will retry failed requests.", + " @default '/auth/ping'" + ], + "tags": { + "@default": "/auth/ping" + } }, "typeValue": { - "raw": "number | '6' | '12' | '18' | '24' | '36'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "6", - "12", - "18", - "24", - "36" - ], - "scalarTypeOption": "number" + "type": "string" }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "apiServerUrl", + "name": "apiServerUrl", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] + "Url to the server api under which all requests will be processed. Usefully for cases, when all api located by some specific url, which is not much app url.", + " @default ''" + ], + "tags": { + "@default": "" + } }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "string" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "fetch", + "name": "fetch", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", + " By default, standard fetch will be used." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "typeof fetch" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:AnchorProps": { + "@epam/uui-core:UseVirtualListProps": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "AnchorProps", - "nameFull": "AnchorProps" + "name": "UseVirtualListProps", + "nameFull": "UseVirtualListProps" }, - "src": "uui-components/src/navigation/Anchor.tsx", + "src": "uui-core/src/hooks/useVirtualList/types.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "AnchorProps", + "raw": "UseVirtualListProps", "print": [ - "type AnchorProps = ClickableComponentProps & IHasChildren & {};" + "interface UseVirtualListProps extends IEditable {", + " /** Count of list items */", + " rowsCount?: number | undefined;", + " /**", + " * Virtual list will align topIndex and visibleCount to the block size.", + " * E.g. with block size = 10, even if we have rows 2 to 12 visible, the range will be aligned to 0-20", + " * This is done to not re-render rows on each scroll.", + " * When scrolling, re-render will happen only when we scroll over the next blockSize rows.", + " * Default is 20.", + " */", + " blockSize?: number;", + " /**", + " * Number of rows to draw before the top and after the bottom of the list.", + " * This is required to hide blank areas while scrolling.", + " * Default is 20.", + " */", + " overdrawRows?: number;", + " /** Called when list was scrolled */", + " onScroll?(value: HTMLElement): void;", + " /**", + " * Selector to get rows container node.", + " */", + " rowsSelector?: string;", + "}" ] }, "props": [ { - "uid": "onClick", - "name": "onClick", + "uid": "rowsCount", + "name": "rowsCount", "comment": { "raw": [ - "Called when component is clicked" + "Count of list items" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "blockSize", + "name": "blockSize", "comment": { "raw": [ - "An analytics event to send (via AnalyticsContext) when component is clicked.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "Virtual list will align topIndex and visibleCount to the block size.", + " E.g. with block size = 10, even if we have rows 2 to 12 visible, the range will be aligned to 0-20", + " This is done to not re-render rows on each scroll.", + " When scrolling, re-render will happen only when we scroll over the next blockSize rows.", + " Default is 20." ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "overdrawRows", + "name": "overdrawRows", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Number of rows to draw before the top and after the bottom of the list.", + " This is required to hide blank areas while scrolling.", + " Default is 20." ] }, "typeValue": { @@ -38906,78 +38470,80 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "onScroll", + "name": "onScroll", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Called when list was scrolled" ] }, "typeValue": { - "raw": "boolean" + "raw": "(value: HTMLElement) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "rowsSelector", + "name": "rowsSelector", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Selector to get rows container node." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "string" + }, + "editor": { + "type": "string" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "link", - "name": "link", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Link object to redirect to for SPA-redirects" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "Link" + "raw": "boolean" }, - "from": "@epam/uui-core:ICanRedirect", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "href", - "name": "href", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isLinkActive", - "name": "isLinkActive", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -38986,633 +38552,711 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "target", - "name": "target", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Controls where the link should be opened" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "'_blank'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] + "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "The current value of component" ] }, "typeValue": { - "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "VirtualListState" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "children", - "name": "children", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Component children" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(newValue: VirtualListState) => void" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-components:ArrayPickerProps": { + "@epam/uui-core:UuiContexts": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "ArrayPickerProps", - "nameFull": "ArrayPickerProps" + "name": "UuiContexts", + "nameFull": "UuiContexts" }, - "src": "uui-components/src/pickers/bindingHelpers.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "{ selectionMode: 'multi'; valueType: 'id'; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "raw": "UuiContexts", "print": [ - "type ArrayPickerProps = ({", - " selectionMode: 'multi';", - " valueType: 'id';", - " emptyValue?: [", - " ] | null;", - "} & IEditable) | ({", - " selectionMode: 'multi';", - " valueType: 'entity';", - " emptyValue?: [", - " ] | null;", - "} & IEditable);" + "interface UuiContexts {", + " /** Api service allows you to process requests with an error handling.", + " * See more here - https://uui.epam.com/documents?id=apiContext&category=contexts", + " * */", + " uuiApi: IApiContext;", + " /** Instance of react-router wrapped by UUI adapter */", + " uuiRouter: IRouterContext;", + " /** Modals service allows you to show modal windows over the main content.", + " * See more here - https://uui.epam.com/documents?id=modalContext&category=contexts", + " * */", + " uuiModals: IModalContext;", + " /** Drag and Drop service for dnd operations.", + " * See more here - https://uui.epam.com/documents?id=dragAndDrop", + " * */", + " uuiDnD: IDndContext;", + " /** UserSettings service allows you to store user data in localStorage. */", + " uuiUserSettings: IUserSettingsContext;", + " /** Web analytics service allows you to send user interaction events to the analytics systems.", + " * See more here - https://uui.epam.com/documents?id=analyticsContext&category=contexts", + " * */", + " uuiAnalytics: IAnalyticsContext;", + " /** Error service allows you to report errors.", + " * See more here - https://uui.epam.com/documents?id=apiContext&category=contexts", + " * */", + " uuiErrors: IErrorContext;", + " /** Notifications service allows you to show notifications over the main content.", + " * See more here - https://uui.epam.com/documents?id=notificationContextDoc&category=contexts", + " * */", + " uuiNotifications: INotificationContext;", + " /** Layout service. Used to manage layout for overlays like modals, dropdowns, etc. */", + " uuiLayout: ILayoutContext;", + " /** Lock service.", + " * See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts", + " * */", + " uuiLocks: ILockContext;", + "}" ] }, "props": [ { - "uid": "selectionMode", - "name": "selectionMode", - "typeValue": { - "raw": "'multi'" - }, - "editor": { - "type": "oneOf", - "options": [ - "multi" + "uid": "uuiApi", + "name": "uuiApi", + "comment": { + "raw": [ + "Api service allows you to process requests with an error handling.", + " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" ] }, - "required": true - }, - { - "uid": "valueType", - "name": "valueType", "typeValue": { - "raw": "'id'" - }, - "editor": { - "type": "oneOf", - "options": [ - "id" - ] + "raw": "IApiContext" }, "required": true }, { - "uid": "emptyValue", - "name": "emptyValue", - "typeValue": { - "raw": "null | []" - }, - "required": false - }, - { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "uuiRouter", + "name": "uuiRouter", "comment": { "raw": [ - "True if component contains invalid input" + "Instance of react-router wrapped by UUI adapter" ] }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "typeValue": { + "raw": "IRouterContext" }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false + "required": true }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "uuiModals", + "name": "uuiModals", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Modals service allows you to show modal windows over the main content.", + " See more here - https://uui.epam.com/documents?id=modalContext&category=contexts" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IModalContext" }, - "from": "@epam/uui-core:IDisableable", - "required": false + "required": true }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "uuiDnD", + "name": "uuiDnD", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Drag and Drop service for dnd operations.", + " See more here - https://uui.epam.com/documents?id=dragAndDrop" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IDndContext" }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false + "required": true }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "uuiUserSettings", + "name": "uuiUserSettings", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "UserSettings service allows you to store user data in localStorage." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IUserSettingsContext" }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false + "required": true }, { - "uid": "value", - "name": "value", + "uid": "uuiAnalytics", + "name": "uuiAnalytics", "comment": { "raw": [ - "The current value of component" + "Web analytics service allows you to send user interaction events to the analytics systems.", + " See more here - https://uui.epam.com/documents?id=analyticsContext&category=contexts" ] }, "typeValue": { - "raw": "TId[]" + "raw": "IAnalyticsContext" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "uuiErrors", + "name": "uuiErrors", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Error service allows you to report errors.", + " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" ] }, "typeValue": { - "raw": "(newValue: TId[]) => void" - }, - "editor": { - "type": "func" + "raw": "IErrorContext" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "valueType_2", - "name": "valueType", - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" + "uid": "uuiNotifications", + "name": "uuiNotifications", + "comment": { + "raw": [ + "Notifications service allows you to show notifications over the main content.", + " See more here - https://uui.epam.com/documents?id=notificationContextDoc&category=contexts" ] }, + "typeValue": { + "raw": "INotificationContext" + }, "required": true }, { - "uid": "value_2", - "name": "value", + "uid": "uuiLayout", + "name": "uuiLayout", "comment": { "raw": [ - "The current value of component" + "Layout service. Used to manage layout for overlays like modals, dropdowns, etc." ] }, "typeValue": { - "raw": "TItem[]" + "raw": "ILayoutContext" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onValueChange_2", - "name": "onValueChange", + "uid": "uuiLocks", + "name": "uuiLocks", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Lock service.", + " See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts" ] }, "typeValue": { - "raw": "(newValue: TItem[]) => void" - }, - "editor": { - "type": "func" + "raw": "ILockContext" }, - "from": "@epam/uui-core:IControlled", "required": true } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-components:AvatarProps": { + "@epam/uui-core:UuiRecoveryErrorInfo": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "AvatarProps", - "nameFull": "AvatarProps" + "name": "UuiRecoveryErrorInfo", + "nameFull": "UuiRecoveryErrorInfo" }, - "src": "uui-components/src/widgets/Avatar.tsx", + "src": "uui-core/src/hooks/useUuiError.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "AvatarProps", + "raw": "UuiRecoveryErrorInfo", "print": [ - "interface AvatarProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", - " /** HTML alt attribute value */", - " alt?: string;", - " /** Image URL */", - " img: string | null;", - " /** Size */", - " size: '12' | '18' | '24' | '30' | '36' | '42' | '48' | '54' | '60' | '72' | '78' | '90' | '144' | number;", - " /** True to show placeholder */", - " isLoading?: boolean;", - "}" + "type UuiRecoveryErrorInfo = {", + " title: string;", + " subtitle: string;", + "};" ] }, "props": [ { - "uid": "alt", - "name": "alt", - "comment": { - "raw": [ - "HTML alt attribute value" - ] - }, + "uid": "title", + "name": "title", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "required": false + "required": true }, { - "uid": "img", - "name": "img", - "comment": { - "raw": [ - "Image URL" - ] - }, + "uid": "subtitle", + "name": "subtitle", "typeValue": { - "raw": "null | string" + "raw": "string" }, "editor": { "type": "string" }, - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UuiServicesProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UuiServicesProps", + "nameFull": "UuiServicesProps" + }, + "src": "uui-core/src/hooks/useUuiServices.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "UuiServicesProps", + "print": [ + "interface UuiServicesProps extends ApiContextProps {", + " /** Function to get the api definitions.", + " * Usually, api definitions this is an object which contain object with all api requests of the app.", + " * Then you can call this requests via 'uuiContext.api.myApi(myData)'", + " * */", + " apiDefinition?: (processRequest: IProcessRequest) => TApi;", + "}" + ] + }, + "props": [ { - "uid": "size", - "name": "size", + "uid": "apiDefinition", + "name": "apiDefinition", "comment": { "raw": [ - "Size" + "Function to get the api definitions.", + " Usually, api definitions this is an object which contain object with all api requests of the app.", + " Then you can call this requests via 'uuiContext.api.myApi(myData)'" ] }, "typeValue": { - "raw": "number | '12' | '18' | '24' | '36' | '30' | '42' | '48' | '54' | '60' | '72' | '78' | '90' | '144'" + "raw": "(processRequest: IProcessRequest) => TApi" }, "editor": { - "type": "oneOf", - "options": [ - "12", - "18", - "24", - "30", - "36", - "42", - "48", - "54", - "60", - "72", - "78", - "90", - "144" - ], - "scalarTypeOption": "number" + "type": "func" }, - "required": true + "required": false }, { - "uid": "isLoading", - "name": "isLoading", + "uid": "apiReloginPath", + "name": "apiReloginPath", "comment": { "raw": [ - "True to show placeholder" - ] + "Url to the relogin page. Used to open new browser window by this path, in case of auth lost error.", + " Opened by this path page, should process authentication and then post 'authSuccess' cross-window message to the opener, to recover failed requests.", + " @default '/auth/login'" + ], + "tags": { + "@default": "/auth/login" + } }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "apiPingPath", + "name": "apiPingPath", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] + "Url to the api, which ApiContext will start pinging in case of 'connection lost', until it gets 200 status. Then it will retry failed requests.", + " @default '/auth/ping'" + ], + "tags": { + "@default": "/auth/ping" + } }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "string" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "apiServerUrl", + "name": "apiServerUrl", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] + "Url to the server api under which all requests will be processed. Usefully for cases, when all api located by some specific url, which is not much app url.", + " @default ''" + ], + "tags": { + "@default": "" + } }, "typeValue": { - "raw": "React.ImgHTMLAttributes & Record<`data-${string}`, string>" + "raw": "string" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "fetch", + "name": "fetch", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", + " By default, standard fetch will be used." ] }, "typeValue": { - "raw": "null | (instance: HTMLImageElement | null) => void | React.MutableRefObject" + "raw": "typeof fetch" }, - "from": "@epam/uui-core:IHasForwardedRef", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:AvatarStackProps": { + "@epam/uui-core:ValidationMode": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "AvatarStackProps", - "nameFull": "AvatarStackProps" + "name": "ValidationMode", + "nameFull": "ValidationMode" }, - "src": "uui-components/src/widgets/AvatarStack.tsx", + "src": "uui-core/src/data/validation/validate.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'change' | 'save'", + "print": [ + "type ValidationMode = 'change' | 'save';" + ] + } + } + }, + "@epam/uui-core:ValidationState": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ValidationState", + "nameFull": "ValidationState" + }, + "src": "uui-core/src/data/lenses/types.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "AvatarStackProps", + "raw": "ValidationState", "print": [ - "interface AvatarStackProps extends IHasCX, IHasRawProps> {", - " avatarSize: '24' | '36' | '48' | '144';", - " urlArray: string[];", - " direction: 'right' | 'left';", - " avatarsCount?: number;", - " renderItem?: (url: string) => React.ReactElement;", + "interface ValidationState extends ICanBeInvalid, IHasValidationMessage {", + " /** If T is a complex value (object or array), this property contains validation states of inner items */", + " validationProps?: {", + " [key: string]: ValidationState;", + " };", "}" ] }, "props": [ { - "uid": "avatarSize", - "name": "avatarSize", - "typeValue": { - "raw": "'24' | '36' | '48' | '144'" - }, - "editor": { - "type": "oneOf", - "options": [ - "24", - "36", - "48", - "144" + "uid": "validationProps", + "name": "validationProps", + "comment": { + "raw": [ + "If T is a complex value (object or array), this property contains validation states of inner items" ] }, - "required": true - }, - { - "uid": "urlArray", - "name": "urlArray", "typeValue": { - "raw": "string[]" + "raw": "{ [key: string]: ValidationState; }" }, - "required": true + "required": false }, { - "uid": "direction", - "name": "direction", - "typeValue": { - "raw": "'right' | 'left'" - }, - "editor": { - "type": "oneOf", - "options": [ - "right", - "left" + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" ] }, - "required": true - }, - { - "uid": "avatarsCount", - "name": "avatarsCount", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "renderItem", - "name": "renderItem", - "typeValue": { - "raw": "(url: string) => React.ReactElement>" + "uid": "validationMessage", + "name": "validationMessage", + "comment": { + "raw": [ + "Message describing why the value is invalid" + ] }, - "editor": { - "type": "component" + "typeValue": { + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:VirtualListRange": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "VirtualListRange", + "nameFull": "VirtualListRange" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "VirtualListRange", + "print": [ + "interface VirtualListRange {", + " /**", + " * Index of the topmost item, in rendered batch.", + " * Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list", + " */", + " topIndex?: number;", + " /**", + " * Number of currently rendered items.", + " * Virtual list updates this value automatically, if it too small.", + " * Note Virtual List renders more items, that actually visible,", + " * as it need maintain some reserve of rows on top / at the bottom of the list.", + " */", + " visibleCount?: number;", + "}" + ] + }, + "props": [ { - "uid": "cx", - "name": "cx", + "uid": "topIndex", + "name": "topIndex", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Index of the topmost item, in rendered batch.", + " Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "number" + }, + "editor": { + "type": "number" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "visibleCount", + "name": "visibleCount", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Number of currently rendered items.", + " Virtual list updates this value automatically, if it too small.", + " Note Virtual List renders more items, that actually visible,", + " as it need maintain some reserve of rows on top / at the bottom of the list." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:IHasRawProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:BaseRatingProps": { + "@epam/uui-core:VirtualListState": { "summary": { - "module": "@epam/uui-components", + "module": "@epam/uui-core", "typeName": { - "name": "BaseRatingProps", - "nameFull": "BaseRatingProps" + "name": "VirtualListState", + "nameFull": "VirtualListState" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Holds state of a Virtual List - top visible item index, and estimated count of visible items" + ] }, - "src": "uui-components/src/inputs/Rating/BaseRating.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "BaseRatingProps", + "raw": "VirtualListState", "print": [ - "interface BaseRatingProps extends IHasCX, IDisableable, IControlled, ICanBeReadonly, IHasRawProps>, IHasForwardedRef {", - " from?: number;", - " to?: number;", + "/** Holds state of a Virtual List - top visible item index, and estimated count of visible items */", + "interface VirtualListState extends VirtualListRange {", " /**", - " * @default 1", + " * Virtual list ensures that row with this Index is within the visible area, if not Virtual List .", + " * Virtual list updates this value on scroll to null when appear in the visible area.", + " * If this value is updated manually, Virtual List would scroll to the specified items.", + " * It would attempt to put scroll so this item will be at the top of the list.", " */", - " step?: 0.5 | 1;", - " renderRating?: (rating: number, markWidth: number, numberOfMarks: number) => React.ReactNode;", + " scrollTo?: ScrollToConfig;", "}" ] }, "props": [ { - "uid": "from", - "name": "from", - "typeValue": { - "raw": "number" + "uid": "scrollTo", + "name": "scrollTo", + "comment": { + "raw": [ + "Virtual list ensures that row with this Index is within the visible area, if not Virtual List .", + " Virtual list updates this value on scroll to null when appear in the visible area.", + " If this value is updated manually, Virtual List would scroll to the specified items.", + " It would attempt to put scroll so this item will be at the top of the list." + ] }, - "editor": { - "type": "number" + "typeValue": { + "raw": "ScrollToConfig" }, "required": false }, { - "uid": "to", - "name": "to", + "uid": "topIndex", + "name": "topIndex", + "comment": { + "raw": [ + "Index of the topmost item, in rendered batch.", + " Note - this item might not be visible, as Virtual List maintain some reserve of rows on top / at the bottom of the list" + ] + }, "typeValue": { "raw": "number" }, "editor": { "type": "number" }, + "from": "@epam/uui-core:VirtualListRange", "required": false }, { - "uid": "step", - "name": "step", + "uid": "visibleCount", + "name": "visibleCount", "comment": { "raw": [ - "@default 1" - ], - "tags": { - "@default": 1 - } - }, - "typeValue": { - "raw": "0.5 | 1" - }, - "editor": { - "type": "oneOf", - "options": [ - 0.5, - 1 + "Number of currently rendered items.", + " Virtual list updates this value automatically, if it too small.", + " Note Virtual List renders more items, that actually visible,", + " as it need maintain some reserve of rows on top / at the bottom of the list." ] }, - "required": false - }, - { - "uid": "renderRating", - "name": "renderRating", "typeValue": { - "raw": "(rating: number, markWidth: number, numberOfMarks: number) => React.ReactNode" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, + "from": "@epam/uui-core:VirtualListRange", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:VPanelProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "VPanelProps", + "nameFull": "VPanelProps" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "VPanelProps", + "print": [ + "type VPanelProps = IHasCX & IHasChildren & IClickable & IHasRawProps> & IHasForwardedRef & IAnalyticableClick & {", + " /** Native style attributes */", + " style?: CSSProperties;", + "};" + ] + }, + "props": [ { "uid": "cx", "name": "cx", @@ -39629,152 +39273,463 @@ "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Component children" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IDisableable", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "value", - "name": "value", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "The current value of component" + "Called when component is clicked" ] }, "typeValue": { - "raw": "TValue" + "raw": "(e?: any) => void" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IClickable", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(newValue: TValue) => void" - }, - "editor": { - "type": "func" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:IHasRawProps", + "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:IHasForwardedRef", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "clickAnalyticsEvent", + "name": "clickAnalyticsEvent", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "An analytics event to send (via AnalyticsContext) when component is clicked.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "null | { [key: string]: any; name: string; }" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "style", + "name": "style", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Native style attributes" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "React.CSSProperties" }, - "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:BlockerProps": { + "@epam/uui-core:ApiCallStatus": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ApiCallStatus", + "nameFull": "ApiCallStatus" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": false + } + }, + "@epam/uui-core:ArrayDataSourceConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ArrayDataSourceConfig", + "nameFull": "ArrayDataSourceConfig" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "exported": false + } + }, + "@epam/uui-core:AsyncDataSourceConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "AsyncDataSourceConfig", + "nameFull": "AsyncDataSourceConfig" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "exported": false + } + }, + "@epam/uui-core:AsyncTreeProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "AsyncTreeProps", + "nameFull": "AsyncTreeProps" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/asyncTree/types.ts", + "comment": { + "raw": [ + "Async tree hook configuration." + ] + }, + "exported": false + } + }, + "@epam/uui-core:CommonTreeConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "CommonTreeConfig", + "nameFull": "CommonTreeConfig" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "comment": { + "raw": [ + "Tree configuration." + ] + }, + "exported": false + } + }, + "@epam/uui-core:CustomFilterConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "CustomFilterConfig", + "nameFull": "CustomFilterConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": false + } + }, + "@epam/uui-core:DatePickerFilterConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DatePickerFilterConfig", + "nameFull": "DatePickerFilterConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": false + } + }, + "@epam/uui-core:FilterConfigBase": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "FilterConfigBase", + "nameFull": "FilterConfigBase" + }, + "src": "uui-core/src/types/tables.ts", + "exported": false + } + }, + "@epam/uui-core:GetItemStatus": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "GetItemStatus", + "nameFull": "GetItemStatus" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", + "comment": { + "raw": [ + "Item status getter." + ] + }, + "exported": false + } + }, + "@epam/uui-core:ItemsStatuses": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ItemsStatuses", + "nameFull": "ItemsStatuses" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "exported": false + } + }, + "@epam/uui-core:ITreeActions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ITreeActions", + "nameFull": "ITreeActions" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "comment": { + "raw": [ + "Actions, allowed to be performed on the tree." + ] + }, + "exported": false + } + }, + "@epam/uui-core:ITreeLoadingState": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ITreeLoadingState", + "nameFull": "ITreeLoadingState" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "comment": { + "raw": [ + "Loading state of the tree." + ] + }, + "exported": false + } + }, + "@epam/uui-core:LazyDataSourceConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LazyDataSourceConfig", + "nameFull": "LazyDataSourceConfig" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "exported": false + } + }, + "@epam/uui-core:LazyTreeProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LazyTreeProps", + "nameFull": "LazyTreeProps" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/lazyTree/types.ts", + "exported": false + } + }, + "@epam/uui-core:LoadMissingRecords": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LoadMissingRecords", + "nameFull": "LoadMissingRecords" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/strategies.ts", + "comment": { + "raw": [ + "Load missing records getter." + ] + }, + "exported": false + } + }, + "@epam/uui-core:NumericFilterConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "NumericFilterConfig", + "nameFull": "NumericFilterConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": false + } + }, + "@epam/uui-core:RangeDatePickerFilterConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RangeDatePickerFilterConfig", + "nameFull": "RangeDatePickerFilterConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": false + } + }, + "@epam/uui-core:RouterState": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RouterState", + "nameFull": "RouterState" + }, + "src": "uui-core/src/services/routing/interfaces/IRouter6.ts", + "exported": false + } + }, + "@epam/uui-core:SharedItemsState": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SharedItemsState", + "nameFull": "SharedItemsState" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/types/common.ts", + "exported": false + } + }, + "@epam/uui-core:SyncTreeProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "SyncTreeProps", + "nameFull": "SyncTreeProps" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/strategies/syncTree/types.ts", + "exported": false + } + }, + "@epam/uui-core:UseTableStateHookBaseParams": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "UseTableStateHookBaseParams", + "nameFull": "UseTableStateHookBaseParams" + }, + "src": "uui-core/src/hooks/useTableState/useTableState.ts", + "exported": false + } + }, + "@epam/uui-components:AccordionProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "BlockerProps", - "nameFull": "BlockerProps" + "name": "AccordionProps", + "nameFull": "AccordionProps" }, - "src": "uui-components/src/layout/Blocker.tsx", + "src": "uui-components/src/layout/Accordion.tsx", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "BlockerProps", + "raw": "GeneralAccordionProps | EditableAccordionProps", "print": [ - "interface BlockerProps extends IHasCX, IHasRawProps> {", - " /** Turns the blocker on or off */", - " isEnabled: boolean;", - " /** Disables spinner animation display */", - " hideSpinner?: boolean;", - " /** Sets the minimal height in px, for cases when blocked content is empty */", - " spacerHeight?: number;", - " /** Replaces default spinner */", - " renderSpinner?(props: any): React.ReactNode;", - "}" + "type AccordionProps = GeneralAccordionProps | EditableAccordionProps;" ] }, "props": [ { - "uid": "isEnabled", - "name": "isEnabled", + "uid": "title", + "name": "title", "comment": { "raw": [ - "Turns the blocker on or off" + "Accordion title" ] }, "typeValue": { - "raw": "boolean" + "raw": "string | React.ReactElement>" + }, + "from": "@epam/uui-components:GeneralAccordionProps", + "required": false + }, + { + "uid": "renderTitle", + "name": "renderTitle", + "comment": { + "raw": [ + "Overrides default title rendering." + ] + }, + "typeValue": { + "raw": "(isOpen: boolean) => React.ReactElement>" }, "editor": { - "type": "bool" + "type": "component" + }, + "from": "@epam/uui-components:GeneralAccordionProps", + "required": false + }, + { + "uid": "dropdownIcon", + "name": "dropdownIcon", + "comment": { + "raw": [ + "Overrides the default dropdown (folding) icon.Pass null to disable the folding icon completely" + ] + }, + "typeValue": { + "raw": "null | Icon" + }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-components:GeneralAccordionProps", + "required": false + }, + { + "uid": "renderAdditionalItems", + "name": "renderAdditionalItems", + "comment": { + "raw": [ + "Renders additional items to component's header (after the title, and before the folding icon)" + ] + }, + "typeValue": { + "raw": "(isOpen: boolean) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-components:GeneralAccordionProps", + "required": false + }, + { + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] + }, + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "required": true + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "required": false }, { - "uid": "hideSpinner", - "name": "hideSpinner", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Disables spinner animation display" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -39783,176 +39738,240 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "spacerHeight", - "name": "spacerHeight", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Sets the minimal height in px, for cases when blocked content is empty" + "Component children" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "renderSpinner", - "name": "renderSpinner", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Replaces default spinner" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(props: any) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "value", + "name": "value", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "The current value of component" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(newValue: boolean) => void" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-components:BurgerProps": { + "@epam/uui-components:AdaptiveItemProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "BurgerProps", - "nameFull": "BurgerProps" + "name": "AdaptiveItemProps", + "nameFull": "AdaptiveItemProps" }, - "src": "uui-components/src/navigation/MainMenu/Burger/Burger.tsx", + "src": "uui-components/src/adaptivePanel/types.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "BurgerProps", + "raw": "AdaptiveItemProps", "print": [ - "interface BurgerProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", - " burgerIcon?: Icon;", - " crossIcon?: Icon;", - " width?: number;", - " burgerContentCx?: string;", - " renderBurgerContent?: (props: {", - " onClose: () => void;", - " }) => React.ReactNode;", - " bg?: string;", - " logoUrl?: string;", - "}" + "type AdaptiveItemProps = T & {", + " /**", + " * Render callback of the item. It renders items inside the panel and measures their width.", + " * Pay attention that if you want to set some gaps between items, use AdaptivePanel property itemsGap.", + " * */", + " render: (item: AdaptiveItemProps, hiddenItems?: AdaptiveItemProps[], displayedItems?: AdaptiveItemProps[]) => any;", + " /**", + " * Item collapsing priority. Items with lower priority will be hidden first.", + " * If several items have the same priority, they will be hidden together, even if there's a place for one of them.", + " * */", + " priority: number;", + " /** If true, this item will be shown when some other items was hidden; for example, you can use it to render dropdowns with hidden items.", + " * You can provide more than one collapsedContainer item, but will be shown only those which has minimal priority, but this priority can't be less than the last hidden item’s priority. */", + " collapsedContainer?: boolean;", + " /** Unique ID of item */", + " id: string;", + "};" ] }, "props": [ { - "uid": "burgerIcon", - "name": "burgerIcon", - "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" + "uid": "render", + "name": "render", + "comment": { + "raw": [ + "Render callback of the item. It renders items inside the panel and measures their width.", + " Pay attention that if you want to set some gaps between items, use AdaptivePanel property itemsGap." + ] }, - "required": false - }, - { - "uid": "crossIcon", - "name": "crossIcon", "typeValue": { - "raw": "Icon" + "raw": "(item: AdaptiveItemProps, hiddenItems?: AdaptiveItemProps[] | undefined, displayedItems?: AdaptiveItemProps[] | undefined) => any" }, "editor": { - "type": "component" + "type": "func" }, - "required": false + "required": true }, { - "uid": "width", - "name": "width", + "uid": "priority", + "name": "priority", + "comment": { + "raw": [ + "Item collapsing priority. Items with lower priority will be hidden first.", + " If several items have the same priority, they will be hidden together, even if there's a place for one of them." + ] + }, "typeValue": { "raw": "number" }, "editor": { "type": "number" }, - "required": false + "required": true }, { - "uid": "burgerContentCx", - "name": "burgerContentCx", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "uid": "collapsedContainer", + "name": "collapsedContainer", + "comment": { + "raw": [ + "If true, this item will be shown when some other items was hidden; for example, you can use it to render dropdowns with hidden items.", + " You can provide more than one collapsedContainer item, but will be shown only those which has minimal priority, but this priority can't be less than the last hidden item’s priority." + ] }, - "required": false - }, - { - "uid": "renderBurgerContent", - "name": "renderBurgerContent", "typeValue": { - "raw": "(props: { onClose: () => void; }) => React.ReactNode" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, "required": false }, { - "uid": "bg", - "name": "bg", + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "Unique ID of item" + ] + }, "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "required": false + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:AdaptivePanelProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "AdaptivePanelProps", + "nameFull": "AdaptivePanelProps" + }, + "src": "uui-components/src/adaptivePanel/types.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "AdaptivePanelProps", + "print": [ + "interface AdaptivePanelProps extends IHasCX, IHasRawProps> {", + " /** Array of items to be rendered in AdaptivePanel */", + " items: AdaptiveItemProps[];", + " /** Defines size of the gap (gutter) between an element's 'items' in the AdaptivePanel */", + " itemsGap?: number | '6' | '12' | '18' | '24' | '36';", + "}" + ] + }, + "props": [ + { + "uid": "items", + "name": "items", + "comment": { + "raw": [ + "Array of items to be rendered in AdaptivePanel" + ] + }, + "typeValue": { + "raw": "{ render: (item: any, hiddenItems?: any[] | undefined, displayedItems?: any[] | undefined) => any; priority: number; collapsedContainer?: boolean | undefined; id: string; }[]" + }, + "required": true }, { - "uid": "logoUrl", - "name": "logoUrl", + "uid": "itemsGap", + "name": "itemsGap", + "comment": { + "raw": [ + "Defines size of the gap (gutter) between an element's 'items' in the AdaptivePanel" + ] + }, "typeValue": { - "raw": "string" + "raw": "number | '6' | '12' | '18' | '24' | '36'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "6", + "12", + "18", + "24", + "36" + ], + "scalarTypeOption": "number" }, "required": false }, @@ -39984,48 +40003,27 @@ }, "from": "@epam/uui-core:IHasRawProps", "required": false - }, - { - "uid": "forwardedRef", - "name": "forwardedRef", - "comment": { - "raw": [ - "this ref is passed to the underlying component" - ] - }, - "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" - }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:ButtonProps": { + "@epam/uui-components:AnchorProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "ButtonProps", - "nameFull": "ButtonProps" + "name": "AnchorProps", + "nameFull": "AnchorProps" }, - "src": "uui-components/src/buttons/Button.tsx", + "src": "uui-components/src/navigation/Anchor.tsx", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "ButtonProps", + "raw": "AnchorProps", "print": [ - "type ButtonProps = ClickableComponentProps & IDropdownToggler & IHasIcon & IHasCaption & {", - " /** Call to clear toggler value */", - " onClear?(e?: any): void;", - " /** Icon for clear value button (usually cross) */", - " clearIcon?: Icon;", - " /** Icon for drop-down toggler */", - " dropdownIcon?: Icon;", - "};" + "type AnchorProps = ClickableComponentProps & IHasChildren & {};" ] }, "props": [ @@ -40193,11 +40191,95 @@ "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "children", + "name": "children", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "Component children" + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:ArrayPickerProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "ArrayPickerProps", + "nameFull": "ArrayPickerProps" + }, + "src": "uui-components/src/pickers/bindingHelpers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "{ selectionMode: 'multi'; valueType: 'id'; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "print": [ + "type ArrayPickerProps = ({", + " selectionMode: 'multi';", + " valueType: 'id';", + " emptyValue?: [", + " ] | null;", + "} & IEditable) | ({", + " selectionMode: 'multi';", + " valueType: 'entity';", + " emptyValue?: [", + " ] | null;", + "} & IEditable);" + ] + }, + "props": [ + { + "uid": "selectionMode", + "name": "selectionMode", + "typeValue": { + "raw": "'multi'" + }, + "editor": { + "type": "oneOf", + "options": [ + "multi" + ] + }, + "required": true + }, + { + "uid": "valueType", + "name": "valueType", + "typeValue": { + "raw": "'id'" + }, + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "required": true + }, + { + "uid": "emptyValue", + "name": "emptyValue", + "typeValue": { + "raw": "null | []" + }, + "required": false + }, + { + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" ] }, "typeValue": { @@ -40206,15 +40288,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -40223,172 +40305,230 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "icon", - "name": "icon", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "Icon" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-core:IHasIcon", + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Position of the icon (left of right)" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "'right' | 'left'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left" - ] + "type": "bool" }, - "from": "@epam/uui-core:IHasIcon", + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "onIconClick", - "name": "onIconClick", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Click handler for the icon" + "The current value of component" ] }, "typeValue": { - "raw": "() => void" + "raw": "TId[]" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TId[]) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IHasIcon", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "caption", - "name": "caption", + "uid": "valueType_2", + "name": "valueType", + "typeValue": { + "raw": "'entity'" + }, + "editor": { + "type": "oneOf", + "options": [ + "entity" + ] + }, + "required": true + }, + { + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." + "The current value of component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "TItem[]" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasCaption", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onClear", - "name": "onClear", + "uid": "onValueChange_2", + "name": "onValueChange", "comment": { "raw": [ - "Call to clear toggler value" + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: TItem[]) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + } + ], + "propsFromUnion": true + } + }, + "@epam/uui-components:AvatarProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "AvatarProps", + "nameFull": "AvatarProps" + }, + "src": "uui-components/src/widgets/Avatar.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "AvatarProps", + "print": [ + "interface AvatarProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", + " /** HTML alt attribute value */", + " alt?: string;", + " /** Image URL */", + " img: string | null;", + " /** Size */", + " size: '12' | '18' | '24' | '30' | '36' | '42' | '48' | '54' | '60' | '72' | '78' | '90' | '144' | number;", + " /** True to show placeholder */", + " isLoading?: boolean;", + "}" + ] + }, + "props": [ + { + "uid": "alt", + "name": "alt", + "comment": { + "raw": [ + "HTML alt attribute value" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, "required": false }, { - "uid": "clearIcon", - "name": "clearIcon", + "uid": "img", + "name": "img", "comment": { "raw": [ - "Icon for clear value button (usually cross)" + "Image URL" ] }, "typeValue": { - "raw": "Icon" + "raw": "null | string" }, "editor": { - "type": "component" + "type": "string" }, "required": false }, { - "uid": "dropdownIcon", - "name": "dropdownIcon", + "uid": "size", + "name": "size", "comment": { "raw": [ - "Icon for drop-down toggler" + "Size" ] }, "typeValue": { - "raw": "Icon" + "raw": "number | '12' | '18' | '24' | '36' | '30' | '42' | '48' | '54' | '60' | '72' | '78' | '90' | '144'" }, "editor": { - "type": "component" - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:CalendarPresetsProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "CalendarPresetsProps", - "nameFull": "CalendarPresetsProps" - }, - "src": "uui-components/src/inputs/DatePicker/CalendarPresets.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "CalendarPresetsProps", - "print": [ - "interface CalendarPresetsProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", - " presets: RangeDatePickerPresets;", - " onPresetSet: (nV: RangeDatePickerPresetValue) => void;", - "}" - ] - }, - "props": [ - { - "uid": "presets", - "name": "presets", - "typeValue": { - "raw": "RangeDatePickerPresets" + "type": "oneOf", + "options": [ + "12", + "18", + "24", + "30", + "36", + "42", + "48", + "54", + "60", + "72", + "78", + "90", + "144" + ], + "scalarTypeOption": "number" }, - "typeValueRef": "@epam/uui-components:RangeDatePickerPresets", "required": true }, { - "uid": "onPresetSet", - "name": "onPresetSet", + "uid": "isLoading", + "name": "isLoading", + "comment": { + "raw": [ + "True to show placeholder" + ] + }, "typeValue": { - "raw": "(nV: RangeDatePickerPresetValue) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "required": false }, { "uid": "cx", @@ -40414,7 +40554,7 @@ ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.ImgHTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false @@ -40428,7 +40568,7 @@ ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "null | (instance: HTMLImageElement | null) => void | React.MutableRefObject" }, "from": "@epam/uui-core:IHasForwardedRef", "required": false @@ -40437,120 +40577,93 @@ "propsFromUnion": false } }, - "@epam/uui-components:CalendarProps": { + "@epam/uui-components:AvatarStackProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "CalendarProps", - "nameFull": "CalendarProps" - }, - "src": "uui-components/src/inputs/DatePicker/Calendar.tsx", - "comment": { - "raw": [ - "Represents the properties of the Calendar component" - ] + "name": "AvatarStackProps", + "nameFull": "AvatarStackProps" }, + "src": "uui-components/src/widgets/AvatarStack.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "CalendarProps", + "raw": "AvatarStackProps", "print": [ - "/**", - " * Represents the properties of the Calendar component", - " */", - "interface CalendarProps extends IHasCX, IDisableable, IHasRawProps>, IHasForwardedRef {", - " value?: TSelection;", - " onValueChange: (day: Dayjs) => void;", - " renderDay?: (renderProps: DayProps) => ReactElement;", - " filter?(day: Dayjs): boolean;", - " hideAnotherMonths?: boolean;", - " isHoliday?: (day: Dayjs) => boolean;", - " /**", - " * Represents displayed month", - " */", - " month: Dayjs;", + "interface AvatarStackProps extends IHasCX, IHasRawProps> {", + " avatarSize: '24' | '36' | '48' | '144';", + " urlArray: string[];", + " direction: 'right' | 'left';", + " avatarsCount?: number;", + " renderItem?: (url: string) => React.ReactElement;", "}" ] }, "props": [ { - "uid": "value", - "name": "value", - "typeValue": { - "raw": "TSelection" - }, - "required": false - }, - { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "avatarSize", + "name": "avatarSize", "typeValue": { - "raw": "(day: Dayjs) => void" + "raw": "'24' | '36' | '48' | '144'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "24", + "36", + "48", + "144" + ] }, "required": true }, { - "uid": "renderDay", - "name": "renderDay", + "uid": "urlArray", + "name": "urlArray", "typeValue": { - "raw": "(renderProps: DayProps) => React.ReactElement>" - }, - "editor": { - "type": "component" + "raw": "string[]" }, - "required": false + "required": true }, { - "uid": "filter", - "name": "filter", + "uid": "direction", + "name": "direction", "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "'right' | 'left'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "right", + "left" + ] }, - "required": false + "required": true }, { - "uid": "hideAnotherMonths", - "name": "hideAnotherMonths", + "uid": "avatarsCount", + "name": "avatarsCount", "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, "required": false }, { - "uid": "isHoliday", - "name": "isHoliday", + "uid": "renderItem", + "name": "renderItem", "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "(url: string) => React.ReactElement>" }, "editor": { - "type": "func" + "type": "component" }, "required": false }, - { - "uid": "month", - "name": "month", - "comment": { - "raw": [ - "Represents displayed month" - ] - }, - "typeValue": { - "raw": "Dayjs" - }, - "required": true - }, { "uid": "cx", "name": "cx", @@ -40566,23 +40679,6 @@ "from": "@epam/uui-core:IHasCX", "required": false }, - { - "uid": "isDisabled", - "name": "isDisabled", - "comment": { - "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IDisableable", - "required": false - }, { "uid": "rawProps", "name": "rawProps", @@ -40596,141 +40692,107 @@ }, "from": "@epam/uui-core:IHasRawProps", "required": false - }, - { - "uid": "forwardedRef", - "name": "forwardedRef", - "comment": { - "raw": [ - "this ref is passed to the underlying component" - ] - }, - "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" - }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:CheckboxProps": { + "@epam/uui-components:BaseRatingProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "CheckboxProps", - "nameFull": "CheckboxProps" + "name": "BaseRatingProps", + "nameFull": "BaseRatingProps" }, - "src": "uui-components/src/inputs/Checkbox.tsx", + "src": "uui-components/src/inputs/Rating/BaseRating.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "CheckboxProps", + "raw": "BaseRatingProps", "print": [ - "interface CheckboxProps extends CheckboxCoreProps, IHasTabIndex {", - " /** Render callback for checkbox label.", - " * If omitted, 'label' prop value will be rendered.", - " */", - " renderLabel?(): React.ReactNode;", - " /** ID to put on 'input' node */", - " id?: string;", - " /** Check icon.", - " * Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon", - " */", - " icon?: Icon;", - " /** Indeterminate state icon.", - " * Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon", + "interface BaseRatingProps extends IHasCX, IDisableable, IControlled, ICanBeReadonly, IHasRawProps>, IHasForwardedRef {", + " from?: number;", + " to?: number;", + " /**", + " * @default 1", " */", - " indeterminateIcon?: Icon;", + " step?: 0.5 | 1;", + " renderRating?: (rating: number, markWidth: number, numberOfMarks: number) => React.ReactNode;", "}" ] }, "props": [ { - "uid": "renderLabel", - "name": "renderLabel", - "comment": { - "raw": [ - "Render callback for checkbox label.", - " If omitted, 'label' prop value will be rendered." - ] - }, + "uid": "from", + "name": "from", "typeValue": { - "raw": "() => React.ReactNode" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, "required": false }, { - "uid": "id", - "name": "id", - "comment": { - "raw": [ - "ID to put on 'input' node" - ] - }, + "uid": "to", + "name": "to", "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, "required": false }, { - "uid": "icon", - "name": "icon", + "uid": "step", + "name": "step", "comment": { "raw": [ - "Check icon.", - " Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon" - ] + "@default 1" + ], + "tags": { + "@default": 1 + } }, "typeValue": { - "raw": "Icon" + "raw": "0.5 | 1" }, "editor": { - "type": "component" + "type": "oneOf", + "options": [ + 0.5, + 1 + ] }, "required": false }, { - "uid": "indeterminateIcon", - "name": "indeterminateIcon", - "comment": { - "raw": [ - "Indeterminate state icon.", - " Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon" - ] - }, + "uid": "renderRating", + "name": "renderRating", "typeValue": { - "raw": "Icon" + "raw": "(rating: number, markWidth: number, numberOfMarks: number) => React.ReactNode" }, "editor": { - "type": "component" + "type": "func" }, "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "True if component contains invalid input" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:ICanBeInvalid", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { @@ -40750,40 +40812,6 @@ "from": "@epam/uui-core:IDisableable", "required": false }, - { - "uid": "isReadonly", - "name": "isReadonly", - "comment": { - "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false - }, - { - "uid": "isRequired", - "name": "isRequired", - "comment": { - "raw": [ - "Marks that component's value is required and shouldn't be empty" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false - }, { "uid": "value", "name": "value", @@ -40793,10 +40821,7 @@ ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TValue" }, "from": "@epam/uui-core:IControlled", "required": true @@ -40810,7 +40835,7 @@ ] }, "typeValue": { - "raw": "(newValue: boolean) => void" + "raw": "(newValue: TValue) => void" }, "editor": { "type": "func" @@ -40819,11 +40844,11 @@ "required": true }, { - "uid": "indeterminate", - "name": "indeterminate", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -40832,89 +40857,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICheckable", - "required": false - }, - { - "uid": "onFocus", - "name": "onFocus", - "comment": { - "raw": [ - "Called when component gets input focus" - ] - }, - "typeValue": { - "raw": "(e: React.FocusEvent) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:ICanFocus", - "required": false - }, - { - "uid": "onBlur", - "name": "onBlur", - "comment": { - "raw": [ - "Called when component looses input focus" - ] - }, - "typeValue": { - "raw": "(e: React.FocusEvent) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:ICanFocus", - "required": false - }, - { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, - "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" - }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false - }, - { - "uid": "label", - "name": "label", - "comment": { - "raw": [ - "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasLabel", - "required": false - }, - { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", - "comment": { - "raw": [ - "Given a value, returns an analytics event to send when component is edited.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." - ] - }, - "typeValue": { - "raw": "(newValue: boolean | null, oldValue: boolean | null) => AnalyticsEvent" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { @@ -40926,89 +40869,95 @@ ] }, "typeValue": { - "raw": "React.LabelHTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:IHasTabIndex", + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:ClickableComponentProps": { + "@epam/uui-components:BlockerProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "ClickableComponentProps", - "nameFull": "ClickableComponentProps" + "name": "BlockerProps", + "nameFull": "BlockerProps" }, - "src": "uui-components/src/widgets/Clickable.tsx", + "src": "uui-components/src/layout/Blocker.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "ClickableComponentProps", + "raw": "BlockerProps", "print": [ - "type ClickableComponentProps = IClickable & IAnalyticableClick & IHasTabIndex & IDisableable & IHasCX & ICanRedirect & IHasRawProps & {};" + "interface BlockerProps extends IHasCX, IHasRawProps> {", + " /** Turns the blocker on or off */", + " isEnabled: boolean;", + " /** Disables spinner animation display */", + " hideSpinner?: boolean;", + " /** Sets the minimal height in px, for cases when blocked content is empty */", + " spacerHeight?: number;", + " /** Replaces default spinner */", + " renderSpinner?(props: any): React.ReactNode;", + "}" ] }, "props": [ { - "uid": "onClick", - "name": "onClick", + "uid": "isEnabled", + "name": "isEnabled", "comment": { "raw": [ - "Called when component is clicked" + "Turns the blocker on or off" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IClickable", - "required": false + "required": true }, { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "hideSpinner", + "name": "hideSpinner", "comment": { "raw": [ - "An analytics event to send (via AnalyticsContext) when component is clicked.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "Disables spinner animation display" ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "spacerHeight", + "name": "spacerHeight", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Sets the minimal height in px, for cases when blocked content is empty" ] }, "typeValue": { @@ -41017,24 +40966,22 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "renderSpinner", + "name": "renderSpinner", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Replaces default spinner" ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: any) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { @@ -41052,74 +40999,6 @@ "from": "@epam/uui-core:IHasCX", "required": false }, - { - "uid": "link", - "name": "link", - "comment": { - "raw": [ - "Link object to redirect to for SPA-redirects" - ] - }, - "typeValue": { - "raw": "Link" - }, - "from": "@epam/uui-core:ICanRedirect", - "required": false - }, - { - "uid": "href", - "name": "href", - "comment": { - "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@epam/uui-core:ICanRedirect", - "required": false - }, - { - "uid": "isLinkActive", - "name": "isLinkActive", - "comment": { - "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanRedirect", - "required": false - }, - { - "uid": "target", - "name": "target", - "comment": { - "raw": [ - "Controls where the link should be opened" - ] - }, - "typeValue": { - "raw": "'_blank'" - }, - "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] - }, - "from": "@epam/uui-core:ICanRedirect", - "required": false - }, { "uid": "rawProps", "name": "rawProps", @@ -41129,7 +41008,7 @@ ] }, "typeValue": { - "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false @@ -41138,383 +41017,303 @@ "propsFromUnion": false } }, - "@epam/uui-components:ClickableRawProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "ClickableRawProps", - "nameFull": "ClickableRawProps" - }, - "src": "uui-components/src/widgets/Clickable.tsx", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "React.AnchorHTMLAttributes | React.ButtonHTMLAttributes | React.HTMLAttributes", - "print": [ - "type ClickableRawProps = React.AnchorHTMLAttributes | React.ButtonHTMLAttributes | React.HTMLAttributes;" - ] - } - } - }, - "@epam/uui-components:ColumnsConfigurationRowProps": { + "@epam/uui-components:BurgerProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "ColumnsConfigurationRowProps", - "nameFull": "ColumnsConfigurationRowProps" + "name": "BurgerProps", + "nameFull": "BurgerProps" }, - "src": "uui-components/src/table/columnsConfigurationModal/types.ts", + "src": "uui-components/src/navigation/MainMenu/Burger/Burger.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ColumnsConfigurationRowProps", + "raw": "BurgerProps", "print": [ - "interface ColumnsConfigurationRowProps extends GroupedDataColumnProps {", - " toggleVisibility: () => void;", - " /**", - " * Pins column to the specified position. If 'fix' parameter is absent, the column is unpinned.", - " * @param fix - The position to which the column should be pinned. Omit to unpin the column.", - " */", - " togglePin: (fix: TColumnPinPosition) => void;", - " onCanAcceptDrop: (props: AcceptDropParams) => DropPositionOptions | null;", - " onDrop: (params: DropParams) => void;", - " columnConfig: IColumnConfig;", - " isDndAllowed: boolean;", - " /**", - " * The position at which the column is pinned. If the value is undefined, it means the column is not pinned.", - " */", - " fix: TColumnPinPosition;", - " isPinnedAlways: boolean;", + "interface BurgerProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", + " burgerIcon?: Icon;", + " crossIcon?: Icon;", + " width?: number;", + " burgerContentCx?: string;", + " renderBurgerContent?: (props: {", + " onClose: () => void;", + " }) => React.ReactNode;", + " bg?: string;", + " logoUrl?: string;", "}" ] }, "props": [ { - "uid": "toggleVisibility", - "name": "toggleVisibility", - "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "togglePin", - "name": "togglePin", - "comment": { - "raw": [ - "Pins column to the specified position. If 'fix' parameter is absent, the column is unpinned.", - " @param fix - The position to which the column should be pinned. Omit to unpin the column." - ] - }, - "typeValue": { - "raw": "(fix: TColumnPinPosition) => void" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "onCanAcceptDrop", - "name": "onCanAcceptDrop", + "uid": "burgerIcon", + "name": "burgerIcon", "typeValue": { - "raw": "(props: AcceptDropParams) => Partial> | null" + "raw": "Icon" }, "editor": { - "type": "func" + "type": "component" }, - "required": true + "required": false }, { - "uid": "onDrop", - "name": "onDrop", + "uid": "crossIcon", + "name": "crossIcon", "typeValue": { - "raw": "(params: DropParams) => void" + "raw": "Icon" }, "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "columnConfig", - "name": "columnConfig", - "typeValue": { - "raw": "IColumnConfig" + "type": "component" }, - "typeValueRef": "@epam/uui-core:IColumnConfig", - "required": true + "required": false }, { - "uid": "isDndAllowed", - "name": "isDndAllowed", + "uid": "width", + "name": "width", "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "required": true + "required": false }, { - "uid": "fix", - "name": "fix", - "comment": { - "raw": [ - "The position at which the column is pinned. If the value is undefined, it means the column is not pinned." - ] - }, + "uid": "burgerContentCx", + "name": "burgerContentCx", "typeValue": { - "raw": "'right' | 'left'" + "raw": "string" }, - "typeValueRef": "@epam/uui-components:TColumnPinPosition", "editor": { - "type": "oneOf", - "options": [ - "right", - "left" - ] + "type": "string" }, "required": false }, { - "uid": "isPinnedAlways", - "name": "isPinnedAlways", + "uid": "renderBurgerContent", + "name": "renderBurgerContent", "typeValue": { - "raw": "boolean" + "raw": "(props: { onClose: () => void; }) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "required": true + "required": false }, { - "uid": "groupKey", - "name": "groupKey", + "uid": "bg", + "name": "bg", "typeValue": { - "raw": "'hidden' | 'displayedUnpinned' | 'displayedPinnedLeft' | 'displayedPinnedRight'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "hidden", - "displayedUnpinned", - "displayedPinnedLeft", - "displayedPinnedRight" - ] + "type": "string" }, - "from": "@epam/uui-components:GroupedDataColumnProps", "required": false }, { - "uid": "key", - "name": "key", - "comment": { - "raw": [ - "Unique key to identify the column. Used to reference columns, e.g. in ColumnsConfig.", - " Also, used as React key for cells, header cells, and other components inside tables." - ] - }, + "uid": "logoUrl", + "name": "logoUrl", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@epam/uui-core:DataColumnProps", - "required": true + "required": false }, { - "uid": "group", - "name": "group", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "A unique identifier for a group of columns that establishes a connection between the column and the group of columns." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DataColumnProps", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "caption", - "name": "caption", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Column caption. Can be a plain text, or any React Component" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "width", - "name": "width", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "The width of the column. Usually, columns has exact this width.", - " When all columns fit, and there's spare horizontal space, you can use 'grow' prop to use this space for certain columns.", - " DataTable's columns can't shrink below width - table will add horizontal scrolling instead of shrinking columns" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:DataColumnProps", - "required": true - }, + "from": "@epam/uui-core:IHasForwardedRef", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:ButtonProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "ButtonProps", + "nameFull": "ButtonProps" + }, + "src": "uui-components/src/buttons/Button.tsx", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ButtonProps", + "print": [ + "type ButtonProps = ClickableComponentProps & IDropdownToggler & IHasIcon & IHasCaption & {", + " /** Call to clear toggler value */", + " onClear?(e?: any): void;", + " /** Icon for clear value button (usually cross) */", + " clearIcon?: Icon;", + " /** Icon for drop-down toggler */", + " dropdownIcon?: Icon;", + "};" + ] + }, + "props": [ { - "uid": "minWidth", - "name": "minWidth", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Minimal width to which column can be resized manually" + "Called when component is clicked" ] }, "typeValue": { - "raw": "number" + "raw": "(e?: any) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "grow", - "name": "grow", + "uid": "clickAnalyticsEvent", + "name": "clickAnalyticsEvent", "comment": { "raw": [ - "The flex grow for the column. Allows column to grow in width if there's spare horizontal space" + "An analytics event to send (via AnalyticsContext) when component is clicked.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | { [key: string]: any; name: string; }" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "textAlign", - "name": "textAlign", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "Aligns cell and header content horizontally" + "Controls the order of keyboard navigation between components" ] }, "typeValue": { - "raw": "'right' | 'left' | 'center'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left", - "center" - ] + "type": "number" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "justifyContent", - "name": "justifyContent", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Aligns only cell content horizontally" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "alignSelf", - "name": "alignSelf", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Align cell content vertically" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DataColumnProps", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "isSortable", - "name": "isSortable", + "uid": "link", + "name": "link", "comment": { "raw": [ - "Enables sorting arrows on the column.", - " Sorting state is kept in DataSourceState.sorting" + "Link object to redirect to for SPA-redirects" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Link" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "isAlwaysVisible", - "name": "isAlwaysVisible", + "uid": "href", + "name": "href", "comment": { "raw": [ - "Pass true to make this column always visible and forbid to hide it from columns config dialog" + "Href (URL) to redirect to, for non-SPA redirects" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "isLocked", - "name": "isLocked", + "uid": "isLinkActive", + "name": "isLinkActive", "comment": { "raw": [ - "Makes this column locked, which means that you can't hide, unpin or reorder this column. Usually applicable for such column without which table because useless.", - " Note, that isLocked column should be always fixed to any side of the table, if you didn't specify `column.fix` prop for such column, 'left' value will be used by default.", - " Also, if you have a few isLocked columns, it's necessary to place it together in the start or end(depends on `fix` prop) of columns array." + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" ] }, "typeValue": { @@ -41523,220 +41322,240 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "isHiddenByDefault", - "name": "isHiddenByDefault", + "uid": "target", + "name": "target", "comment": { "raw": [ - "Makes column hidden by default. User can turn it on later, via ColumnsConfiguration" + "Controls where the link should be opened" ] }, "typeValue": { - "raw": "boolean" + "raw": "'_blank'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "_blank" + ] }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "info", - "name": "info", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Info tooltip displayed in the table header" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "isFilterActive", - "name": "isFilterActive", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "Should return true, if current filter affects the column.", - " Usually, this prop is filled automatically by the useTableState hook.", - " If you use the useTableState hook, you don't need to specify it manually." + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { - "raw": "(filter: any, column: DataColumnProps) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "canCopy", - "name": "canCopy", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "A pure function that defines that column value can be copied to the other column." + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { - "raw": "(cell: DataTableSelectedCellData) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "canAcceptCopy", - "name": "canAcceptCopy", + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "A pure function that defines that column accepts copying other column value into it" + "Icon can be a React element (usually an SVG element)" ] }, "typeValue": { - "raw": "(from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean" + "raw": "Icon" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "allowResizing", - "name": "allowResizing", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component." + "Position of the icon (left of right)" ] }, "typeValue": { - "raw": "boolean" + "raw": "'right' | 'left'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "right", + "left" + ] }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "render", - "name": "render", + "uid": "onIconClick", + "name": "onIconClick", "comment": { "raw": [ - "Render the cell content. The item props is the value of the whole row (TItem)." + "Click handler for the icon" ] }, "typeValue": { - "raw": "(item: any, props: DataRowProps) => any" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:DataColumnProps", + "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "renderCell", - "name": "renderCell", + "uid": "caption", + "name": "caption", "comment": { "raw": [ - "Overrides rendering of the whole cell" + "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." ] }, "typeValue": { - "raw": "(cellProps: RenderCellProps) => any" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:DataColumnProps", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasCaption", "required": false }, { - "uid": "renderHeaderCell", - "name": "renderHeaderCell", + "uid": "onClear", + "name": "onClear", "comment": { "raw": [ - "Overrides rendering of the whole header cell." + "Call to clear toggler value" ] }, "typeValue": { - "raw": "(cellProps: DataTableHeaderCellProps) => any" + "raw": "(e?: any) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "renderDropdown", - "name": "renderDropdown", + "uid": "clearIcon", + "name": "clearIcon", "comment": { "raw": [ - "Render callback for column header dropdown.", - " Usually, this prop is filled automatically by the useTableState hook.", - " If you use the useTableState hook, you don't need to specify it manually." + "Icon for clear value button (usually cross)" ] }, "typeValue": { - "raw": "() => React.ReactNode" + "raw": "Icon" }, "editor": { "type": "component" }, - "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "renderFilter", - "name": "renderFilter", + "uid": "dropdownIcon", + "name": "dropdownIcon", "comment": { "raw": [ - "Render callback for column filter.", - " If you use useTableState hook, and you specify filter for the column, default filter will be rendered automatically.", - " You can use this prop to render a custom filter component." + "Icon for drop-down toggler" ] }, "typeValue": { - "raw": "(lens: ILens, dropdownProps: IDropdownBodyProps) => React.ReactNode" + "raw": "Icon" }, "editor": { "type": "component" }, - "from": "@epam/uui-core:DataColumnProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:CalendarPresetsProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "CalendarPresetsProps", + "nameFull": "CalendarPresetsProps" + }, + "src": "uui-components/src/inputs/DatePicker/CalendarPresets.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "CalendarPresetsProps", + "print": [ + "interface CalendarPresetsProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", + " presets: RangeDatePickerPresets;", + " onPresetSet: (nV: RangeDatePickerPresetValue) => void;", + "}" + ] + }, + "props": [ { - "uid": "renderTooltip", - "name": "renderTooltip", - "comment": { - "raw": [ - "Render callback for column header tooltip.", - " This tooltip will appear on cell hover with 600ms delay.", - "", - " If omitted, default implementation with column.caption + column.info will be rendered.", - " Pass `() => null` to disable tooltip rendering." - ] + "uid": "presets", + "name": "presets", + "typeValue": { + "raw": "RangeDatePickerPresets" }, + "typeValueRef": "@epam/uui-components:RangeDatePickerPresets", + "required": true + }, + { + "uid": "onPresetSet", + "name": "onPresetSet", "typeValue": { - "raw": "(column: DataColumnProps) => React.ReactNode" + "raw": "(nV: RangeDatePickerPresetValue) => void" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:DataColumnProps", - "required": false + "required": true }, { "uid": "cx", @@ -41754,60 +41573,151 @@ "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Called when component is clicked" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "HTMLDivElement & Record<`data-${string}`, string>" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:ControlGroupProps": { + "@epam/uui-components:CalendarProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "ControlGroupProps", - "nameFull": "ControlGroupProps" + "name": "CalendarProps", + "nameFull": "CalendarProps" + }, + "src": "uui-components/src/inputs/DatePicker/Calendar.tsx", + "comment": { + "raw": [ + "Represents the properties of the Calendar component" + ] }, - "src": "uui-components/src/layout/ControlGroup.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ControlGroupProps", + "raw": "CalendarProps", "print": [ - "interface ControlGroupProps extends IHasCX, IHasChildren, IHasRawProps> {", + "/**", + " * Represents the properties of the Calendar component", + " */", + "interface CalendarProps extends IHasCX, IDisableable, IHasRawProps>, IHasForwardedRef {", + " value?: TSelection;", + " onValueChange: (day: Dayjs) => void;", + " renderDay?: (renderProps: DayProps) => ReactElement;", + " filter?(day: Dayjs): boolean;", + " hideAnotherMonths?: boolean;", + " isHoliday?: (day: Dayjs) => boolean;", + " /**", + " * Represents displayed month", + " */", + " month: Dayjs;", "}" ] }, "props": [ + { + "uid": "value", + "name": "value", + "typeValue": { + "raw": "TSelection" + }, + "required": false + }, + { + "uid": "onValueChange", + "name": "onValueChange", + "typeValue": { + "raw": "(day: Dayjs) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "renderDay", + "name": "renderDay", + "typeValue": { + "raw": "(renderProps: DayProps) => React.ReactElement>" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "filter", + "name": "filter", + "typeValue": { + "raw": "(day: Dayjs) => boolean" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "hideAnotherMonths", + "name": "hideAnotherMonths", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isHoliday", + "name": "isHoliday", + "typeValue": { + "raw": "(day: Dayjs) => boolean" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "month", + "name": "month", + "comment": { + "raw": [ + "Represents displayed month" + ] + }, + "typeValue": { + "raw": "Dayjs" + }, + "required": true + }, { "uid": "cx", "name": "cx", @@ -41824,18 +41734,20 @@ "required": false }, { - "uid": "children", - "name": "children", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Component children" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDisableable", "required": false }, { @@ -41851,49 +41763,99 @@ }, "from": "@epam/uui-core:IHasRawProps", "required": false + }, + { + "uid": "forwardedRef", + "name": "forwardedRef", + "comment": { + "raw": [ + "this ref is passed to the underlying component" + ] + }, + "typeValue": { + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + }, + "from": "@epam/uui-core:IHasForwardedRef", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:ControlIconProps": { + "@epam/uui-components:CheckboxProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "ControlIconProps", - "nameFull": "ControlIconProps" + "name": "CheckboxProps", + "nameFull": "CheckboxProps" }, - "src": "uui-components/src/layout/IconContainer.tsx", + "src": "uui-components/src/inputs/Checkbox.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ControlIconProps", + "raw": "CheckboxProps", "print": [ - "interface ControlIconProps extends IHasCX, IDisableable, IHasRawProps>, IHasTabIndex {", - " /** Icon to display */", + "interface CheckboxProps extends CheckboxCoreProps, IHasTabIndex {", + " /** Render callback for checkbox label.", + " * If omitted, 'label' prop value will be rendered.", + " */", + " renderLabel?(): React.ReactNode;", + " /** ID to put on 'input' node */", + " id?: string;", + " /** Check icon.", + " * Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon", + " */", " icon?: Icon;", - " /** Flips the icon vertically */", - " flipY?: boolean;", - " /** Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise)) */", - " rotate?: '0' | '90cw' | '180' | '90ccw';", - " /** Click handler */", - " onClick?(e: React.SyntheticEvent): void;", - " /** CSS style prop to put on the component */", - " style?: React.CSSProperties;", - " /** Icon size in pixels (both width and height, as icons are assumed to be square-shaped) */", - " size?: number | string;", + " /** Indeterminate state icon.", + " * Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon", + " */", + " indeterminateIcon?: Icon;", "}" ] }, "props": [ + { + "uid": "renderLabel", + "name": "renderLabel", + "comment": { + "raw": [ + "Render callback for checkbox label.", + " If omitted, 'label' prop value will be rendered." + ] + }, + "typeValue": { + "raw": "() => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "ID to put on 'input' node" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, { "uid": "icon", "name": "icon", "comment": { "raw": [ - "Icon to display" + "Check icon.", + " Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon" ] }, "typeValue": { @@ -41905,11 +41867,28 @@ "required": false }, { - "uid": "flipY", - "name": "flipY", + "uid": "indeterminateIcon", + "name": "indeterminateIcon", "comment": { "raw": [ - "Flips the icon vertically" + "Indeterminate state icon.", + " Usually it has a default implementation in skins, so providing this is only necessary if you want to replace the default icon" + ] + }, + "typeValue": { + "raw": "Icon" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" ] }, "typeValue": { @@ -41918,70 +41897,143 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "rotate", - "name": "rotate", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise))" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "'0' | '90cw' | '180' | '90ccw'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "0", - "180", - "90cw", - "90ccw" + "type": "bool" + }, + "from": "@epam/uui-core:IDisableable", + "required": false + }, + { + "uid": "isReadonly", + "name": "isReadonly", + "comment": { + "raw": [ + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Click handler" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "(e: React.SyntheticEvent) => void" + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", + "required": false + }, + { + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, + "typeValue": { + "raw": "(newValue: boolean) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "indeterminate", + "name": "indeterminate", + "comment": { + "raw": [ + "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICheckable", "required": false }, { - "uid": "style", - "name": "style", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "CSS style prop to put on the component" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "(e: React.FocusEvent) => void" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "size", - "name": "size", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "Icon size in pixels (both width and height, as icons are assumed to be square-shaped)" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "string | number" + "raw": "(e: React.FocusEvent) => void" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:ICanFocus", "required": false }, { @@ -42000,20 +42052,36 @@ "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "label", + "name": "label", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." ] }, "typeValue": { - "raw": "boolean" + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasLabel", + "required": false + }, + { + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", + "comment": { + "raw": [ + "Given a value, returns an analytics event to send when component is edited.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + ] + }, + "typeValue": { + "raw": "(newValue: boolean | null, oldValue: boolean | null) => AnalyticsEvent" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { @@ -42025,7 +42093,7 @@ ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.LabelHTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false @@ -42051,110 +42119,63 @@ "propsFromUnion": false } }, - "@epam/uui-components:DataTableCellContainerProps": { + "@epam/uui-components:ClickableComponentProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "DataTableCellContainerProps", - "nameFull": "DataTableCellContainerProps" - }, - "src": "uui-components/src/table/DataTableCellContainer.tsx", - "comment": { - "raw": [ - "Props for DataTableCellContainer component." - ] + "name": "ClickableComponentProps", + "nameFull": "ClickableComponentProps" }, + "src": "uui-components/src/widgets/Clickable.tsx", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "DataTableCellContainerProps", + "raw": "ClickableComponentProps", "print": [ - "/**", - " * Props for DataTableCellContainer component.", - " */", - "interface DataTableCellContainerProps extends IHasCX, IClickable, React.PropsWithChildren, IHasRawProps> {", - " /**", - " * DataTable column configuration.", - " */", - " column: DataColumnProps | DataColumnGroupProps;", - " /**", - " * CSS text-align property.", - " */", - " textAlign?: 'left' | 'center' | 'right';", - " /**", - " * Flexbox align-self property. Aligns items vertically for horizontal flexbox. [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-align-self)", - " */", - " alignSelf?: string;", - " /**", - " * Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink).", - " */", - " shrink?: number;", - " /**", - " * Standard style attribute. Styles are added to element style, overriding supplied flex styles.", - " */", - " style?: React.CSSProperties;", - "}" + "type ClickableComponentProps = IClickable & IAnalyticableClick & IHasTabIndex & IDisableable & IHasCX & ICanRedirect & IHasRawProps & {};" ] }, "props": [ { - "uid": "column", - "name": "column", - "comment": { - "raw": [ - "DataTable column configuration." - ] - }, - "typeValue": { - "raw": "DataColumnProps | DataColumnGroupProps" - }, - "required": true - }, - { - "uid": "textAlign", - "name": "textAlign", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "CSS text-align property." + "Called when component is clicked" ] }, "typeValue": { - "raw": "'right' | 'left' | 'center'" + "raw": "(e?: any) => void" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left", - "center" - ] + "type": "func" }, + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "alignSelf", - "name": "alignSelf", + "uid": "clickAnalyticsEvent", + "name": "clickAnalyticsEvent", "comment": { "raw": [ - "Flexbox align-self property. Aligns items vertically for horizontal flexbox. [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-align-self)" + "An analytics event to send (via AnalyticsContext) when component is clicked.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | { [key: string]: any; name: string; }" }, + "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "shrink", - "name": "shrink", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink)." + "Controls the order of keyboard navigation between components" ] }, "typeValue": { @@ -42163,19 +42184,24 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "style", - "name": "style", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Standard style attribute. Styles are added to element style, overriding supplied flex styles." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { @@ -42194,30 +42220,71 @@ "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "link", + "name": "link", "comment": { "raw": [ - "Called when component is clicked" + "Link object to redirect to for SPA-redirects" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "Link" + }, + "from": "@epam/uui-core:ICanRedirect", + "required": false + }, + { + "uid": "href", + "name": "href", + "comment": { + "raw": [ + "Href (URL) to redirect to, for non-SPA redirects" + ] + }, + "typeValue": { + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "children", - "name": "children", + "uid": "isLinkActive", + "name": "isLinkActive", + "comment": { + "raw": [ + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" + ] + }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@types/react:PropsWithChildren", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanRedirect", + "required": false + }, + { + "uid": "target", + "name": "target", + "comment": { + "raw": [ + "Controls where the link should be opened" + ] + }, + "typeValue": { + "raw": "'_blank'" + }, + "editor": { + "type": "oneOf", + "options": [ + "_blank" + ] + }, + "from": "@epam/uui-core:ICanRedirect", "required": false }, { @@ -42229,7 +42296,7 @@ ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false @@ -42238,196 +42305,347 @@ "propsFromUnion": false } }, - "@epam/uui-components:DataTableFocusContextState": { + "@epam/uui-components:ClickableRawProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "DataTableFocusContextState", - "nameFull": "DataTableFocusContextState" - }, - "src": "uui-components/src/table/tableCellsFocus/context/DataTableFocusContext.ts", - "comment": { - "raw": [ - "State of a DataTableFocusContext." - ] + "name": "ClickableRawProps", + "nameFull": "ClickableRawProps" }, + "src": "uui-components/src/widgets/Clickable.tsx", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "DataTableFocusContextState", + "raw": "React.AnchorHTMLAttributes | React.ButtonHTMLAttributes | React.HTMLAttributes", "print": [ - "/**", - " * State of a DataTableFocusContext.", - " */", - "interface DataTableFocusContextState {", - " /**", - " * Focus manipulation manager in tables.", - " */", - " dataTableFocusManager: DataTableFocusManager;", - "}" + "type ClickableRawProps = React.AnchorHTMLAttributes | React.ButtonHTMLAttributes | React.HTMLAttributes;" ] - }, - "props": [ - { - "uid": "dataTableFocusManager", - "name": "dataTableFocusManager", - "comment": { - "raw": [ - "Focus manipulation manager in tables." - ] - }, - "typeValue": { - "raw": "DataTableFocusManager" - }, - "required": true - } - ], - "propsFromUnion": false + } } }, - "@epam/uui-components:DataTableFocusProviderProps": { + "@epam/uui-components:ColumnsConfigurationRowProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "DataTableFocusProviderProps", - "nameFull": "DataTableFocusProviderProps" - }, - "src": "uui-components/src/table/tableCellsFocus/context/DataTableFocusProvider.tsx", - "comment": { - "raw": [ - "Provider of a DataTableFocusContext." - ] + "name": "ColumnsConfigurationRowProps", + "nameFull": "ColumnsConfigurationRowProps" }, + "src": "uui-components/src/table/columnsConfigurationModal/types.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataTableFocusProviderProps", + "raw": "ColumnsConfigurationRowProps", "print": [ - "/**", - " * Provider of a DataTableFocusContext.", - " */", - "interface DataTableFocusProviderProps extends React.PropsWithChildren {", + "interface ColumnsConfigurationRowProps extends GroupedDataColumnProps {", + " toggleVisibility: () => void;", " /**", - " * Focus manipulation manager in tables.", + " * Pins column to the specified position. If 'fix' parameter is absent, the column is unpinned.", + " * @param fix - The position to which the column should be pinned. Omit to unpin the column.", " */", - " dataTableFocusManager?: DataTableFocusManager;", + " togglePin: (fix: TColumnPinPosition) => void;", + " onCanAcceptDrop: (props: AcceptDropParams) => DropPositionOptions | null;", + " onDrop: (params: DropParams) => void;", + " columnConfig: IColumnConfig;", + " isDndAllowed: boolean;", + " /**", + " * The position at which the column is pinned. If the value is undefined, it means the column is not pinned.", + " */", + " fix: TColumnPinPosition;", + " isPinnedAlways: boolean;", "}" ] }, "props": [ { - "uid": "dataTableFocusManager", - "name": "dataTableFocusManager", + "uid": "toggleVisibility", + "name": "toggleVisibility", + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "togglePin", + "name": "togglePin", "comment": { "raw": [ - "Focus manipulation manager in tables." + "Pins column to the specified position. If 'fix' parameter is absent, the column is unpinned.", + " @param fix - The position to which the column should be pinned. Omit to unpin the column." ] }, "typeValue": { - "raw": "DataTableFocusManager" + "raw": "(fix: TColumnPinPosition) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "onCanAcceptDrop", + "name": "onCanAcceptDrop", + "typeValue": { + "raw": "(props: AcceptDropParams) => Partial> | null" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "onDrop", + "name": "onDrop", + "typeValue": { + "raw": "(params: DropParams) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "columnConfig", + "name": "columnConfig", + "typeValue": { + "raw": "IColumnConfig" + }, + "typeValueRef": "@epam/uui-core:IColumnConfig", + "required": true + }, + { + "uid": "isDndAllowed", + "name": "isDndAllowed", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + }, + { + "uid": "fix", + "name": "fix", + "comment": { + "raw": [ + "The position at which the column is pinned. If the value is undefined, it means the column is not pinned." + ] + }, + "typeValue": { + "raw": "'right' | 'left'" + }, + "typeValueRef": "@epam/uui-components:TColumnPinPosition", + "editor": { + "type": "oneOf", + "options": [ + "right", + "left" + ] }, "required": false }, { - "uid": "children", - "name": "children", + "uid": "isPinnedAlways", + "name": "isPinnedAlways", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + }, + { + "uid": "groupKey", + "name": "groupKey", + "typeValue": { + "raw": "'hidden' | 'displayedUnpinned' | 'displayedPinnedLeft' | 'displayedPinnedRight'" + }, + "editor": { + "type": "oneOf", + "options": [ + "hidden", + "displayedUnpinned", + "displayedPinnedLeft", + "displayedPinnedRight" + ] + }, + "from": "@epam/uui-components:GroupedDataColumnProps", + "required": false + }, + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "Unique key to identify the column. Used to reference columns, e.g. in ColumnsConfig.", + " Also, used as React key for cells, header cells, and other components inside tables." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:DataColumnProps", + "required": true + }, + { + "uid": "group", + "name": "group", + "comment": { + "raw": [ + "A unique identifier for a group of columns that establishes a connection between the column and the group of columns." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:DataColumnProps", + "required": false + }, + { + "uid": "caption", + "name": "caption", + "comment": { + "raw": [ + "Column caption. Can be a plain text, or any React Component" + ] + }, "typeValue": { "raw": "React.ReactNode" }, "typeValueRef": "@types/react:ReactNode", - "from": "@types/react:PropsWithChildren", + "from": "@epam/uui-core:DataColumnProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:DayProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "DayProps", - "nameFull": "DayProps" - }, - "src": "uui-components/src/inputs/DatePicker/Day.tsx", - "comment": { - "raw": [ - "Represents the properties of the Day component" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DayProps", - "print": [ - "/**", - " * Represents the properties of the Day component", - " */", - "interface DayProps extends IEditable, IHasRawProps>, IHasForwardedRef, IHasCX {", - " filter?(day: Dayjs): boolean;", - " renderDayNumber?: (param: Dayjs) => any;", - " isSelected?: boolean;", - " isHoliday?: boolean;", - "}" - ] - }, - "props": [ + }, + { + "uid": "width", + "name": "width", + "comment": { + "raw": [ + "The width of the column. Usually, columns has exact this width.", + " When all columns fit, and there's spare horizontal space, you can use 'grow' prop to use this space for certain columns.", + " DataTable's columns can't shrink below width - table will add horizontal scrolling instead of shrinking columns" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataColumnProps", + "required": true + }, + { + "uid": "minWidth", + "name": "minWidth", + "comment": { + "raw": [ + "Minimal width to which column can be resized manually" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataColumnProps", + "required": false + }, { - "uid": "filter", - "name": "filter", + "uid": "grow", + "name": "grow", + "comment": { + "raw": [ + "The flex grow for the column. Allows column to grow in width if there's spare horizontal space" + ] + }, "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "renderDayNumber", - "name": "renderDayNumber", + "uid": "textAlign", + "name": "textAlign", + "comment": { + "raw": [ + "Aligns cell and header content horizontally" + ] + }, "typeValue": { - "raw": "(param: Dayjs) => any" + "raw": "'right' | 'left' | 'center'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "right", + "left", + "center" + ] }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isSelected", - "name": "isSelected", + "uid": "justifyContent", + "name": "justifyContent", + "comment": { + "raw": [ + "Aligns only cell content horizontally" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isHoliday", - "name": "isHoliday", + "uid": "alignSelf", + "name": "alignSelf", + "comment": { + "raw": [ + "Align cell content vertically" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "isSortable", + "name": "isSortable", "comment": { "raw": [ - "True if component contains invalid input" + "Enables sorting arrows on the column.", + " Sorting state is kept in DataSourceState.sorting" ] }, "typeValue": { @@ -42436,15 +42654,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "isAlwaysVisible", + "name": "isAlwaysVisible", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Pass true to make this column always visible and forbid to hide it from columns config dialog" ] }, "typeValue": { @@ -42453,15 +42671,17 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isLocked", + "name": "isLocked", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Makes this column locked, which means that you can't hide, unpin or reorder this column. Usually applicable for such column without which table because useless.", + " Note, that isLocked column should be always fixed to any side of the table, if you didn't specify `column.fix` prop for such column, 'left' value will be used by default.", + " Also, if you have a few isLocked columns, it's necessary to place it together in the start or end(depends on `fix` prop) of columns array." ] }, "typeValue": { @@ -42470,15 +42690,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "isHiddenByDefault", + "name": "isHiddenByDefault", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Makes column hidden by default. User can turn it on later, via ColumnsConfiguration" ] }, "typeValue": { @@ -42487,446 +42707,422 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "value", - "name": "value", + "uid": "info", + "name": "info", "comment": { "raw": [ - "The current value of component" + "Info tooltip displayed in the table header" ] }, "typeValue": { - "raw": "Dayjs" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IControlled", - "required": true + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:DataColumnProps", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "isFilterActive", + "name": "isFilterActive", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Should return true, if current filter affects the column.", + " Usually, this prop is filled automatically by the useTableState hook.", + " If you use the useTableState hook, you don't need to specify it manually." ] }, "typeValue": { - "raw": "(newValue: Dayjs) => void" + "raw": "(filter: any, column: DataColumnProps) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:DataColumnProps", + "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "canCopy", + "name": "canCopy", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "A pure function that defines that column value can be copied to the other column." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(cell: DataTableSelectedCellData) => boolean" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "canAcceptCopy", + "name": "canAcceptCopy", "comment": { "raw": [ - "this ref is passed to the underlying component" + "A pure function that defines that column accepts copying other column value into it" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "(from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean" }, - "from": "@epam/uui-core:IHasForwardedRef", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "allowResizing", + "name": "allowResizing", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:DataColumnProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:DragHandleProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "DragHandleProps", - "nameFull": "DragHandleProps" - }, - "src": "uui-components/src/dnd/DragHandle.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DragHandleProps", - "print": [ - "interface DragHandleProps extends IHasCX, IHasRawProps>, IDisableable {", - " /**", - " * Icon to be used as the drag handle", - " */", - " dragHandleIcon?: Icon;", - "}" - ] - }, - "props": [ + }, { - "uid": "dragHandleIcon", - "name": "dragHandleIcon", + "uid": "render", + "name": "render", "comment": { "raw": [ - "Icon to be used as the drag handle" + "Render the cell content. The item props is the value of the whole row (TItem)." ] }, "typeValue": { - "raw": "Icon" + "raw": "(item: any, props: DataRowProps) => any" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "renderCell", + "name": "renderCell", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Overrides rendering of the whole cell" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(cellProps: RenderCellProps) => any" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "renderHeaderCell", + "name": "renderHeaderCell", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Overrides rendering of the whole header cell." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(cellProps: DataTableHeaderCellProps) => any" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "renderDropdown", + "name": "renderDropdown", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Render callback for column header dropdown.", + " Usually, this prop is filled automatically by the useTableState hook.", + " If you use the useTableState hook, you don't need to specify it manually." ] }, "typeValue": { - "raw": "boolean" + "raw": "() => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:DataColumnProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:DropdownContainerProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "DropdownContainerProps", - "nameFull": "DropdownContainerProps" - }, - "src": "uui-components/src/overlays/DropdownContainer.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DropdownContainerProps", - "print": [ - "interface DropdownContainerProps extends IHasCX, IHasChildren, IHasStyleAttrs, IHasRawProps>, IHasForwardedRef, IDropdownBodyProps, Pick {", - " /** Defines width in 'px' or 'auto'. If 'auto' provided, will be used width of the content. */", - " width?: number | 'auto';", - " /** Defines maximum width in 'px'. If 'auto' provided, will be used width of the content. */", - " maxWidth?: number | 'auto';", - " /** Defines height in 'px'. */", - " height?: number;", - " /** Defines maxHeight in 'px'. If 'auto' provided, will be used height of the content. */", - " maxHeight?: number | 'auto';", - " /** If true, arrow tip will be shown", - " * @default false", - " * */", - " showArrow?: boolean;", - " /**", - " * Pass true to wrap DropdownContainer with FocusLock component to support keyboard navigation.", - " * If omitted, true value will be used.", - " *", - " * After DropdownContainer appeared the focus will be set on the first focusable element inside.", - " * @default true", - " */", - " focusLock?: boolean;", - " /**", - " * Pass true to lock focus within DropdownContainer.", - " * If omitted, true value will be used. It's used if focusLock=true.", - " */", - " persistentFocus?: boolean;", - " /**", - " * Pass any extra props to the FocusLock wrapper.", - " */", - " lockProps?: Record;", - " /**", - " * Pass true to handle Escape key press and call props.onClose().", - " * If omitted, true value will be used. It's used if focusLock=true.", - " */", - " closeOnEsc?: boolean;", - " /** Called on keyDown event in DropdownContainer.", - " Can be used to provide your own handlers.", - " */", - " onKeyDown?(e: React.KeyboardEvent): void;", - "}" - ] - }, - "props": [ + }, { - "uid": "width", - "name": "width", + "uid": "renderFilter", + "name": "renderFilter", "comment": { "raw": [ - "Defines width in 'px' or 'auto'. If 'auto' provided, will be used width of the content." + "Render callback for column filter.", + " If you use useTableState hook, and you specify filter for the column, default filter will be rendered automatically.", + " You can use this prop to render a custom filter component." ] }, "typeValue": { - "raw": "number | 'auto'" + "raw": "(lens: ILens, dropdownProps: IDropdownBodyProps) => React.ReactNode" }, "editor": { - "type": "oneOf", - "options": [ - "auto" - ], - "scalarTypeOption": "number" + "type": "component" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "maxWidth", - "name": "maxWidth", + "uid": "renderTooltip", + "name": "renderTooltip", "comment": { "raw": [ - "Defines maximum width in 'px'. If 'auto' provided, will be used width of the content." + "Render callback for column header tooltip.", + " This tooltip will appear on cell hover with 600ms delay.", + "", + " If omitted, default implementation with column.caption + column.info will be rendered.", + " Pass `() => null` to disable tooltip rendering." ] }, "typeValue": { - "raw": "number | 'auto'" + "raw": "(column: DataColumnProps) => React.ReactNode" }, "editor": { - "type": "oneOf", - "options": [ - "auto" - ], - "scalarTypeOption": "number" + "type": "component" }, + "from": "@epam/uui-core:DataColumnProps", "required": false }, { - "uid": "height", - "name": "height", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Defines height in 'px'." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "maxHeight", - "name": "maxHeight", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Defines maxHeight in 'px'. If 'auto' provided, will be used height of the content." + "Called when component is clicked" ] }, "typeValue": { - "raw": "number | 'auto'" + "raw": "(e?: any) => void" }, "editor": { - "type": "oneOf", - "options": [ - "auto" - ], - "scalarTypeOption": "number" + "type": "func" }, + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "showArrow", - "name": "showArrow", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "If true, arrow tip will be shown", - " @default false" - ], - "tags": { - "@default": false - } + "Any HTML attributes (native or 'data-') to put on the underlying component" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "HTMLDivElement & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:ControlGroupProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "ControlGroupProps", + "nameFull": "ControlGroupProps" + }, + "src": "uui-components/src/layout/ControlGroup.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ControlGroupProps", + "print": [ + "interface ControlGroupProps extends IHasCX, IHasChildren, IHasRawProps> {", + "}" + ] + }, + "props": [ { - "uid": "focusLock", - "name": "focusLock", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Pass true to wrap DropdownContainer with FocusLock component to support keyboard navigation.", - " If omitted, true value will be used.", - "", - " After DropdownContainer appeared the focus will be set on the first focusable element inside.", - " @default true" - ], - "tags": { - "@default": true - } + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "persistentFocus", - "name": "persistentFocus", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Pass true to lock focus within DropdownContainer.", - " If omitted, true value will be used. It's used if focusLock=true." + "Component children" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "lockProps", - "name": "lockProps", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Pass any extra props to the FocusLock wrapper." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "Record" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false - }, - { - "uid": "closeOnEsc", - "name": "closeOnEsc", + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:ControlIconProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "ControlIconProps", + "nameFull": "ControlIconProps" + }, + "src": "uui-components/src/layout/IconContainer.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ControlIconProps", + "print": [ + "interface ControlIconProps extends IHasCX, IDisableable, IHasRawProps>, IHasTabIndex {", + " /** Icon to display */", + " icon?: Icon;", + " /** Flips the icon vertically */", + " flipY?: boolean;", + " /** Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise)) */", + " rotate?: '0' | '90cw' | '180' | '90ccw';", + " /** Click handler */", + " onClick?(e: React.SyntheticEvent): void;", + " /** CSS style prop to put on the component */", + " style?: React.CSSProperties;", + " /** Icon size in pixels (both width and height, as icons are assumed to be square-shaped) */", + " size?: number | string;", + "}" + ] + }, + "props": [ + { + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "Pass true to handle Escape key press and call props.onClose().", - " If omitted, true value will be used. It's used if focusLock=true." + "Icon to display" ] }, "typeValue": { - "raw": "boolean" + "raw": "Icon" }, "editor": { - "type": "bool" + "type": "component" }, "required": false }, { - "uid": "onKeyDown", - "name": "onKeyDown", + "uid": "flipY", + "name": "flipY", "comment": { "raw": [ - "Called on keyDown event in DropdownContainer.", - " Can be used to provide your own handlers." + "Flips the icon vertically" ] }, "typeValue": { - "raw": "(e: React.KeyboardEvent) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "rotate", + "name": "rotate", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise))" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "'0' | '90cw' | '180' | '90ccw'" + }, + "editor": { + "type": "oneOf", + "options": [ + "0", + "180", + "90cw", + "90ccw" + ] }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "children", - "name": "children", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Component children" + "Click handler" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(e: React.SyntheticEvent) => void" + }, + "editor": { + "type": "func" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", "required": false }, { @@ -42940,77 +43136,73 @@ "typeValue": { "raw": "React.CSSProperties" }, - "from": "@epam/uui-core:IHasStyleAttrs", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "size", + "name": "size", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Icon size in pixels (both width and height, as icons are assumed to be square-shaped)" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "string | number" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "this ref is passed to the underlying component" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:IHasForwardedRef", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "onClose", - "name": "onClose", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Call to close the Dropdown body" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IDropdownBodyProps", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "togglerWidth", - "name": "togglerWidth", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "The width of the toggler, which can be used to adjust the body width to it" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IDropdownBodyProps", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "togglerHeight", - "name": "togglerHeight", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "The height of the toggler" + "Controls the order of keyboard navigation between components" ] }, "typeValue": { @@ -43019,412 +43211,407 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:IDropdownBodyProps", + "from": "@epam/uui-core:IHasTabIndex", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:DataTableCellContainerProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "DataTableCellContainerProps", + "nameFull": "DataTableCellContainerProps" + }, + "src": "uui-components/src/table/DataTableCellContainer.tsx", + "comment": { + "raw": [ + "Props for DataTableCellContainer component." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataTableCellContainerProps", + "print": [ + "/**", + " * Props for DataTableCellContainer component.", + " */", + "interface DataTableCellContainerProps extends IHasCX, IClickable, React.PropsWithChildren, IHasRawProps> {", + " /**", + " * DataTable column configuration.", + " */", + " column: DataColumnProps | DataColumnGroupProps;", + " /**", + " * CSS text-align property.", + " */", + " textAlign?: 'left' | 'center' | 'right';", + " /**", + " * Flexbox align-self property. Aligns items vertically for horizontal flexbox. [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-align-self)", + " */", + " alignSelf?: string;", + " /**", + " * Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink).", + " */", + " shrink?: number;", + " /**", + " * Standard style attribute. Styles are added to element style, overriding supplied flex styles.", + " */", + " style?: React.CSSProperties;", + "}" + ] + }, + "props": [ { - "uid": "scheduleUpdate", - "name": "scheduleUpdate", + "uid": "column", + "name": "column", "comment": { "raw": [ - "Call to force recompute dropdown position" + "DataTable column configuration." ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "DataColumnProps | DataColumnGroupProps" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "required": true }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "textAlign", + "name": "textAlign", "comment": { "raw": [ - "Indicates that dropdown is open" + "CSS text-align property." ] }, "typeValue": { - "raw": "boolean" + "raw": "'right' | 'left' | 'center'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "right", + "left", + "center" + ] }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "arrowProps", - "name": "arrowProps", + "uid": "alignSelf", + "name": "alignSelf", "comment": { "raw": [ - "Props that should be provided to the arrow component" + "Flexbox align-self property. Aligns items vertically for horizontal flexbox. [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-align-self)" ] }, "typeValue": { - "raw": "PopperArrowProps" + "raw": "string" + }, + "editor": { + "type": "string" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "shrink", + "name": "shrink", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink)." ] }, "typeValue": { - "raw": "'right' | 'left' | 'top' | 'bottom' | 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left", - "top", - "bottom", - "auto", - "auto-start", - "auto-end", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "number" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "autoFocus", - "name": "autoFocus", + "uid": "style", + "name": "style", "comment": { "raw": [ - "enables or disables autoFocusing feature.", - " If enabled - will move focus inside Lock, selecting the first or autoFocusable element", - " If disable - will blur any focus on Lock activation.", - " @default true" - ], - "tags": { - "@default": true - } + "Standard style attribute. Styles are added to element style, overriding supplied flex styles." + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.CSSProperties" }, - "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", "required": false }, { - "uid": "as", - "name": "as", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Component to use, defaults to 'div'" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "string | React.ComponentClass & { children: React.ReactNode; }, any> | React.FunctionComponent & { children: React.ReactNode; }>" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "shards", - "name": "shards", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Shards forms a scattered lock, same as `group` does, but in more \"low\" and controlled way" + "Called when component is clicked" ] }, "typeValue": { - "raw": "(HTMLElement | React.RefObject)[]" + "raw": "(e?: any) => void" }, - "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "returnFocus", - "name": "returnFocus", + "uid": "children", + "name": "children", + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@types/react:PropsWithChildren", + "required": false + }, + { + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "if true, will return focus to the previous position on trap disable.", - " Optionally, can pass focus options instead of `true` to control the focus", - " more precisely (ie. `{ preventScroll: true }`)", - "", - " can also accept a function with the first argument equals to element focus will be returned to", - " in order to provide full control to the user space" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "boolean | FocusOptions | (returnTo: Element) => boolean | FocusOptions" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", + "from": "@epam/uui-core:IHasRawProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:DropSpotRenderParams": { + "@epam/uui-components:DataTableFocusContextState": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "DropSpotRenderParams", - "nameFull": "DropSpotRenderParams" + "name": "DataTableFocusContextState", + "nameFull": "DataTableFocusContextState" + }, + "src": "uui-components/src/table/tableCellsFocus/context/DataTableFocusContext.ts", + "comment": { + "raw": [ + "State of a DataTableFocusContext." + ] }, - "src": "uui-components/src/widgets/DropSpot.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DropSpotRenderParams", + "raw": "DataTableFocusContextState", "print": [ - "interface DropSpotRenderParams extends DropSpotState {", - " /** Event handlers to put on your rendered component */", - " eventHandlers: EventHandlers;", + "/**", + " * State of a DataTableFocusContext.", + " */", + "interface DataTableFocusContextState {", + " /**", + " * Focus manipulation manager in tables.", + " */", + " dataTableFocusManager: DataTableFocusManager;", "}" ] }, "props": [ { - "uid": "eventHandlers", - "name": "eventHandlers", + "uid": "dataTableFocusManager", + "name": "dataTableFocusManager", "comment": { "raw": [ - "Event handlers to put on your rendered component" + "Focus manipulation manager in tables." ] }, "typeValue": { - "raw": "EventHandlers" - }, - "required": true - }, - { - "uid": "isDraggingOver", - "name": "isDraggingOver", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-components:DropSpotState", - "required": true - }, - { - "uid": "isDragStart", - "name": "isDragStart", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataTableFocusManager" }, - "from": "@epam/uui-components:DropSpotState", "required": true } ], "propsFromUnion": false } }, - "@epam/uui-components:FlexSpacerProps": { + "@epam/uui-components:DataTableFocusProviderProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "FlexSpacerProps", - "nameFull": "FlexSpacerProps" + "name": "DataTableFocusProviderProps", + "nameFull": "DataTableFocusProviderProps" + }, + "src": "uui-components/src/table/tableCellsFocus/context/DataTableFocusProvider.tsx", + "comment": { + "raw": [ + "Provider of a DataTableFocusContext." + ] }, - "src": "uui-components/src/layout/flexItems/FlexSpacer.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "FlexSpacerProps", + "raw": "DataTableFocusProviderProps", "print": [ - "interface FlexSpacerProps extends IAdaptiveItem {", + "/**", + " * Provider of a DataTableFocusContext.", + " */", + "interface DataTableFocusProviderProps extends React.PropsWithChildren {", + " /**", + " * Focus manipulation manager in tables.", + " */", + " dataTableFocusManager?: DataTableFocusManager;", "}" ] }, "props": [ { - "uid": "estimatedWidth", - "name": "estimatedWidth", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "priority", - "name": "priority", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "uid": "dataTableFocusManager", + "name": "dataTableFocusManager", + "comment": { + "raw": [ + "Focus manipulation manager in tables." + ] }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "collapseToMore", - "name": "collapseToMore", "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataTableFocusManager" }, - "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "children", + "name": "children", "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IAdaptiveItem", + "typeValueRef": "@types/react:ReactNode", + "from": "@types/react:PropsWithChildren", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:HeaderCellContentProps": { + "@epam/uui-components:DayProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "HeaderCellContentProps", - "nameFull": "HeaderCellContentProps" + "name": "DayProps", + "nameFull": "DayProps" + }, + "src": "uui-components/src/inputs/DatePicker/Day.tsx", + "comment": { + "raw": [ + "Represents the properties of the Day component" + ] }, - "src": "uui-components/src/table/DataTableHeaderCell.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "HeaderCellContentProps", + "raw": "DayProps", "print": [ - "interface HeaderCellContentProps extends DndActorRenderParams {", - " /** Called when resizing is started */", - " onResizeStart: (e: React.MouseEvent) => void;", - " /** Called when resizing is ended */", - " onResizeEnd: (e: MouseEvent) => void;", - " /** Called during the resizing process */", - " onResize: (e: MouseEvent) => void;", - " /** Called when sorting */", - " toggleSort: (e: React.MouseEvent) => void;", - " /** Indicates that resizing process is active */", - " isResizing: boolean;", + "/**", + " * Represents the properties of the Day component", + " */", + "interface DayProps extends IEditable, IHasRawProps>, IHasForwardedRef, IHasCX {", + " filter?(day: Dayjs): boolean;", + " renderDayNumber?: (param: Dayjs) => any;", + " isSelected?: boolean;", + " isHoliday?: boolean;", "}" ] }, "props": [ { - "uid": "onResizeStart", - "name": "onResizeStart", - "comment": { - "raw": [ - "Called when resizing is started" - ] - }, + "uid": "filter", + "name": "filter", "typeValue": { - "raw": "(e: React.MouseEvent) => void" + "raw": "(day: Dayjs) => boolean" }, "editor": { "type": "func" }, - "required": true + "required": false }, { - "uid": "onResizeEnd", - "name": "onResizeEnd", - "comment": { - "raw": [ - "Called when resizing is ended" - ] - }, + "uid": "renderDayNumber", + "name": "renderDayNumber", "typeValue": { - "raw": "(e: MouseEvent) => void" + "raw": "(param: Dayjs) => any" }, "editor": { "type": "func" }, - "required": true + "required": false + }, + { + "uid": "isSelected", + "name": "isSelected", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false }, { - "uid": "onResize", - "name": "onResize", - "comment": { - "raw": [ - "Called during the resizing process" - ] - }, + "uid": "isHoliday", + "name": "isHoliday", "typeValue": { - "raw": "(e: MouseEvent) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "required": false }, { - "uid": "toggleSort", - "name": "toggleSort", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Called when sorting" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "(e: React.MouseEvent) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:ICanBeInvalid", + "required": false }, { - "uid": "isResizing", - "name": "isResizing", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Indicates that resizing process is active" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -43433,14 +43620,15 @@ "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDisableable", + "required": false }, { - "uid": "isDraggable", - "name": "isDraggable", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "True, if the element can be dragged. Doesn't mean that DnD is active." + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -43449,15 +43637,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "from": "@epam/uui-core:ICanBeReadonly", + "required": false }, { - "uid": "isDraggedOut", - "name": "isDraggedOut", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost." + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { @@ -43466,233 +43654,281 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "from": "@epam/uui-core:ICanBeRequired", + "required": false }, { - "uid": "isDragGhost", - "name": "isDragGhost", + "uid": "value", + "name": "value", "comment": { "raw": [ - "True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost." + "The current value of component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Dayjs" }, - "from": "@epam/uui-core:DndActorRenderParams", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "isDraggedOver", - "name": "isDraggedOver", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: Dayjs) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DndActorRenderParams", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "isDropAccepted", - "name": "isDropAccepted", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "from": "@epam/uui-core:IHasRawProps", + "required": false }, { - "uid": "isDndInProgress", - "name": "isDndInProgress", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "True if any drag and drop operation is in progress, even if the element not being dragged" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "from": "@epam/uui-core:IHasForwardedRef", + "required": false }, { - "uid": "dragData", - "name": "dragData", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Drag data associated with the element. Specified always, even if there is no DnD operation happening." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "any" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DndActorRenderParams", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:DragHandleProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "DragHandleProps", + "nameFull": "DragHandleProps" + }, + "src": "uui-components/src/dnd/DragHandle.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DragHandleProps", + "print": [ + "interface DragHandleProps extends IHasCX, IHasRawProps>, IDisableable {", + " /**", + " * Icon to be used as the drag handle", + " */", + " dragHandleIcon?: Icon;", + "}" + ] + }, + "props": [ { - "uid": "position", - "name": "position", + "uid": "dragHandleIcon", + "name": "dragHandleIcon", "comment": { "raw": [ - "Drop position. Chosen from accepted drop positions according to pointer coordinates" + "Icon to be used as the drag handle" ] }, "typeValue": { - "raw": "'right' | 'left' | 'top' | 'bottom' | 'inside'" + "raw": "Icon" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left", - "top", - "bottom", - "inside" - ] + "type": "component" }, - "from": "@epam/uui-core:DndActorRenderParams", "required": false }, { - "uid": "eventHandlers", - "name": "eventHandlers", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Event handlers. Component is expected to pass these events to the top element it renders.", - " As onClick event on the element will be overwritten, use DndActorProps.onClick to receive click events on the element" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "DndEventHandlers" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "required": false }, { - "uid": "classNames", - "name": "classNames", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "CSS class names to add to the element.", - " Some of these markers are used by the DndActor internally, so they must be added even if no used by component itself to apply styles." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "string[]" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:DndActorRenderParams", - "required": true + "from": "@epam/uui-core:IHasRawProps", + "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Ref to the DOM element to perform DnD actions" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "null | React.RefObject | (instance: any) => void" + "raw": "boolean" }, - "from": "@epam/uui-core:DndActorRenderParams", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDisableable", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:IconButtonProps": { + "@epam/uui-components:DropdownContainerProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "IconButtonProps", - "nameFull": "IconButtonProps" + "name": "DropdownContainerProps", + "nameFull": "DropdownContainerProps" }, - "src": "uui-components/src/buttons/IconButton.tsx", + "src": "uui-components/src/overlays/DropdownContainer.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "IconButtonProps", + "raw": "DropdownContainerProps", "print": [ - "type IconButtonProps = ClickableComponentProps & Omit & {", - " /** Icon can be a React element (usually an SVG element) */", - " icon?: Icon;", - " /** Icon for drop-down toggler */", - " dropdownIcon?: Icon;", + "interface DropdownContainerProps extends IHasCX, IHasChildren, IHasStyleAttrs, IHasRawProps>, IHasForwardedRef, IDropdownBodyProps, Pick {", + " /** Defines width in 'px' or 'auto'. If 'auto' provided, will be used width of the content. */", + " width?: number | 'auto';", + " /** Defines maximum width in 'px'. If 'auto' provided, will be used width of the content. */", + " maxWidth?: number | 'auto';", + " /** Defines height in 'px'. */", + " height?: number;", + " /** Defines maxHeight in 'px'. If 'auto' provided, will be used height of the content. */", + " maxHeight?: number | 'auto';", + " /** If true, arrow tip will be shown", + " * @default false", + " * */", + " showArrow?: boolean;", " /**", - " * Defines component size.", + " * Pass true to wrap DropdownContainer with FocusLock component to support keyboard navigation.", + " * If omitted, true value will be used.", + " *", + " * After DropdownContainer appeared the focus will be set on the first focusable element inside.", + " * @default true", " */", - " size?: number | string;", + " focusLock?: boolean;", " /**", - " * Pass true to enable dropdown icon.", + " * Pass true to lock focus within DropdownContainer.", + " * If omitted, true value will be used. It's used if focusLock=true.", " */", - " showDropdownIcon?: boolean;", - "};" + " persistentFocus?: boolean;", + " /**", + " * Pass any extra props to the FocusLock wrapper.", + " */", + " lockProps?: Record;", + " /**", + " * Pass true to handle Escape key press and call props.onClose().", + " * If omitted, true value will be used. It's used if focusLock=true.", + " */", + " closeOnEsc?: boolean;", + " /** Called on keyDown event in DropdownContainer.", + " Can be used to provide your own handlers.", + " */", + " onKeyDown?(e: React.KeyboardEvent): void;", + "}" ] }, "props": [ { - "uid": "onClick", - "name": "onClick", + "uid": "width", + "name": "width", "comment": { "raw": [ - "Called when component is clicked" + "Defines width in 'px' or 'auto'. If 'auto' provided, will be used width of the content." ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "number | 'auto'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "auto" + ], + "scalarTypeOption": "number" }, - "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "maxWidth", + "name": "maxWidth", "comment": { "raw": [ - "An analytics event to send (via AnalyticsContext) when component is clicked.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "Defines maximum width in 'px'. If 'auto' provided, will be used width of the content." ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "number | 'auto'" + }, + "editor": { + "type": "oneOf", + "options": [ + "auto" + ], + "scalarTypeOption": "number" }, - "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "height", + "name": "height", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Defines height in 'px'." ] }, "typeValue": { @@ -43701,354 +43937,353 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "maxHeight", + "name": "maxHeight", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Defines maxHeight in 'px'. If 'auto' provided, will be used height of the content." ] }, "typeValue": { - "raw": "boolean" + "raw": "number | 'auto'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "auto" + ], + "scalarTypeOption": "number" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "showArrow", + "name": "showArrow", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] + "If true, arrow tip will be shown", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "link", - "name": "link", + "uid": "focusLock", + "name": "focusLock", "comment": { "raw": [ - "Link object to redirect to for SPA-redirects" - ] + "Pass true to wrap DropdownContainer with FocusLock component to support keyboard navigation.", + " If omitted, true value will be used.", + "", + " After DropdownContainer appeared the focus will be set on the first focusable element inside.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "Link" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "href", - "name": "href", + "uid": "persistentFocus", + "name": "persistentFocus", "comment": { "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" + "Pass true to lock focus within DropdownContainer.", + " If omitted, true value will be used. It's used if focusLock=true." ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "isLinkActive", - "name": "isLinkActive", + "uid": "lockProps", + "name": "lockProps", "comment": { "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" + "Pass any extra props to the FocusLock wrapper." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Record" }, - "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "target", - "name": "target", + "uid": "closeOnEsc", + "name": "closeOnEsc", "comment": { "raw": [ - "Controls where the link should be opened" + "Pass true to handle Escape key press and call props.onClose().", + " If omitted, true value will be used. It's used if focusLock=true." ] }, "typeValue": { - "raw": "'_blank'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] + "type": "bool" }, - "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "onKeyDown", + "name": "onKeyDown", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Called on keyDown event in DropdownContainer.", + " Can be used to provide your own handlers." ] }, "typeValue": { - "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(e: React.KeyboardEvent) => void" + }, + "editor": { + "type": "func" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:IDropdownToggler", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "icon", - "name": "icon", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "Component children" ] }, "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "dropdownIcon", - "name": "dropdownIcon", + "uid": "style", + "name": "style", "comment": { "raw": [ - "Icon for drop-down toggler" + "CSS style prop to put on the component" ] }, "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" + "raw": "React.CSSProperties" }, + "from": "@epam/uui-core:IHasStyleAttrs", "required": false }, { - "uid": "size", - "name": "size", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Defines component size." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "string | number" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "showDropdownIcon", - "name": "showDropdownIcon", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Pass true to enable dropdown icon." + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, + "from": "@epam/uui-core:IHasForwardedRef", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:IconContainerProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "IconContainerProps", - "nameFull": "IconContainerProps" - }, - "src": "uui-components/src/layout/IconContainer.tsx", - "comment": { - "raw": [ - "Represents the properties of a IconContainer component." - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "ControlIconProps", - "print": [ - "/** Represents the properties of a IconContainer component. */", - "type IconContainerProps = ControlIconProps & {};" - ] - }, - "props": [ + }, { - "uid": "icon", - "name": "icon", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Icon to display" + "Call to close the Dropdown body" ] }, "typeValue": { - "raw": "Icon" + "raw": "() => void" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-components:ControlIconProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "flipY", - "name": "flipY", + "uid": "togglerWidth", + "name": "togglerWidth", "comment": { "raw": [ - "Flips the icon vertically" + "The width of the toggler, which can be used to adjust the body width to it" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-components:ControlIconProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "rotate", - "name": "rotate", + "uid": "togglerHeight", + "name": "togglerHeight", "comment": { "raw": [ - "Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise))" + "The height of the toggler" ] }, "typeValue": { - "raw": "'0' | '90cw' | '180' | '90ccw'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "0", - "180", - "90cw", - "90ccw" - ] + "type": "number" }, - "from": "@epam/uui-components:ControlIconProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "scheduleUpdate", + "name": "scheduleUpdate", "comment": { "raw": [ - "Click handler" + "Call to force recompute dropdown position" ] }, "typeValue": { - "raw": "(e: React.SyntheticEvent) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-components:ControlIconProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "style", - "name": "style", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "CSS style prop to put on the component" + "Indicates that dropdown is open" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "boolean" }, - "from": "@epam/uui-components:ControlIconProps", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "size", - "name": "size", + "uid": "arrowProps", + "name": "arrowProps", "comment": { "raw": [ - "Icon size in pixels (both width and height, as icons are assumed to be square-shaped)" + "Props that should be provided to the arrow component" ] }, "typeValue": { - "raw": "string | number" + "raw": "PopperArrowProps" }, - "from": "@epam/uui-components:ControlIconProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "'right' | 'left' | 'top' | 'bottom' | 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "oneOf", + "options": [ + "right", + "left", + "top", + "bottom", + "auto", + "auto-start", + "auto-end", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] + }, + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "autoFocus", + "name": "autoFocus", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] + "enables or disables autoFocusing feature.", + " If enabled - will move focus inside Lock, selecting the first or autoFocusable element", + " If disable - will blur any focus on Lock activation.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -44056,1714 +44291,1585 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "as", + "name": "as", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Component to use, defaults to 'div'" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "string | React.ComponentClass & { children: React.ReactNode; }, any> | React.FunctionComponent & { children: React.ReactNode; }>" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "shards", + "name": "shards", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Shards forms a scattered lock, same as `group` does, but in more \"low\" and controlled way" ] }, "typeValue": { - "raw": "number" + "raw": "(HTMLElement | React.RefObject)[]" }, - "editor": { - "type": "number" + "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", + "required": false + }, + { + "uid": "returnFocus", + "name": "returnFocus", + "comment": { + "raw": [ + "if true, will return focus to the previous position on trap disable.", + " Optionally, can pass focus options instead of `true` to control the focus", + " more precisely (ie. `{ preventScroll: true }`)", + "", + " can also accept a function with the first argument equals to element focus will be returned to", + " in order to provide full control to the user space" + ] }, - "from": "@epam/uui-core:IHasTabIndex", + "typeValue": { + "raw": "boolean | FocusOptions | (returnTo: Element) => boolean | FocusOptions" + }, + "from": "node_modules/react-focus-lock/dist/cjs/interfaces.d.ts:ReactFocusLockProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:InputAddonProps": { + "@epam/uui-components:DropSpotRenderParams": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "InputAddonProps", - "nameFull": "InputAddonProps" + "name": "DropSpotRenderParams", + "nameFull": "DropSpotRenderParams" }, - "src": "uui-components/src/inputs/InputAddon.tsx", + "src": "uui-components/src/widgets/DropSpot.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "InputAddonProps", + "raw": "DropSpotRenderParams", "print": [ - "interface InputAddonProps extends IHasCX {", - " /** Content to be rendered in addon */", - " content: React.ReactNode;", + "interface DropSpotRenderParams extends DropSpotState {", + " /** Event handlers to put on your rendered component */", + " eventHandlers: EventHandlers;", "}" ] }, "props": [ { - "uid": "content", - "name": "content", + "uid": "eventHandlers", + "name": "eventHandlers", "comment": { "raw": [ - "Content to be rendered in addon" + "Event handlers to put on your rendered component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "EventHandlers" }, - "typeValueRef": "@types/react:ReactNode", - "required": false + "required": true }, { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] + "uid": "isDraggingOver", + "name": "isDraggingOver", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-components:DropSpotState", + "required": true + }, + { + "uid": "isDragStart", + "name": "isDragStart", "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "editor": { + "type": "bool" + }, + "from": "@epam/uui-components:DropSpotState", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-components:IRenderInputProps": { + "@epam/uui-components:FlexSpacerProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "IRenderInputProps", - "nameFull": "IRenderInputProps" + "name": "FlexSpacerProps", + "nameFull": "FlexSpacerProps" }, - "src": "uui-components/src/inputs/TextInput.tsx", + "src": "uui-components/src/layout/flexItems/FlexSpacer.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "IRenderInputProps", + "raw": "FlexSpacerProps", "print": [ - "type IRenderInputProps = React.DetailedHTMLProps, HTMLInputElement>;" + "interface FlexSpacerProps extends IAdaptiveItem {", + "}" ] }, "props": [ { - "uid": "ref", - "name": "ref", - "typeValue": { - "raw": "null | string | (instance: HTMLInputElement | null) => void | React.RefObject" - }, - "from": "@types/react:ClassAttributes", - "required": false - }, - { - "uid": "key", - "name": "key", - "typeValue": { - "raw": "null | string | number" - }, - "from": "@types/react:Attributes", - "required": false - }, - { - "uid": "accept", - "name": "accept", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "alt", - "name": "alt", + "uid": "estimatedWidth", + "name": "estimatedWidth", "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "autoComplete", - "name": "autoComplete", + "uid": "priority", + "name": "priority", "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "autoFocus", - "name": "autoFocus", + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "capture", - "name": "capture", - "typeValue": { - "raw": "boolean | 'user' | 'environment'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "user", - "environment" - ] - }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "checked", - "name": "checked", + "uid": "collapseToMore", + "name": "collapseToMore", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "crossOrigin", - "name": "crossOrigin", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "disabled", - "name": "disabled", + "uid": "collapsedContainer", + "name": "collapsedContainer", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IAdaptiveItem", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:HeaderCellContentProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "HeaderCellContentProps", + "nameFull": "HeaderCellContentProps" + }, + "src": "uui-components/src/table/DataTableHeaderCell.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "HeaderCellContentProps", + "print": [ + "interface HeaderCellContentProps extends DndActorRenderParams {", + " /** Called when resizing is started */", + " onResizeStart: (e: React.MouseEvent) => void;", + " /** Called when resizing is ended */", + " onResizeEnd: (e: MouseEvent) => void;", + " /** Called during the resizing process */", + " onResize: (e: MouseEvent) => void;", + " /** Called when sorting */", + " toggleSort: (e: React.MouseEvent) => void;", + " /** Indicates that resizing process is active */", + " isResizing: boolean;", + "}" + ] + }, + "props": [ { - "uid": "enterKeyHint", - "name": "enterKeyHint", - "typeValue": { - "raw": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'" - }, - "editor": { - "type": "oneOf", - "options": [ - "enter", - "done", - "go", - "next", - "previous", - "search", - "send" + "uid": "onResizeStart", + "name": "onResizeStart", + "comment": { + "raw": [ + "Called when resizing is started" ] }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "form", - "name": "form", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "formAction", - "name": "formAction", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "formEncType", - "name": "formEncType", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "formMethod", - "name": "formMethod", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "formNoValidate", - "name": "formNoValidate", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "formTarget", - "name": "formTarget", "typeValue": { - "raw": "string" + "raw": "(e: React.MouseEvent) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "required": true }, { - "uid": "height", - "name": "height", - "typeValue": { - "raw": "string | number" + "uid": "onResizeEnd", + "name": "onResizeEnd", + "comment": { + "raw": [ + "Called when resizing is ended" + ] }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "list", - "name": "list", "typeValue": { - "raw": "string" + "raw": "(e: MouseEvent) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "required": true }, { - "uid": "max", - "name": "max", - "typeValue": { - "raw": "string | number" + "uid": "onResize", + "name": "onResize", + "comment": { + "raw": [ + "Called during the resizing process" + ] }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "maxLength", - "name": "maxLength", "typeValue": { - "raw": "number" + "raw": "(e: MouseEvent) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "required": true }, { - "uid": "min", - "name": "min", - "typeValue": { - "raw": "string | number" + "uid": "toggleSort", + "name": "toggleSort", + "comment": { + "raw": [ + "Called when sorting" + ] }, - "from": "@types/react:InputHTMLAttributes", - "required": false - }, - { - "uid": "minLength", - "name": "minLength", "typeValue": { - "raw": "number" + "raw": "(e: React.MouseEvent) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "required": true }, { - "uid": "multiple", - "name": "multiple", + "uid": "isResizing", + "name": "isResizing", + "comment": { + "raw": [ + "Indicates that resizing process is active" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "required": true }, { - "uid": "name", - "name": "name", + "uid": "isDraggable", + "name": "isDraggable", + "comment": { + "raw": [ + "True, if the element can be dragged. Doesn't mean that DnD is active." + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "pattern", - "name": "pattern", + "uid": "isDraggedOut", + "name": "isDraggedOut", + "comment": { + "raw": [ + "True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost." + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "isDragGhost", + "name": "isDragGhost", + "comment": { + "raw": [ + "True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost." + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "readOnly", - "name": "readOnly", + "uid": "isDraggedOver", + "name": "isDraggedOver", + "comment": { + "raw": [ + "True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false)" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "required", - "name": "required", + "uid": "isDropAccepted", + "name": "isDropAccepted", + "comment": { + "raw": [ + "True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "size", - "name": "size", + "uid": "isDndInProgress", + "name": "isDndInProgress", + "comment": { + "raw": [ + "True if any drag and drop operation is in progress, even if the element not being dragged" + ] + }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "src", - "name": "src", - "typeValue": { - "raw": "string" + "uid": "dragData", + "name": "dragData", + "comment": { + "raw": [ + "Drag data associated with the element. Specified always, even if there is no DnD operation happening." + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "any" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:DndActorRenderParams", "required": false }, { - "uid": "step", - "name": "step", + "uid": "position", + "name": "position", + "comment": { + "raw": [ + "Drop position. Chosen from accepted drop positions according to pointer coordinates" + ] + }, "typeValue": { - "raw": "string | number" + "raw": "'right' | 'left' | 'top' | 'bottom' | 'inside'" }, - "from": "@types/react:InputHTMLAttributes", + "editor": { + "type": "oneOf", + "options": [ + "right", + "left", + "top", + "bottom", + "inside" + ] + }, + "from": "@epam/uui-core:DndActorRenderParams", "required": false }, { - "uid": "type", - "name": "type", + "uid": "eventHandlers", + "name": "eventHandlers", + "comment": { + "raw": [ + "Event handlers. Component is expected to pass these events to the top element it renders.", + " As onClick event on the element will be overwritten, use DndActorProps.onClick to receive click events on the element" + ] + }, "typeValue": { - "raw": "'number' | 'hidden' | string & {} | 'button' | 'time' | 'image' | 'text' | 'search' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'month' | 'password' | 'radio' | 'range' | 'reset' | 'submit' | 'tel' | 'url' | 'week'" + "raw": "DndEventHandlers" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "value", - "name": "value", + "uid": "classNames", + "name": "classNames", + "comment": { + "raw": [ + "CSS class names to add to the element.", + " Some of these markers are used by the DndActor internally, so they must be added even if no used by component itself to apply styles." + ] + }, "typeValue": { - "raw": "string | number | readonly string[]" + "raw": "string[]" }, - "from": "@types/react:InputHTMLAttributes", - "required": false + "from": "@epam/uui-core:DndActorRenderParams", + "required": true }, { - "uid": "width", - "name": "width", + "uid": "ref", + "name": "ref", + "comment": { + "raw": [ + "Ref to the DOM element to perform DnD actions" + ] + }, "typeValue": { - "raw": "string | number" + "raw": "null | React.RefObject | (instance: any) => void" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:DndActorRenderParams", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:IconButtonProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "IconButtonProps", + "nameFull": "IconButtonProps" + }, + "src": "uui-components/src/buttons/IconButton.tsx", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "IconButtonProps", + "print": [ + "type IconButtonProps = ClickableComponentProps & Omit & {", + " /** Icon can be a React element (usually an SVG element) */", + " icon?: Icon;", + " /** Icon for drop-down toggler */", + " dropdownIcon?: Icon;", + " /**", + " * Defines component size.", + " */", + " size?: number | string;", + " /**", + " * Pass true to enable dropdown icon.", + " */", + " showDropdownIcon?: boolean;", + "};" + ] + }, + "props": [ { - "uid": "onChange", - "name": "onChange", + "uid": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Called when component is clicked" + ] + }, "typeValue": { - "raw": "React.ChangeEventHandler" + "raw": "(e?: any) => void" }, "editor": { "type": "func" }, - "from": "@types/react:InputHTMLAttributes", + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "defaultChecked", - "name": "defaultChecked", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "uid": "clickAnalyticsEvent", + "name": "clickAnalyticsEvent", + "comment": { + "raw": [ + "An analytics event to send (via AnalyticsContext) when component is clicked.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + ] }, - "from": "@types/react:HTMLAttributes", - "required": false - }, - { - "uid": "defaultValue", - "name": "defaultValue", "typeValue": { - "raw": "string | number | readonly string[]" + "raw": "null | { [key: string]: any; name: string; }" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "suppressContentEditableWarning", - "name": "suppressContentEditableWarning", + "uid": "tabIndex", + "name": "tabIndex", + "comment": { + "raw": [ + "Controls the order of keyboard navigation between components" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IHasTabIndex", "required": false }, { - "uid": "suppressHydrationWarning", - "name": "suppressHydrationWarning", + "uid": "isDisabled", + "name": "isDisabled", + "comment": { + "raw": [ + "Disable editing, and visually de-emphasize value of the component" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "accessKey", - "name": "accessKey", - "typeValue": { - "raw": "string" + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@types/react:HTMLAttributes", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "className", - "name": "className", - "typeValue": { - "raw": "string" + "uid": "link", + "name": "link", + "comment": { + "raw": [ + "Link object to redirect to for SPA-redirects" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "Link" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "contentEditable", - "name": "contentEditable", - "typeValue": { - "raw": "boolean | 'inherit' | 'true' | 'false'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "inherit", - "true", - "false" + "uid": "href", + "name": "href", + "comment": { + "raw": [ + "Href (URL) to redirect to, for non-SPA redirects" ] }, - "from": "@types/react:HTMLAttributes", - "required": false - }, - { - "uid": "contextMenu", - "name": "contextMenu", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "dir", - "name": "dir", + "uid": "isLinkActive", + "name": "isLinkActive", + "comment": { + "raw": [ + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "draggable", - "name": "draggable", + "uid": "target", + "name": "target", + "comment": { + "raw": [ + "Controls where the link should be opened" + ] + }, "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "'_blank'" }, "editor": { "type": "oneOf", "options": [ - false, - true, - "true", - "false" + "_blank" ] }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "hidden", - "name": "hidden", - "typeValue": { - "raw": "boolean" + "uid": "rawProps", + "name": "rawProps", + "comment": { + "raw": [ + "Any HTML attributes (native or 'data-') to put on the underlying component" + ] }, - "editor": { - "type": "bool" + "typeValue": { + "raw": "React.AnchorHTMLAttributes & Record<`data-${string}`, string> | React.ButtonHTMLAttributes & Record<`data-${string}`, string> | React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "id", - "name": "id", + "uid": "isOpen", + "name": "isOpen", + "comment": { + "raw": [ + "When isDropdown=true, indicate that dropdown is open with chevron icon" + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "lang", - "name": "lang", + "uid": "icon", + "name": "icon", + "comment": { + "raw": [ + "Icon can be a React element (usually an SVG element)" + ] + }, "typeValue": { - "raw": "string" + "raw": "Icon" }, "editor": { - "type": "string" + "type": "component" }, - "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "nonce", - "name": "nonce", + "uid": "dropdownIcon", + "name": "dropdownIcon", + "comment": { + "raw": [ + "Icon for drop-down toggler" + ] + }, "typeValue": { - "raw": "string" + "raw": "Icon" }, "editor": { - "type": "string" + "type": "component" }, - "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "slot", - "name": "slot", - "typeValue": { - "raw": "string" + "uid": "size", + "name": "size", + "comment": { + "raw": [ + "Defines component size." + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "string | number" }, - "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "spellCheck", - "name": "spellCheck", + "uid": "showDropdownIcon", + "name": "showDropdownIcon", + "comment": { + "raw": [ + "Pass true to enable dropdown icon." + ] + }, "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "bool" }, - "from": "@types/react:HTMLAttributes", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:IconContainerProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "IconContainerProps", + "nameFull": "IconContainerProps" + }, + "src": "uui-components/src/layout/IconContainer.tsx", + "comment": { + "raw": [ + "Represents the properties of a IconContainer component." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ControlIconProps", + "print": [ + "/** Represents the properties of a IconContainer component. */", + "type IconContainerProps = ControlIconProps & {};" + ] + }, + "props": [ { - "uid": "style", - "name": "style", - "typeValue": { - "raw": "React.CSSProperties" + "uid": "icon", + "name": "icon", + "comment": { + "raw": [ + "Icon to display" + ] }, - "from": "@types/react:HTMLAttributes", - "required": false - }, - { - "uid": "tabIndex", - "name": "tabIndex", "typeValue": { - "raw": "number" + "raw": "Icon" }, "editor": { - "type": "number" + "type": "component" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "title", - "name": "title", + "uid": "flipY", + "name": "flipY", + "comment": { + "raw": [ + "Flips the icon vertically" + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "translate", - "name": "translate", + "uid": "rotate", + "name": "rotate", + "comment": { + "raw": [ + "Rotate the icon (cw stands for 'clock-wise', ccw stands for 'counter clock-wise))" + ] + }, "typeValue": { - "raw": "'yes' | 'no'" + "raw": "'0' | '90cw' | '180' | '90ccw'" }, "editor": { "type": "oneOf", "options": [ - "yes", - "no" + "0", + "180", + "90cw", + "90ccw" ] }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "radioGroup", - "name": "radioGroup", + "uid": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Click handler" + ] + }, "typeValue": { - "raw": "string" + "raw": "(e: React.SyntheticEvent) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "role", - "name": "role", - "typeValue": { - "raw": "string & {} | 'article' | 'button' | 'dialog' | 'figure' | 'form' | 'img' | 'link' | 'main' | 'menu' | 'menuitem' | 'option' | 'table' | 'switch' | 'search' | 'checkbox' | 'radio' | 'alert' | 'alertdialog' | 'application' | 'banner' | 'cell' | 'columnheader' | 'combobox' | 'complementary' | 'contentinfo' | 'definition' | 'directory' | 'document' | 'feed' | 'grid' | 'gridcell' | 'group' | 'heading' | 'list' | 'listbox' | 'listitem' | 'log' | 'marquee' | 'math' | 'menubar' | 'menuitemcheckbox' | 'menuitemradio' | 'navigation' | 'none' | 'note' | 'presentation' | 'progressbar' | 'radiogroup' | 'region' | 'row' | 'rowgroup' | 'rowheader' | 'scrollbar' | 'searchbox' | 'separator' | 'slider' | 'spinbutton' | 'status' | 'tab' | 'tablist' | 'tabpanel' | 'term' | 'textbox' | 'timer' | 'toolbar' | 'tooltip' | 'tree' | 'treegrid' | 'treeitem'" + "uid": "style", + "name": "style", + "comment": { + "raw": [ + "CSS style prop to put on the component" + ] }, - "from": "@types/react:HTMLAttributes", - "required": false - }, - { - "uid": "about", - "name": "about", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "React.CSSProperties" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "datatype", - "name": "datatype", - "typeValue": { - "raw": "string" + "uid": "size", + "name": "size", + "comment": { + "raw": [ + "Icon size in pixels (both width and height, as icons are assumed to be square-shaped)" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "string | number" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-components:ControlIconProps", "required": false }, { - "uid": "inlist", - "name": "inlist", + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] + }, "typeValue": { - "raw": "any" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@types/react:HTMLAttributes", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "prefix", - "name": "prefix", + "uid": "isDisabled", + "name": "isDisabled", + "comment": { + "raw": [ + "Disable editing, and visually de-emphasize value of the component" + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "property", - "name": "property", - "typeValue": { - "raw": "string" + "uid": "rawProps", + "name": "rawProps", + "comment": { + "raw": [ + "Any HTML attributes (native or 'data-') to put on the underlying component" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "resource", - "name": "resource", + "uid": "tabIndex", + "name": "tabIndex", + "comment": { + "raw": [ + "Controls the order of keyboard navigation between components" + ] + }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@types/react:HTMLAttributes", + "from": "@epam/uui-core:IHasTabIndex", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:InputAddonProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "InputAddonProps", + "nameFull": "InputAddonProps" + }, + "src": "uui-components/src/inputs/InputAddon.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "InputAddonProps", + "print": [ + "interface InputAddonProps extends IHasCX {", + " /** Content to be rendered in addon */", + " content: React.ReactNode;", + "}" + ] + }, + "props": [ { - "uid": "typeof", - "name": "typeof", - "typeValue": { - "raw": "string" + "uid": "content", + "name": "content", + "comment": { + "raw": [ + "Content to be rendered in addon" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "React.ReactNode" }, - "from": "@types/react:HTMLAttributes", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "vocab", - "name": "vocab", - "typeValue": { - "raw": "string" + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@types/react:HTMLAttributes", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:IRenderInputProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "IRenderInputProps", + "nameFull": "IRenderInputProps" + }, + "src": "uui-components/src/inputs/TextInput.tsx", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "IRenderInputProps", + "print": [ + "type IRenderInputProps = React.DetailedHTMLProps, HTMLInputElement>;" + ] + }, + "props": [ { - "uid": "autoCapitalize", - "name": "autoCapitalize", + "uid": "ref", + "name": "ref", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | string | (instance: HTMLInputElement | null) => void | React.RefObject" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:ClassAttributes", "required": false }, { - "uid": "autoCorrect", - "name": "autoCorrect", + "uid": "key", + "name": "key", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "null | string | number" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:Attributes", "required": false }, { - "uid": "autoSave", - "name": "autoSave", + "uid": "accept", + "name": "accept", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "color", - "name": "color", + "uid": "alt", + "name": "alt", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "itemProp", - "name": "itemProp", + "uid": "autoComplete", + "name": "autoComplete", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "itemScope", - "name": "itemScope", + "uid": "autoFocus", + "name": "autoFocus", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "itemType", - "name": "itemType", + "uid": "capture", + "name": "capture", "typeValue": { - "raw": "string" + "raw": "boolean | 'user' | 'environment'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + false, + true, + "user", + "environment" + ] }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "itemID", - "name": "itemID", + "uid": "checked", + "name": "checked", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "itemRef", - "name": "itemRef", + "uid": "crossOrigin", + "name": "crossOrigin", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "results", - "name": "results", + "uid": "disabled", + "name": "disabled", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "security", - "name": "security", + "uid": "enterKeyHint", + "name": "enterKeyHint", "typeValue": { - "raw": "string" + "raw": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "enter", + "done", + "go", + "next", + "previous", + "search", + "send" + ] }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "unselectable", - "name": "unselectable", + "uid": "form", + "name": "form", "typeValue": { - "raw": "'on' | 'off'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "on", - "off" - ] + "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "inputMode", - "name": "inputMode", - "comment": { - "raw": [ - "Hints at the type of data that might be entered by the user while editing the element or its contents", - " @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute" - ] - }, + "uid": "formAction", + "name": "formAction", "typeValue": { - "raw": "'text' | 'search' | 'email' | 'tel' | 'url' | 'none' | 'numeric' | 'decimal'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "text", - "search", - "email", - "tel", - "url", - "none", - "numeric", - "decimal" - ] + "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "is", - "name": "is", - "comment": { - "raw": [ - "Specify that a standard HTML element should behave like a defined custom built-in element", - " @see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is" - ] - }, + "uid": "formEncType", + "name": "formEncType", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:HTMLAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-activedescendant'", - "name": "'aria-activedescendant'", - "comment": { - "raw": [ - "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application." - ] - }, + "uid": "formMethod", + "name": "formMethod", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-atomic'", - "name": "'aria-atomic'", - "comment": { - "raw": [ - "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute." - ] - }, + "uid": "formNoValidate", + "name": "formNoValidate", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-autocomplete'", - "name": "'aria-autocomplete'", - "comment": { - "raw": [ - "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be", - " presented if they are made." - ] - }, + "uid": "formTarget", + "name": "formTarget", "typeValue": { - "raw": "'list' | 'none' | 'inline' | 'both'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "list", - "none", - "inline", - "both" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-busy'", - "name": "'aria-busy'", - "comment": { - "raw": [ - "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user." - ] - }, + "uid": "height", + "name": "height", "typeValue": { - "raw": "boolean | 'true' | 'false'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "raw": "string | number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-checked'", - "name": "'aria-checked'", - "comment": { - "raw": [ - "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets.", - " @see aria-pressed @see aria-selected." - ] - }, + "uid": "list", + "name": "list", "typeValue": { - "raw": "boolean | 'true' | 'false' | 'mixed'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false", - "mixed" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-colcount'", - "name": "'aria-colcount'", - "comment": { - "raw": [ - "Defines the total number of columns in a table, grid, or treegrid.", - " @see aria-colindex." - ] + "uid": "max", + "name": "max", + "typeValue": { + "raw": "string | number" }, + "from": "@types/react:InputHTMLAttributes", + "required": false + }, + { + "uid": "maxLength", + "name": "maxLength", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-colindex'", - "name": "'aria-colindex'", - "comment": { - "raw": [ - "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.", - " @see aria-colcount @see aria-colspan." - ] + "uid": "min", + "name": "min", + "typeValue": { + "raw": "string | number" }, + "from": "@types/react:InputHTMLAttributes", + "required": false + }, + { + "uid": "minLength", + "name": "minLength", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-colspan'", - "name": "'aria-colspan'", - "comment": { - "raw": [ - "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.", - " @see aria-colindex @see aria-rowspan." - ] - }, + "uid": "multiple", + "name": "multiple", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-controls'", - "name": "'aria-controls'", - "comment": { - "raw": [ - "Identifies the element (or elements) whose contents or presence are controlled by the current element.", - " @see aria-owns." - ] - }, + "uid": "name", + "name": "name", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-current'", - "name": "'aria-current'", - "comment": { - "raw": [ - "Indicates the element that represents the current item within a container or set of related elements." - ] - }, + "uid": "pattern", + "name": "pattern", "typeValue": { - "raw": "boolean | 'time' | 'date' | 'true' | 'false' | 'page' | 'step' | 'location'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "time", - "date", - "true", - "false", - "page", - "step", - "location" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-describedby'", - "name": "'aria-describedby'", - "comment": { - "raw": [ - "Identifies the element (or elements) that describes the object.", - " @see aria-labelledby" - ] - }, + "uid": "placeholder", + "name": "placeholder", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-details'", - "name": "'aria-details'", - "comment": { - "raw": [ - "Identifies the element that provides a detailed, extended description for the object.", - " @see aria-describedby." - ] - }, + "uid": "readOnly", + "name": "readOnly", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-disabled'", - "name": "'aria-disabled'", - "comment": { - "raw": [ - "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.", - " @see aria-hidden @see aria-readonly." - ] - }, + "uid": "required", + "name": "required", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-dropeffect'", - "name": "'aria-dropeffect'", - "comment": { - "raw": [ - "Indicates what functions can be performed when a dragged object is released on the drop target.", - " @deprecated in ARIA 1.1" - ], - "tags": { - "@deprecated": "in ARIA 1.1" - } - }, + "uid": "size", + "name": "size", "typeValue": { - "raw": "'link' | 'none' | 'copy' | 'execute' | 'move' | 'popup'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "link", - "none", - "copy", - "execute", - "move", - "popup" - ] + "type": "number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-errormessage'", - "name": "'aria-errormessage'", - "comment": { - "raw": [ - "Identifies the element that provides an error message for the object.", - " @see aria-invalid @see aria-describedby." - ] - }, + "uid": "src", + "name": "src", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-expanded'", - "name": "'aria-expanded'", - "comment": { - "raw": [ - "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed." - ] - }, + "uid": "step", + "name": "step", "typeValue": { - "raw": "boolean | 'true' | 'false'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "raw": "string | number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-flowto'", - "name": "'aria-flowto'", - "comment": { - "raw": [ - "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,", - " allows assistive technology to override the general default of reading in document source order." - ] - }, + "uid": "type", + "name": "type", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "'number' | 'hidden' | string & {} | 'button' | 'time' | 'image' | 'text' | 'search' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'month' | 'password' | 'radio' | 'range' | 'reset' | 'submit' | 'tel' | 'url' | 'week'" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-grabbed'", - "name": "'aria-grabbed'", - "comment": { - "raw": [ - "Indicates an element's \"grabbed\" state in a drag-and-drop operation.", - " @deprecated in ARIA 1.1" - ], - "tags": { - "@deprecated": "in ARIA 1.1" - } - }, + "uid": "value", + "name": "value", "typeValue": { - "raw": "boolean | 'true' | 'false'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "raw": "string | number | readonly string[]" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-haspopup'", - "name": "'aria-haspopup'", - "comment": { - "raw": [ - "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element." - ] - }, + "uid": "width", + "name": "width", "typeValue": { - "raw": "boolean | 'dialog' | 'menu' | 'true' | 'false' | 'grid' | 'listbox' | 'tree'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "dialog", - "menu", - "true", - "false", - "grid", - "listbox", - "tree" - ] + "raw": "string | number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-hidden'", - "name": "'aria-hidden'", - "comment": { - "raw": [ - "Indicates whether the element is exposed to an accessibility API.", - " @see aria-disabled." - ] - }, + "uid": "onChange", + "name": "onChange", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "React.ChangeEventHandler" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "func" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:InputHTMLAttributes", "required": false }, { - "uid": "'aria-invalid'", - "name": "'aria-invalid'", - "comment": { - "raw": [ - "Indicates the entered value does not conform to the format expected by the application.", - " @see aria-errormessage." - ] - }, + "uid": "defaultChecked", + "name": "defaultChecked", "typeValue": { - "raw": "boolean | 'true' | 'false' | 'grammar' | 'spelling'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false", - "grammar", - "spelling" - ] + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-keyshortcuts'", - "name": "'aria-keyshortcuts'", - "comment": { - "raw": [ - "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element." - ] - }, + "uid": "defaultValue", + "name": "defaultValue", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "string | number | readonly string[]" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-label'", - "name": "'aria-label'", - "comment": { - "raw": [ - "Defines a string value that labels the current element.", - " @see aria-labelledby." - ] - }, + "uid": "suppressContentEditableWarning", + "name": "suppressContentEditableWarning", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-labelledby'", - "name": "'aria-labelledby'", - "comment": { - "raw": [ - "Identifies the element (or elements) that labels the current element.", - " @see aria-describedby." - ] - }, + "uid": "suppressHydrationWarning", + "name": "suppressHydrationWarning", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-level'", - "name": "'aria-level'", - "comment": { - "raw": [ - "Defines the hierarchical level of an element within a structure." - ] - }, + "uid": "accessKey", + "name": "accessKey", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-live'", - "name": "'aria-live'", - "comment": { - "raw": [ - "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region." - ] - }, + "uid": "className", + "name": "className", "typeValue": { - "raw": "'off' | 'assertive' | 'polite'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "off", - "assertive", - "polite" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-modal'", - "name": "'aria-modal'", - "comment": { - "raw": [ - "Indicates whether an element is modal when displayed." - ] - }, + "uid": "contentEditable", + "name": "contentEditable", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "boolean | 'inherit' | 'true' | 'false'" }, "editor": { "type": "oneOf", "options": [ false, true, + "inherit", "true", "false" ] }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-multiline'", - "name": "'aria-multiline'", - "comment": { - "raw": [ - "Indicates whether a text box accepts multiple lines of input or only a single line." - ] - }, + "uid": "contextMenu", + "name": "contextMenu", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-multiselectable'", - "name": "'aria-multiselectable'", - "comment": { - "raw": [ - "Indicates that the user may select more than one item from the current selectable descendants." - ] + "uid": "dir", + "name": "dir", + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "draggable", + "name": "draggable", "typeValue": { "raw": "boolean | 'true' | 'false'" }, @@ -45776,119 +45882,72 @@ "false" ] }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-orientation'", - "name": "'aria-orientation'", - "comment": { - "raw": [ - "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous." - ] - }, + "uid": "hidden", + "name": "hidden", "typeValue": { - "raw": "'horizontal' | 'vertical'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "horizontal", - "vertical" - ] + "type": "bool" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-owns'", - "name": "'aria-owns'", - "comment": { - "raw": [ - "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship", - " between DOM elements where the DOM hierarchy cannot be used to represent the relationship.", - " @see aria-controls." - ] - }, + "uid": "id", + "name": "id", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", - "required": false - }, - { - "uid": "'aria-placeholder'", - "name": "'aria-placeholder'", - "comment": { - "raw": [ - "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.", - " A hint could be a sample value or a brief description of the expected format." - ] - }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "lang", + "name": "lang", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-posinset'", - "name": "'aria-posinset'", - "comment": { - "raw": [ - "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.", - " @see aria-setsize." - ] - }, + "uid": "nonce", + "name": "nonce", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-pressed'", - "name": "'aria-pressed'", - "comment": { - "raw": [ - "Indicates the current \"pressed\" state of toggle buttons.", - " @see aria-checked @see aria-selected." - ] - }, + "uid": "slot", + "name": "slot", "typeValue": { - "raw": "boolean | 'true' | 'false' | 'mixed'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false", - "mixed" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-readonly'", - "name": "'aria-readonly'", - "comment": { - "raw": [ - "Indicates that the element is not editable, but is otherwise operable.", - " @see aria-disabled." - ] - }, + "uid": "spellCheck", + "name": "spellCheck", "typeValue": { "raw": "boolean | 'true' | 'false'" }, @@ -45901,1009 +45960,1399 @@ "false" ] }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-relevant'", - "name": "'aria-relevant'", - "comment": { - "raw": [ - "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.", - " @see aria-atomic." - ] + "uid": "style", + "name": "style", + "typeValue": { + "raw": "React.CSSProperties" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "tabIndex", + "name": "tabIndex", "typeValue": { - "raw": "'text' | 'additions' | 'additions removals' | 'additions text' | 'all' | 'removals' | 'removals additions' | 'removals text' | 'text additions' | 'text removals'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "text", - "additions", - "additions removals", - "additions text", - "all", - "removals", - "removals additions", - "removals text", - "text additions", - "text removals" - ] + "type": "number" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-required'", - "name": "'aria-required'", - "comment": { - "raw": [ - "Indicates that user input is required on the element before a form may be submitted." - ] + "uid": "title", + "name": "title", + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "translate", + "name": "translate", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "'yes' | 'no'" }, "editor": { "type": "oneOf", "options": [ - false, - true, - "true", - "false" + "yes", + "no" ] }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-roledescription'", - "name": "'aria-roledescription'", - "comment": { - "raw": [ - "Defines a human-readable, author-localized description for the role of an element." - ] - }, + "uid": "radioGroup", + "name": "radioGroup", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-rowcount'", - "name": "'aria-rowcount'", - "comment": { - "raw": [ - "Defines the total number of rows in a table, grid, or treegrid.", - " @see aria-rowindex." - ] + "uid": "role", + "name": "role", + "typeValue": { + "raw": "string & {} | 'article' | 'button' | 'dialog' | 'figure' | 'form' | 'img' | 'link' | 'main' | 'menu' | 'menuitem' | 'option' | 'table' | 'switch' | 'search' | 'checkbox' | 'radio' | 'alert' | 'alertdialog' | 'application' | 'banner' | 'cell' | 'columnheader' | 'combobox' | 'complementary' | 'contentinfo' | 'definition' | 'directory' | 'document' | 'feed' | 'grid' | 'gridcell' | 'group' | 'heading' | 'list' | 'listbox' | 'listitem' | 'log' | 'marquee' | 'math' | 'menubar' | 'menuitemcheckbox' | 'menuitemradio' | 'navigation' | 'none' | 'note' | 'presentation' | 'progressbar' | 'radiogroup' | 'region' | 'row' | 'rowgroup' | 'rowheader' | 'scrollbar' | 'searchbox' | 'separator' | 'slider' | 'spinbutton' | 'status' | 'tab' | 'tablist' | 'tabpanel' | 'term' | 'textbox' | 'timer' | 'toolbar' | 'tooltip' | 'tree' | 'treegrid' | 'treeitem'" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "about", + "name": "about", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-rowindex'", - "name": "'aria-rowindex'", - "comment": { - "raw": [ - "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.", - " @see aria-rowcount @see aria-rowspan." - ] - }, + "uid": "datatype", + "name": "datatype", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-rowspan'", - "name": "'aria-rowspan'", - "comment": { - "raw": [ - "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.", - " @see aria-rowindex @see aria-colspan." - ] + "uid": "inlist", + "name": "inlist", + "typeValue": { + "raw": "any" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "prefix", + "name": "prefix", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-selected'", - "name": "'aria-selected'", - "comment": { - "raw": [ - "Indicates the current \"selected\" state of various widgets.", - " @see aria-checked @see aria-pressed." - ] - }, + "uid": "property", + "name": "property", "typeValue": { - "raw": "boolean | 'true' | 'false'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "true", - "false" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-setsize'", - "name": "'aria-setsize'", - "comment": { - "raw": [ - "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.", - " @see aria-posinset." - ] - }, + "uid": "resource", + "name": "resource", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-sort'", - "name": "'aria-sort'", - "comment": { - "raw": [ - "Indicates if items in a table or grid are sorted in ascending or descending order." - ] - }, + "uid": "typeof", + "name": "typeof", "typeValue": { - "raw": "'none' | 'ascending' | 'descending' | 'other'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "none", - "ascending", - "descending", - "other" - ] + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-valuemax'", - "name": "'aria-valuemax'", - "comment": { - "raw": [ - "Defines the maximum allowed value for a range widget." - ] - }, + "uid": "vocab", + "name": "vocab", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-valuemin'", - "name": "'aria-valuemin'", - "comment": { - "raw": [ - "Defines the minimum allowed value for a range widget." - ] - }, + "uid": "autoCapitalize", + "name": "autoCapitalize", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-valuenow'", - "name": "'aria-valuenow'", - "comment": { - "raw": [ - "Defines the current value for a range widget.", - " @see aria-valuetext." - ] - }, + "uid": "autoCorrect", + "name": "autoCorrect", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "'aria-valuetext'", - "name": "'aria-valuetext'", - "comment": { - "raw": [ - "Defines the human readable text alternative of aria-valuenow for a range widget." - ] + "uid": "autoSave", + "name": "autoSave", + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@types/react:HTMLAttributes", + "required": false + }, + { + "uid": "color", + "name": "color", "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "from": "@types/react:AriaAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "children", - "name": "children", + "uid": "itemProp", + "name": "itemProp", "typeValue": { - "raw": "React.ReactNode" + "raw": "string" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@types/react:DOMAttributes", + "editor": { + "type": "string" + }, + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "dangerouslySetInnerHTML", - "name": "dangerouslySetInnerHTML", + "uid": "itemScope", + "name": "itemScope", "typeValue": { - "raw": "{ __html: string; }" + "raw": "boolean" }, - "from": "@types/react:DOMAttributes", + "editor": { + "type": "bool" + }, + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCopy", - "name": "onCopy", + "uid": "itemType", + "name": "itemType", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCopyCapture", - "name": "onCopyCapture", + "uid": "itemID", + "name": "itemID", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCut", - "name": "onCut", + "uid": "itemRef", + "name": "itemRef", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCutCapture", - "name": "onCutCapture", + "uid": "results", + "name": "results", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onPaste", - "name": "onPaste", + "uid": "security", + "name": "security", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onPasteCapture", - "name": "onPasteCapture", + "uid": "unselectable", + "name": "unselectable", "typeValue": { - "raw": "React.ClipboardEventHandler" + "raw": "'on' | 'off'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "on", + "off" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCompositionEnd", - "name": "onCompositionEnd", + "uid": "inputMode", + "name": "inputMode", + "comment": { + "raw": [ + "Hints at the type of data that might be entered by the user while editing the element or its contents", + " @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute" + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "'text' | 'search' | 'email' | 'tel' | 'url' | 'none' | 'numeric' | 'decimal'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "text", + "search", + "email", + "tel", + "url", + "none", + "numeric", + "decimal" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCompositionEndCapture", - "name": "onCompositionEndCapture", + "uid": "is", + "name": "is", + "comment": { + "raw": [ + "Specify that a standard HTML element should behave like a defined custom built-in element", + " @see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is" + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:HTMLAttributes", "required": false }, { - "uid": "onCompositionStart", - "name": "onCompositionStart", + "uid": "'aria-activedescendant'", + "name": "'aria-activedescendant'", + "comment": { + "raw": [ + "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application." + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCompositionStartCapture", - "name": "onCompositionStartCapture", + "uid": "'aria-atomic'", + "name": "'aria-atomic'", + "comment": { + "raw": [ + "Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute." + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCompositionUpdate", - "name": "onCompositionUpdate", + "uid": "'aria-autocomplete'", + "name": "'aria-autocomplete'", + "comment": { + "raw": [ + "Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be", + " presented if they are made." + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "'list' | 'none' | 'inline' | 'both'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "list", + "none", + "inline", + "both" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCompositionUpdateCapture", - "name": "onCompositionUpdateCapture", + "uid": "'aria-busy'", + "name": "'aria-busy'", + "comment": { + "raw": [ + "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user." + ] + }, "typeValue": { - "raw": "React.CompositionEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "'aria-checked'", + "name": "'aria-checked'", + "comment": { + "raw": [ + "Indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets.", + " @see aria-pressed @see aria-selected." + ] + }, "typeValue": { - "raw": "React.FocusEventHandler" + "raw": "boolean | 'true' | 'false' | 'mixed'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false", + "mixed" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onFocusCapture", - "name": "onFocusCapture", + "uid": "'aria-colcount'", + "name": "'aria-colcount'", + "comment": { + "raw": [ + "Defines the total number of columns in a table, grid, or treegrid.", + " @see aria-colindex." + ] + }, "typeValue": { - "raw": "React.FocusEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "'aria-colindex'", + "name": "'aria-colindex'", + "comment": { + "raw": [ + "Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.", + " @see aria-colcount @see aria-colspan." + ] + }, "typeValue": { - "raw": "React.FocusEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onBlurCapture", - "name": "onBlurCapture", + "uid": "'aria-colspan'", + "name": "'aria-colspan'", + "comment": { + "raw": [ + "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.", + " @see aria-colindex @see aria-rowspan." + ] + }, "typeValue": { - "raw": "React.FocusEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onChangeCapture", - "name": "onChangeCapture", + "uid": "'aria-controls'", + "name": "'aria-controls'", + "comment": { + "raw": [ + "Identifies the element (or elements) whose contents or presence are controlled by the current element.", + " @see aria-owns." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onBeforeInput", - "name": "onBeforeInput", + "uid": "'aria-current'", + "name": "'aria-current'", + "comment": { + "raw": [ + "Indicates the element that represents the current item within a container or set of related elements." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "boolean | 'time' | 'date' | 'true' | 'false' | 'page' | 'step' | 'location'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "time", + "date", + "true", + "false", + "page", + "step", + "location" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onBeforeInputCapture", - "name": "onBeforeInputCapture", + "uid": "'aria-describedby'", + "name": "'aria-describedby'", + "comment": { + "raw": [ + "Identifies the element (or elements) that describes the object.", + " @see aria-labelledby" + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onInput", - "name": "onInput", + "uid": "'aria-details'", + "name": "'aria-details'", + "comment": { + "raw": [ + "Identifies the element that provides a detailed, extended description for the object.", + " @see aria-describedby." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onInputCapture", - "name": "onInputCapture", + "uid": "'aria-disabled'", + "name": "'aria-disabled'", + "comment": { + "raw": [ + "Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.", + " @see aria-hidden @see aria-readonly." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onReset", - "name": "onReset", + "uid": "'aria-dropeffect'", + "name": "'aria-dropeffect'", + "comment": { + "raw": [ + "Indicates what functions can be performed when a dragged object is released on the drop target.", + " @deprecated in ARIA 1.1" + ], + "tags": { + "@deprecated": "in ARIA 1.1" + } + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "'link' | 'none' | 'copy' | 'execute' | 'move' | 'popup'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "link", + "none", + "copy", + "execute", + "move", + "popup" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onResetCapture", - "name": "onResetCapture", + "uid": "'aria-errormessage'", + "name": "'aria-errormessage'", + "comment": { + "raw": [ + "Identifies the element that provides an error message for the object.", + " @see aria-invalid @see aria-describedby." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onSubmit", - "name": "onSubmit", + "uid": "'aria-expanded'", + "name": "'aria-expanded'", + "comment": { + "raw": [ + "Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onSubmitCapture", - "name": "onSubmitCapture", + "uid": "'aria-flowto'", + "name": "'aria-flowto'", + "comment": { + "raw": [ + "Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,", + " allows assistive technology to override the general default of reading in document source order." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onInvalid", - "name": "onInvalid", + "uid": "'aria-grabbed'", + "name": "'aria-grabbed'", + "comment": { + "raw": [ + "Indicates an element's \"grabbed\" state in a drag-and-drop operation.", + " @deprecated in ARIA 1.1" + ], + "tags": { + "@deprecated": "in ARIA 1.1" + } + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onInvalidCapture", - "name": "onInvalidCapture", + "uid": "'aria-haspopup'", + "name": "'aria-haspopup'", + "comment": { + "raw": [ + "Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element." + ] + }, "typeValue": { - "raw": "React.FormEventHandler" + "raw": "boolean | 'dialog' | 'menu' | 'true' | 'false' | 'grid' | 'listbox' | 'tree'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "dialog", + "menu", + "true", + "false", + "grid", + "listbox", + "tree" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoad", - "name": "onLoad", + "uid": "'aria-hidden'", + "name": "'aria-hidden'", + "comment": { + "raw": [ + "Indicates whether the element is exposed to an accessibility API.", + " @see aria-disabled." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadCapture", - "name": "onLoadCapture", + "uid": "'aria-invalid'", + "name": "'aria-invalid'", + "comment": { + "raw": [ + "Indicates the entered value does not conform to the format expected by the application.", + " @see aria-errormessage." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false' | 'grammar' | 'spelling'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false", + "grammar", + "spelling" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onError", - "name": "onError", + "uid": "'aria-keyshortcuts'", + "name": "'aria-keyshortcuts'", + "comment": { + "raw": [ + "Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onErrorCapture", - "name": "onErrorCapture", + "uid": "'aria-label'", + "name": "'aria-label'", + "comment": { + "raw": [ + "Defines a string value that labels the current element.", + " @see aria-labelledby." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyDown", - "name": "onKeyDown", + "uid": "'aria-labelledby'", + "name": "'aria-labelledby'", + "comment": { + "raw": [ + "Identifies the element (or elements) that labels the current element.", + " @see aria-describedby." + ] + }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyDownCapture", - "name": "onKeyDownCapture", + "uid": "'aria-level'", + "name": "'aria-level'", + "comment": { + "raw": [ + "Defines the hierarchical level of an element within a structure." + ] + }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyPress", - "name": "onKeyPress", + "uid": "'aria-live'", + "name": "'aria-live'", "comment": { "raw": [ - "@deprecated" + "Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region." ] }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "'off' | 'assertive' | 'polite'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "off", + "assertive", + "polite" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyPressCapture", - "name": "onKeyPressCapture", + "uid": "'aria-modal'", + "name": "'aria-modal'", "comment": { "raw": [ - "@deprecated" + "Indicates whether an element is modal when displayed." ] }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyUp", - "name": "onKeyUp", + "uid": "'aria-multiline'", + "name": "'aria-multiline'", + "comment": { + "raw": [ + "Indicates whether a text box accepts multiple lines of input or only a single line." + ] + }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onKeyUpCapture", - "name": "onKeyUpCapture", + "uid": "'aria-multiselectable'", + "name": "'aria-multiselectable'", + "comment": { + "raw": [ + "Indicates that the user may select more than one item from the current selectable descendants." + ] + }, "typeValue": { - "raw": "React.KeyboardEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onAbort", - "name": "onAbort", - "typeValue": { - "raw": "React.ReactEventHandler" - }, - "editor": { - "type": "func" + "uid": "'aria-orientation'", + "name": "'aria-orientation'", + "comment": { + "raw": [ + "Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous." + ] }, - "from": "@types/react:DOMAttributes", - "required": false - }, - { - "uid": "onAbortCapture", - "name": "onAbortCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "'horizontal' | 'vertical'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "horizontal", + "vertical" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCanPlay", - "name": "onCanPlay", + "uid": "'aria-owns'", + "name": "'aria-owns'", + "comment": { + "raw": [ + "Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship", + " between DOM elements where the DOM hierarchy cannot be used to represent the relationship.", + " @see aria-controls." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCanPlayCapture", - "name": "onCanPlayCapture", + "uid": "'aria-placeholder'", + "name": "'aria-placeholder'", + "comment": { + "raw": [ + "Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value.", + " A hint could be a sample value or a brief description of the expected format." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCanPlayThrough", - "name": "onCanPlayThrough", + "uid": "'aria-posinset'", + "name": "'aria-posinset'", + "comment": { + "raw": [ + "Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.", + " @see aria-setsize." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onCanPlayThroughCapture", - "name": "onCanPlayThroughCapture", + "uid": "'aria-pressed'", + "name": "'aria-pressed'", + "comment": { + "raw": [ + "Indicates the current \"pressed\" state of toggle buttons.", + " @see aria-checked @see aria-selected." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false' | 'mixed'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false", + "mixed" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onDurationChange", - "name": "onDurationChange", + "uid": "'aria-readonly'", + "name": "'aria-readonly'", + "comment": { + "raw": [ + "Indicates that the element is not editable, but is otherwise operable.", + " @see aria-disabled." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onDurationChangeCapture", - "name": "onDurationChangeCapture", + "uid": "'aria-relevant'", + "name": "'aria-relevant'", + "comment": { + "raw": [ + "Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.", + " @see aria-atomic." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "'text' | 'additions' | 'additions removals' | 'additions text' | 'all' | 'removals' | 'removals additions' | 'removals text' | 'text additions' | 'text removals'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "text", + "additions", + "additions removals", + "additions text", + "all", + "removals", + "removals additions", + "removals text", + "text additions", + "text removals" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEmptied", - "name": "onEmptied", + "uid": "'aria-required'", + "name": "'aria-required'", + "comment": { + "raw": [ + "Indicates that user input is required on the element before a form may be submitted." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEmptiedCapture", - "name": "onEmptiedCapture", + "uid": "'aria-roledescription'", + "name": "'aria-roledescription'", + "comment": { + "raw": [ + "Defines a human-readable, author-localized description for the role of an element." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEncrypted", - "name": "onEncrypted", + "uid": "'aria-rowcount'", + "name": "'aria-rowcount'", + "comment": { + "raw": [ + "Defines the total number of rows in a table, grid, or treegrid.", + " @see aria-rowindex." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEncryptedCapture", - "name": "onEncryptedCapture", + "uid": "'aria-rowindex'", + "name": "'aria-rowindex'", + "comment": { + "raw": [ + "Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.", + " @see aria-rowcount @see aria-rowspan." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEnded", - "name": "onEnded", + "uid": "'aria-rowspan'", + "name": "'aria-rowspan'", + "comment": { + "raw": [ + "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.", + " @see aria-rowindex @see aria-colspan." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onEndedCapture", - "name": "onEndedCapture", + "uid": "'aria-selected'", + "name": "'aria-selected'", + "comment": { + "raw": [ + "Indicates the current \"selected\" state of various widgets.", + " @see aria-checked @see aria-pressed." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "boolean | 'true' | 'false'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "true", + "false" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadedData", - "name": "onLoadedData", + "uid": "'aria-setsize'", + "name": "'aria-setsize'", + "comment": { + "raw": [ + "Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.", + " @see aria-posinset." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadedDataCapture", - "name": "onLoadedDataCapture", + "uid": "'aria-sort'", + "name": "'aria-sort'", + "comment": { + "raw": [ + "Indicates if items in a table or grid are sorted in ascending or descending order." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "'none' | 'ascending' | 'descending' | 'other'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "none", + "ascending", + "descending", + "other" + ] }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadedMetadata", - "name": "onLoadedMetadata", + "uid": "'aria-valuemax'", + "name": "'aria-valuemax'", + "comment": { + "raw": [ + "Defines the maximum allowed value for a range widget." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadedMetadataCapture", - "name": "onLoadedMetadataCapture", + "uid": "'aria-valuemin'", + "name": "'aria-valuemin'", + "comment": { + "raw": [ + "Defines the minimum allowed value for a range widget." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadStart", - "name": "onLoadStart", + "uid": "'aria-valuenow'", + "name": "'aria-valuenow'", + "comment": { + "raw": [ + "Defines the current value for a range widget.", + " @see aria-valuetext." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onLoadStartCapture", - "name": "onLoadStartCapture", + "uid": "'aria-valuetext'", + "name": "'aria-valuetext'", + "comment": { + "raw": [ + "Defines the human readable text alternative of aria-valuenow for a range widget." + ] + }, "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@types/react:DOMAttributes", + "from": "@types/react:AriaAttributes", "required": false }, { - "uid": "onPause", - "name": "onPause", + "uid": "children", + "name": "children", "typeValue": { - "raw": "React.ReactEventHandler" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "onPauseCapture", - "name": "onPauseCapture", + "uid": "dangerouslySetInnerHTML", + "name": "dangerouslySetInnerHTML", "typeValue": { - "raw": "React.ReactEventHandler" - }, - "editor": { - "type": "func" + "raw": "{ __html: string; }" }, "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "onPlay", - "name": "onPlay", + "uid": "onCopy", + "name": "onCopy", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46912,10 +47361,10 @@ "required": false }, { - "uid": "onPlayCapture", - "name": "onPlayCapture", + "uid": "onCopyCapture", + "name": "onCopyCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46924,10 +47373,10 @@ "required": false }, { - "uid": "onPlaying", - "name": "onPlaying", + "uid": "onCut", + "name": "onCut", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46936,10 +47385,10 @@ "required": false }, { - "uid": "onPlayingCapture", - "name": "onPlayingCapture", + "uid": "onCutCapture", + "name": "onCutCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46948,10 +47397,10 @@ "required": false }, { - "uid": "onProgress", - "name": "onProgress", + "uid": "onPaste", + "name": "onPaste", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46960,10 +47409,10 @@ "required": false }, { - "uid": "onProgressCapture", - "name": "onProgressCapture", + "uid": "onPasteCapture", + "name": "onPasteCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.ClipboardEventHandler" }, "editor": { "type": "func" @@ -46972,10 +47421,10 @@ "required": false }, { - "uid": "onRateChange", - "name": "onRateChange", + "uid": "onCompositionEnd", + "name": "onCompositionEnd", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -46984,10 +47433,10 @@ "required": false }, { - "uid": "onRateChangeCapture", - "name": "onRateChangeCapture", + "uid": "onCompositionEndCapture", + "name": "onCompositionEndCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -46996,10 +47445,10 @@ "required": false }, { - "uid": "onResize", - "name": "onResize", + "uid": "onCompositionStart", + "name": "onCompositionStart", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -47008,10 +47457,10 @@ "required": false }, { - "uid": "onResizeCapture", - "name": "onResizeCapture", + "uid": "onCompositionStartCapture", + "name": "onCompositionStartCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -47020,10 +47469,10 @@ "required": false }, { - "uid": "onSeeked", - "name": "onSeeked", + "uid": "onCompositionUpdate", + "name": "onCompositionUpdate", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -47032,10 +47481,10 @@ "required": false }, { - "uid": "onSeekedCapture", - "name": "onSeekedCapture", + "uid": "onCompositionUpdateCapture", + "name": "onCompositionUpdateCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.CompositionEventHandler" }, "editor": { "type": "func" @@ -47044,10 +47493,10 @@ "required": false }, { - "uid": "onSeeking", - "name": "onSeeking", + "uid": "onFocus", + "name": "onFocus", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FocusEventHandler" }, "editor": { "type": "func" @@ -47056,10 +47505,10 @@ "required": false }, { - "uid": "onSeekingCapture", - "name": "onSeekingCapture", + "uid": "onFocusCapture", + "name": "onFocusCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FocusEventHandler" }, "editor": { "type": "func" @@ -47068,10 +47517,10 @@ "required": false }, { - "uid": "onStalled", - "name": "onStalled", + "uid": "onBlur", + "name": "onBlur", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FocusEventHandler" }, "editor": { "type": "func" @@ -47080,10 +47529,10 @@ "required": false }, { - "uid": "onStalledCapture", - "name": "onStalledCapture", + "uid": "onBlurCapture", + "name": "onBlurCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FocusEventHandler" }, "editor": { "type": "func" @@ -47092,10 +47541,10 @@ "required": false }, { - "uid": "onSuspend", - "name": "onSuspend", + "uid": "onChangeCapture", + "name": "onChangeCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47104,10 +47553,10 @@ "required": false }, { - "uid": "onSuspendCapture", - "name": "onSuspendCapture", + "uid": "onBeforeInput", + "name": "onBeforeInput", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47116,10 +47565,10 @@ "required": false }, { - "uid": "onTimeUpdate", - "name": "onTimeUpdate", + "uid": "onBeforeInputCapture", + "name": "onBeforeInputCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47128,10 +47577,10 @@ "required": false }, { - "uid": "onTimeUpdateCapture", - "name": "onTimeUpdateCapture", + "uid": "onInput", + "name": "onInput", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47140,10 +47589,10 @@ "required": false }, { - "uid": "onVolumeChange", - "name": "onVolumeChange", + "uid": "onInputCapture", + "name": "onInputCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47152,10 +47601,10 @@ "required": false }, { - "uid": "onVolumeChangeCapture", - "name": "onVolumeChangeCapture", + "uid": "onReset", + "name": "onReset", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47164,10 +47613,10 @@ "required": false }, { - "uid": "onWaiting", - "name": "onWaiting", + "uid": "onResetCapture", + "name": "onResetCapture", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47176,10 +47625,10 @@ "required": false }, { - "uid": "onWaitingCapture", - "name": "onWaitingCapture", + "uid": "onSubmit", + "name": "onSubmit", "typeValue": { - "raw": "React.ReactEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47188,10 +47637,10 @@ "required": false }, { - "uid": "onAuxClick", - "name": "onAuxClick", + "uid": "onSubmitCapture", + "name": "onSubmitCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47200,10 +47649,10 @@ "required": false }, { - "uid": "onAuxClickCapture", - "name": "onAuxClickCapture", + "uid": "onInvalid", + "name": "onInvalid", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47212,10 +47661,10 @@ "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "onInvalidCapture", + "name": "onInvalidCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.FormEventHandler" }, "editor": { "type": "func" @@ -47224,10 +47673,10 @@ "required": false }, { - "uid": "onClickCapture", - "name": "onClickCapture", + "uid": "onLoad", + "name": "onLoad", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47236,10 +47685,10 @@ "required": false }, { - "uid": "onContextMenu", - "name": "onContextMenu", + "uid": "onLoadCapture", + "name": "onLoadCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47248,10 +47697,10 @@ "required": false }, { - "uid": "onContextMenuCapture", - "name": "onContextMenuCapture", + "uid": "onError", + "name": "onError", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47260,10 +47709,10 @@ "required": false }, { - "uid": "onDoubleClick", - "name": "onDoubleClick", + "uid": "onErrorCapture", + "name": "onErrorCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47272,10 +47721,10 @@ "required": false }, { - "uid": "onDoubleClickCapture", - "name": "onDoubleClickCapture", + "uid": "onKeyDown", + "name": "onKeyDown", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47284,10 +47733,10 @@ "required": false }, { - "uid": "onDrag", - "name": "onDrag", + "uid": "onKeyDownCapture", + "name": "onKeyDownCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47296,10 +47745,15 @@ "required": false }, { - "uid": "onDragCapture", - "name": "onDragCapture", + "uid": "onKeyPress", + "name": "onKeyPress", + "comment": { + "raw": [ + "@deprecated" + ] + }, "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47308,10 +47762,15 @@ "required": false }, { - "uid": "onDragEnd", - "name": "onDragEnd", + "uid": "onKeyPressCapture", + "name": "onKeyPressCapture", + "comment": { + "raw": [ + "@deprecated" + ] + }, "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47320,10 +47779,10 @@ "required": false }, { - "uid": "onDragEndCapture", - "name": "onDragEndCapture", + "uid": "onKeyUp", + "name": "onKeyUp", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47332,10 +47791,10 @@ "required": false }, { - "uid": "onDragEnter", - "name": "onDragEnter", + "uid": "onKeyUpCapture", + "name": "onKeyUpCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.KeyboardEventHandler" }, "editor": { "type": "func" @@ -47344,10 +47803,10 @@ "required": false }, { - "uid": "onDragEnterCapture", - "name": "onDragEnterCapture", + "uid": "onAbort", + "name": "onAbort", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47356,10 +47815,10 @@ "required": false }, { - "uid": "onDragExit", - "name": "onDragExit", + "uid": "onAbortCapture", + "name": "onAbortCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47368,10 +47827,10 @@ "required": false }, { - "uid": "onDragExitCapture", - "name": "onDragExitCapture", + "uid": "onCanPlay", + "name": "onCanPlay", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47380,10 +47839,10 @@ "required": false }, { - "uid": "onDragLeave", - "name": "onDragLeave", + "uid": "onCanPlayCapture", + "name": "onCanPlayCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47392,10 +47851,10 @@ "required": false }, { - "uid": "onDragLeaveCapture", - "name": "onDragLeaveCapture", + "uid": "onCanPlayThrough", + "name": "onCanPlayThrough", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47404,10 +47863,10 @@ "required": false }, { - "uid": "onDragOver", - "name": "onDragOver", + "uid": "onCanPlayThroughCapture", + "name": "onCanPlayThroughCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47416,10 +47875,10 @@ "required": false }, { - "uid": "onDragOverCapture", - "name": "onDragOverCapture", + "uid": "onDurationChange", + "name": "onDurationChange", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47428,10 +47887,10 @@ "required": false }, { - "uid": "onDragStart", - "name": "onDragStart", + "uid": "onDurationChangeCapture", + "name": "onDurationChangeCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47440,10 +47899,10 @@ "required": false }, { - "uid": "onDragStartCapture", - "name": "onDragStartCapture", + "uid": "onEmptied", + "name": "onEmptied", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47452,10 +47911,10 @@ "required": false }, { - "uid": "onDrop", - "name": "onDrop", + "uid": "onEmptiedCapture", + "name": "onEmptiedCapture", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47464,10 +47923,10 @@ "required": false }, { - "uid": "onDropCapture", - "name": "onDropCapture", + "uid": "onEncrypted", + "name": "onEncrypted", "typeValue": { - "raw": "React.DragEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47476,10 +47935,10 @@ "required": false }, { - "uid": "onMouseDown", - "name": "onMouseDown", + "uid": "onEncryptedCapture", + "name": "onEncryptedCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47488,10 +47947,10 @@ "required": false }, { - "uid": "onMouseDownCapture", - "name": "onMouseDownCapture", + "uid": "onEnded", + "name": "onEnded", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47500,10 +47959,10 @@ "required": false }, { - "uid": "onMouseEnter", - "name": "onMouseEnter", + "uid": "onEndedCapture", + "name": "onEndedCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47512,10 +47971,10 @@ "required": false }, { - "uid": "onMouseLeave", - "name": "onMouseLeave", + "uid": "onLoadedData", + "name": "onLoadedData", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47524,10 +47983,10 @@ "required": false }, { - "uid": "onMouseMove", - "name": "onMouseMove", + "uid": "onLoadedDataCapture", + "name": "onLoadedDataCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47536,10 +47995,10 @@ "required": false }, { - "uid": "onMouseMoveCapture", - "name": "onMouseMoveCapture", + "uid": "onLoadedMetadata", + "name": "onLoadedMetadata", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47548,10 +48007,10 @@ "required": false }, { - "uid": "onMouseOut", - "name": "onMouseOut", + "uid": "onLoadedMetadataCapture", + "name": "onLoadedMetadataCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47560,10 +48019,10 @@ "required": false }, { - "uid": "onMouseOutCapture", - "name": "onMouseOutCapture", + "uid": "onLoadStart", + "name": "onLoadStart", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47572,10 +48031,10 @@ "required": false }, { - "uid": "onMouseOver", - "name": "onMouseOver", + "uid": "onLoadStartCapture", + "name": "onLoadStartCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47584,10 +48043,10 @@ "required": false }, { - "uid": "onMouseOverCapture", - "name": "onMouseOverCapture", + "uid": "onPause", + "name": "onPause", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47596,10 +48055,10 @@ "required": false }, { - "uid": "onMouseUp", - "name": "onMouseUp", + "uid": "onPauseCapture", + "name": "onPauseCapture", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47608,10 +48067,10 @@ "required": false }, { - "uid": "onMouseUpCapture", - "name": "onMouseUpCapture", + "uid": "onPlay", + "name": "onPlay", "typeValue": { - "raw": "React.MouseEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47620,8 +48079,8 @@ "required": false }, { - "uid": "onSelect", - "name": "onSelect", + "uid": "onPlayCapture", + "name": "onPlayCapture", "typeValue": { "raw": "React.ReactEventHandler" }, @@ -47632,8 +48091,8 @@ "required": false }, { - "uid": "onSelectCapture", - "name": "onSelectCapture", + "uid": "onPlaying", + "name": "onPlaying", "typeValue": { "raw": "React.ReactEventHandler" }, @@ -47644,10 +48103,10 @@ "required": false }, { - "uid": "onTouchCancel", - "name": "onTouchCancel", + "uid": "onPlayingCapture", + "name": "onPlayingCapture", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47656,10 +48115,10 @@ "required": false }, { - "uid": "onTouchCancelCapture", - "name": "onTouchCancelCapture", + "uid": "onProgress", + "name": "onProgress", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47668,10 +48127,10 @@ "required": false }, { - "uid": "onTouchEnd", - "name": "onTouchEnd", + "uid": "onProgressCapture", + "name": "onProgressCapture", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47680,10 +48139,10 @@ "required": false }, { - "uid": "onTouchEndCapture", - "name": "onTouchEndCapture", + "uid": "onRateChange", + "name": "onRateChange", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47692,10 +48151,10 @@ "required": false }, { - "uid": "onTouchMove", - "name": "onTouchMove", + "uid": "onRateChangeCapture", + "name": "onRateChangeCapture", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47704,10 +48163,10 @@ "required": false }, { - "uid": "onTouchMoveCapture", - "name": "onTouchMoveCapture", + "uid": "onResize", + "name": "onResize", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47716,10 +48175,10 @@ "required": false }, { - "uid": "onTouchStart", - "name": "onTouchStart", + "uid": "onResizeCapture", + "name": "onResizeCapture", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47728,10 +48187,10 @@ "required": false }, { - "uid": "onTouchStartCapture", - "name": "onTouchStartCapture", + "uid": "onSeeked", + "name": "onSeeked", "typeValue": { - "raw": "React.TouchEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47740,10 +48199,10 @@ "required": false }, { - "uid": "onPointerDown", - "name": "onPointerDown", + "uid": "onSeekedCapture", + "name": "onSeekedCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47752,10 +48211,10 @@ "required": false }, { - "uid": "onPointerDownCapture", - "name": "onPointerDownCapture", + "uid": "onSeeking", + "name": "onSeeking", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47764,10 +48223,10 @@ "required": false }, { - "uid": "onPointerMove", - "name": "onPointerMove", + "uid": "onSeekingCapture", + "name": "onSeekingCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47776,10 +48235,10 @@ "required": false }, { - "uid": "onPointerMoveCapture", - "name": "onPointerMoveCapture", + "uid": "onStalled", + "name": "onStalled", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47788,10 +48247,10 @@ "required": false }, { - "uid": "onPointerUp", - "name": "onPointerUp", + "uid": "onStalledCapture", + "name": "onStalledCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47800,10 +48259,10 @@ "required": false }, { - "uid": "onPointerUpCapture", - "name": "onPointerUpCapture", + "uid": "onSuspend", + "name": "onSuspend", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47812,10 +48271,10 @@ "required": false }, { - "uid": "onPointerCancel", - "name": "onPointerCancel", + "uid": "onSuspendCapture", + "name": "onSuspendCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47824,10 +48283,10 @@ "required": false }, { - "uid": "onPointerCancelCapture", - "name": "onPointerCancelCapture", + "uid": "onTimeUpdate", + "name": "onTimeUpdate", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47836,10 +48295,10 @@ "required": false }, { - "uid": "onPointerEnter", - "name": "onPointerEnter", + "uid": "onTimeUpdateCapture", + "name": "onTimeUpdateCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47848,10 +48307,10 @@ "required": false }, { - "uid": "onPointerEnterCapture", - "name": "onPointerEnterCapture", + "uid": "onVolumeChange", + "name": "onVolumeChange", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47860,10 +48319,10 @@ "required": false }, { - "uid": "onPointerLeave", - "name": "onPointerLeave", + "uid": "onVolumeChangeCapture", + "name": "onVolumeChangeCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47872,10 +48331,10 @@ "required": false }, { - "uid": "onPointerLeaveCapture", - "name": "onPointerLeaveCapture", + "uid": "onWaiting", + "name": "onWaiting", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47884,10 +48343,10 @@ "required": false }, { - "uid": "onPointerOver", - "name": "onPointerOver", + "uid": "onWaitingCapture", + "name": "onWaitingCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.ReactEventHandler" }, "editor": { "type": "func" @@ -47896,10 +48355,10 @@ "required": false }, { - "uid": "onPointerOverCapture", - "name": "onPointerOverCapture", + "uid": "onAuxClick", + "name": "onAuxClick", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47908,10 +48367,10 @@ "required": false }, { - "uid": "onPointerOut", - "name": "onPointerOut", + "uid": "onAuxClickCapture", + "name": "onAuxClickCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47920,10 +48379,10 @@ "required": false }, { - "uid": "onPointerOutCapture", - "name": "onPointerOutCapture", + "uid": "onClick", + "name": "onClick", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47932,10 +48391,10 @@ "required": false }, { - "uid": "onGotPointerCapture", - "name": "onGotPointerCapture", + "uid": "onClickCapture", + "name": "onClickCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47944,10 +48403,10 @@ "required": false }, { - "uid": "onGotPointerCaptureCapture", - "name": "onGotPointerCaptureCapture", + "uid": "onContextMenu", + "name": "onContextMenu", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47956,10 +48415,10 @@ "required": false }, { - "uid": "onLostPointerCapture", - "name": "onLostPointerCapture", + "uid": "onContextMenuCapture", + "name": "onContextMenuCapture", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47968,10 +48427,10 @@ "required": false }, { - "uid": "onLostPointerCaptureCapture", - "name": "onLostPointerCaptureCapture", + "uid": "onDoubleClick", + "name": "onDoubleClick", "typeValue": { - "raw": "React.PointerEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47980,10 +48439,10 @@ "required": false }, { - "uid": "onScroll", - "name": "onScroll", + "uid": "onDoubleClickCapture", + "name": "onDoubleClickCapture", "typeValue": { - "raw": "React.UIEventHandler" + "raw": "React.MouseEventHandler" }, "editor": { "type": "func" @@ -47992,10 +48451,10 @@ "required": false }, { - "uid": "onScrollCapture", - "name": "onScrollCapture", + "uid": "onDrag", + "name": "onDrag", "typeValue": { - "raw": "React.UIEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48004,10 +48463,10 @@ "required": false }, { - "uid": "onWheel", - "name": "onWheel", + "uid": "onDragCapture", + "name": "onDragCapture", "typeValue": { - "raw": "React.WheelEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48016,10 +48475,10 @@ "required": false }, { - "uid": "onWheelCapture", - "name": "onWheelCapture", + "uid": "onDragEnd", + "name": "onDragEnd", "typeValue": { - "raw": "React.WheelEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48028,10 +48487,10 @@ "required": false }, { - "uid": "onAnimationStart", - "name": "onAnimationStart", + "uid": "onDragEndCapture", + "name": "onDragEndCapture", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48040,10 +48499,10 @@ "required": false }, { - "uid": "onAnimationStartCapture", - "name": "onAnimationStartCapture", + "uid": "onDragEnter", + "name": "onDragEnter", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48052,10 +48511,10 @@ "required": false }, { - "uid": "onAnimationEnd", - "name": "onAnimationEnd", + "uid": "onDragEnterCapture", + "name": "onDragEnterCapture", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48064,10 +48523,10 @@ "required": false }, { - "uid": "onAnimationEndCapture", - "name": "onAnimationEndCapture", + "uid": "onDragExit", + "name": "onDragExit", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48076,10 +48535,10 @@ "required": false }, { - "uid": "onAnimationIteration", - "name": "onAnimationIteration", + "uid": "onDragExitCapture", + "name": "onDragExitCapture", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48088,10 +48547,10 @@ "required": false }, { - "uid": "onAnimationIterationCapture", - "name": "onAnimationIterationCapture", + "uid": "onDragLeave", + "name": "onDragLeave", "typeValue": { - "raw": "React.AnimationEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48100,10 +48559,10 @@ "required": false }, { - "uid": "onTransitionEnd", - "name": "onTransitionEnd", + "uid": "onDragLeaveCapture", + "name": "onDragLeaveCapture", "typeValue": { - "raw": "React.TransitionEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" @@ -48112,1160 +48571,956 @@ "required": false }, { - "uid": "onTransitionEndCapture", - "name": "onTransitionEndCapture", + "uid": "onDragOver", + "name": "onDragOver", "typeValue": { - "raw": "React.TransitionEventHandler" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" }, "from": "@types/react:DOMAttributes", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:IScrollSpyApi": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "IScrollSpyApi", - "nameFull": "IScrollSpyApi" - }, - "src": "uui-components/src/navigation/ScrollSpy.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IScrollSpyApi", - "print": [ - "interface IScrollSpyApi {", - " scrollToElement: (item?: string) => void;", - " currentActive: string;", - " setRef: (ref: HTMLElement) => void;", - "}" - ] - }, - "props": [ + }, { - "uid": "scrollToElement", - "name": "scrollToElement", + "uid": "onDragOverCapture", + "name": "onDragOverCapture", "typeValue": { - "raw": "(item?: string | undefined) => void" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" }, - "required": true + "from": "@types/react:DOMAttributes", + "required": false }, { - "uid": "currentActive", - "name": "currentActive", + "uid": "onDragStart", + "name": "onDragStart", "typeValue": { - "raw": "string" + "raw": "React.DragEventHandler" }, "editor": { - "type": "string" + "type": "func" }, - "required": true + "from": "@types/react:DOMAttributes", + "required": false }, { - "uid": "setRef", - "name": "setRef", + "uid": "onDragStartCapture", + "name": "onDragStartCapture", "typeValue": { - "raw": "(ref: HTMLElement) => void" + "raw": "React.DragEventHandler" }, "editor": { "type": "func" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:IScrollSpyProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "IScrollSpyProps", - "nameFull": "IScrollSpyProps" - }, - "src": "uui-components/src/navigation/ScrollSpy.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IScrollSpyProps", - "print": [ - "interface IScrollSpyProps {", - " elements?: Readonly;", - " initialActive?: string;", - " options?: IntersectionObserverInit;", - "}" - ] - }, - "props": [ - { - "uid": "elements", - "name": "elements", - "typeValue": { - "raw": "readonly string[]" - }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "initialActive", - "name": "initialActive", + "uid": "onDrop", + "name": "onDrop", "typeValue": { - "raw": "string" + "raw": "React.DragEventHandler" }, "editor": { - "type": "string" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "options", - "name": "options", + "uid": "onDropCapture", + "name": "onDropCapture", "typeValue": { - "raw": "IntersectionObserverInit" - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:LabeledInputProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "LabeledInputProps", - "nameFull": "LabeledInputProps" - }, - "src": "uui-components/src/layout/LabeledInput.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "LabeledInputProps", - "print": [ - "interface LabeledInputProps extends LabeledInputCoreProps {", - " /** Overrides the default Tooltip component to use for info tooltip */", - " Tooltip?: React.ComponentType;", - " /** Overrides the default info icon */", - " infoIcon?: Icon;", - "}" - ] - }, - "props": [ - { - "uid": "Tooltip", - "name": "Tooltip", - "comment": { - "raw": [ - "Overrides the default Tooltip component to use for info tooltip" - ] + "raw": "React.DragEventHandler" }, - "typeValue": { - "raw": "React.ComponentClass | React.FunctionComponent" + "editor": { + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "infoIcon", - "name": "infoIcon", - "comment": { - "raw": [ - "Overrides the default info icon" - ] - }, + "uid": "onMouseDown", + "name": "onMouseDown", "typeValue": { - "raw": "Icon" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "labelPosition", - "name": "labelPosition", - "comment": { - "raw": [ - "Position of the label, relative to the wrapped component (top of left)" - ] - }, + "uid": "onMouseDownCapture", + "name": "onMouseDownCapture", "typeValue": { - "raw": "'left' | 'top'" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "top" - ] + "type": "func" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "info", - "name": "info", - "comment": { - "raw": [ - "Info hint text to show in tooltip" - ] - }, + "uid": "onMouseEnter", + "name": "onMouseEnter", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.MouseEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:LabeledInputCoreProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "isOptional", - "name": "isOptional", - "comment": { - "raw": [ - "Marks related field as optional" - ] - }, + "uid": "onMouseLeave", + "name": "onMouseLeave", "typeValue": { - "raw": "boolean" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "htmlFor", - "name": "htmlFor", - "comment": { - "raw": [ - "HTML 'for' tag to bind the label to a component.", - " Can be used when component can't be wrapped by the LabeledInput, e.g. when form is layed out as table with labels and inputs placed into different columns" - ] - }, + "uid": "onMouseMove", + "name": "onMouseMove", "typeValue": { - "raw": "string" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "A value from LabeledInput children" - ] - }, + "uid": "onMouseMoveCapture", + "name": "onMouseMoveCapture", "typeValue": { - "raw": "any" + "raw": "React.MouseEventHandler" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "maxLength", - "name": "maxLength", - "comment": { - "raw": [ - "Maximum text length, in characters" - ] - }, + "uid": "onMouseOut", + "name": "onMouseOut", "typeValue": { - "raw": "number" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "charCounter", - "name": "charCounter", - "comment": { - "raw": [ - "Showing current text length, in characters and maxLength" - ] - }, + "uid": "onMouseOutCapture", + "name": "onMouseOutCapture", "typeValue": { - "raw": "boolean" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:LabeledInputCoreProps", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "footnote", - "name": "footnote", - "comment": { - "raw": [ - "Additional info positioned at the bottom of LabeledInput" - ] - }, + "uid": "onMouseOver", + "name": "onMouseOver", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.MouseEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:LabeledInputCoreProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "sidenote", - "name": "sidenote", - "comment": { - "raw": [ - "Additional info positioned to the right side of label" - ] - }, + "uid": "onMouseOverCapture", + "name": "onMouseOverCapture", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.MouseEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:LabeledInputCoreProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", - "comment": { - "raw": [ - "True if component contains invalid input" - ] - }, + "uid": "onMouseUp", + "name": "onMouseUp", "typeValue": { - "raw": "boolean" + "raw": "React.MouseEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, + "uid": "onMouseUpCapture", + "name": "onMouseUpCapture", "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "React.MouseEventHandler" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "label", - "name": "label", - "comment": { - "raw": [ - "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." - ] - }, + "uid": "onSelect", + "name": "onSelect", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.ReactEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasLabel", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "Component children" - ] - }, + "uid": "onSelectCapture", + "name": "onSelectCapture", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.ReactEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "isRequired", - "name": "isRequired", - "comment": { - "raw": [ - "Marks that component's value is required and shouldn't be empty" - ] - }, + "uid": "onTouchCancel", + "name": "onTouchCancel", "typeValue": { - "raw": "boolean" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", - "comment": { - "raw": [ - "Message describing why the value is invalid" - ] - }, + "uid": "onTouchCancelCapture", + "name": "onTouchCancelCapture", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.TouchEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, + "uid": "onTouchEnd", + "name": "onTouchEnd", "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.TouchEventHandler" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:MainMenuCustomElementProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "MainMenuCustomElementProps", - "nameFull": "MainMenuCustomElementProps" - }, - "src": "uui-components/src/navigation/MainMenu/MainMenuCustomElement.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "MainMenuCustomElementProps", - "print": [ - "interface MainMenuCustomElementProps extends IAdaptiveItem, IHasChildren {", - "}" - ] - }, - "props": [ + }, { - "uid": "estimatedWidth", - "name": "estimatedWidth", + "uid": "onTouchEndCapture", + "name": "onTouchEndCapture", "typeValue": { - "raw": "number" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "priority", - "name": "priority", + "uid": "onTouchMove", + "name": "onTouchMove", "typeValue": { - "raw": "number" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", + "uid": "onTouchMoveCapture", + "name": "onTouchMoveCapture", "typeValue": { - "raw": "boolean" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapseToMore", - "name": "collapseToMore", + "uid": "onTouchStart", + "name": "onTouchStart", "typeValue": { - "raw": "boolean" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "onTouchStartCapture", + "name": "onTouchStartCapture", "typeValue": { - "raw": "boolean" + "raw": "React.TouchEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "Component children" - ] - }, + "uid": "onPointerDown", + "name": "onPointerDown", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.PointerEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:MainMenuDropdownProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "MainMenuDropdownProps", - "nameFull": "MainMenuDropdownProps" - }, - "src": "uui-components/src/navigation/MainMenu/MainMenu.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "MainMenuDropdownProps", - "print": [ - "interface MainMenuDropdownProps extends IHasChildren, IHasCaption, IAdaptiveItem, ICanRedirect, IHasCX, IHasRawProps> {", - " /** Render callback for the MainMenuDropdown body.", - " * If omitted, component children will be rendered.", - " */", - " renderBody?: (props: DropdownBodyProps) => React.ReactNode;", - "}" - ] - }, - "props": [ + }, { - "uid": "renderBody", - "name": "renderBody", - "comment": { - "raw": [ - "Render callback for the MainMenuDropdown body.", - " If omitted, component children will be rendered." - ] - }, + "uid": "onPointerDownCapture", + "name": "onPointerDownCapture", "typeValue": { - "raw": "(props: DropdownBodyProps) => React.ReactNode" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "Component children" - ] - }, + "uid": "onPointerMove", + "name": "onPointerMove", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.PointerEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "caption", - "name": "caption", - "comment": { - "raw": [ - "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." - ] - }, + "uid": "onPointerMoveCapture", + "name": "onPointerMoveCapture", "typeValue": { - "raw": "React.ReactNode" + "raw": "React.PointerEventHandler" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasCaption", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "estimatedWidth", - "name": "estimatedWidth", + "uid": "onPointerUp", + "name": "onPointerUp", "typeValue": { - "raw": "number" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "priority", - "name": "priority", + "uid": "onPointerUpCapture", + "name": "onPointerUpCapture", "typeValue": { - "raw": "number" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", + "uid": "onPointerCancel", + "name": "onPointerCancel", "typeValue": { - "raw": "boolean" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapseToMore", - "name": "collapseToMore", + "uid": "onPointerCancelCapture", + "name": "onPointerCancelCapture", "typeValue": { - "raw": "boolean" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "onPointerEnter", + "name": "onPointerEnter", "typeValue": { - "raw": "boolean" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "link", - "name": "link", - "comment": { - "raw": [ - "Link object to redirect to for SPA-redirects" - ] - }, + "uid": "onPointerEnterCapture", + "name": "onPointerEnterCapture", "typeValue": { - "raw": "Link" + "raw": "React.PointerEventHandler" }, - "from": "@epam/uui-core:ICanRedirect", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "href", - "name": "href", - "comment": { - "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" - ] - }, + "uid": "onPointerLeave", + "name": "onPointerLeave", "typeValue": { - "raw": "string" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "isLinkActive", - "name": "isLinkActive", - "comment": { - "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" - ] - }, + "uid": "onPointerLeaveCapture", + "name": "onPointerLeaveCapture", "typeValue": { - "raw": "boolean" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "target", - "name": "target", - "comment": { - "raw": [ - "Controls where the link should be opened" - ] - }, + "uid": "onPointerOver", + "name": "onPointerOver", "typeValue": { - "raw": "'_blank'" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, + "uid": "onPointerOverCapture", + "name": "onPointerOverCapture", "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "React.PointerEventHandler" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, + "uid": "onPointerOut", + "name": "onPointerOut", "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.PointerEventHandler" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:MainMenuLogoProps": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "MainMenuLogoProps", - "nameFull": "MainMenuLogoProps" - }, - "src": "uui-components/src/navigation/MainMenu/MainMenuLogo.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "MainMenuLogoProps", - "print": [ - "interface MainMenuLogoProps extends IAdaptiveItem, ICanRedirect, IHasRawProps>, IHasForwardedRef {", - " logoUrl?: string;", - " logoBgColor?: string;", - " showArrow?: boolean;", - " onContextMenu?: any;", - " link?: Link;", - " onClick?: (e: React.MouseEvent) => any;", - "}" - ] - }, - "props": [ + }, { - "uid": "logoUrl", - "name": "logoUrl", + "uid": "onPointerOutCapture", + "name": "onPointerOutCapture", "typeValue": { - "raw": "string" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "string" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "logoBgColor", - "name": "logoBgColor", + "uid": "onGotPointerCapture", + "name": "onGotPointerCapture", "typeValue": { - "raw": "string" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "string" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "showArrow", - "name": "showArrow", + "uid": "onGotPointerCaptureCapture", + "name": "onGotPointerCaptureCapture", "typeValue": { - "raw": "boolean" + "raw": "React.PointerEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "onContextMenu", - "name": "onContextMenu", + "uid": "onLostPointerCapture", + "name": "onLostPointerCapture", "typeValue": { - "raw": "any" + "raw": "React.PointerEventHandler" }, + "editor": { + "type": "func" + }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "link", - "name": "link", + "uid": "onLostPointerCaptureCapture", + "name": "onLostPointerCaptureCapture", "typeValue": { - "raw": "Link" + "raw": "React.PointerEventHandler" + }, + "editor": { + "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "onScroll", + "name": "onScroll", "typeValue": { - "raw": "(e: React.MouseEvent) => any" + "raw": "React.UIEventHandler" }, "editor": { "type": "func" }, + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "estimatedWidth", - "name": "estimatedWidth", + "uid": "onScrollCapture", + "name": "onScrollCapture", "typeValue": { - "raw": "number" + "raw": "React.UIEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "priority", - "name": "priority", + "uid": "onWheel", + "name": "onWheel", "typeValue": { - "raw": "number" + "raw": "React.WheelEventHandler" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", + "uid": "onWheelCapture", + "name": "onWheelCapture", "typeValue": { - "raw": "boolean" + "raw": "React.WheelEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapseToMore", - "name": "collapseToMore", + "uid": "onAnimationStart", + "name": "onAnimationStart", "typeValue": { - "raw": "boolean" + "raw": "React.AnimationEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "onAnimationStartCapture", + "name": "onAnimationStartCapture", "typeValue": { - "raw": "boolean" + "raw": "React.AnimationEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IAdaptiveItem", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "href", - "name": "href", - "comment": { - "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" - ] + "uid": "onAnimationEnd", + "name": "onAnimationEnd", + "typeValue": { + "raw": "React.AnimationEventHandler" + }, + "editor": { + "type": "func" }, + "from": "@types/react:DOMAttributes", + "required": false + }, + { + "uid": "onAnimationEndCapture", + "name": "onAnimationEndCapture", "typeValue": { - "raw": "string" + "raw": "React.AnimationEventHandler" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "isLinkActive", - "name": "isLinkActive", - "comment": { - "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" - ] + "uid": "onAnimationIteration", + "name": "onAnimationIteration", + "typeValue": { + "raw": "React.AnimationEventHandler" + }, + "editor": { + "type": "func" }, + "from": "@types/react:DOMAttributes", + "required": false + }, + { + "uid": "onAnimationIterationCapture", + "name": "onAnimationIterationCapture", "typeValue": { - "raw": "boolean" + "raw": "React.AnimationEventHandler" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false }, { - "uid": "target", - "name": "target", - "comment": { - "raw": [ - "Controls where the link should be opened" - ] + "uid": "onTransitionEnd", + "name": "onTransitionEnd", + "typeValue": { + "raw": "React.TransitionEventHandler" + }, + "editor": { + "type": "func" }, + "from": "@types/react:DOMAttributes", + "required": false + }, + { + "uid": "onTransitionEndCapture", + "name": "onTransitionEndCapture", "typeValue": { - "raw": "'_blank'" + "raw": "React.TransitionEventHandler" }, "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] + "type": "func" }, - "from": "@epam/uui-core:ICanRedirect", + "from": "@types/react:DOMAttributes", "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:IScrollSpyApi": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "IScrollSpyApi", + "nameFull": "IScrollSpyApi" + }, + "src": "uui-components/src/navigation/ScrollSpy.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IScrollSpyApi", + "print": [ + "interface IScrollSpyApi {", + " scrollToElement: (item?: string) => void;", + " currentActive: string;", + " setRef: (ref: HTMLElement) => void;", + "}" + ] + }, + "props": [ + { + "uid": "scrollToElement", + "name": "scrollToElement", + "typeValue": { + "raw": "(item?: string | undefined) => void" + }, + "editor": { + "type": "func" + }, + "required": true }, { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] + "uid": "currentActive", + "name": "currentActive", + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" }, + "required": true + }, + { + "uid": "setRef", + "name": "setRef", "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(ref: HTMLElement) => void" + }, + "editor": { + "type": "func" + }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:IScrollSpyProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "IScrollSpyProps", + "nameFull": "IScrollSpyProps" + }, + "src": "uui-components/src/navigation/ScrollSpy.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IScrollSpyProps", + "print": [ + "interface IScrollSpyProps {", + " elements?: Readonly;", + " initialActive?: string;", + " options?: IntersectionObserverInit;", + "}" + ] + }, + "props": [ + { + "uid": "elements", + "name": "elements", + "typeValue": { + "raw": "readonly string[]" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", - "comment": { - "raw": [ - "this ref is passed to the underlying component" - ] + "uid": "initialActive", + "name": "initialActive", + "typeValue": { + "raw": "string" }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "options", + "name": "options", "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "IntersectionObserverInit" }, - "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:MainMenuProps": { + "@epam/uui-components:LabeledInputProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "MainMenuProps", - "nameFull": "MainMenuProps" + "name": "LabeledInputProps", + "nameFull": "LabeledInputProps" }, - "src": "uui-components/src/navigation/MainMenu/MainMenu.tsx", + "src": "uui-components/src/layout/LabeledInput.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "MainMenuProps", + "raw": "LabeledInputProps", "print": [ - "interface MainMenuProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", - " /** Array of menu items to be rendered */", - " items?: AdaptiveItemProps[];", - " /** @deprecated", - " * Use 'items' prop to define menu content */", - " children?: any;", - " /** Path to the logo source */", - " appLogoUrl?: string;", - " /** SPA link to navigate on logo click */", - " logoLink?: Link;", - " /** Href to navigate on logo click */", - " logoHref?: string;", - " /** Called when logo is clicked */", - " onLogoClick?: (e: MouseEvent) => any;", - " /** Path to the customer logo source */", - " customerLogoUrl?: string;", - " /** SPA link to navigate on customer logo click */", - " customerLogoLink?: Link;", - " /** Href to navigate on customer logo click */", - " customerLogoHref?: string;", - " customerLogoBgColor?: string;", - " isTransparent?: boolean;", - " /** Render callback for burger menu content.", - " * Burger will appear, which some items don't fit the menu width.", - " * */", - " renderBurger?: (props: {", - " onClose: () => void;", - " }) => React.ReactNode;", - " /** If true, Burger button will be always visible */", - " alwaysShowBurger?: boolean;", - " serverBadge?: string;", - " /** Internal prop to define component for MainMenuDropdown */", - " MainMenuDropdown?: React.ComponentType;", - " /** Internal prop to define component for Burger */", - " Burger?: React.ComponentType;", + "interface LabeledInputProps extends LabeledInputCoreProps {", + " /** Overrides the default Tooltip component to use for info tooltip */", + " Tooltip?: React.ComponentType;", + " /** Overrides the default info icon */", + " infoIcon?: Icon;", "}" ] }, "props": [ { - "uid": "items", - "name": "items", + "uid": "Tooltip", + "name": "Tooltip", "comment": { "raw": [ - "Array of menu items to be rendered" + "Overrides the default Tooltip component to use for info tooltip" ] }, "typeValue": { - "raw": "{ render: (item: any, hiddenItems?: any[] | undefined, displayedItems?: any[] | undefined) => any; priority: number; collapsedContainer?: boolean | undefined; id: string; }[]" + "raw": "React.ComponentClass | React.FunctionComponent" }, "required": false }, { - "uid": "children", - "name": "children", + "uid": "infoIcon", + "name": "infoIcon", "comment": { "raw": [ - "@deprecated", - " Use 'items' prop to define menu content" + "Overrides the default info icon" ] }, "typeValue": { - "raw": "any" + "raw": "Icon" + }, + "editor": { + "type": "component" }, "required": false }, { - "uid": "appLogoUrl", - "name": "appLogoUrl", + "uid": "labelPosition", + "name": "labelPosition", "comment": { "raw": [ - "Path to the logo source" + "Position of the label, relative to the wrapped component (top of left)" ] }, "typeValue": { - "raw": "string" + "raw": "'left' | 'top'" }, "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "logoLink", - "name": "logoLink", - "comment": { - "raw": [ - "SPA link to navigate on logo click" + "type": "oneOf", + "options": [ + "left", + "top" ] }, - "typeValue": { - "raw": "Link" - }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "logoHref", - "name": "logoHref", + "uid": "info", + "name": "info", "comment": { "raw": [ - "Href to navigate on logo click" + "Info hint text to show in tooltip" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "onLogoClick", - "name": "onLogoClick", + "uid": "isOptional", + "name": "isOptional", "comment": { "raw": [ - "Called when logo is clicked" + "Marks related field as optional" ] }, "typeValue": { - "raw": "(e: React.MouseEvent) => any" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "customerLogoUrl", - "name": "customerLogoUrl", + "uid": "htmlFor", + "name": "htmlFor", "comment": { "raw": [ - "Path to the customer logo source" + "HTML 'for' tag to bind the label to a component.", + " Can be used when component can't be wrapped by the LabeledInput, e.g. when form is layed out as table with labels and inputs placed into different columns" ] }, "typeValue": { @@ -49274,82 +49529,93 @@ "editor": { "type": "string" }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "customerLogoLink", - "name": "customerLogoLink", + "uid": "value", + "name": "value", "comment": { "raw": [ - "SPA link to navigate on customer logo click" + "A value from LabeledInput children" ] }, "typeValue": { - "raw": "Link" + "raw": "any" }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "customerLogoHref", - "name": "customerLogoHref", + "uid": "maxLength", + "name": "maxLength", "comment": { "raw": [ - "Href to navigate on customer logo click" + "Maximum text length, in characters" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "customerLogoBgColor", - "name": "customerLogoBgColor", + "uid": "charCounter", + "name": "charCounter", + "comment": { + "raw": [ + "Showing current text length, in characters and maxLength" + ] + }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "isTransparent", - "name": "isTransparent", - "typeValue": { - "raw": "boolean" + "uid": "footnote", + "name": "footnote", + "comment": { + "raw": [ + "Additional info positioned at the bottom of LabeledInput" + ] }, - "editor": { - "type": "bool" + "typeValue": { + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "renderBurger", - "name": "renderBurger", + "uid": "sidenote", + "name": "sidenote", "comment": { "raw": [ - "Render callback for burger menu content.", - " Burger will appear, which some items don't fit the menu width." + "Additional info positioned to the right side of label" ] }, "typeValue": { - "raw": "(props: { onClose: () => void; }) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:LabeledInputCoreProps", "required": false }, { - "uid": "alwaysShowBurger", - "name": "alwaysShowBurger", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "If true, Burger button will be always visible" + "True if component contains invalid input" ] }, "typeValue": { @@ -49358,547 +49624,415 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "serverBadge", - "name": "serverBadge", - "typeValue": { - "raw": "string" + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + ] }, - "editor": { - "type": "string" + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "MainMenuDropdown", - "name": "MainMenuDropdown", + "uid": "label", + "name": "label", "comment": { "raw": [ - "Internal prop to define component for MainMenuDropdown" + "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." ] }, "typeValue": { - "raw": "React.ComponentClass | React.FunctionComponent" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasLabel", "required": false }, { - "uid": "Burger", - "name": "Burger", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Internal prop to define component for Burger" + "Component children" ] }, "typeValue": { - "raw": "React.ComponentClass | React.FunctionComponent" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IHasRawProps", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IHasForwardedRef", + "from": "@epam/uui-core:IHasRawProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:NumericInputProps": { + "@epam/uui-components:MainMenuCustomElementProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "NumericInputProps", - "nameFull": "NumericInputProps" + "name": "MainMenuCustomElementProps", + "nameFull": "MainMenuCustomElementProps" }, - "src": "uui-components/src/inputs/NumericInput.tsx", + "src": "uui-components/src/navigation/MainMenu/MainMenuCustomElement.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "NumericInputProps", + "raw": "MainMenuCustomElementProps", "print": [ - "interface NumericInputProps extends ICanFocus, IHasCX, IClickable, IDisableable, IEditable, IHasPlaceholder, ICanBeReadonly, IAnalyticableOnChange, IHasRawProps> {", - " /** Maximum value (default is Number.MAX_SAFE_INTEGER) */", - " max?: number;", - " /**", - " * Minimum value (default is 0)", - " * @default 0", - " */", - " min?: number;", - " /** Overrides the up/increase icon */", - " upIcon?: Icon;", - " /** Overrides the down/decrease icon */", - " downIcon?: Icon;", - " /** Increase/decrease step on up/down icons clicks and up/down arrow keys */", - " step?: number;", - " /** CSS classes to put directly on the Input element */", - " inputCx?: CX;", - " /** HTML ID */", - " id?: string;", - " /** Turn off up/down (increase/decrease) buttons */", - " disableArrows?: boolean;", - " /** Align text inside the component. Useful for tables (in cell-mode) - to align numbers in table column */", - " align?: 'left' | 'right';", - " /**", - " * Turns off locale-based formatting, standard Number.toString() is used instead", - " * @default false", - " */", - " disableLocaleFormatting?: boolean;", - " /** Number formatting options. See #{link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat} */", - " formatOptions?: Intl.NumberFormatOptions;", - " /**", - " * A function to convert current input value to displayed text.", - " * Overrides standard Intl-based formatting.", - " * If passed, only maximumFractionDigits considered from formatOptions when both properties provided.", - " * Formatting is applied only when input is not focused.", - " */", - " formatValue?(value: number): string;", + "interface MainMenuCustomElementProps extends IAdaptiveItem, IHasChildren {", "}" ] }, "props": [ { - "uid": "max", - "name": "max", - "comment": { - "raw": [ - "Maximum value (default is Number.MAX_SAFE_INTEGER)" - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false - }, - { - "uid": "min", - "name": "min", - "comment": { - "raw": [ - "Minimum value (default is 0)", - " @default 0" - ], - "tags": { - "@default": 0 - } - }, + "uid": "estimatedWidth", + "name": "estimatedWidth", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "upIcon", - "name": "upIcon", - "comment": { - "raw": [ - "Overrides the up/increase icon" - ] - }, - "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "downIcon", - "name": "downIcon", - "comment": { - "raw": [ - "Overrides the down/decrease icon" - ] - }, - "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "step", - "name": "step", - "comment": { - "raw": [ - "Increase/decrease step on up/down icons clicks and up/down arrow keys" - ] - }, + "uid": "priority", + "name": "priority", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "inputCx", - "name": "inputCx", - "comment": { - "raw": [ - "CSS classes to put directly on the Input element" - ] - }, - "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" - }, - "typeValueRef": "@epam/uui-core:ClassValue", - "required": false - }, - { - "uid": "id", - "name": "id", - "comment": { - "raw": [ - "HTML ID" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "disableArrows", - "name": "disableArrows", - "comment": { - "raw": [ - "Turn off up/down (increase/decrease) buttons" - ] - }, + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "align", - "name": "align", - "comment": { - "raw": [ - "Align text inside the component. Useful for tables (in cell-mode) - to align numbers in table column" - ] - }, + "uid": "collapseToMore", + "name": "collapseToMore", "typeValue": { - "raw": "'right' | 'left'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left" - ] + "type": "bool" }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "disableLocaleFormatting", - "name": "disableLocaleFormatting", - "comment": { - "raw": [ - "Turns off locale-based formatting, standard Number.toString() is used instead", - " @default false" - ], - "tags": { - "@default": false - } - }, + "uid": "collapsedContainer", + "name": "collapsedContainer", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "formatOptions", - "name": "formatOptions", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Number formatting options. See #{link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat}" + "Component children" ] }, "typeValue": { - "raw": "Intl.NumberFormatOptions" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:MainMenuDropdownProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "MainMenuDropdownProps", + "nameFull": "MainMenuDropdownProps" + }, + "src": "uui-components/src/navigation/MainMenu/MainMenu.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "MainMenuDropdownProps", + "print": [ + "interface MainMenuDropdownProps extends IHasChildren, IHasCaption, IAdaptiveItem, ICanRedirect, IHasCX, IHasRawProps> {", + " /** Render callback for the MainMenuDropdown body.", + " * If omitted, component children will be rendered.", + " */", + " renderBody?: (props: DropdownBodyProps) => React.ReactNode;", + "}" + ] + }, + "props": [ { - "uid": "formatValue", - "name": "formatValue", + "uid": "renderBody", + "name": "renderBody", "comment": { "raw": [ - "A function to convert current input value to displayed text.", - " Overrides standard Intl-based formatting.", - " If passed, only maximumFractionDigits considered from formatOptions when both properties provided.", - " Formatting is applied only when input is not focused." + "Render callback for the MainMenuDropdown body.", + " If omitted, component children will be rendered." ] }, "typeValue": { - "raw": "(value: number) => string" + "raw": "(props: DropdownBodyProps) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Called when component gets input focus" + "Component children" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:ICanFocus", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "caption", + "name": "caption", "comment": { "raw": [ - "Called when component looses input focus" + "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:ICanFocus", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasCaption", "required": false }, { - "uid": "cx", - "name": "cx", - "comment": { - "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" - ] - }, + "uid": "estimatedWidth", + "name": "estimatedWidth", "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "number" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "onClick", - "name": "onClick", - "comment": { - "raw": [ - "Called when component is clicked" - ] - }, + "uid": "priority", + "name": "priority", "typeValue": { - "raw": "(e?: any) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", - "comment": { - "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] - }, + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", - "comment": { - "raw": [ - "True if component contains invalid input" - ] - }, + "uid": "collapseToMore", + "name": "collapseToMore", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", - "comment": { - "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] - }, + "uid": "collapsedContainer", + "name": "collapsedContainer", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "link", + "name": "link", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Link object to redirect to for SPA-redirects" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Link" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "value", - "name": "value", + "uid": "href", + "name": "href", "comment": { "raw": [ - "The current value of component" + "Href (URL) to redirect to, for non-SPA redirects" ] }, "typeValue": { - "raw": "null | number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:ICanRedirect", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "isLinkActive", + "name": "isLinkActive", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" ] }, "typeValue": { - "raw": "(newValue: number | null) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:ICanRedirect", + "required": false }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "target", + "name": "target", "comment": { "raw": [ - "Placeholder to display when empty" + "Controls where the link should be opened" ] }, "typeValue": { - "raw": "any" + "raw": "'_blank'" }, - "from": "@epam/uui-core:IHasPlaceholder", + "editor": { + "type": "oneOf", + "options": [ + "_blank" + ] + }, + "from": "@epam/uui-core:ICanRedirect", "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Given a value, returns an analytics event to send when component is edited.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "(newValue: number | null, oldValue: number | null) => AnalyticsEvent" - }, - "editor": { - "type": "func" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { @@ -49910,7 +50044,7 @@ ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false @@ -49919,230 +50053,175 @@ "propsFromUnion": false } }, - "@epam/uui-components:PaginatorProps": { + "@epam/uui-components:MainMenuLogoProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "PaginatorProps", - "nameFull": "PaginatorProps" + "name": "MainMenuLogoProps", + "nameFull": "MainMenuLogoProps" }, - "src": "uui-components/src/widgets/Paginator.tsx", + "src": "uui-components/src/navigation/MainMenu/MainMenuLogo.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "PaginatorProps", + "raw": "MainMenuLogoProps", "print": [ - "interface PaginatorProps extends IControlled, IAnalyticableOnChange, IDisableable, IHasRawProps> {", - " /** Total number of pages */", - " totalPages: number;", - " /** Override default rendering, keeping the component behavior */", - " render?(params: PaginatorRenderParams): any;", + "interface MainMenuLogoProps extends IAdaptiveItem, ICanRedirect, IHasRawProps>, IHasForwardedRef {", + " logoUrl?: string;", + " logoBgColor?: string;", + " showArrow?: boolean;", + " onContextMenu?: any;", + " link?: Link;", + " onClick?: (e: React.MouseEvent) => any;", "}" ] }, "props": [ { - "uid": "totalPages", - "name": "totalPages", - "comment": { - "raw": [ - "Total number of pages" - ] - }, + "uid": "logoUrl", + "name": "logoUrl", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "required": true + "required": false }, { - "uid": "render", - "name": "render", - "comment": { - "raw": [ - "Override default rendering, keeping the component behavior" - ] - }, + "uid": "logoBgColor", + "name": "logoBgColor", "typeValue": { - "raw": "(params: PaginatorRenderParams) => any" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, "required": false }, { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, + "uid": "showArrow", + "name": "showArrow", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] + "uid": "onContextMenu", + "name": "onContextMenu", + "typeValue": { + "raw": "any" + }, + "required": false + }, + { + "uid": "link", + "name": "link", + "typeValue": { + "raw": "Link" }, + "required": false + }, + { + "uid": "onClick", + "name": "onClick", "typeValue": { - "raw": "(newValue: number) => void" + "raw": "(e: React.MouseEvent) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", - "comment": { - "raw": [ - "Given a value, returns an analytics event to send when component is edited.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." - ] - }, + "uid": "estimatedWidth", + "name": "estimatedWidth", "typeValue": { - "raw": "(newValue: number | null, oldValue: number | null) => AnalyticsEvent" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", - "comment": { - "raw": [ - "Disable editing, and visually de-emphasize value of the component" - ] - }, + "uid": "priority", + "name": "priority", "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:IAdaptiveItem", "required": false }, { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "boolean" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IAdaptiveItem", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-components:PaginatorRenderParams": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "PaginatorRenderParams", - "nameFull": "PaginatorRenderParams" - }, - "src": "uui-components/src/widgets/Paginator.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "PaginatorRenderParams", - "print": [ - "interface PaginatorRenderParams extends IHasRawProps> {", - " /** Array of pages that should be rendered */", - " pages: PaginatorItem[];", - " /** Call to go to the next page */", - " goToNext(): void;", - " /** Call to go to the previous page */", - " goToPrev(): void;", - " /** True, if current page is last */", - " isLast: boolean;", - " /** True, if current page is first */", - " isFirst: boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "pages", - "name": "pages", - "comment": { - "raw": [ - "Array of pages that should be rendered" - ] - }, + "uid": "collapseToMore", + "name": "collapseToMore", "typeValue": { - "raw": "PaginatorItem[]" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false }, { - "uid": "goToNext", - "name": "goToNext", - "comment": { - "raw": [ - "Call to go to the next page" - ] - }, + "uid": "collapsedContainer", + "name": "collapsedContainer", "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IAdaptiveItem", + "required": false }, { - "uid": "goToPrev", - "name": "goToPrev", + "uid": "href", + "name": "href", "comment": { "raw": [ - "Call to go to the previous page" + "Href (URL) to redirect to, for non-SPA redirects" ] }, "typeValue": { - "raw": "() => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "from": "@epam/uui-core:ICanRedirect", + "required": false }, { - "uid": "isLast", - "name": "isLast", + "uid": "isLinkActive", + "name": "isLinkActive", "comment": { "raw": [ - "True, if current page is last" + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" ] }, "typeValue": { @@ -50151,23 +50230,28 @@ "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:ICanRedirect", + "required": false }, { - "uid": "isFirst", - "name": "isFirst", + "uid": "target", + "name": "target", "comment": { "raw": [ - "True, if current page is first" + "Controls where the link should be opened" ] }, "typeValue": { - "raw": "boolean" + "raw": "'_blank'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "_blank" + ] }, - "required": true + "from": "@epam/uui-core:ICanRedirect", + "required": false }, { "uid": "rawProps", @@ -50178,449 +50262,530 @@ ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, "from": "@epam/uui-core:IHasRawProps", "required": false + }, + { + "uid": "forwardedRef", + "name": "forwardedRef", + "comment": { + "raw": [ + "this ref is passed to the underlying component" + ] + }, + "typeValue": { + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + }, + "from": "@epam/uui-core:IHasForwardedRef", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:PickerBindingProps": { + "@epam/uui-components:MainMenuProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "PickerBindingProps", - "nameFull": "PickerBindingProps" + "name": "MainMenuProps", + "nameFull": "MainMenuProps" }, - "src": "uui-components/src/pickers/bindingHelpers.ts", + "src": "uui-components/src/navigation/MainMenu/MainMenu.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "{ selectionMode: 'single'; valueType: 'id'; } & IEditable | { selectionMode: 'single'; valueType?: 'entity' | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'id'; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "raw": "MainMenuProps", "print": [ - "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" + "interface MainMenuProps extends IHasCX, IHasRawProps>, IHasForwardedRef {", + " /** Array of menu items to be rendered */", + " items?: AdaptiveItemProps[];", + " /** @deprecated", + " * Use 'items' prop to define menu content */", + " children?: any;", + " /** Path to the logo source */", + " appLogoUrl?: string;", + " /** SPA link to navigate on logo click */", + " logoLink?: Link;", + " /** Href to navigate on logo click */", + " logoHref?: string;", + " /** Called when logo is clicked */", + " onLogoClick?: (e: MouseEvent) => any;", + " /** Path to the customer logo source */", + " customerLogoUrl?: string;", + " /** SPA link to navigate on customer logo click */", + " customerLogoLink?: Link;", + " /** Href to navigate on customer logo click */", + " customerLogoHref?: string;", + " customerLogoBgColor?: string;", + " isTransparent?: boolean;", + " /** Render callback for burger menu content.", + " * Burger will appear, which some items don't fit the menu width.", + " * */", + " renderBurger?: (props: {", + " onClose: () => void;", + " }) => React.ReactNode;", + " /** If true, Burger button will be always visible */", + " alwaysShowBurger?: boolean;", + " serverBadge?: string;", + " /** Internal prop to define component for MainMenuDropdown */", + " MainMenuDropdown?: React.ComponentType;", + " /** Internal prop to define component for Burger */", + " Burger?: React.ComponentType;", + "}" ] }, "props": [ { - "uid": "selectionMode", - "name": "selectionMode", + "uid": "items", + "name": "items", + "comment": { + "raw": [ + "Array of menu items to be rendered" + ] + }, "typeValue": { - "raw": "'single'" + "raw": "{ render: (item: any, hiddenItems?: any[] | undefined, displayedItems?: any[] | undefined) => any; priority: number; collapsedContainer?: boolean | undefined; id: string; }[]" }, - "editor": { - "type": "oneOf", - "options": [ - "single" + "required": false + }, + { + "uid": "children", + "name": "children", + "comment": { + "raw": [ + "@deprecated", + " Use 'items' prop to define menu content" ] }, - "from": "@epam/uui-components:SinglePickerProps", - "required": true + "typeValue": { + "raw": "any" + }, + "required": false }, { - "uid": "valueType", - "name": "valueType", + "uid": "appLogoUrl", + "name": "appLogoUrl", + "comment": { + "raw": [ + "Path to the logo source" + ] + }, "typeValue": { - "raw": "'id'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "id" - ] + "type": "string" }, - "from": "@epam/uui-components:SinglePickerProps", - "required": true + "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "logoLink", + "name": "logoLink", "comment": { "raw": [ - "True if component contains invalid input" + "SPA link to navigate on logo click" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Link" }, - "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "logoHref", + "name": "logoHref", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Href to navigate on logo click" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "onLogoClick", + "name": "onLogoClick", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Called when logo is clicked" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.MouseEvent) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "customerLogoUrl", + "name": "customerLogoUrl", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Path to the customer logo source" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "value", - "name": "value", + "uid": "customerLogoLink", + "name": "customerLogoLink", "comment": { "raw": [ - "The current value of component" + "SPA link to navigate on customer logo click" ] }, "typeValue": { - "raw": "TId" + "raw": "Link" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "customerLogoHref", + "name": "customerLogoHref", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Href to navigate on customer logo click" ] }, "typeValue": { - "raw": "(newValue: TId) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "valueType_2", - "name": "valueType", + "uid": "customerLogoBgColor", + "name": "customerLogoBgColor", "typeValue": { - "raw": "'entity'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "entity" - ] + "type": "string" }, - "from": "@epam/uui-components:SinglePickerProps", "required": false }, { - "uid": "value_2", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, + "uid": "isTransparent", + "name": "isTransparent", "typeValue": { - "raw": "TItem" + "raw": "boolean" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "bool" + }, + "required": false }, { - "uid": "onValueChange_2", - "name": "onValueChange", + "uid": "renderBurger", + "name": "renderBurger", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Render callback for burger menu content.", + " Burger will appear, which some items don't fit the menu width." ] }, "typeValue": { - "raw": "(newValue: TItem) => void" + "raw": "(props: { onClose: () => void; }) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "selectionMode_3", - "name": "selectionMode", - "typeValue": { - "raw": "'multi'" - }, - "editor": { - "type": "oneOf", - "options": [ - "multi" + "uid": "alwaysShowBurger", + "name": "alwaysShowBurger", + "comment": { + "raw": [ + "If true, Burger button will be always visible" ] }, - "from": "@epam/uui-components:ArrayPickerProps", - "required": true - }, - { - "uid": "valueType_3", - "name": "valueType", "typeValue": { - "raw": "'id'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "id" - ] + "type": "bool" }, - "from": "@epam/uui-components:ArrayPickerProps", - "required": true + "required": false }, { - "uid": "emptyValue", - "name": "emptyValue", + "uid": "serverBadge", + "name": "serverBadge", "typeValue": { - "raw": "null | []" + "raw": "string" + }, + "editor": { + "type": "string" }, - "from": "@epam/uui-components:ArrayPickerProps", "required": false }, { - "uid": "value_3", - "name": "value", + "uid": "MainMenuDropdown", + "name": "MainMenuDropdown", "comment": { "raw": [ - "The current value of component" + "Internal prop to define component for MainMenuDropdown" ] }, "typeValue": { - "raw": "TId[]" + "raw": "React.ComponentClass | React.FunctionComponent" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "onValueChange_3", - "name": "onValueChange", + "uid": "Burger", + "name": "Burger", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Internal prop to define component for Burger" ] }, "typeValue": { - "raw": "(newValue: TId[]) => void" - }, - "editor": { - "type": "func" + "raw": "React.ComponentClass | React.FunctionComponent" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "valueType_4", - "name": "valueType", - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" + "uid": "cx", + "name": "cx", + "comment": { + "raw": [ + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, - "from": "@epam/uui-components:ArrayPickerProps", - "required": true + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "required": false }, { - "uid": "value_4", - "name": "value", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "The current value of component" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "TItem[]" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:IHasRawProps", + "required": false }, { - "uid": "onValueChange_4", - "name": "onValueChange", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "(newValue: TItem[]) => void" - }, - "editor": { - "type": "func" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:IHasForwardedRef", + "required": false } ], - "propsFromUnion": true - } - }, - "@epam/uui-components:PickerBindingValueType": { - "summary": { - "module": "@epam/uui-components", - "typeName": { - "name": "PickerBindingValueType", - "nameFull": "PickerBindingValueType" - }, - "src": "uui-components/src/pickers/bindingHelpers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'scalar' | 'array'", - "print": [ - "type PickerBindingValueType = 'scalar' | 'array';" - ] - } + "propsFromUnion": false } }, - "@epam/uui-components:PickerBodyBaseProps": { + "@epam/uui-components:NumericInputProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "PickerBodyBaseProps", - "nameFull": "PickerBodyBaseProps" + "name": "NumericInputProps", + "nameFull": "NumericInputProps" }, - "src": "uui-components/src/pickers/PickerBodyBase.tsx", + "src": "uui-components/src/inputs/NumericInput.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "PickerBodyBaseProps", + "raw": "NumericInputProps", "print": [ - "interface PickerBodyBaseProps extends DataSourceListProps, IEditable, IHasRawProps>, Pick, 'minCharsToSearch' | 'renderEmpty' | 'renderNotFound' | 'fixedBodyPosition' | 'searchDebounceDelay'> {", - " onKeyDown?(e: React.KeyboardEvent): void;", - " rows: React.ReactNode[];", - " scheduleUpdate?: () => void;", - " search: IEditable;", - " showSearch?: boolean | 'auto';", + "interface NumericInputProps extends ICanFocus, IHasCX, IClickable, IDisableable, IEditable, IHasPlaceholder, ICanBeReadonly, IAnalyticableOnChange, IHasRawProps> {", + " /** Maximum value (default is Number.MAX_SAFE_INTEGER) */", + " max?: number;", + " /**", + " * Minimum value (default is 0)", + " * @default 0", + " */", + " min?: number;", + " /** Overrides the up/increase icon */", + " upIcon?: Icon;", + " /** Overrides the down/decrease icon */", + " downIcon?: Icon;", + " /** Increase/decrease step on up/down icons clicks and up/down arrow keys */", + " step?: number;", + " /** CSS classes to put directly on the Input element */", + " inputCx?: CX;", + " /** HTML ID */", + " id?: string;", + " /** Turn off up/down (increase/decrease) buttons */", + " disableArrows?: boolean;", + " /** Align text inside the component. Useful for tables (in cell-mode) - to align numbers in table column */", + " align?: 'left' | 'right';", + " /**", + " * Turns off locale-based formatting, standard Number.toString() is used instead", + " * @default false", + " */", + " disableLocaleFormatting?: boolean;", + " /** Number formatting options. See #{link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat} */", + " formatOptions?: Intl.NumberFormatOptions;", + " /**", + " * A function to convert current input value to displayed text.", + " * Overrides standard Intl-based formatting.", + " * If passed, only maximumFractionDigits considered from formatOptions when both properties provided.", + " * Formatting is applied only when input is not focused.", + " */", + " formatValue?(value: number): string;", "}" ] }, "props": [ { - "uid": "onKeyDown", - "name": "onKeyDown", + "uid": "max", + "name": "max", + "comment": { + "raw": [ + "Maximum value (default is Number.MAX_SAFE_INTEGER)" + ] + }, "typeValue": { - "raw": "(e: React.KeyboardEvent) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": false }, { - "uid": "rows", - "name": "rows", + "uid": "min", + "name": "min", + "comment": { + "raw": [ + "Minimum value (default is 0)", + " @default 0" + ], + "tags": { + "@default": 0 + } + }, "typeValue": { - "raw": "React.ReactNode[]" + "raw": "number" }, - "required": true + "editor": { + "type": "number" + }, + "required": false }, { - "uid": "scheduleUpdate", - "name": "scheduleUpdate", + "uid": "upIcon", + "name": "upIcon", + "comment": { + "raw": [ + "Overrides the up/increase icon" + ] + }, "typeValue": { - "raw": "() => void" + "raw": "Icon" }, "editor": { - "type": "func" + "type": "component" }, "required": false }, { - "uid": "search", - "name": "search", + "uid": "downIcon", + "name": "downIcon", + "comment": { + "raw": [ + "Overrides the down/decrease icon" + ] + }, "typeValue": { - "raw": "IEditable" + "raw": "Icon" }, - "required": true + "editor": { + "type": "component" + }, + "required": false }, { - "uid": "showSearch", - "name": "showSearch", + "uid": "step", + "name": "step", + "comment": { + "raw": [ + "Increase/decrease step on up/down icons clicks and up/down arrow keys" + ] + }, "typeValue": { - "raw": "boolean | 'auto'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "auto" + "type": "number" + }, + "required": false + }, + { + "uid": "inputCx", + "name": "inputCx", + "comment": { + "raw": [ + "CSS classes to put directly on the Input element" ] }, + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + }, + "typeValueRef": "@epam/uui-core:ClassValue", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "id", + "name": "id", "comment": { "raw": [ - "ICheckable object for Select All behavior.", - " If omitted, Select All action will be absent." + "HTML ID" ] }, "typeValue": { - "raw": "ICheckable" + "raw": "string" + }, + "editor": { + "type": "string" }, - "from": "@epam/uui-core:DataSourceListProps", "required": false }, { - "uid": "isReloading", - "name": "isReloading", + "uid": "disableArrows", + "name": "disableArrows", "comment": { "raw": [ - "Signals that data is reloading on search/sort/filter/reload." + "Turn off up/down (increase/decrease) buttons" ] }, "typeValue": { @@ -50629,86 +50794,152 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataSourceListProps", "required": false }, { - "uid": "rowsCount", - "name": "rowsCount", + "uid": "align", + "name": "align", + "comment": { + "raw": [ + "Align text inside the component. Useful for tables (in cell-mode) - to align numbers in table column" + ] + }, + "typeValue": { + "raw": "'right' | 'left'" + }, + "editor": { + "type": "oneOf", + "options": [ + "right", + "left" + ] + }, + "required": false + }, + { + "uid": "disableLocaleFormatting", + "name": "disableLocaleFormatting", + "comment": { + "raw": [ + "Turns off locale-based formatting, standard Number.toString() is used instead", + " @default false" + ], + "tags": { + "@default": false + } + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "formatOptions", + "name": "formatOptions", + "comment": { + "raw": [ + "Number formatting options. See #{link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat}" + ] + }, + "typeValue": { + "raw": "Intl.NumberFormatOptions" + }, + "required": false + }, + { + "uid": "formatValue", + "name": "formatValue", + "comment": { + "raw": [ + "A function to convert current input value to displayed text.", + " Overrides standard Intl-based formatting.", + " If passed, only maximumFractionDigits considered from formatOptions when both properties provided.", + " Formatting is applied only when input is not focused." + ] + }, + "typeValue": { + "raw": "(value: number) => string" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Count of rows, after applying filter, and folding on tree nodes.", - " Obsolete! Please switch to exactRowsCount / knownRowsCount" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "number" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataSourceListCounts", + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "exactRowsCount", - "name": "exactRowsCount", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "number" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataSourceListCounts", + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "knownRowsCount", - "name": "knownRowsCount", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "There's at least knownRowsCount rows. There can be more if list is lazy loaded.", - " Equals to exactRowsCount if all rows are loaded, or if API returns rows count", - " Otherwise, exactRowsCount will be null, and knownRowsCount will specify number of loaded rows." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DataSourceListCounts", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "totalCount", - "name": "totalCount", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" + "Called when component is clicked" ] }, "typeValue": { - "raw": "number" + "raw": "(e?: any) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataSourceListCounts", + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "True if component contains invalid input" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -50717,15 +50948,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "True if component contains invalid input" ] }, "typeValue": { @@ -50734,7 +50965,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { @@ -50780,7 +51011,10 @@ ] }, "typeValue": { - "raw": "DataSourceState, any>" + "raw": "null | number" + }, + "editor": { + "type": "number" }, "from": "@epam/uui-core:IControlled", "required": true @@ -50794,7 +51028,7 @@ ] }, "typeValue": { - "raw": "(newValue: DataSourceState, any>) => void" + "raw": "(newValue: number | null) => void" }, "editor": { "type": "func" @@ -50803,488 +51037,345 @@ "required": true }, { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, - "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" - }, - "from": "@epam/uui-core:IHasRawProps", - "required": false - }, - { - "uid": "minCharsToSearch", - "name": "minCharsToSearch", - "comment": { - "raw": [ - "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", - " By default search triggers after input value is changed.", - "", - " Note: defined minCharsToSearch isn't compatible with searchPosition=body." - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-components:PickerInputBaseProps", - "required": false - }, - { - "uid": "renderEmpty", - "name": "renderEmpty", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "Overrides the rendering of PickerBody content when it is empty.", - " It's used for different empty reasons, like: no record find, no record at all, there is not enough search length to start loading(minCharsToSearch prop provided).", - " Consider this all cases where a custom callback is provided.", - " If not provided, default implementation is used." + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "(props: PickerEmptyBodyProps) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false - }, - { - "uid": "renderNotFound", - "name": "renderNotFound", - "comment": { - "raw": [ - "@deprecated in favor of `renderEmpty` method.", - " Overrides the default 'no records found' banner.", - " The 'search' callback parameter allows to distinguish cases when there's no records at all, and when current search doesn't find anything." - ], - "tags": { - "@deprecated": "in favor of" - } - }, - "typeValue": { - "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "any" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:IHasPlaceholder", "required": false }, { - "uid": "fixedBodyPosition", - "name": "fixedBodyPosition", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter." + "Given a value, returns an analytics event to send when component is edited.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: number | null, oldValue: number | null) => AnalyticsEvent" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "searchDebounceDelay", - "name": "searchDebounceDelay", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Search input debounce delay in ms. Default value is 500ms" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:IHasRawProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-components:PickerInputBaseProps": { + "@epam/uui-components:PaginatorProps": { "summary": { "module": "@epam/uui-components", "typeName": { - "name": "PickerInputBaseProps", - "nameFull": "PickerInputBaseProps" + "name": "PaginatorProps", + "nameFull": "PaginatorProps" }, - "src": "uui-components/src/pickers/hooks/types.ts", + "src": "uui-components/src/widgets/Paginator.tsx", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; }", + "raw": "PaginatorProps", "print": [ - "type PickerInputBaseProps = PickerBaseProps & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & {", - " /** dropdown (default) - show selection in dropdown; modal - opens modal window to select items */", - " editMode?: PickerInputEditMode;", - " /** Maximum number of tags to display in input, before collapsing to \"N items selected\" mode */", - " maxItems?: number;", - " /** Minimum width of dropdown body */", - " minBodyWidth?: number;", - " /** Prevents selected items tags to occupy multiple lines */", - " isSingleLine?: boolean;", - " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", - " dropdownPlacement?: Placement;", - " /** Replaces default 'toggler' - an input to which Picker attaches dropdown */", - " renderToggler?: (props: PickerTogglerProps) => React.ReactNode;", - " /**", - " * Defines where search field is:", - " * 'input' - try to place search inside the toggler (default for single-select),", - " * 'body' - put search inside the dropdown (default for multi-select)", - " * 'none' - disables search completely", - " *", - " * Note: 'searchPosition' cannot be 'input' if 'editMode' is 'modal'", - " */", - " searchPosition?: PickerInputSearchPosition;", - " /** Disallow to clear Picker value (cross icon) */", - " disableClear?: boolean;", - " /**", - " * Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", - " * By default search triggers after input value is changed.", - " *", - " * Note: defined minCharsToSearch isn't compatible with searchPosition=body.", - " */", - " minCharsToSearch?: number;", - " /** Overrides default height of the dropdown body */", - " dropdownHeight?: number;", - " /** Sets focus to component when it's mounted */", - " autoFocus?: boolean;", - " /** HTML attributes to put directly to the PickerInput parts */", - " rawProps?: {", - " /** HTML attributes to put directly to the input element */", - " input?: IHasRawProps>['rawProps'];", - " /** HTML attributes to put directly to the body root element */", - " body?: IHasRawProps>['rawProps'];", - " };", - " /** Adds custom footer to the dropdown body */", - " renderFooter?: (props: PickerInputFooterProps) => React.ReactNode;", - " /** Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter. */", - " fixedBodyPosition?: boolean;", - " /**", - " * Node of portal target, where to render the dropdown body.", - " * By default, will be used global portal node.", - " */", - " portalTarget?: HTMLElement;", - " /** CSS class(es) to put on input-part component. See https://github.com/JedWatson/classnames#usage for details */", - " inputCx?: CX;", - " /** CSS class(es) to put on body-part component. See https://github.com/JedWatson/classnames#usage for details */", - " bodyCx?: CX;", - " /**", - " * Enables highlighting of the items' text with search-matching results.", - " * */", - " highlightSearchMatches?: boolean;", - " /** Search input debounce delay in ms. Default value is 500ms */", - " searchDebounceDelay?: number;", - " /** HTML ID attribute for the input in toggler */", - " id?: string;", - "};" + "interface PaginatorProps extends IControlled, IAnalyticableOnChange, IDisableable, IHasRawProps> {", + " /** Total number of pages */", + " totalPages: number;", + " /** Override default rendering, keeping the component behavior */", + " render?(params: PaginatorRenderParams): any;", + "}" ] }, "props": [ { - "uid": "entityName", - "name": "entityName", - "comment": { - "raw": [ - "Name of the entity being selected. Affects wording like \"Please select [entity]\"" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false - }, - { - "uid": "entityPluralName", - "name": "entityPluralName", + "uid": "totalPages", + "name": "totalPages", "comment": { "raw": [ - "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" + "Total number of pages" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false - }, - { - "uid": "dataSource", - "name": "dataSource", - "comment": { - "raw": [ - "Datasource to get data for the picker" - ] - }, - "typeValue": { - "raw": "IDataSource" + "type": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": true }, { - "uid": "getName", - "name": "getName", + "uid": "render", + "name": "render", "comment": { "raw": [ - "A pure function that gets entity name from entity object.", - " Default: (item) => item.name." + "Override default rendering, keeping the component behavior" ] }, "typeValue": { - "raw": "(item: TItem) => string" + "raw": "(params: PaginatorRenderParams) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "renderRow", - "name": "renderRow", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." + "The current value of component" ] }, "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks." + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(item: TItem, index: number) => DataRowOptions" + "raw": "(newValue: number) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "renderNotFound", - "name": "renderNotFound", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "@deprecated in favor of `renderEmpty` method.", - " Overrides the default 'no records found' banner.", - " The 'search' callback parameter allows to distinguish cases when there's no records at all, and when current search doesn't find anything." - ], - "tags": { - "@deprecated": "in favor of" - } + "Given a value, returns an analytics event to send when component is edited.", + " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." + ] }, "typeValue": { - "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" + "raw": "(newValue: number | null, oldValue: number | null) => AnalyticsEvent" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "renderEmpty", - "name": "renderEmpty", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Overrides the rendering of PickerBody content when it is empty.", - " It's used for different empty reasons, like: no record find, no record at all, there is not enough search length to start loading(minCharsToSearch prop provided).", - " Consider this all cases where a custom callback is provided.", - " If not provided, default implementation is used." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "(props: PickerEmptyBodyProps) => React.ReactNode" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "emptyValue", - "name": "emptyValue", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Defines which value is to set on clear. E.g. you can put an empty array instead of null for empty multi-select Pickers" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "null | []" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:IHasRawProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:PaginatorRenderParams": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "PaginatorRenderParams", + "nameFull": "PaginatorRenderParams" + }, + "src": "uui-components/src/widgets/Paginator.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "PaginatorRenderParams", + "print": [ + "interface PaginatorRenderParams extends IHasRawProps> {", + " /** Array of pages that should be rendered */", + " pages: PaginatorItem[];", + " /** Call to go to the next page */", + " goToNext(): void;", + " /** Call to go to the previous page */", + " goToPrev(): void;", + " /** True, if current page is last */", + " isLast: boolean;", + " /** True, if current page is first */", + " isFirst: boolean;", + "}" + ] + }, + "props": [ { - "uid": "sortBy", - "name": "sortBy", + "uid": "pages", + "name": "pages", "comment": { "raw": [ - "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" + "Array of pages that should be rendered" ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" + "raw": "PaginatorItem[]" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "filter", - "name": "filter", + "uid": "goToNext", + "name": "goToNext", "comment": { "raw": [ - "Additional filter to apply to the DataSource. Can be used to limit selection somehow, w/o re-building the DataSource. E.g. in the linked pickers scenario." + "Call to go to the next page" ] }, "typeValue": { - "raw": "any" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false - }, - { - "uid": "sorting", - "name": "sorting", - "comment": { - "raw": [ - "Defines sorting to pass to the DataSource" - ] + "raw": "() => void" }, - "typeValue": { - "raw": "SortingOption" + "editor": { + "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "goToPrev", + "name": "goToPrev", "comment": { "raw": [ - "Controls how the selection (checking items) of a parent node affects the selection of its all children, and vice versa.", - " - false: All nodes are selected independently (default).", - " - true or 'explicit': Selecting a parent node explicitly selects all its children. Unchecking the last parent's child unchecks its parent.", - " - 'implicit': Selecting a parent node means that all children are considered checked.", - " The user sees all these nodes as checked on the UI, but only the selected parent is visible in the PickerInput tags, and only the checked", - " parent is present in the Picker's value or DataSourceState.checked array. When the user unchecks the first child of such a parent,", - " its parents become unchecked and all children but the unchecked one become checked, making children's selection explicit. If the last", - " unchecked child gets checked, all children from the checked are removed, returning to the implicit state when only the parent is checked." + "Call to go to the previous page" ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "() => void" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "isLast", + "name": "isLast", "comment": { "raw": [ - "You can return true for all, or some items to fold them." + "True, if current page is last" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "isFirst", + "name": "isFirst", "comment": { "raw": [ - "Given an item, should return an array of string fields to search on. By default, the search is performed on item.name field." + "True, if current page is first" ] }, "typeValue": { - "raw": "(item: TItem) => string[]" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "ref", - "name": "ref", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Component ref" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "null | (instance: PickerInputElement | null) => void | React.RefObject" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:IHasRawProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-components:PickerBindingProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "PickerBindingProps", + "nameFull": "PickerBindingProps" + }, + "src": "uui-components/src/pickers/bindingHelpers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "{ selectionMode: 'single'; valueType: 'id'; } & IEditable | { selectionMode: 'single'; valueType?: 'entity' | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'id'; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "print": [ + "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" + ] + }, + "props": [ { "uid": "selectionMode", "name": "selectionMode", - "comment": { - "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" - ] - }, "typeValue": { "raw": "'single'" }, @@ -51294,17 +51385,12 @@ "single" ] }, - "from": "@epam/uui-core:SinglePickerProps", + "from": "@epam/uui-components:SinglePickerProps", "required": true }, { "uid": "valueType", "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, "typeValue": { "raw": "'id'" }, @@ -51314,8 +51400,8 @@ "id" ] }, - "from": "@epam/uui-core:SinglePickerProps", - "required": false + "from": "@epam/uui-components:SinglePickerProps", + "required": true }, { "uid": "isInvalid", @@ -51417,292 +51503,379 @@ "required": true }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", - "comment": { - "raw": [ - "Given a value, returns an analytics event to send when component is edited.", - " See [AnalyticsContext](@link https://uui.epam.com/documents?id=analyticsContext&mode=doc&skin=UUI4_promo&category=contexts)." - ] - }, + "uid": "valueType_2", + "name": "valueType", "typeValue": { - "raw": "(newValue: any, oldValue: any) => AnalyticsEvent" + "raw": "'entity'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "entity" + ] }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-components:SinglePickerProps", "required": false }, { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "Enables/disables selected rows only in Picker." + "The current value of component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TItem" }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "onValueChange_2", + "name": "onValueChange", "comment": { "raw": [ - "Called when component gets input focus" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "(newValue: TItem) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onBlur", - "name": "onBlur", - "comment": { - "raw": [ - "Called when component looses input focus" + "uid": "selectionMode_3", + "name": "selectionMode", + "typeValue": { + "raw": "'multi'" + }, + "editor": { + "type": "oneOf", + "options": [ + "multi" ] }, + "from": "@epam/uui-components:ArrayPickerProps", + "required": true + }, + { + "uid": "valueType_3", + "name": "valueType", "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "'id'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "id" + ] }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-components:ArrayPickerProps", + "required": true + }, + { + "uid": "emptyValue", + "name": "emptyValue", + "typeValue": { + "raw": "null | []" + }, + "from": "@epam/uui-components:ArrayPickerProps", "required": false }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "value_3", + "name": "value", "comment": { "raw": [ - "Placeholder to display when empty" + "The current value of component" ] }, "typeValue": { - "raw": "any" + "raw": "TId[]" }, - "from": "@epam/uui-core:IHasPlaceholder", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "icon", - "name": "icon", + "uid": "onValueChange_3", + "name": "onValueChange", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "Icon" + "raw": "(newValue: TId[]) => void" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:IHasIcon", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "iconPosition", - "name": "iconPosition", - "comment": { - "raw": [ - "Position of the icon (left of right)" - ] - }, + "uid": "valueType_4", + "name": "valueType", "typeValue": { - "raw": "'right' | 'left'" + "raw": "'entity'" }, "editor": { "type": "oneOf", "options": [ - "right", - "left" + "entity" ] }, - "from": "@epam/uui-core:IHasIcon", - "required": false + "from": "@epam/uui-components:ArrayPickerProps", + "required": true }, { - "uid": "onIconClick", - "name": "onIconClick", + "uid": "value_4", + "name": "value", "comment": { "raw": [ - "Click handler for the icon" + "The current value of component" + ] + }, + "typeValue": { + "raw": "TItem[]" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "onValueChange_4", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" ] }, + "typeValue": { + "raw": "(newValue: TItem[]) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + } + ], + "propsFromUnion": true + } + }, + "@epam/uui-components:PickerBindingValueType": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "PickerBindingValueType", + "nameFull": "PickerBindingValueType" + }, + "src": "uui-components/src/pickers/bindingHelpers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'scalar' | 'array'", + "print": [ + "type PickerBindingValueType = 'scalar' | 'array';" + ] + } + } + }, + "@epam/uui-components:PickerBodyBaseProps": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "PickerBodyBaseProps", + "nameFull": "PickerBodyBaseProps" + }, + "src": "uui-components/src/pickers/PickerBodyBase.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "PickerBodyBaseProps", + "print": [ + "interface PickerBodyBaseProps extends DataSourceListProps, IEditable, IHasRawProps>, Pick, 'minCharsToSearch' | 'renderEmpty' | 'renderNotFound' | 'fixedBodyPosition' | 'searchDebounceDelay'> {", + " onKeyDown?(e: React.KeyboardEvent): void;", + " rows: React.ReactNode[];", + " scheduleUpdate?: () => void;", + " search: IEditable;", + " showSearch?: boolean | 'auto';", + "}" + ] + }, + "props": [ + { + "uid": "onKeyDown", + "name": "onKeyDown", + "typeValue": { + "raw": "(e: React.KeyboardEvent) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "rows", + "name": "rows", + "typeValue": { + "raw": "React.ReactNode[]" + }, + "required": true + }, + { + "uid": "scheduleUpdate", + "name": "scheduleUpdate", "typeValue": { "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IHasIcon", "required": false }, { - "uid": "editMode", - "name": "editMode", - "comment": { - "raw": [ - "dropdown (default) - show selection in dropdown; modal - opens modal window to select items" - ] + "uid": "search", + "name": "search", + "typeValue": { + "raw": "IEditable" }, + "required": true + }, + { + "uid": "showSearch", + "name": "showSearch", "typeValue": { - "raw": "'dropdown' | 'modal'" + "raw": "boolean | 'auto'" }, "editor": { "type": "oneOf", "options": [ - "dropdown", - "modal" + false, + true, + "auto" ] }, "required": false }, { - "uid": "maxItems", - "name": "maxItems", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "Maximum number of tags to display in input, before collapsing to \"N items selected\" mode" + "ICheckable object for Select All behavior.", + " If omitted, Select All action will be absent." ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "ICheckable" }, + "from": "@epam/uui-core:DataSourceListProps", "required": false }, { - "uid": "minBodyWidth", - "name": "minBodyWidth", + "uid": "isReloading", + "name": "isReloading", "comment": { "raw": [ - "Minimum width of dropdown body" + "Signals that data is reloading on search/sort/filter/reload." ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:DataSourceListProps", "required": false }, { - "uid": "isSingleLine", - "name": "isSingleLine", + "uid": "rowsCount", + "name": "rowsCount", "comment": { "raw": [ - "Prevents selected items tags to occupy multiple lines" + "Count of rows, after applying filter, and folding on tree nodes.", + " Obsolete! Please switch to exactRowsCount / knownRowsCount" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, + "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "dropdownPlacement", - "name": "dropdownPlacement", + "uid": "exactRowsCount", + "name": "exactRowsCount", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" ] }, "typeValue": { - "raw": "'right' | 'left' | 'top' | 'bottom' | 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "right", - "left", - "top", - "bottom", - "auto", - "auto-start", - "auto-end", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "number" }, + "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "renderToggler", - "name": "renderToggler", + "uid": "knownRowsCount", + "name": "knownRowsCount", "comment": { "raw": [ - "Replaces default 'toggler' - an input to which Picker attaches dropdown" + "There's at least knownRowsCount rows. There can be more if list is lazy loaded.", + " Equals to exactRowsCount if all rows are loaded, or if API returns rows count", + " Otherwise, exactRowsCount will be null, and knownRowsCount will specify number of loaded rows." ] }, "typeValue": { - "raw": "(props: PickerTogglerProps) => React.ReactNode" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, + "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "searchPosition", - "name": "searchPosition", + "uid": "totalCount", + "name": "totalCount", "comment": { "raw": [ - "Defines where search field is:", - " 'input' - try to place search inside the toggler (default for single-select),", - " 'body' - put search inside the dropdown (default for multi-select)", - " 'none' - disables search completely", - "", - " Note: 'searchPosition' cannot be 'input' if 'editMode' is 'modal'" + "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" ] }, "typeValue": { - "raw": "'body' | 'input' | 'none'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "body", - "input", - "none" - ] + "type": "number" }, + "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "disableClear", - "name": "disableClear", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Disallow to clear Picker value (cross icon)" + "True if component contains invalid input" ] }, "typeValue": { @@ -51711,49 +51884,49 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "minCharsToSearch", - "name": "minCharsToSearch", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", - " By default search triggers after input value is changed.", - "", - " Note: defined minCharsToSearch isn't compatible with searchPosition=body." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "dropdownHeight", - "name": "dropdownHeight", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Overrides default height of the dropdown body" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "autoFocus", - "name": "autoFocus", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Sets focus to component when it's mounted" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { @@ -51762,101 +51935,122 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "value", + "name": "value", "comment": { "raw": [ - "HTML attributes to put directly to the PickerInput parts" + "The current value of component" ] }, "typeValue": { - "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" + "raw": "DataSourceState, any>" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "renderFooter", - "name": "renderFooter", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Adds custom footer to the dropdown body" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(props: PickerInputFooterProps) => React.ReactNode" + "raw": "(newValue: DataSourceState, any>) => void" }, "editor": { - "type": "component" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "fixedBodyPosition", - "name": "fixedBodyPosition", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "portalTarget", - "name": "portalTarget", + "uid": "minCharsToSearch", + "name": "minCharsToSearch", "comment": { "raw": [ - "Node of portal target, where to render the dropdown body.", - " By default, will be used global portal node." + "Minimum characters to type, before search will trigger. If input characters number is less then 'minCharsToSearch', it will disable opening dropdown body.", + " By default search triggers after input value is changed.", + "", + " Note: defined minCharsToSearch isn't compatible with searchPosition=body." ] }, "typeValue": { - "raw": "HTMLElement" + "raw": "number" + }, + "editor": { + "type": "number" }, + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { - "uid": "inputCx", - "name": "inputCx", + "uid": "renderEmpty", + "name": "renderEmpty", "comment": { "raw": [ - "CSS class(es) to put on input-part component. See https://github.com/JedWatson/classnames#usage for details" + "Overrides the rendering of PickerBody content when it is empty.", + " It's used for different empty reasons, like: no record find, no record at all, there is not enough search length to start loading(minCharsToSearch prop provided).", + " Consider this all cases where a custom callback is provided.", + " If not provided, default implementation is used." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(props: PickerEmptyBodyProps) => React.ReactNode" }, - "typeValueRef": "@epam/uui-core:ClassValue", + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "bodyCx", - "name": "bodyCx", + "uid": "renderNotFound", + "name": "renderNotFound", "comment": { "raw": [ - "CSS class(es) to put on body-part component. See https://github.com/JedWatson/classnames#usage for details" - ] + "@deprecated in favor of `renderEmpty` method.", + " Overrides the default 'no records found' banner.", + " The 'search' callback parameter allows to distinguish cases when there's no records at all, and when current search doesn't find anything." + ], + "tags": { + "@deprecated": "in favor of" + } }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" }, - "typeValueRef": "@epam/uui-core:ClassValue", + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "highlightSearchMatches", - "name": "highlightSearchMatches", + "uid": "fixedBodyPosition", + "name": "fixedBodyPosition", "comment": { "raw": [ - "Enables highlighting of the items' text with search-matching results." + "Disables moving the dropdown body, when togglers is moved. Used in filters panel, to prevent filter selection to 'jump' after adding a filter." ] }, "typeValue": { @@ -51865,6 +52059,7 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -51881,199 +52076,11 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:PickerInputBaseProps", "required": false - }, - { - "uid": "id", - "name": "id", - "comment": { - "raw": [ - "HTML ID attribute for the input in toggler" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "valueType_2", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" - ] - }, - "from": "@epam/uui-core:SinglePickerProps", - "required": true - }, - { - "uid": "value_2", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TItem" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_2", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TItem) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "selectionMode_3", - "name": "selectionMode", - "comment": { - "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" - ] - }, - "typeValue": { - "raw": "'multi'" - }, - "editor": { - "type": "oneOf", - "options": [ - "multi" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true - }, - { - "uid": "valueType_3", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'id'" - }, - "editor": { - "type": "oneOf", - "options": [ - "id" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": false - }, - { - "uid": "value_3", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TId[]" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_3", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TId[]) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "valueType_4", - "name": "valueType", - "comment": { - "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] - }, - "typeValue": { - "raw": "'entity'" - }, - "editor": { - "type": "oneOf", - "options": [ - "entity" - ] - }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true - }, - { - "uid": "value_4", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TItem[]" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange_4", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, - "typeValue": { - "raw": "(newValue: TItem[]) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true } ], - "propsFromUnion": true + "propsFromUnion": false } }, "@epam/uui-components:PickerListBaseProps": { @@ -52089,7 +52096,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; }", + "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; }", "print": [ "type PickerListBaseProps = Exclude, 'cascadeSelection'> & {", " /**", @@ -52550,23 +52557,6 @@ "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, - { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", - "comment": { - "raw": [ - "Enables/disables selected rows only in Picker." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false - }, { "uid": "maxDefaultItems", "name": "maxDefaultItems", @@ -63310,7 +63300,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { @@ -63716,7 +63706,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; }", + "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; } | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & TProps & { toggleModalOpening?(opened: boolean): void; shouldShowBody?(): boolean; }", "print": [ "type UsePickerInputProps = PickerInputBaseProps & TProps & {", " toggleModalOpening?(opened: boolean): void;", @@ -64161,23 +64151,6 @@ "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, - { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", - "comment": { - "raw": [ - "Enables/disables selected rows only in Picker." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false - }, { "uid": "onFocus", "name": "onFocus", @@ -64299,7 +64272,7 @@ "modal" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64316,7 +64289,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64333,7 +64306,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64350,7 +64323,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64384,24 +64357,7 @@ "left-end" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", - "required": false - }, - { - "uid": "renderToggler", - "name": "renderToggler", - "comment": { - "raw": [ - "Replaces default 'toggler' - an input to which Picker attaches dropdown" - ] - }, - "typeValue": { - "raw": "(props: PickerTogglerProps) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64428,7 +64384,7 @@ "none" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64445,7 +64401,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64465,7 +64421,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64482,7 +64438,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64499,7 +64455,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64513,7 +64469,7 @@ "typeValue": { "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64530,7 +64486,7 @@ "editor": { "type": "component" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64547,7 +64503,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64562,7 +64518,7 @@ "typeValue": { "raw": "HTMLElement" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64577,7 +64533,7 @@ "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64592,7 +64548,7 @@ "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64609,7 +64565,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64626,7 +64582,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64643,7 +64599,7 @@ "editor": { "type": "string" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -64858,7 +64814,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps", + "raw": "PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps | PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } & TProps", "print": [ "type UsePickerListProps = PickerListBaseProps & TProps & {};" ] @@ -65300,23 +65256,6 @@ "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, - { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", - "comment": { - "raw": [ - "Enables/disables selected rows only in Picker." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false - }, { "uid": "maxDefaultItems", "name": "maxDefaultItems", @@ -70636,7 +70575,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -70695,7 +70634,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -70712,7 +70651,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -74766,12 +74705,8 @@ "name": "size", "comment": { "raw": [ - "Defines component size.", - " @default '36'" - ], - "tags": { - "@default": "36" - } + "Defines component size." + ] }, "typeValue": { "raw": "'36' | '48' | '24' | '30' | '42'" @@ -75714,7 +75649,7 @@ "typeValue": { "raw": "DropdownMenuContainerProps", "print": [ - "interface DropdownMenuContainerProps extends VPanelProps, IHasChildren, DropdownBodyProps, Pick {", + "interface DropdownMenuContainerProps extends VPanelProps, IHasChildren, DropdownBodyProps, Pick {", " closeOnKey?: React.KeyboardEvent['key'];", " minWidth?: number;", "}" @@ -76003,6 +75938,27 @@ }, "from": "@epam/uui-components:DropdownContainerProps", "required": false + }, + { + "uid": "maxHeight", + "name": "maxHeight", + "comment": { + "raw": [ + "Defines maxHeight in 'px'. If 'auto' provided, will be used height of the content." + ] + }, + "typeValue": { + "raw": "number | 'auto'" + }, + "editor": { + "type": "oneOf", + "options": [ + "auto" + ], + "scalarTypeOption": "number" + }, + "from": "@epam/uui-components:DropdownContainerProps", + "required": false } ], "propsFromUnion": false @@ -79644,282 +79600,296 @@ "required": false }, { - "uid": "icon", - "name": "icon", - "comment": { - "raw": [ - "Icon can be a React element (usually an SVG element)" - ] - }, - "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" - }, - "from": "@epam/uui-core:IHasIcon", - "required": false - }, - { - "uid": "iconPosition", - "name": "iconPosition", - "comment": { - "raw": [ - "Position of the icon (left of right)" - ] - }, - "typeValue": { - "raw": "'left' | 'right'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] - }, - "from": "@epam/uui-core:IHasIcon", - "required": false - }, - { - "uid": "onIconClick", - "name": "onIconClick", - "comment": { - "raw": [ - "Click handler for the icon" - ] - }, - "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IHasIcon", - "required": false - }, - { - "uid": "caption", - "name": "caption", - "comment": { - "raw": [ - "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasCaption", - "required": false - }, - { - "uid": "color", - "name": "color", - "comment": { - "raw": [ - "Defines component color", - " @default 'primary'" - ], - "tags": { - "@default": "primary" - } - }, - "typeValue": { - "raw": "'critical' | 'primary' | 'secondary' | 'accent' | 'white' | 'contrast'" - }, - "editor": { - "type": "oneOf", - "options": [ - "critical", - "primary", - "secondary", - "accent", - "white", - "contrast" - ] - }, - "from": "@epam/uui:LinkButtonMods", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui:MainMenuAvatarProps": { - "summary": { - "module": "@epam/uui", - "typeName": { - "name": "MainMenuAvatarProps", - "nameFull": "MainMenuAvatarProps" - }, - "src": "uui/components/navigation/MainMenu/MainMenuAvatar.tsx", - "comment": { - "raw": [ - "Represents the properties of the MainMenuAvatar component." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "MainMenuAvatarProps", - "print": [ - "/** Represents the properties of the MainMenuAvatar component. */", - "interface MainMenuAvatarProps extends IClickable, IAdaptiveItem, IDropdownToggler, IHasCX {", - " avatarUrl?: string;", - " icon?: Icon;", - "}" - ] - }, - "props": [ - { - "uid": "avatarUrl", - "name": "avatarUrl", - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "icon", - "name": "icon", - "typeValue": { - "raw": "Icon" - }, - "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "onClick", - "name": "onClick", - "comment": { - "raw": [ - "Called when component is clicked" - ] - }, - "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IClickable", - "required": false - }, - { - "uid": "estimatedWidth", - "name": "estimatedWidth", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "priority", - "name": "priority", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "collapseToMore", - "name": "collapseToMore", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "collapsedContainer", - "name": "collapsedContainer", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IAdaptiveItem", - "required": false - }, - { - "uid": "isOpen", - "name": "isOpen", - "comment": { - "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IDropdownToggler", - "required": false - }, - { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "icon", + "name": "icon", + "comment": { + "raw": [ + "Icon can be a React element (usually an SVG element)" + ] + }, + "typeValue": { + "raw": "Icon" + }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:IHasIcon", + "required": false + }, + { + "uid": "iconPosition", + "name": "iconPosition", + "comment": { + "raw": [ + "Position of the icon (left of right)" + ] + }, + "typeValue": { + "raw": "'left' | 'right'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] + }, + "from": "@epam/uui-core:IHasIcon", + "required": false + }, + { + "uid": "onIconClick", + "name": "onIconClick", + "comment": { + "raw": [ + "Click handler for the icon" + ] + }, + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IHasIcon", + "required": false + }, + { + "uid": "caption", + "name": "caption", + "comment": { + "raw": [ + "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasCaption", + "required": false + }, + { + "uid": "color", + "name": "color", + "comment": { + "raw": [ + "Defines component color", + " @default 'primary'" + ], + "tags": { + "@default": "primary" + } + }, + "typeValue": { + "raw": "'critical' | 'primary' | 'secondary' | 'accent' | 'white' | 'contrast'" + }, + "editor": { + "type": "oneOf", + "options": [ + "critical", + "primary", + "secondary", + "accent", + "white", + "contrast" + ] + }, + "from": "@epam/uui:LinkButtonMods", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui:MainMenuAvatarProps": { + "summary": { + "module": "@epam/uui", + "typeName": { + "name": "MainMenuAvatarProps", + "nameFull": "MainMenuAvatarProps" + }, + "src": "uui/components/navigation/MainMenu/MainMenuAvatar.tsx", + "comment": { + "raw": [ + "Represents the properties of the MainMenuAvatar component." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "MainMenuAvatarProps", + "print": [ + "/** Represents the properties of the MainMenuAvatar component. */", + "interface MainMenuAvatarProps extends IClickable, IAdaptiveItem, IDropdownToggler, IHasCX, IHasRawProps> {", + " avatarUrl?: string;", + " icon?: Icon;", + "}" + ] + }, + "props": [ + { + "uid": "avatarUrl", + "name": "avatarUrl", + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "icon", + "name": "icon", + "typeValue": { + "raw": "Icon" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Called when component is clicked" + ] + }, + "typeValue": { + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IClickable", + "required": false + }, + { + "uid": "estimatedWidth", + "name": "estimatedWidth", + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false + }, + { + "uid": "priority", + "name": "priority", + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false + }, + { + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false + }, + { + "uid": "collapseToMore", + "name": "collapseToMore", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false + }, + { + "uid": "collapsedContainer", + "name": "collapsedContainer", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IAdaptiveItem", + "required": false + }, + { + "uid": "isOpen", + "name": "isOpen", + "comment": { + "raw": [ + "When isDropdown=true, indicate that dropdown is open with chevron icon" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDropdownToggler", + "required": false + }, + { + "uid": "isDropdown", + "name": "isDropdown", + "comment": { + "raw": [ + "Shows chevron icon, enabling component to act as dropdown toggler" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDropdownToggler", + "required": false + }, + { + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:IDropdownToggler", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "React.ButtonHTMLAttributes & Record<`data-${string}`, string>" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "from": "@epam/uui-core:IHasRawProps", "required": false } ], @@ -84433,7 +84403,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; }", + "raw": "Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; } | Omit & PickerInputModsOverride & IHasEditMode & PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & { editMode?: PickerInputEditMode | undefined; maxItems?: number | undefined; minBodyWidth?: number | undefined; isSingleLine?: boolean | undefined; dropdownPlacement?: Placement | undefined; searchPosition?: PickerInputSearchPosition | undefined; disableClear?: boolean | undefined; minCharsToSearch?: number | undefined; dropdownHeight?: number | undefined; autoFocus?: boolean | undefined; rawProps?: { input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; } | undefined; renderFooter?: ((props: PickerInputFooterProps) => React.ReactNode) | undefined; fixedBodyPosition?: boolean | undefined; portalTarget?: HTMLElement | undefined; inputCx?: ClassValue; bodyCx?: ClassValue; highlightSearchMatches?: boolean | undefined; searchDebounceDelay?: number | undefined; id?: string | undefined; } & { renderTag?: ((props: PickerTogglerRenderItemParams) => JSX.Element) | undefined; renderToggler?: ((props: PickerTogglerProps) => React.ReactNode) | undefined; }", "print": [ "type PickerInputProps = Overwrite & IHasEditMode & PickerInputBaseProps & {", " /**", @@ -84441,6 +84411,8 @@ " * If omitted, default `PickerTogglerTag` component will be rendered", " */", " renderTag?: (props: PickerTogglerRenderItemParams) => JSX.Element;", + " /** Replaces default 'toggler' - an input to which Picker attaches dropdown */", + " renderToggler?: (props: PickerTogglerProps) => React.ReactNode;", "};" ] }, @@ -84930,23 +84902,6 @@ "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, - { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", - "comment": { - "raw": [ - "Enables/disables selected rows only in Picker." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false - }, { "uid": "onFocus", "name": "onFocus", @@ -85068,7 +85023,7 @@ "modal" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85085,7 +85040,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85102,7 +85057,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85119,7 +85074,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85153,24 +85108,7 @@ "left-end" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", - "required": false - }, - { - "uid": "renderToggler", - "name": "renderToggler", - "comment": { - "raw": [ - "Replaces default 'toggler' - an input to which Picker attaches dropdown" - ] - }, - "typeValue": { - "raw": "(props: PickerTogglerProps) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85187,17 +85125,17 @@ ] }, "typeValue": { - "raw": "'none' | 'body' | 'input'" + "raw": "'none' | 'input' | 'body'" }, "editor": { "type": "oneOf", "options": [ "none", - "body", - "input" + "input", + "body" ] }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85214,7 +85152,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85234,7 +85172,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85251,7 +85189,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85268,7 +85206,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85282,7 +85220,7 @@ "typeValue": { "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85299,7 +85237,7 @@ "editor": { "type": "component" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85316,7 +85254,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85331,7 +85269,7 @@ "typeValue": { "raw": "HTMLElement" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85346,7 +85284,7 @@ "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85361,7 +85299,7 @@ "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85378,7 +85316,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85395,7 +85333,7 @@ "editor": { "type": "number" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85412,7 +85350,7 @@ "editor": { "type": "string" }, - "from": "@epam/uui-components:PickerInputBaseProps", + "from": "@epam/uui-core:PickerInputBaseProps", "required": false }, { @@ -85432,6 +85370,22 @@ }, "required": false }, + { + "uid": "renderToggler", + "name": "renderToggler", + "comment": { + "raw": [ + "Replaces default 'toggler' - an input to which Picker attaches dropdown" + ] + }, + "typeValue": { + "raw": "(props: PickerTogglerProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, { "uid": "valueType_2", "name": "valueType", @@ -87381,7 +87335,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & PickerShowSelectedOnly & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; }", + "raw": "Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'single'; valueType: 'entity'; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; } | Omit & PickerListModsOverride & IHasPlaceholder & PickerModalOptions & { renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode; noOptionsMessage?: React.ReactNode; } & PickerBaseOptions & { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable & IAnalyticableOnChange & { maxDefaultItems?: number | undefined; maxTotalItems?: number | undefined; defaultIds?: TId[] | undefined; settingsKey?: string | undefined; sortBy?(item: TItem, sorting: SortingOption): string; }", "print": [ "type PickerListProps = Overwrite & IHasPlaceholder & PickerModalOptions & {", " renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode;", @@ -87955,23 +87909,6 @@ "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, - { - "uid": "showSelectedOnly", - "name": "showSelectedOnly", - "comment": { - "raw": [ - "Enables/disables selected rows only in Picker." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:PickerShowSelectedOnly", - "required": false - }, { "uid": "maxDefaultItems", "name": "maxDefaultItems", @@ -98418,7 +98355,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { @@ -98771,7 +98708,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { @@ -104462,7 +104399,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { @@ -111432,7 +111369,7 @@ "name": "onClose", "comment": { "raw": [ - "Called when dropdown was closed" + "Call to close the dropdown body" ] }, "typeValue": { diff --git a/uui-components/src/pickers/hooks/usePicker.ts b/uui-components/src/pickers/hooks/usePicker.ts index 5a4ca655bd..e999e4fd07 100644 --- a/uui-components/src/pickers/hooks/usePicker.ts +++ b/uui-components/src/pickers/hooks/usePicker.ts @@ -6,8 +6,15 @@ import { import { applyValueToDataSourceState, dataSourceStateToValue } from '../bindingHelpers'; import { PickerState } from './types'; -export function usePicker>( - props: TProps, +type UsePickerProps = PickerBaseProps & { + /** + * Enables/disables selected rows only in Picker. + */ + showSelectedOnly?: boolean; +}; + +export function usePicker( + props: UsePickerProps, pickerState: PickerState, ) { const context = useContext(UuiContext); diff --git a/uui-components/src/pickers/hooks/usePickerInput.ts b/uui-components/src/pickers/hooks/usePickerInput.ts index 77cececd28..c89bc3edec 100644 --- a/uui-components/src/pickers/hooks/usePickerInput.ts +++ b/uui-components/src/pickers/hooks/usePickerInput.ts @@ -56,7 +56,7 @@ export function usePickerInput(props: UsePickerInputProps>({ ...props, showSelectedOnly }, pickerInputState); + const picker = usePicker({ ...props, showSelectedOnly }, pickerInputState); const { context, view, diff --git a/uui-components/src/pickers/hooks/usePickerList.ts b/uui-components/src/pickers/hooks/usePickerList.ts index 4eb1b3f186..11ad2ecb45 100644 --- a/uui-components/src/pickers/hooks/usePickerList.ts +++ b/uui-components/src/pickers/hooks/usePickerList.ts @@ -73,7 +73,7 @@ export function usePickerList(props: UsePickerListProps>(pickerProps, pickerListState); + const picker = usePicker(pickerProps, pickerListState); const { view, getEntityName, diff --git a/uui-components/src/pickers/hooks/usePickerModal.ts b/uui-components/src/pickers/hooks/usePickerModal.ts index 81561b2eef..aa6a56b78f 100644 --- a/uui-components/src/pickers/hooks/usePickerModal.ts +++ b/uui-components/src/pickers/hooks/usePickerModal.ts @@ -1,12 +1,10 @@ import { useMemo, useEffect } from 'react'; -import { DataSourceState, IHasCaption, IModal, Lens, PickerBaseProps, PickerFooterProps } from '@epam/uui-core'; +import { DataSourceState, IModal, Lens, PickerFooterProps } from '@epam/uui-core'; import { usePicker } from './usePicker'; import { usePickerModalState } from './usePickerModalState'; -import { PickerModalOptions, UsePickerModalProps } from './types'; +import { UsePickerModalProps } from './types'; import { applyValueToDataSourceState, dataSourceStateToValue } from '../bindingHelpers'; -type PickerProps = PickerBaseProps & IModal & IHasCaption & PickerModalOptions; - const initialStateValues: DataSourceState = { topIndex: 0, visibleCount: 30, @@ -22,15 +20,13 @@ export function usePickerModal(props: UsePickerModalProps = { - ...props, - showSelectedOnly: pickerListState.showSelected, - value: selection, - onValueChange: setSelection, - } as PickerProps; - - const picker = usePicker>( - pickerProps, + const picker = usePicker( + { + ...props, + showSelectedOnly: pickerListState.showSelected, + value: selection as any, + onValueChange: setSelection, + }, pickerListState, ); const { diff --git a/uui-core/src/types/pickers.ts b/uui-core/src/types/pickers.ts index 968cbe60c5..30ec0c09a0 100644 --- a/uui-core/src/types/pickers.ts +++ b/uui-core/src/types/pickers.ts @@ -255,21 +255,10 @@ export type PickerFooterProps = { isSearchTooShort?: boolean; }; -/** - * Show selected rows only in Picker. - */ -export interface PickerShowSelectedOnly { - /** - * Enables/disables selected rows only in Picker. - */ - showSelectedOnly?: boolean; -} - export type PickerBaseProps = PickerBaseOptions & PickerBindingProps -& IAnalyticableOnChange -& PickerShowSelectedOnly; +& IAnalyticableOnChange; /** * Component can be used as Toggler control for pickers. diff --git a/uui-docs/src/commonDocs/pickerDocs.tsx b/uui-docs/src/commonDocs/pickerDocs.tsx index b0b23009bc..cb8445c14a 100644 --- a/uui-docs/src/commonDocs/pickerDocs.tsx +++ b/uui-docs/src/commonDocs/pickerDocs.tsx @@ -31,17 +31,9 @@ const getDataSourceExamples = (ctx: IDocBuilderGenCtx) => { || new LazyDataSource({ api: (request, context) => { const { search } = request; - if (search && context.parentId) { // >1 level, search - return Promise.resolve({ items: context.parent.children }); - } else if (search) { - const tree = ctx.demoApi.locationsSearch({ ...request, search }); - return tree; - } - - const filter = { parentId: context?.parentId }; - return ctx.demoApi.locations({ ...request, filter }); + const filter = search ? {} : { parentId: context?.parentId }; + return ctx.demoApi.locations({ ...request, search, filter }); }, - flattenSearchResults: false, getId: (i) => i.id, getParentId: (i) => i.parentId, getChildCount: (l) => l.childCount, diff --git a/uui-e2e-tests/framework/pageObjects/pickerInputObject.ts b/uui-e2e-tests/framework/pageObjects/pickerInputObject.ts index 2daea34f49..af287cf4f0 100644 --- a/uui-e2e-tests/framework/pageObjects/pickerInputObject.ts +++ b/uui-e2e-tests/framework/pageObjects/pickerInputObject.ts @@ -15,6 +15,7 @@ export class PickerInputObject { showOnlySelectedSwitch: Locator; selectAll: Locator; clearAll: Locator; + done: Locator; areaMultiSelectable: { root: Locator, allChecked: Locator, @@ -57,6 +58,7 @@ export class PickerInputObject { showOnlySelectedSwitch: dropdown.locator('label:has(input[role="switch"])').locator('input[role="switch"]'), selectAll: dropdown.locator('button').getByText('SELECT ALL'), clearAll: dropdown.locator('button').getByText('CLEAR ALL'), + done: dropdown.locator('button').getByText('DONE'), // Visible only in mobile view areaMultiSelectable: { root: areaMultiSelectable, allChecked: areaMultiSelectable.locator('input[type="checkbox"][aria-checked="true"]'), diff --git a/uui-e2e-tests/tests/Integration/dropdown/dropdown.e2e.ts b/uui-e2e-tests/tests/Integration/dropdown/dropdown.e2e.ts index 21ced279cb..a7264f804a 100644 --- a/uui-e2e-tests/tests/Integration/dropdown/dropdown.e2e.ts +++ b/uui-e2e-tests/tests/Integration/dropdown/dropdown.e2e.ts @@ -1,14 +1,19 @@ import { expect } from '@playwright/test'; import { test } from '../../../framework/fixtures/docExamplePage/fixture'; import { DropdownObject } from '../../../framework/pageObjects/dropdownObject'; -import { DocExamplePath, setupDocExampleTest } from '../testUtils'; +import { setupDocExampleTest } from '../testUtils'; + +enum testPageUrl { + 'Dropdown / Scrolling behavior' = '/preview?theme=loveship&isSkin=true&componentId=dropdown&previewId=json%3A%7B"id"%3A""%2C"context"%3A"Default"%2C"matrix"%3A%7B%7D%7D', + 'Dropdown / Boundary mode' = '/preview?theme=loveship&isSkin=true&componentId=dropdown&previewId=json%3A%7B%22id%22%3A%22%22%2C%22context%22%3A%22Default%22%2C%22matrix%22%3A%7B%22openOnHover%22%3A%7B%22examples%22%3A%5B%22true%22%5D%7D%2C%22closeOnMouseLeave%22%3A%7B%22examples%22%3A%5B%22boundary%22%5D%7D%7D%7D' +} test('Dropdown / Boundary mode', async ({ pageWrapper }, testInfo) => { const { pageObject } = await setupDocExampleTest({ testInfo, pageWrapper, PageObjectConstructor: DropdownObject, - testUrl: DocExamplePath['Dropdown / Boundary mode'], + testUrl: testPageUrl['Dropdown / Boundary mode'], }); await pageObject.waitForContentLoad(); @@ -39,7 +44,7 @@ test('Dropdown / Scrolling behavior', async ({ pageWrapper }, testInfo) => { testInfo, pageWrapper, PageObjectConstructor: DropdownObject, - testUrl: DocExamplePath['Dropdown / Scrolling behavior'], + testUrl: testPageUrl['Dropdown / Scrolling behavior'], }); await pageObject.waitForContentLoad(); diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png new file mode 100644 index 0000000000..ba34b4219b Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png new file mode 100644 index 0000000000..c9d28af024 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png new file mode 100644 index 0000000000..c2b3f5f736 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png new file mode 100644 index 0000000000..4875818e64 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png new file mode 100644 index 0000000000..43585b476a Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/chromium/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png new file mode 100644 index 0000000000..d6471ec344 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png new file mode 100644 index 0000000000..ff85fcafb1 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png new file mode 100644 index 0000000000..3bc307a92c Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png new file mode 100644 index 0000000000..f2493d4aad Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png new file mode 100644 index 0000000000..d3e911c732 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/firefox/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png new file mode 100644 index 0000000000..ad0c1a6e84 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-01-open-mobile-view.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png new file mode 100644 index 0000000000..0643176530 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-02-search-results.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png new file mode 100644 index 0000000000..86f88005cb Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-03-option-france-checked.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png new file mode 100644 index 0000000000..c029441a72 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-04-option-europe-checked-mixed.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png new file mode 100644 index 0000000000..7649632ba7 Binary files /dev/null and b/uui-e2e-tests/tests/Integration/pickerInput/__screenshots__/linux/webkit/pickerInput-LazyTreeInput-Mobile-view-step-05-body-closed-after-done-click.png differ diff --git a/uui-e2e-tests/tests/Integration/pickerInput/pickerInput.e2e.ts b/uui-e2e-tests/tests/Integration/pickerInput/pickerInput.e2e.ts index e835f3b128..1132876097 100644 --- a/uui-e2e-tests/tests/Integration/pickerInput/pickerInput.e2e.ts +++ b/uui-e2e-tests/tests/Integration/pickerInput/pickerInput.e2e.ts @@ -1,18 +1,18 @@ import { test } from '../../../framework/fixtures/docExamplePage/fixture'; import { PickerInputObject } from '../../../framework/pageObjects/pickerInputObject'; -import { DocExamplePath, setupDocExampleTest } from '../testUtils'; +import { setupDocExampleTest } from '../testUtils'; const OPTION_TEXT = { FRANCE_EUROPE: 'FranceEurope', FRANCE_GARGES: 'Garges-lès-GonesseEurope / France', }; -test(DocExamplePath['pickerInput/LazyTreeInput'], async ({ pageWrapper }, testInfo) => { +test('pickerInput/LazyTreeInput', async ({ pageWrapper }, testInfo) => { const { pageObject, expectScreenshot } = await setupDocExampleTest({ testInfo, pageWrapper, PageObjectConstructor: PickerInputObject, - examplePath: DocExamplePath['pickerInput/LazyTreeInput'], + examplePath: 'pickerInput/LazyTreeInput', }); await test.step('Put focus on the picker input field', async () => { await pageObject.focusInput(); @@ -127,3 +127,42 @@ test(DocExamplePath['pickerInput/LazyTreeInput'], async ({ pageWrapper }, testIn await expectScreenshot(22, 'focus-outside'); }); }); + +test('pickerInput/LazyTreeInput/Mobile view', async ({ pageWrapper }, testInfo) => { + const { pageObject, expectScreenshot } = await setupDocExampleTest({ + testInfo, + pageWrapper, + PageObjectConstructor: PickerInputObject, + examplePath: 'pickerInput/LazyTreeInput', + }); + await test.step('Put focus on the picker input field', async () => { + await pageWrapper.page.setViewportSize({ width: 640, height: 900 }); + await pageObject.locators.input.click(); + await expectScreenshot(1, 'open-mobile-view'); + }); + await test.step('Type "france" into the search field', async () => { + await pageObject.focusDropdownSearchInput(); + await pageObject.keyboardType('france'); + await pageObject.waitDropdownLoaderAppearsAndDisappears(); + await expectScreenshot(2, 'search-results'); + }); + + await test.step('Click on the "France" option', async () => { + await pageObject.clickOption(OPTION_TEXT.FRANCE_EUROPE); + await pageObject.waitDropdownOptionChecked(OPTION_TEXT.FRANCE_EUROPE); + await expectScreenshot(3, 'option-france-checked'); + }); + + await test.step('Press "Backspace" key 6 times(Clear search)', async () => { + await pageObject.focusDropdownSearchInput(); + await pageObject.keyboardPress('Backspace', 6); + await pageObject.waitDropdownOptionCheckedMixed('Europe'); + await expectScreenshot(4, 'option-europe-checked-mixed'); + }); + + await test.step('Press "Done" button', async () => { + await pageObject.locators.dropdown.done.click(); + await pageObject.waitDropdownDisappears(); + await expectScreenshot(5, 'body-closed-after-done-click'); + }); +}); diff --git a/uui-e2e-tests/tests/Integration/testUtils.ts b/uui-e2e-tests/tests/Integration/testUtils.ts index d196bdb6d1..51f3757879 100644 --- a/uui-e2e-tests/tests/Integration/testUtils.ts +++ b/uui-e2e-tests/tests/Integration/testUtils.ts @@ -1,12 +1,6 @@ import type { Page, TestInfo } from '@playwright/test'; import { type DocExamplePage } from '../../framework/fixtures/docExamplePage/docExamplePage'; -export enum DocExamplePath { - 'pickerInput/LazyTreeInput' = 'pickerInput/LazyTreeInput', - 'Dropdown / Scrolling behavior' = '/preview?theme=loveship&isSkin=true&componentId=dropdown&previewId=json%3A%7B"id"%3A""%2C"context"%3A"Default"%2C"matrix"%3A%7B%7D%7D', - 'Dropdown / Boundary mode' = '/preview?theme=loveship&isSkin=true&componentId=dropdown&previewId=json%3A%7B%22id%22%3A%22%22%2C%22context%22%3A%22Default%22%2C%22matrix%22%3A%7B%22openOnHover%22%3A%7B%22examples%22%3A%5B%22true%22%5D%7D%2C%22closeOnMouseLeave%22%3A%7B%22examples%22%3A%5B%22boundary%22%5D%7D%7D%7D' -} - interface IDocExampleTestSetupBase { testInfo: TestInfo, pageWrapper: DocExamplePage, @@ -18,7 +12,7 @@ interface IDocExampleTestSetupWithUrl extends IDocExampleTestSetupB } interface IDocExampleTestSetupWithPath extends IDocExampleTestSetupBase { - examplePath: DocExamplePath; + examplePath: string; } type IDocExampleTestSetup = IDocExampleTestSetupWithUrl | IDocExampleTestSetupWithPath; diff --git a/uui/components/pickers/__tests__/PickerInput.test.tsx b/uui/components/pickers/__tests__/PickerInput.test.tsx index 2d8ecd54ba..f3908e9ea6 100644 --- a/uui/components/pickers/__tests__/PickerInput.test.tsx +++ b/uui/components/pickers/__tests__/PickerInput.test.tsx @@ -1,13 +1,11 @@ import React, { ReactNode } from 'react'; -import { ArrayDataSource, CascadeSelection, LazyDataSource, PickerInputSearchPosition } from '@epam/uui-core'; +import { ArrayDataSource, CascadeSelection, LazyDataSource } from '@epam/uui-core'; import { renderSnapshotWithContextAsync, setupComponentForTest, screen, within, fireEvent, waitFor, userEvent, PickerInputTestObject, act, - delayAct, } from '@epam/uui-test-utils'; import { Modals, PickerToggler } from '@epam/uui-components'; import { DataPickerRow, FlexCell, PickerItem, Text, Button } from '../../'; import { PickerInput, PickerInputProps } from '../PickerInput'; -import { IHasEditMode } from '../../types'; import { Item, TestItemType, TestTreeItem, mockDataSource, mockDataSourceAsync, mockSmallDataSourceAsync, mockTreeLikeDataSourceAsync } from './mocks'; type PickerInputComponentProps = PickerInputProps; @@ -154,1666 +152,1771 @@ describe('PickerInput', () => { jest.clearAllMocks(); }); - it('should render with minimum props', async () => { - const tree = await renderSnapshotWithContextAsync( - , - ); - expect(tree).toMatchSnapshot(); - }); - - it('should render with maximum props', async () => { - const tree = await renderSnapshotWithContextAsync( - item?.level ?? '' } - autoFocus - placeholder="Test placeholder" - filter={ (item: any) => item.level === 'A1' } - sorting={ { direction: 'desc', field: 'level' } } - searchPosition="body" - minBodyWidth={ 900 } - renderNotFound={ () => null } - renderFooter={ (props) =>
{ props as unknown as ReactNode }
} - cascadeSelection - dropdownHeight={ 48 } - minCharsToSearch={ 4 } - />, - ); - expect(tree).toMatchSnapshot(); - }); - - it('should open body', async () => { - const { dom, result } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'single', - dataSource: mockSmallDataSourceAsync, - getName: ({ name }) => name, + describe('Rendering', () => { + it('should render with minimum props', async () => { + const tree = await renderSnapshotWithContextAsync( + , + ); + expect(tree).toMatchSnapshot(); + }); + + it('should render with maximum props', async () => { + const tree = await renderSnapshotWithContextAsync( + item?.level ?? '' } + autoFocus + placeholder="Test placeholder" + filter={ (item: any) => item.level === 'A1' } + sorting={ { direction: 'desc', field: 'level' } } + searchPosition="body" + minBodyWidth={ 900 } + renderNotFound={ () => null } + renderFooter={ (props) =>
{ props as unknown as ReactNode }
} + cascadeSelection + dropdownHeight={ 48 } + minCharsToSearch={ 4 } + />, + ); + expect(tree).toMatchSnapshot(); + }); + + it('should render custom placeholder', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + placeholder: 'Custom placeholder', + }); + expect(await PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Custom placeholder'); }); - fireEvent.click(dom.input); - - await PickerInputTestObject.waitForOptionsToBeReady(); - await PickerInputTestObject.waitForLoadingComplete(); - - expect(result.baseElement).toMatchSnapshot(); - }); - - describe('[selectionMode single]', () => { - it('[valueType id] should select & clear option', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + it('should define minBodyWidth', async () => { + const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'single', - }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - const optionC2 = await screen.findByText('C2'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); + selectionMode: 'multi', + minBodyWidth: 300, }); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); - const clear = screen.getByRole('button'); - fireEvent.click(clear); - await waitFor(() => { - expect(screen.queryByText('C2')).not.toBeInTheDocument(); - }); + fireEvent.click(dom.input); - // double click should be performed to check, if on blur selection is still present - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); - }); - expect(screen.queryByText('C2')).not.toBeInTheDocument(); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); - }); - expect(screen.queryByText('C2')).not.toBeInTheDocument(); + const dialogBody = dialog.getElementsByClassName('uui-dropdown-body')[0]; + expect(dialogBody).toHaveStyle('min-width: 300px'); }); - it('[valueType id] should listen to value change', async () => { - const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ - selectionMode: 'single', + it('should define dropdownHeight', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + dropdownHeight: 100, }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - const optionC2 = await screen.findByText('C2'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); - }); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - await waitFor(() => { - expect(screen.queryByText('C2')).not.toBeInTheDocument(); + const dialogBody = dialog.firstElementChild?.firstElementChild; + expect(dialogBody).toHaveStyle('max-height: 100px'); + }); + + it('should render custom not found', async () => { + const mockEmptyDS = new ArrayDataSource({ + items: [], + getId: ({ id }) => id, }); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - const option2C2 = await screen.findByText('C2'); - fireEvent.click(option2C2); + const mockConsoleError = jest.fn(); + const prevConsoleError = console.error; + console.error = mockConsoleError; - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); - }); - await waitFor(() => { - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); - }); - }); + const customText = 'Custom Text or Component'; - it('should close body on click outside', async () => { const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'single', + selectionMode: 'multi', + dataSource: mockEmptyDS, + renderNotFound: () => ( + + {customText} + + ), }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); - await waitFor(() => { - expect(screen.getByRole('dialog')).toBeInTheDocument(); - }); + const notFound = within(await screen.findByRole('dialog')).getByTestId('test-custom-not-found'); + expect(notFound).toHaveTextContent(customText); + expect(mockConsoleError).toBeCalled(); - fireEvent.click(document.body); + console.error = prevConsoleError; + }); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); + it('should render custom renderEmpty', async () => { + const mockEmptyDS = new ArrayDataSource({ + items: [], + getId: ({ id }) => id, }); - }); - it('should keep selection on close body', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + const customTextForNotFound = 'Custom Text For Not Found'; + const customTextForNotFoundId = 'test-custom-not-found-from-empty'; + const customTextForNotEnoughCharsInSearch = 'Custom Text For Not Enough Chars In Search'; + const customTextForNotEnoughCharsInSearchId = 'test-custom-not-enough-chars-from-empty'; + + const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'single', + selectionMode: 'multi', + minCharsToSearch: 3, + searchPosition: 'body', + dataSource: mockEmptyDS, + renderEmpty: ({ minCharsToSearch, search }) => { + if (search.length < minCharsToSearch) { + return ( + + {customTextForNotEnoughCharsInSearch} + + ); + } + + return ( + + {customTextForNotFound} + + ); + }, + getSearchFields: (item) => [item!.level], }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); fireEvent.click(dom.input); - await waitFor(() => { - expect(screen.getByRole('dialog')).toBeInTheDocument(); - }); - const optionC2 = await screen.findByText('C2'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); - }); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - // double click should be performed to check, if on blur selection is still present - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); + await waitFor(async () => { + const notFound = within(await screen.findByRole('dialog')).getByTestId(customTextForNotEnoughCharsInSearchId); + expect(notFound).toHaveTextContent(customTextForNotEnoughCharsInSearch); }); - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); + const bodyInput = within(dialog).getByPlaceholderText('Search'); + fireEvent.change(bodyInput, { target: { value: 'A11' } }); + + await waitFor(async () => { + const notFound = within(await screen.findByRole('dialog')).getByTestId(customTextForNotFoundId); + expect(notFound).toHaveTextContent(customTextForNotFound); }); - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); }); - it('[valueType entity] should select & clear option', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + it('should render custom row', async () => { + const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'single', - valueType: 'entity', + selectionMode: 'multi', + renderRow: (props) => ( + } + /> + ), }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); - await waitFor(() => { - expect(screen.getByRole('dialog')).toBeInTheDocument(); - }); + expect(await screen.findByRole('dialog')).toBeInTheDocument(); - const optionC2 = await screen.findByText('C2'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); - }); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - await waitFor(() => { - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); - }); + await PickerInputTestObject.waitForOptionsToBeReady(); - const clear = screen.getByRole('button'); - fireEvent.click(clear); - await waitFor(() => { - expect(screen.queryByText('C2')).not.toBeInTheDocument(); - }); + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'Elementary', + 'Elementary+', + 'Pre-Intermediate', + 'Pre-Intermediate+', + 'Intermediate', + 'Intermediate+', + 'Upper-Intermediate', + 'Upper-Intermediate+', + 'Advanced', + 'Advanced+', + 'Proficiency', + ]); }); - it('[valueType entity] should listen to value change', async () => { - const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ - value: undefined, - selectionMode: 'single', - valueType: 'entity', + it('should render names according to getName prop', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: [3, 4], + selectionMode: 'multi', + getName: ({ name }) => name, }); expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - const optionC2 = await screen.findByText('C2'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); - }); - - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - - await waitFor(() => { - expect(screen.queryByText('C2')).not.toBeInTheDocument(); - }); + await waitFor(() => expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Elementary+', 'Pre-Intermediate'])); fireEvent.click(dom.input); expect(screen.getByRole('dialog')).toBeInTheDocument(); - const option2C2 = await screen.findByText('C2'); - fireEvent.click(option2C2); + const optionC2 = await screen.findByText('Proficiency'); + fireEvent.click(optionC2); await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); - }); - await waitFor(() => { - expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + expect(mocks.onValueChange).toHaveBeenLastCalledWith([3, 4, 12]); }); }); + }); - it('should render names of items by getName', async () => { - const { mocks, dom } = await setupPickerInputForTest({ - value: 3, + describe('Body Open/Close', () => { + it('should open body', async () => { + const { dom, result, mocks } = await setupPickerInputForTest({ + value: undefined, selectionMode: 'single', + dataSource: mockSmallDataSourceAsync, getName: ({ name }) => name, }); - await waitFor(async () => expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Elementary+')); + // should not call api or onValueChange on mount + expect(mocks.onValueChange).not.toBeCalled(); + expect(mockDataSourceAsync.api).not.toBeCalled(); fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - const optionC2 = await screen.findByText('Proficiency'); - fireEvent.click(optionC2); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); - }); - }); + // should call onValueChange on open + expect(mocks.onValueChange).not.toBeCalled(); - it('should render entity name in placeholder', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'single', - entityName: 'Language Level', - }); + await PickerInputTestObject.waitForOptionsToBeReady(); + await PickerInputTestObject.waitForLoadingComplete(); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select Language Level'); + expect(result.baseElement).toMatchSnapshot(); }); - it('should ignore plural entity name in placeholder', async () => { + it('should open dropdown when start typing with selectionMode single', async () => { const { dom } = await setupPickerInputForTest({ value: undefined, selectionMode: 'single', - entityName: 'Language Level', - entityPluralName: 'Multiple Language Levels', }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select Language Level'); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + + fireEvent.change(dom.input, { target: { value: 'A' } }); + + expect(await screen.findByRole('dialog')).toBeInTheDocument(); }); - it.each<[CascadeSelection]>( - [[false], [true], ['implicit'], ['explicit']], - ) - ('should pick single element with cascadeSelection = %s', async (cascadeSelection) => { - const { mocks, dom } = await setupPickerInputForTest({ + it('should focus first founded item after search', async () => { // TODO: move + const { dom } = await setupPickerInputForTest({ value: undefined, - getName: ({ name }) => name, selectionMode: 'single', - cascadeSelection, - dataSource: mockTreeLikeDataSourceAsync, }); + fireEvent.click(dom.input); - await PickerInputTestObject.waitForOptionsToBeReady(); + const dialog = await screen.findByRole('dialog'); - // Check parent - await PickerInputTestObject.clickOptionByText('Parent 2'); + fireEvent.change(dom.input, { target: { value: 'A' } }); + + await PickerInputTestObject.waitForOptionsToBeReady(); await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(2); + const focusedItem = dialog.querySelector('.uui-focus'); + expect(focusedItem?.getAttribute('aria-posinset')).toBe('1'); }); - - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Parent 2'); }); - it('should work with maxItems properly', async () => { - const { mocks, dom } = await setupPickerInputForTest({ + it('should open body in modal if editMode= modal', async () => { + const { dom } = await setupPickerInputForTest({ value: undefined, - maxItems: 1, selectionMode: 'single', + editMode: 'modal', }); - - fireEvent.click(dom.input); - - await PickerInputTestObject.waitForOptionsToBeReady(); - - // Check parent - await PickerInputTestObject.clickOptionByText('A1'); fireEvent.click(dom.input); - await PickerInputTestObject.clickOptionByText('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith(3); - }); + expect(screen.getByAria('modal', 'true')).toBeInTheDocument(); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1+'); + expect( + await PickerInputTestObject.findOptionsText({ busy: false, editMode: 'modal' }), + ).toEqual( + ['A1', 'A1+', 'A2', 'A2+', 'B1', 'B1+', 'B2', 'B2+', 'C1', 'C1+', 'C2'], + ); }); - it('should disable clear', async () => { - const { dom, setProps } = await setupPickerInputForTest({ - value: 2, + it('should close body on click outside', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, selectionMode: 'single', - disableClear: false, }); - - await waitFor(() => expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1')); - - const clearButton = within(dom.container).getByRole('button', { name: 'Clear' }); - expect(clearButton).toBeInTheDocument(); - fireEvent.click(clearButton); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); await waitFor(() => { - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + expect(screen.getByRole('dialog')).toBeInTheDocument(); }); - // After clearing of all the items, debounced version of clear search is called. - // If update items just after clearing, handleDataSourceValueChange with old value will be called. - // So, to wait for all debounced events execution, delayAct should be called. - await delayAct(); + fireEvent.click(document.body); - setProps({ disableClear: true, value: 2 }); await waitFor(() => { - expect(within(dom.container).queryByRole('button', { name: 'Clear' })).not.toBeInTheDocument(); + expect(screen.queryByRole('dialog')).toBeNull(); }); - - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1'); }); + }); - it('should clear selected item', async () => { + describe('Search Functionality', () => { + it('should render search in input', async () => { const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'single', - maxItems: 100, + selectionMode: 'multi', + searchPosition: 'input', }); - fireEvent.click(dom.input); - expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + expect(dom.input.getAttribute('readonly')).toBeNull(); + fireEvent.click(dom.input); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - const clearButton = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); - expect(clearButton).toBeInTheDocument(); - expect(clearButton).toHaveAttribute('aria-disabled', 'true'); + const bodyInput = within(dialog).queryByPlaceholderText('Search'); + expect(bodyInput).not.toBeInTheDocument(); + }); - await PickerInputTestObject.clickOptionByText('A1'); - await waitFor(() => { - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1'); + it('should render search in body', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + searchPosition: 'body', }); + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); fireEvent.click(dom.input); - const clearButton2 = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); - expect(clearButton2).toHaveAttribute('aria-disabled', 'false'); - - fireEvent.click(clearButton2); - await waitFor(() => { - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - }); - - const clearButton3 = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); - expect(clearButton3).toHaveAttribute('aria-disabled', 'true'); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); + const bodyInput = within(dialog).getByPlaceholderText('Search'); + expect(bodyInput).toBeInTheDocument(); + expect(bodyInput.hasAttribute('readonly')).toBeFalsy(); }); - }); - describe('[selectionMode multi]', () => { - it('[valueType id] should select & clear several options', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + it('should not render search in none mode', async () => { + const { dom } = await setupPickerInputForTest({ value: undefined, selectionMode: 'multi', + searchPosition: 'none', }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - await PickerInputTestObject.clickOptionCheckbox('A1'); + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); + fireEvent.click(dom.input); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); - }); - - await PickerInputTestObject.clickOptionCheckbox('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); - }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); - - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); - - PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1+'); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1']); - }); - - PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1'); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); - }); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); + expect(within(dialog).queryByPlaceholderText('Search')).not.toBeInTheDocument(); }); - it('[valueType id] should select & clear all', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + it('should search items and check founded items', async () => { + const { dom, mocks } = await setupPickerInputForTest({ value: undefined, selectionMode: 'multi', + searchPosition: 'body', + getSearchFields: (item) => [item!.level], }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - - await PickerInputTestObject.clickOptionCheckbox('A1'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); - }); + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); + fireEvent.click(dom.input); - await PickerInputTestObject.clickOptionCheckbox('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); - }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - await PickerInputTestObject.clickClearAllOptions(); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); - }); + await PickerInputTestObject.waitForOptionsToBeReady(); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'A1', + 'A1+', + 'A2', + 'A2+', + 'B1', + 'B1+', + 'B2', + 'B2+', + 'C1', + 'C1+', + 'C2', + ]); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); - }); - it('should close body on click outside', async () => { - const { dom, mocks } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - }); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); + const bodyInput = within(dialog).getByPlaceholderText('Search'); + fireEvent.change(bodyInput, { target: { value: 'A' } }); - await PickerInputTestObject.clickOptionCheckbox('A1'); + await waitFor(() => expect(PickerInputTestObject.getOptions({ busy: false }).length).toBe(4)); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); - }); + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'A1', + 'A1+', + 'A2', + 'A2+', + ]); await PickerInputTestObject.clickOptionCheckbox('A1+'); await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); + expect(mocks.onValueChange).toHaveBeenLastCalledWith([3]); }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); - - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1+']); }); - it('should keep selection on close body', async () => { - const { dom, mocks } = await setupPickerInputForTest({ + it('should open dialog only when minCharsToSearch is reached if search in input', async () => { + const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'multi', - }); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - - await PickerInputTestObject.clickOptionCheckbox('A1'); - - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + minCharsToSearch: 1, + selectionMode: 'single', + searchPosition: 'input', }); - await PickerInputTestObject.clickOptionCheckbox('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); - }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + fireEvent.click(dom.input); - fireEvent.click(window.document.body); expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - // double click should be performed to check, if on blur selection is still present - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); + jest.useFakeTimers(); + fireEvent.change(dom.input, { target: { value: 'A' } }); + act(() => { + jest.runAllTimers(); }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + jest.useRealTimers(); + const pickerBody = await PickerInputTestObject.findDialog(); + return expect(pickerBody).toBeInTheDocument(); + }); - fireEvent.click(document.body); - await waitFor(() => { - expect(screen.queryByRole('dialog')).toBeNull(); + it('should not load items while search less than minCharsToSearch', async () => { + const apiMock = jest.fn().mockResolvedValue([]); + + const mockEmptyDS = new LazyDataSource({ + api: apiMock, + getId: ({ id }) => id, }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); - }); - it('[valueType id] should listen to value change', async () => { - const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ - valueForFirstUpdate: [4], + const { dom } = await setupPickerInputForTest({ value: undefined, selectionMode: 'multi', - valueType: 'id', + minCharsToSearch: 3, + searchPosition: 'body', + dataSource: mockEmptyDS, + getSearchFields: (item) => [item!.level], }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - await PickerInputTestObject.clickOptionCheckbox('A1'); + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + await waitFor(async () => { + const notFound = within(await screen.findByRole('dialog')); + expect(notFound.getByText('Type search to load items')).toBeInTheDocument(); }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2']); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + expect(apiMock).toBeCalledTimes(0); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - await PickerInputTestObject.clickOptionCheckbox('A1'); + const bodyInput = within(dialog).getByPlaceholderText('Search'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([4, 2]); + jest.useFakeTimers(); + fireEvent.change(bodyInput, { target: { value: '1234' } }); + act(() => { + jest.runAllTimers(); + }); + jest.useRealTimers(); + + await waitFor(async () => { + const notFound = within(await screen.findByRole('dialog')); + expect(notFound.getByText('No records found')).toBeInTheDocument(); }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2', 'A1']); + + expect(apiMock).toBeCalledTimes(1); }); - it('[valueType entity] should listen to value change', async () => { - const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ - valueForFirstUpdate: [{ id: 4, level: 'A2', name: 'Pre-Intermediate' }], + it.each(['id', 'entity'])('should use selected value as a search value for single select and search in input', async (valueType) => { + const { dom } = await setupPickerInputForTest({ value: undefined, - selectionMode: 'multi', - valueType: 'entity', + selectionMode: 'single', + searchPosition: 'input', + valueType: valueType as PickerInputProps['valueType'], }); expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); fireEvent.click(dom.input); expect(screen.getByRole('dialog')).toBeInTheDocument(); - await PickerInputTestObject.clickOptionCheckbox('A1'); - + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ - id: 2, - level: 'A1', - name: 'Elementary', - }]); + expect(dom.input.getAttribute('value')?.trim()).toEqual('C2'); }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2']); - - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - fireEvent.click(dom.input); - expect(screen.getByRole('dialog')).toBeInTheDocument(); - await act(async () => { - await PickerInputTestObject.clickOptionCheckbox('A1'); - }); + await userEvent.type(dom.input, '{backspace}'); // remove 1 char to apply value to search await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ - id: 4, - level: 'A2', - name: 'Pre-Intermediate', - }, - { - id: 2, - level: 'A1', - name: 'Elementary', - }]); + expect(dom.input.getAttribute('value')?.trim()).toEqual('C'); }); - expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2', 'A1']); - }); - it('[valueType entity] should select & clear several options', async () => { - const { dom, mocks } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - valueType: 'entity', - }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - fireEvent.click(dom.input); expect(screen.getByRole('dialog')).toBeInTheDocument(); + await PickerInputTestObject.waitForOptionsToBeReady(); - await PickerInputTestObject.clickOptionCheckbox('A1'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ id: 2, level: 'A1', name: 'Elementary' }]); - }); + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'C1', + 'C1+', + 'C2', + ]); + }); + }); - await PickerInputTestObject.clickOptionCheckbox('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([ - { id: 2, level: 'A1', name: 'Elementary' }, - { id: 3, level: 'A1+', name: 'Elementary+' }, - ]); - }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); + describe('Selection', () => { + describe('Single Mode', () => { + it('[valueType id] should select & clear option', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'single', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); + }); - fireEvent.click(window.document.body); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + const clear = screen.getByRole('button'); + fireEvent.click(clear); + await waitFor(() => { + expect(screen.queryByText('C2')).not.toBeInTheDocument(); + }); - PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1+'); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1']); - }); - PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1'); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); - }); - }); + // double click should be performed to check, if on blur selection is still present + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(screen.queryByText('C2')).not.toBeInTheDocument(); - it('should render names of items by getName', async () => { - const { dom } = await setupPickerInputForTest({ - value: [3, 4], - selectionMode: 'multi', - getName: ({ name }) => name, + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(screen.queryByText('C2')).not.toBeInTheDocument(); }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); - await waitFor(() => expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Elementary+', 'Pre-Intermediate'])); - }); - it('should render entity name with \'s\' in placeholder', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - entityName: 'Language Level', - }); + it('[valueType id] should listen to external value change', async () => { + const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ + selectionMode: 'single', + }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select Language Levels'); - }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); - it('should render plural entity name in placeholder', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - entityName: 'Language Level', - entityPluralName: 'Multiple Language Levels', - }); + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); + }); - expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select Multiple Language Levels'); - }); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - it('should pick single element with cascadeSelection = false', async () => { - const { mocks, dom } = await setupPickerInputForTest({ - value: undefined, - getName: ({ name }) => name, - selectionMode: 'multi', - cascadeSelection: false, - dataSource: mockTreeLikeDataSourceAsync, - }); - fireEvent.click(dom.input); - expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); - await PickerInputTestObject.clickOptionCheckbox('Parent 2'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); - }); + await waitFor(() => { + expect(screen.queryByText('C2')).not.toBeInTheDocument(); // wait for value change + }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2']); - }); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + const option2C2 = await screen.findByText('C2'); + fireEvent.click(option2C2); - it.each<[CascadeSelection]>( - [[true], ['explicit']], - ) - ('should pick multiple elements with cascadeSelection = %s', async (cascadeSelection) => { - const { mocks, dom } = await setupPickerInputForTest({ - value: undefined, - getName: ({ name }) => name, - selectionMode: 'multi', - cascadeSelection, - dataSource: mockTreeLikeDataSourceAsync, + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); + }); + await waitFor(() => { + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + }); }); - fireEvent.click(dom.input); - expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); - // Check parent - await PickerInputTestObject.clickOptionCheckbox('Parent 2'); - // Unfold parent - await PickerInputTestObject.clickOptionUnfold('Parent 2'); - await waitFor(() => { - // Test if checkboxes are checked/unchecked - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 2.1, 2.2, 2.3]); - }); + it('should keep selection on body close', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'single', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + await waitFor(() => { + expect(screen.getByRole('dialog')).toBeInTheDocument(); + }); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(12); + }); - // Check child - await PickerInputTestObject.clickOptionCheckbox('Child 2.2'); - await waitFor(() => { - // Test if checkboxes are checked/unchecked - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2.1, 2.3]); + // double click should be performed to check, if on blur selection is still present + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); }); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Child 2.1', 'Child 2.3']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 2', 'Child 2.2', 'Parent 3']); - }); + it('[valueType entity] should select & clear option', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'single', + valueType: 'entity', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + await waitFor(() => { + expect(screen.getByRole('dialog')).toBeInTheDocument(); + }); - it('should pick single element with cascadeSelection = implicit', async () => { - const { mocks, dom } = await setupPickerInputForTest({ - value: undefined, - getName: ({ name }) => name, - selectionMode: 'multi', - cascadeSelection: 'implicit', - dataSource: mockTreeLikeDataSourceAsync, - }); + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); + }); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + await waitFor(() => { + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + }); - fireEvent.click(dom.input); - await waitFor(async () => { - expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + const clear = screen.getByRole('button'); + fireEvent.click(clear); + await waitFor(() => { + expect(screen.queryByText('C2')).not.toBeInTheDocument(); + }); }); - // Check parent - await PickerInputTestObject.clickOptionCheckbox('Parent 2'); - // Unfold parent - await PickerInputTestObject.clickOptionUnfold('Parent 2'); + it('[valueType entity] should listen to value change', async () => { + const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ + value: undefined, + selectionMode: 'single', + valueType: 'entity', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + const optionC2 = await screen.findByText('C2'); + fireEvent.click(optionC2); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); + }); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + + await waitFor(() => { + expect(screen.queryByText('C2')).not.toBeInTheDocument(); + }); + + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + const option2C2 = await screen.findByText('C2'); + fireEvent.click(option2C2); + + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith({ id: 12, level: 'C2', name: 'Proficiency' }); + }); + await waitFor(() => { + expect(screen.getByPlaceholderText('C2')).toBeInTheDocument(); + }); }); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2']); + it.each<[CascadeSelection]>( + [[false], [true], ['implicit'], ['explicit']], + ) + ('should pick single element with cascadeSelection = %s', async (cascadeSelection) => { + const { mocks, dom } = await setupPickerInputForTest({ + value: undefined, + getName: ({ name }) => name, + selectionMode: 'single', + cascadeSelection, + dataSource: mockTreeLikeDataSourceAsync, + }); + fireEvent.click(dom.input); + + await PickerInputTestObject.waitForOptionsToBeReady(); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); + // Check parent + await PickerInputTestObject.clickOptionByText('Parent 2'); - // Check child - await PickerInputTestObject.clickOptionCheckbox('Child 2.2'); - await waitFor(() => { - // Test if checkboxes are checked/unchecked - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2.1, 2.3]); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(2); + }); + + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Parent 2'); }); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Child 2.1', 'Child 2.3']); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Child 2.1', 'Child 2.3']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 2', 'Child 2.2', 'Parent 3']); - }); - it('should wrap up extra items if number of elements is greater than maxItems', async () => { - const { mocks, dom } = await setupPickerInputForTest({ - value: undefined, - maxItems: 2, - entityPluralName: 'languages', - selectionMode: 'multi', + it('should work with maxItems properly(maxItems should not affect single select)', async () => { + const { mocks, dom } = await setupPickerInputForTest({ + value: undefined, + maxItems: 1, + selectionMode: 'single', + }); + + fireEvent.click(dom.input); + + await PickerInputTestObject.waitForOptionsToBeReady(); + + // Check parent + await PickerInputTestObject.clickOptionByText('A1'); + fireEvent.click(dom.input); + await PickerInputTestObject.clickOptionByText('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(3); + }); + + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1+'); }); - fireEvent.click(dom.input); - await waitFor(async () => { + it('should clear selected item', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'single', + maxItems: 100, + }); + fireEvent.click(dom.input); + expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); - }); - // Check parent - await PickerInputTestObject.clickOptionByText('A1'); - await PickerInputTestObject.clickOptionByText('A1+'); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); - }); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + const clearButton = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); + expect(clearButton).toBeInTheDocument(); + expect(clearButton).toHaveAttribute('aria-disabled', 'true'); - await PickerInputTestObject.clickOptionByText('A2'); - await PickerInputTestObject.clickOptionByText('A2+'); + await PickerInputTestObject.clickOptionByText('A1'); + await waitFor(() => { + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('A1'); + }); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3, 4, 5]); - }); + fireEvent.click(dom.input); - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+', '+ 2']); - }); + const clearButton2 = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); + expect(clearButton2).toHaveAttribute('aria-disabled', 'false'); - it('should disable clear', async () => { - const { setProps, dom, result } = await setupPickerInputForTest({ - value: [2, 3], - selectionMode: 'multi', - disableClear: false, - }); - await waitFor(() => expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+'])); - PickerInputTestObject.clearInput(result.container); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); - }); + fireEvent.click(clearButton2); + await waitFor(() => { + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + }); - setProps({ disableClear: true, value: [2, 3] }); - await waitFor(() => { - expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + const clearButton3 = within(screen.getByRole('dialog')).getByRole('button', { name: 'CLEAR' }); + expect(clearButton3).toHaveAttribute('aria-disabled', 'true'); }); - expect(PickerInputTestObject.hasClearInputButton(result.container)).toBeFalsy(); }); - it('should select all', async () => { - const { dom, mocks } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - maxItems: 100, - }); + describe('Multi Mode', () => { + it('[valueType id] should check & uncheck options', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); - fireEvent.click(dom.input); - await waitFor(async () => { - expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); - }); + await PickerInputTestObject.clickOptionCheckbox('A1'); - await PickerInputTestObject.clickSelectAllOptions(); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); - await waitFor(() => { - expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]); - // expect(within(dialog).getByText('CLEAR ALL')).toBeInTheDocument(); - }); + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); + }); + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1']); - await waitFor(() => { - const result = PickerInputTestObject.getSelectedTagsText(dom.target); - return expect(result).toEqual(['A1', 'A1+', 'A2', 'A2+', 'B1', 'B1+', 'B2', 'B2+', 'C1', 'C1+', 'C2']); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + + PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1'); // Remove by tags cross in toggler + await waitFor(() => { + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + }); }); - await PickerInputTestObject.clickClearAllOptions(); - await waitFor(() => { + it('[valueType id] should select & clear all', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + + await PickerInputTestObject.clickOptionCheckbox('A1'); + + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); + + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); + }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); + + await PickerInputTestObject.clickClearAllOptions(); + await waitFor(() => { + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + }); + + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); }); - }); - describe('show only selected', () => { - it('should show only selected items', async () => { - const { dom } = await setupPickerInputForTest({ - value: [4, 2, 6, 8], + it('should keep selection on close body', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + }); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + + await PickerInputTestObject.clickOptionCheckbox('A1'); + + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); + + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3]); + }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A1+']); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + + // double click should be performed to check, if on blur selection is still present + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + + fireEvent.click(document.body); + await waitFor(() => { + expect(screen.queryByRole('dialog')).toBeNull(); + }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1', 'A1+']); + }); + + it('[valueType id] should listen to value change', async () => { + const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ + valueForFirstUpdate: [4], + value: undefined, selectionMode: 'multi', + valueType: 'id', }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); - const dialog = await screen.findByRole('dialog'); - expect(dialog).toBeInTheDocument(); + await PickerInputTestObject.clickOptionCheckbox('A1'); - await waitFor(async () => { - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A2', 'B1', 'B2']); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['A1+', 'A2+', 'B1+', 'B2+', 'C1', 'C1+', 'C2']); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - await PickerInputTestObject.clickShowOnlySelected(); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + await PickerInputTestObject.clickOptionCheckbox('A1'); - expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A2', 'A1', 'B1', 'B2']); - expect(await PickerInputTestObject.findUncheckedOptions()).toEqual([]); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([4, 2]); + }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2', 'A1']); }); - }); - it('should show selected items by \'Show only selected\' click, and reset \'Show only selected\' mode by search change', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - searchPosition: 'body', - getSearchFields: (item) => [item!.level], + it('[valueType entity] should listen to value change', async () => { + const { dom, mocks } = await setupPickerInputForTestWithFirstValueChangeRewriting({ + valueForFirstUpdate: [{ id: 4, level: 'A2', name: 'Pre-Intermediate' }], + value: undefined, + selectionMode: 'multi', + valueType: 'entity', + }); + + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + + await PickerInputTestObject.clickOptionCheckbox('A1'); + + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ + id: 2, + level: 'A1', + name: 'Elementary', + }]); + }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2']); + + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); + await act(async () => { + await PickerInputTestObject.clickOptionCheckbox('A1'); + }); + + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ + id: 4, + level: 'A2', + name: 'Pre-Intermediate', + }, + { + id: 2, + level: 'A1', + name: 'Elementary', + }]); + }); + expect(await PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A2', 'A1']); }); - expect(dom.input.hasAttribute('readonly')).toBeTruthy(); - fireEvent.click(dom.input); + it('[valueType entity] should check & uncheck several options', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + valueType: 'entity', + }); + expect(PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Please select'); + fireEvent.click(dom.input); + expect(screen.getByRole('dialog')).toBeInTheDocument(); - const dialog = await screen.findByRole('dialog'); - expect(dialog).toBeInTheDocument(); + await PickerInputTestObject.clickOptionCheckbox('A1'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([{ id: 2, level: 'A1', name: 'Elementary' }]); + }); - await PickerInputTestObject.waitForOptionsToBeReady(); + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([ + { id: 2, level: 'A1', name: 'Elementary' }, + { id: 3, level: 'A1+', name: 'Elementary+' }, + ]); + }); - // Verify that all expected options are displayed. - expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ - 'A1', - 'A1+', - 'A2', - 'A2+', - 'B1', - 'B1+', - 'B2', - 'B2+', - 'C1', - 'C1+', - 'C2', - ]); + await PickerInputTestObject.clickOptionCheckbox('A1+'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([ + { id: 2, level: 'A1', name: 'Elementary' }, + ]); + }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1']); - // Click on options 'A1' and 'B1' to select them. - await PickerInputTestObject.clickOptionByText('A1'); - await PickerInputTestObject.clickOptionByText('B1'); + fireEvent.click(window.document.body); + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['A1']); - await PickerInputTestObject.clickShowOnlySelected(); + PickerInputTestObject.removeSelectedTagByText(dom.target, 'A1'); // Uncheck item by tag cross in togger + await waitFor(() => { + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + }); + }); - // Expect that only 'A1' and 'B1' are visible after the filter is applied. - await waitFor(async () => expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual(['A1', 'B1'])); + it('should check single element with cascadeSelection = false', async () => { + const { mocks, dom } = await setupPickerInputForTest({ + value: undefined, + getName: ({ name }) => name, + selectionMode: 'multi', + cascadeSelection: false, + dataSource: mockTreeLikeDataSourceAsync, + }); + fireEvent.click(dom.input); + expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + await PickerInputTestObject.clickOptionCheckbox('Parent 2'); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); - // Type 'A' into the search input and trigger the search. - const bodyInput = within(dialog).getByPlaceholderText('Search'); - fireEvent.change(bodyInput, { target: { value: 'A' } }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2']); + }); - // Expect that only options containing 'A' are shown after the search. - await waitFor(() => expect(PickerInputTestObject.getOptions({ busy: false }).length).toBe(4)); - expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual(['A1', 'A1+', 'A2', 'A2+']); + it.each<[CascadeSelection]>( + [[true], ['explicit']], + ) + ('should pick multiple elements with cascadeSelection = %s', async (cascadeSelection) => { + const { mocks, dom } = await setupPickerInputForTest({ + value: undefined, + getName: ({ name }) => name, + selectionMode: 'multi', + cascadeSelection, + dataSource: mockTreeLikeDataSourceAsync, + }); - // Clear the search input and verify that all options are visible again. - fireEvent.change(bodyInput, { target: { value: '' } }); - await waitFor(async () => expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ - 'A1', - 'A1+', - 'A2', - 'A2+', - 'B1', - 'B1+', - 'B2', - 'B2+', - 'C1', - 'C1+', - 'C2', - ])); - }); - }); + fireEvent.click(dom.input); + expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + // Check parent + await PickerInputTestObject.clickOptionCheckbox('Parent 2'); + // Unfold parent + await PickerInputTestObject.clickOptionUnfold('Parent 2'); + await waitFor(() => { + // Test if checkboxes are checked/unchecked + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 2.1, 2.2, 2.3]); + }); - it('should disable input', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'single', - isDisabled: true, - }); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); - expect(dom.input.hasAttribute('disabled')).toBeTruthy(); - expect(dom.input.getAttribute('aria-disabled')?.trim()).toEqual('true'); + // Check child + await PickerInputTestObject.clickOptionCheckbox('Child 2.2'); + await waitFor(() => { + // Test if checkboxes are checked/unchecked + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2.1, 2.3]); + }); - fireEvent.click(dom.input); - expect(screen.queryByRole('dialog')).toBeNull(); - }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Child 2.1', 'Child 2.3']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 2', 'Child 2.2', 'Parent 3']); + }); - it('should make an input readonly', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'single', - isReadonly: true, - }); + it('should pick single element with cascadeSelection = implicit', async () => { + const { mocks, dom } = await setupPickerInputForTest({ + value: undefined, + getName: ({ name }) => name, + selectionMode: 'multi', + cascadeSelection: 'implicit', + dataSource: mockTreeLikeDataSourceAsync, + }); - expect(dom.input.hasAttribute('readonly')).toBeTruthy(); - expect(dom.input.getAttribute('aria-readonly')?.trim()).toEqual('true'); + fireEvent.click(dom.input); + await waitFor(async () => { + expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + }); - fireEvent.click(dom.input); - expect(screen.queryByRole('dialog')).toBeNull(); - }); + // Check parent + await PickerInputTestObject.clickOptionCheckbox('Parent 2'); + // Unfold parent + await PickerInputTestObject.clickOptionUnfold('Parent 2'); - it.each<[IHasEditMode['mode'] | undefined]>( - [[undefined], ['form'], ['cell'], ['inline']], - )('should render with mode = %s', async (mode) => { - const props: PickerInputComponentProps = { - value: [], - onValueChange: () => {}, - valueType: 'id', - dataSource: mockDataSourceAsync, - disableClear: false, - searchPosition: 'input', - getName: (item: TestItemType) => item.level, - selectionMode: 'multi', - mode, - }; - expect(await renderSnapshotWithContextAsync()).toMatchSnapshot(); - }); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2]); + }); - it.each<['left' | 'right' | undefined]>( - [[undefined], ['left'], ['right']], - )('should render icon at specific position', async (iconPosition) => { - const props: PickerInputComponentProps = { - value: [], - onValueChange: () => {}, - valueType: 'id', - dataSource: mockDataSourceAsync, - disableClear: false, - searchPosition: 'input', - getName: (item: TestItemType) => item.level, - selectionMode: 'multi', - icon: () =>
, - iconPosition, - }; - expect(await renderSnapshotWithContextAsync()).toMatchSnapshot(); - }); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Parent 2']); - it('should pass onClick to the icon', async () => { - const { mocks } = await setupPickerInputForTest({ - value: undefined, - onIconClick: jest.fn(), - icon: () =>
, - }); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Parent 2', 'Child 2.1', 'Child 2.2', 'Child 2.3']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 3']); - const iconContainer = screen.getByTestId('test-icon').parentElement as Element; - fireEvent.click(iconContainer); - expect(mocks.onIconClick).toBeCalledTimes(1); - }); + // Check child + await PickerInputTestObject.clickOptionCheckbox('Child 2.2'); + await waitFor(() => { + // Test if checkboxes are checked/unchecked + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2.1, 2.3]); + }); + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual(['Child 2.1', 'Child 2.3']); + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['Child 2.1', 'Child 2.3']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['Parent 1', 'Parent 2', 'Child 2.2', 'Parent 3']); + }); - it('should open dialog only when minCharsToSearch is reached', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - minCharsToSearch: 1, - }); + it('should select all', async () => { + const { dom, mocks } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + maxItems: 100, + }); - fireEvent.click(dom.input); + fireEvent.click(dom.input); + await waitFor(async () => { + expect(await PickerInputTestObject.hasOptions()).toBeTruthy(); + }); - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + await PickerInputTestObject.clickSelectAllOptions(); - jest.useFakeTimers(); - fireEvent.change(dom.input, { target: { value: 'A' } }); - act(() => { - jest.runAllTimers(); - }); - jest.useRealTimers(); - const pickerBody = await PickerInputTestObject.findDialog(); - return expect(pickerBody).toBeInTheDocument(); - }); + await waitFor(() => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith([2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]); + // expect(within(dialog).getByText('CLEAR ALL')).toBeInTheDocument(); + }); - it('should use modal edit mode', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'single', - editMode: 'modal', - }); - fireEvent.click(dom.input); - expect(screen.getByAria('modal', 'true')).toBeInTheDocument(); + await waitFor(() => { + const result = PickerInputTestObject.getSelectedTagsText(dom.target); + return expect(result).toEqual(['A1', 'A1+', 'A2', 'A2+', 'B1', 'B1+', 'B2', 'B2+', 'C1', 'C1+', 'C2']); + }); - expect( - await PickerInputTestObject.findOptionsText({ busy: false, editMode: 'modal' }), - ).toEqual( - ['A1', 'A1+', 'A2', 'A2+', 'B1', 'B1+', 'B2', 'B2+', 'C1', 'C1+', 'C2'], - ); - }); + await PickerInputTestObject.clickClearAllOptions(); + await waitFor(() => { + expect(PickerInputTestObject.getSelectedTagsText(dom.target)).toEqual([]); + }); + }); - it('should render input as invalid', async () => { - const props: PickerInputComponentProps = { - value: undefined, - onValueChange: () => {}, - valueType: 'id', - dataSource: mockDataSourceAsync, - disableClear: false, - searchPosition: 'input', - getName: (item: TestItemType) => item.level, - selectionMode: 'single', - isInvalid: true, - }; - expect(await renderSnapshotWithContextAsync()).toMatchSnapshot(); - }); + describe('show only selected', () => { + it('should show only selected items', async () => { + const { dom } = await setupPickerInputForTest({ + value: [4, 2, 6, 8], + selectionMode: 'multi', + }); - it('should support single line', async () => { - const props: PickerInputComponentProps = { - value: [], - onValueChange: () => {}, - dataSource: mockDataSourceAsync, - disableClear: false, - searchPosition: 'input', - getName: (item: TestItemType) => item.level, - selectionMode: 'multi', - isSingleLine: true, - }; - expect(await renderSnapshotWithContextAsync()).toMatchSnapshot(); - }); + fireEvent.click(dom.input); + + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); + + await waitFor(async () => { + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A1', 'A2', 'B1', 'B2']); + }); + + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual(['A1+', 'A2+', 'B1+', 'B2+', 'C1', 'C1+', 'C2']); + + await PickerInputTestObject.clickShowOnlySelected(); + + expect(await PickerInputTestObject.findCheckedOptions()).toEqual(['A2', 'A1', 'B1', 'B2']); + expect(await PickerInputTestObject.findUncheckedOptions()).toEqual([]); + }); - it('should provide custom placeholder', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - placeholder: 'Custom placeholder', - }); - expect(await PickerInputTestObject.getPlaceholderText(dom.input)).toEqual('Custom placeholder'); - }); + it('should show selected items by \'Show only selected\' click, and reset \'Show only selected\' mode by search change', async () => { + const { dom } = await setupPickerInputForTest({ + value: undefined, + selectionMode: 'multi', + searchPosition: 'body', + getSearchFields: (item) => [item!.level], + }); + + expect(dom.input.hasAttribute('readonly')).toBeTruthy(); + fireEvent.click(dom.input); + + const dialog = await screen.findByRole('dialog'); + expect(dialog).toBeInTheDocument(); + + await PickerInputTestObject.waitForOptionsToBeReady(); + + // Verify that all expected options are displayed. + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'A1', + 'A1+', + 'A2', + 'A2+', + 'B1', + 'B1+', + 'B2', + 'B2+', + 'C1', + 'C1+', + 'C2', + ]); + + // Click on options 'A1' and 'B1' to select them. + await PickerInputTestObject.clickOptionByText('A1'); + await PickerInputTestObject.clickOptionByText('B1'); + + await PickerInputTestObject.clickShowOnlySelected(); + + // Expect that only 'A1' and 'B1' are visible after the filter is applied. + await waitFor(async () => expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual(['A1', 'B1'])); + + // Type 'A' into the search input and trigger the search. + const bodyInput = within(dialog).getByPlaceholderText('Search'); + fireEvent.change(bodyInput, { target: { value: 'A' } }); + + // Expect that only options containing 'A' are shown after the search. + await waitFor(() => expect(PickerInputTestObject.getOptions({ busy: false }).length).toBe(4)); + expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual(['A1', 'A1+', 'A2', 'A2+']); + + // Clear the search input and verify that all options are visible again. + fireEvent.change(bodyInput, { target: { value: '' } }); + await waitFor(async () => expect(await PickerInputTestObject.findOptionsText({ busy: false })).toEqual([ + 'A1', + 'A1+', + 'A2', + 'A2+', + 'B1', + 'B1+', + 'B2', + 'B2+', + 'C1', + 'C1+', + 'C2', + ])); + }); + }); - it('should define minBodyWidth', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - minBodyWidth: 300, - }); + describe('emptyValue tests', () => { + it.each<[undefined | null | []]>([[[]], [undefined], [null]]) + ('should not call onValueChange on edit search with emptyValue = %s; and return emptyValue = %s on check -> uncheck', async (emptyValue) => { + const { dom, mocks } = await setupPickerInputForTest({ + emptyValue: emptyValue, + value: emptyValue as (undefined | []), + selectionMode: 'multi', + searchPosition: 'body', + }); - fireEvent.click(dom.input); + fireEvent.click(dom.input); - const dialog = await screen.findByRole('dialog'); - expect(dialog).toBeInTheDocument(); + const dialog = await screen.findByRole('dialog'); + const bodyInput = await within(dialog).findByPlaceholderText('Search'); + fireEvent.change(bodyInput, { target: { value: 'A' } }); - const dialogBody = dialog.getElementsByClassName('uui-dropdown-body')[0]; - expect(dialogBody).toHaveStyle('min-width: 300px'); - }); + expect(mocks.onValueChange).toHaveBeenCalledTimes(0); - it('should define dropdownHeight', async () => { - const { dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - dropdownHeight: 100, - }); + // Test value after check -> uncheck + await PickerInputTestObject.clickOptionCheckbox('A1'); // check + await PickerInputTestObject.clickOptionCheckbox('A1'); // uncheck - fireEvent.click(dom.input); + await waitFor(async () => { + expect(mocks.onValueChange).toHaveBeenLastCalledWith(emptyValue); + }); + }); - const dialog = await screen.findByRole('dialog'); - expect(dialog).toBeInTheDocument(); + it.each<[undefined | null | []]>([[[]], [undefined], [null]]) + ('should not call onValueChange on edit search if emptyValue = %s does not equal to the initial value', async (emptyValue) => { + const { dom, mocks } = await setupPickerInputForTest({ + emptyValue: emptyValue, + value: undefined, + selectionMode: 'multi', + searchPosition: 'body', + }); - const dialogBody = dialog.firstElementChild?.firstElementChild; - expect(dialogBody).toHaveStyle('max-height: 100px'); - }); + fireEvent.click(dom.input); - it('should render custom toggler', async () => { - const { mocks, dom } = await setupPickerInputForTest({ - value: undefined, - selectionMode: 'multi', - renderToggler: (props) => ( -