From 7d0f78a1d2a825b10569db4a212bfb1fc32b839d Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 13:01:00 +0300 Subject: [PATCH 1/8] [Docs]: updated types docs and added docs for showSelectedOnly. --- ...ataSourcePropsShowSelectedOnly.example.tsx | 39 + .../dataSources/BaseDataSourceProps.doc.tsx | 1 + ...urces-DataSourcePropsShowSelectedOnly.json | 25 + public/docs/docsGenOutput/docsGenOutput.d.ts | 40 +- public/docs/docsGenOutput/docsGenOutput.json | 30812 +++++++++------- uui-docs/src/dataSources/DataSourceViewer.tsx | 11 +- 6 files changed, 17623 insertions(+), 13305 deletions(-) create mode 100644 app/src/docs/_examples/dataSources/DataSourcePropsShowSelectedOnly.example.tsx create mode 100644 public/docs/content/examples-dataSources-DataSourcePropsShowSelectedOnly.json diff --git a/app/src/docs/_examples/dataSources/DataSourcePropsShowSelectedOnly.example.tsx b/app/src/docs/_examples/dataSources/DataSourcePropsShowSelectedOnly.example.tsx new file mode 100644 index 0000000000..fb6bce0775 --- /dev/null +++ b/app/src/docs/_examples/dataSources/DataSourcePropsShowSelectedOnly.example.tsx @@ -0,0 +1,39 @@ +import React, { useState } from 'react'; +import { DataSourceViewer } from '@epam/uui-docs'; +import { DataSourceState, useArrayDataSource } from '@epam/uui-core'; + +const items = [ + { id: '1', name: 'Parent 1' }, + { id: '1.1', name: 'Child 1.1', parentId: '1' }, + { id: '1.2', name: 'Child 1.2', parentId: '1' }, + + { id: '2', name: 'Parent 2' }, + { id: '2.1', name: 'Child 2.1', parentId: '2' }, + { id: '2.2', name: 'Child 2.2', parentId: '2' }, + + { id: '3', name: 'Parent 3' }, + { id: '3.2', name: 'Child 3.2', parentId: '3' }, + { id: '3.1', name: 'Child 3.1', parentId: '3' }, +]; + +export default function DataSourcePropsShowSelectedOnlyExample() { + const [showSelectedOnly, setShowSelectedOnly] = useState(false); + + const [value, onValueChange] = useState({ checked: ['1'] }); + const dataSource = useArrayDataSource({ + items, + rowOptions: { checkbox: { isVisible: true } }, + showSelectedOnly, + }, []); + + return ( + setShowSelectedOnly(!showSelectedOnly) } + /> + ); +} diff --git a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx index 477031e2f1..e8d2a60051 100644 --- a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx +++ b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx @@ -16,6 +16,7 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { + ); } diff --git a/public/docs/content/examples-dataSources-DataSourcePropsShowSelectedOnly.json b/public/docs/content/examples-dataSources-DataSourcePropsShowSelectedOnly.json new file mode 100644 index 0000000000..7570d8ecd8 --- /dev/null +++ b/public/docs/content/examples-dataSources-DataSourcePropsShowSelectedOnly.json @@ -0,0 +1,25 @@ +[ + { + "type": "paragraph", + "children": [ + { + "text": "Enables/disables showing selected rows only." + } + ] + }, + { + "type": "paragraph", + "children": [ + { + "text": "If enabled in " + }, + { + "text": "LazyDataSource", + "uui-richTextEditor-code": true + }, + { + "text": " since initialization, only selected/checked records are loaded. The rest of the records would be loaded after turning on a showing of all the records." + } + ] + } +] \ No newline at end of file diff --git a/public/docs/docsGenOutput/docsGenOutput.d.ts b/public/docs/docsGenOutput/docsGenOutput.d.ts index 3e76da5ebb..f5fa6bab62 100644 --- a/public/docs/docsGenOutput/docsGenOutput.d.ts +++ b/public/docs/docsGenOutput/docsGenOutput.d.ts @@ -7,9 +7,6 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:ApiExtensions' | '@epam/uui-core:ApiRecoveryReason' | '@epam/uui-core:ApiStatus' | -'@epam/uui-core:ApplyFilterOptions' | -'@epam/uui-core:ApplySearchOptions' | -'@epam/uui-core:ApplySortOptions' | '@epam/uui-core:ArrayDataSourceProps' | '@epam/uui-core:ArrayElement' | '@epam/uui-core:ArrayListViewProps' | @@ -17,12 +14,14 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:AsyncDataSourceProps' | '@epam/uui-core:AsyncListViewProps' | '@epam/uui-core:BaseArrayListViewProps' | +'@epam/uui-core:BaseDataSourceConfig' | '@epam/uui-core:BaseDatePickerProps' | '@epam/uui-core:BaseListViewProps' | '@epam/uui-core:BaseRangeDatePickerProps' | '@epam/uui-core:BatchPromiseOptions' | '@epam/uui-core:BlockTypes' | '@epam/uui-core:CascadeSelection' | +'@epam/uui-core:CascadeSelectionService' | '@epam/uui-core:CheckboxCoreProps' | '@epam/uui-core:ClassValue' | '@epam/uui-core:ColumnsConfig' | @@ -62,6 +61,7 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:ErrorPageInfo' | '@epam/uui-core:FileUploadOptions' | '@epam/uui-core:FileUploadResponse' | +'@epam/uui-core:FilterConfig' | '@epam/uui-core:FilterPredicate' | '@epam/uui-core:FilterPredicateName' | '@epam/uui-core:FiltersConfig' | @@ -119,10 +119,12 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:IHasTabIndex' | '@epam/uui-core:IHasValidationMessage' | '@epam/uui-core:IHistory4' | +'@epam/uui-core:IImmutableMap' | '@epam/uui-core:ILayoutContext' | '@epam/uui-core:ILens' | '@epam/uui-core:ILockContext' | '@epam/uui-core:IMap' | +'@epam/uui-core:IMapElement' | '@epam/uui-core:IModal' | '@epam/uui-core:IModalContext' | '@epam/uui-core:INotification' | @@ -134,8 +136,14 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:IRouterContext' | '@epam/uui-core:ITablePreset' | '@epam/uui-core:ITableState' | -'@epam/uui-core:ItemsComparator' | +'@epam/uui-core:ItemsMapParams' | +'@epam/uui-core:ItemsStorageParams' | '@epam/uui-core:ITree' | +'@epam/uui-core:ITreeItemsInfo' | +'@epam/uui-core:ITreeLoadResult' | +'@epam/uui-core:ITreeNodeInfo' | +'@epam/uui-core:ITreeNodeStatus' | +'@epam/uui-core:ITreeParams' | '@epam/uui-core:IUserSettingsContext' | '@epam/uui-core:LabeledInputCoreProps' | '@epam/uui-core:LayoutLayer' | @@ -148,43 +156,56 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-core:LazyListViewProps' | '@epam/uui-core:LazyLoadedMapLoadCallback' | '@epam/uui-core:Link' | -'@epam/uui-core:ListApiResponse' | -'@epam/uui-core:ListApiSettings' | '@epam/uui-core:LoadingStatus' | -'@epam/uui-core:LoadTreeOptions' | '@epam/uui-core:Metadata' | '@epam/uui-core:ModalBlockerProps' | '@epam/uui-core:ModalFooterCoreProps' | '@epam/uui-core:ModalHeaderCoreProps' | '@epam/uui-core:ModalOperation' | '@epam/uui-core:ModalWindowProps' | +'@epam/uui-core:ModificationOptions' | '@epam/uui-core:NotificationOperation' | '@epam/uui-core:NotificationParams' | +'@epam/uui-core:OnUpdate' | +'@epam/uui-core:PatchOptions' | +'@epam/uui-core:PatchOrderingType' | '@epam/uui-core:PickerBaseOptions' | '@epam/uui-core:PickerBaseProps' | '@epam/uui-core:PickerBindingProps' | '@epam/uui-core:PickerBindingValueType' | '@epam/uui-core:PickerFilterConfig' | '@epam/uui-core:PickerFooterProps' | +'@epam/uui-core:PickerShowSelectedOnly' | +'@epam/uui-core:Position' | +'@epam/uui-core:PositionType' | '@epam/uui-core:RangeDatePickerInputType' | '@epam/uui-core:RangeDatePickerPresets' | '@epam/uui-core:RangeDatePickerPresetValue' | '@epam/uui-core:RangeDatePickerValue' | +'@epam/uui-core:RecordStatus' | '@epam/uui-core:RenderCellProps' | '@epam/uui-core:RenderEditorProps' | '@epam/uui-core:ScrollAlign' | '@epam/uui-core:ScrollToConfig' | +'@epam/uui-core:SearchConfig' | +'@epam/uui-core:SetDataSourceState' | '@epam/uui-core:SinglePickerProps' | +'@epam/uui-core:SortConfig' | '@epam/uui-core:SortDirection' | +'@epam/uui-core:SortedPatchByParentId' | '@epam/uui-core:SortingOption' | '@epam/uui-core:SpinnerCoreProps' | '@epam/uui-core:TableFiltersConfig' | '@epam/uui-core:TextInputCoreProps' | '@epam/uui-core:TooltipCoreProps' | -'@epam/uui-core:ITreeNodeInfo' | -'@epam/uui-core:ITreeParams' | +'@epam/uui-core:UseCascadeSelectionServiceProps' | +'@epam/uui-core:UseDataRowsProps' | +'@epam/uui-core:UseFoldingServiceProps' | '@epam/uui-core:UseFormProps' | +'@epam/uui-core:UseLazyFetchingAdvisorProps' | '@epam/uui-core:UseTableStateHookParams' | +'@epam/uui-core:UseTreeProps' | +'@epam/uui-core:UseTreeResult' | '@epam/uui-core:UseUuiErrorOptions' | '@epam/uui-core:UseUuiErrorProps' | '@epam/uui-core:UseUuiServicesProps' | @@ -250,6 +271,7 @@ type Autogenerated_TDocsGenExportedTypeRef = '@epam/uui-core:AcceptDropParams' | '@epam/uui-components:PickerModalOptions' | '@epam/uui-components:PickerModalScalarProps' | '@epam/uui-components:PickerTogglerProps' | +'@epam/uui-components:PickerTogglerRenderItemParams' | '@epam/uui-components:PortalProps' | '@epam/uui-components:PositionValues' | '@epam/uui-components:RadioInputProps' | diff --git a/public/docs/docsGenOutput/docsGenOutput.json b/public/docs/docsGenOutput/docsGenOutput.json index 6053465c6b..c02836e194 100644 --- a/public/docs/docsGenOutput/docsGenOutput.json +++ b/public/docs/docsGenOutput/docsGenOutput.json @@ -1,5 +1,5 @@ { - "version": "5.7.0", + "version": "5.7.1", "docsGenTypes": { "@epam/uui-core:AcceptDropParams": { "summary": { @@ -703,177 +703,6 @@ } } }, - "@epam/uui-core:ApplyFilterOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ApplyFilterOptions", - "nameFull": "ApplyFilterOptions" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ApplyFilterOptions", - "print": [ - "interface ApplyFilterOptions extends Pick, 'filter'> {", - " getFilter?: (filter: TFilter) => (item: TItem) => boolean;", - "}" - ] - }, - "props": [ - { - "uid": "getFilter", - "name": "getFilter", - "typeValue": { - "raw": "(filter: TFilter) => (item: TItem) => boolean" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "filter", - "name": "filter", - "comment": { - "raw": [ - "Filter value used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, filtering is performed internally by the datasource." - ] - }, - "typeValue": { - "raw": "TFilter" - }, - "from": "@epam/uui-core:DataSourceState", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ApplySearchOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ApplySearchOptions", - "nameFull": "ApplySearchOptions" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ApplySearchOptions", - "print": [ - "interface ApplySearchOptions extends Pick, 'search'> {", - " getSearchFields?: (item: TItem) => string[];", - " sortSearchByRelevance?: boolean;", - "}" - ] - }, - "props": [ - { - "uid": "getSearchFields", - "name": "getSearchFields", - "typeValue": { - "raw": "(item: TItem) => string[]" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "sortSearchByRelevance", - "name": "sortSearchByRelevance", - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "required": false - }, - { - "uid": "search", - "name": "search", - "comment": { - "raw": [ - "Search value, used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, searching is performed internally by the datasource." - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "from": "@epam/uui-core:DataSourceState", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ApplySortOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ApplySortOptions", - "nameFull": "ApplySortOptions" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ApplySortOptions", - "print": [ - "interface ApplySortOptions extends Pick, 'sorting'> {", - " sortBy?(item: TItem, sorting: SortingOption): any;", - "}" - ] - }, - "props": [ - { - "uid": "sortBy", - "name": "sortBy", - "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "sorting", - "name": "sorting", - "comment": { - "raw": [ - "Sorting value, used to sort data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, sorting is performed internally by the datasource." - ] - }, - "typeValue": { - "raw": "SortingOption[]" - }, - "from": "@epam/uui-core:DataSourceState", - "required": false - } - ], - "propsFromUnion": false - } - }, "@epam/uui-core:ArrayDataSourceProps": { "summary": { "module": "@epam/uui-core", @@ -894,106 +723,6 @@ ] }, "props": [ - { - "uid": "items", - "name": "items", - "comment": { - "raw": [ - "Data, which should be represented by a DataSource." - ] - }, - "typeValue": { - "raw": "TItem[] | ITree" - }, - "from": "@epam/uui-core:ArrayListViewProps", - "required": false - }, - { - "uid": "getSearchFields", - "name": "getSearchFields", - "comment": { - "raw": [ - "A pure function that gets search value for each item.", - " Default: (item) => item.name." - ] - }, - "typeValue": { - "raw": "(item: TItem) => string[]" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "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:BaseArrayListViewProps", - "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": "(filter: TFilter) => (item: TItem) => boolean" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "required": false - }, - { - "uid": "sortSearchByRelevance", - "name": "sortSearchByRelevance", - "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 - } - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "required": false - }, { "uid": "getId", "name": "getId", @@ -1001,7 +730,8 @@ "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 An item to get ID of" + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { @@ -1010,7 +740,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1028,7 +758,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1043,7 +773,10 @@ " - 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)" + " 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": { @@ -1052,7 +785,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1071,7 +804,7 @@ "typeValue": { "raw": "DataRowOptions" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1084,16 +817,17 @@ " 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 An item to get options for" + " @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) => DataRowOptions" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1102,7 +836,9 @@ "comment": { "raw": [ "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + " 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": { @@ -1111,7 +847,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1141,7 +877,7 @@ "explicit" ] }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1149,8 +885,12 @@ "name": "selectAll", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -1158,19 +898,16 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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`." + "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": { @@ -1179,84 +916,100 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ArrayElement": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ArrayElement", - "nameFull": "ArrayElement" - }, - "src": "uui-core/src/data/lenses/types.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "ArrayElement", - "print": [ - "type ArrayElement = ArrayType extends (infer ElementType)[] ? ElementType : never;" - ] - } - } - }, - "@epam/uui-core:ArrayListViewProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ArrayListViewProps", - "nameFull": "ArrayListViewProps" - }, - "src": "uui-core/src/data/processing/views/ArrayListView.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ArrayListViewProps", - "print": [ - "interface ArrayListViewProps extends BaseArrayListViewProps {", - " /** Data, which should be represented by a DataSource. */", - " items?: TItem[] | ITree;", - "}" - ] - }, - "props": [ + }, { - "uid": "items", - "name": "items", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Data, which should be represented by a DataSource." + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "TItem[] | ITree" + "raw": "(item: TItem) => boolean" }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "A pure function that gets search value for each item.", - " Default: (item) => item.name." + "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) => string[]" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "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": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "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 }, { @@ -1273,25 +1026,25 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "getFilter", - "name": "getFilter", + "uid": "getSearchFields", + "name": "getSearchFields", "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." + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "(filter: TFilter) => (item: TItem) => boolean" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "from": "@epam/uui-core:SearchConfig", "required": false }, { @@ -1324,9 +1077,85 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "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": "(filter: TFilter) => (item: TItem) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FilterConfig", "required": false }, + { + "uid": "items", + "name": "items", + "comment": { + "raw": [ + "Data, which should be represented by a DataSource." + ] + }, + "typeValue": { + "raw": "TItem[]" + }, + "from": "@epam/uui-core:ArrayDataSourceConfig", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ArrayElement": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ArrayElement", + "nameFull": "ArrayElement" + }, + "src": "uui-core/src/data/lenses/types.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ArrayElement", + "print": [ + "type ArrayElement = ArrayType extends (infer ElementType)[] ? ElementType : never;" + ] + } + } + }, + "@epam/uui-core:ArrayListViewProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ArrayListViewProps", + "nameFull": "ArrayListViewProps" + }, + "src": "uui-core/src/data/processing/views/types.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ArrayListViewProps", + "print": [ + "interface ArrayListViewProps extends BaseArrayListViewProps, ArrayDataSourceConfig {", + "}" + ] + }, + "props": [ { "uid": "getId", "name": "getId", @@ -1334,7 +1163,8 @@ "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 An item to get ID of" + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { @@ -1343,7 +1173,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1361,7 +1191,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1376,7 +1206,10 @@ " - 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)" + " 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": { @@ -1385,7 +1218,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1404,7 +1237,7 @@ "typeValue": { "raw": "DataRowOptions" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1417,16 +1250,17 @@ " 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 An item to get options for" + " @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) => DataRowOptions" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1435,7 +1269,9 @@ "comment": { "raw": [ "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + " 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": { @@ -1444,7 +1280,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1474,7 +1310,7 @@ "explicit" ] }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1482,8 +1318,12 @@ "name": "selectAll", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -1491,19 +1331,16 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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`." + "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": { @@ -1512,66 +1349,259 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ArrayPickerProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ArrayPickerProps", - "nameFull": "ArrayPickerProps" - }, - "src": "uui-core/src/types/pickers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "{ selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", - "print": [ - "type ArrayPickerProps = ({", - " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", - " selectionMode: 'multi';", - " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", - " valueType?: 'id';", - " /** Defines what to use as an empty value. If other value provided, it will be assumed as selection */", - " emptyValue?: [", - " ] | null;", - "} & IEditable) | ({", - " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", - " selectionMode: 'multi';", - " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", - " valueType: 'entity';", - " /** Defines what to use as an empty value. If other value provided, it will be assumed as selection */", - " emptyValue?: [", - " ] | null;", - "} & IEditable);" - ] - }, - "props": [ + }, { - "uid": "selectionMode", - "name": "selectionMode", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "'multi'" + "raw": "(item: TItem) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - "multi" - ] + "type": "func" }, - "required": true + "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": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "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": "getSearchFields", + "name": "getSearchFields", + "comment": { + "raw": [ + "A pure function that gets search value for each item.", + " @default (item) => item.name." + ] + }, + "typeValue": { + "raw": "(item: TItem) => string[]" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:SearchConfig", + "required": false + }, + { + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", + "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 + } + }, + "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": "(filter: TFilter) => (item: TItem) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FilterConfig", + "required": false + }, + { + "uid": "items", + "name": "items", + "comment": { + "raw": [ + "Data, which should be represented by a DataSource." + ] + }, + "typeValue": { + "raw": "TItem[]" + }, + "from": "@epam/uui-core:ArrayDataSourceConfig", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ArrayPickerProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ArrayPickerProps", + "nameFull": "ArrayPickerProps" + }, + "src": "uui-core/src/types/pickers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "{ selectionMode: 'multi'; valueType?: 'id' | undefined; emptyValue?: [] | null | undefined; } & IEditable | { selectionMode: 'multi'; valueType: 'entity'; emptyValue?: [] | null | undefined; } & IEditable", + "print": [ + "type ArrayPickerProps = ({", + " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", + " selectionMode: 'multi';", + " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", + " valueType?: 'id';", + " /** Defines what to use as an empty value. If other value provided, it will be assumed as selection */", + " emptyValue?: [", + " ] | null;", + "} & IEditable) | ({", + " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", + " selectionMode: 'multi';", + " /** Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem) */", + " valueType: 'entity';", + " /** Defines what to use as an empty value. If other value provided, it will be assumed as selection */", + " emptyValue?: [", + " ] | null;", + "} & IEditable);" + ] + }, + "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": "'multi'" + }, + "editor": { + "type": "oneOf", + "options": [ + "multi" + ] + }, + "required": true }, { "uid": "valueType", @@ -1778,112 +1808,6 @@ ] }, "props": [ - { - "uid": "api", - "name": "api", - "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" - ] - }, - "typeValue": { - "raw": "() => Promise" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:AsyncListViewProps", - "required": true - }, - { - "uid": "getSearchFields", - "name": "getSearchFields", - "comment": { - "raw": [ - "A pure function that gets search value for each item.", - " Default: (item) => item.name." - ] - }, - "typeValue": { - "raw": "(item: TItem) => string[]" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "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:BaseArrayListViewProps", - "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": "(filter: TFilter) => (item: TItem) => boolean" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "required": false - }, - { - "uid": "sortSearchByRelevance", - "name": "sortSearchByRelevance", - "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 - } - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:BaseArrayListViewProps", - "required": false - }, { "uid": "getId", "name": "getId", @@ -1891,7 +1815,8 @@ "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 An item to get ID of" + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { @@ -1900,7 +1825,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1918,7 +1843,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1933,7 +1858,10 @@ " - 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)" + " 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": { @@ -1942,7 +1870,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1961,7 +1889,7 @@ "typeValue": { "raw": "DataRowOptions" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1974,16 +1902,17 @@ " 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 An item to get options for" + " @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) => DataRowOptions" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -1992,7 +1921,9 @@ "comment": { "raw": [ "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + " 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": { @@ -2001,7 +1932,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2031,7 +1962,7 @@ "explicit" ] }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2039,8 +1970,12 @@ "name": "selectAll", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -2048,19 +1983,16 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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`." + "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": { @@ -2069,74 +2001,100 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:AsyncListViewProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "AsyncListViewProps", - "nameFull": "AsyncListViewProps" - }, - "src": "uui-core/src/data/processing/views/AsyncListView.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "AsyncListViewProps", - "print": [ - "interface AsyncListViewProps extends BaseArrayListViewProps {", - " /** 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", - " * */", - " api(): Promise;", - "}" - ] - }, - "props": [ + }, { - "uid": "api", - "name": "api", + "uid": "isDeleted", + "name": "isDeleted", "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" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "() => Promise" + "raw": "(item: TItem) => boolean" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "A pure function that gets search value for each item.", - " Default: (item) => item.name." + "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) => string[]" + "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:BaseArrayListViewProps", + "from": "@epam/uui-core:PatchOptions", + "required": false + }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "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 }, { @@ -2153,25 +2111,25 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "getFilter", - "name": "getFilter", + "uid": "getSearchFields", + "name": "getSearchFields", "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." + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "(filter: TFilter) => (item: TItem) => boolean" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "from": "@epam/uui-core:SearchConfig", "required": false }, { @@ -2204,9 +2162,71 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseArrayListViewProps", + "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": "(filter: TFilter) => (item: TItem) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FilterConfig", "required": false }, + { + "uid": "api", + "name": "api", + "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" + ] + }, + "typeValue": { + "raw": "() => Promise" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:AsyncDataSourceConfig", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:AsyncListViewProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "AsyncListViewProps", + "nameFull": "AsyncListViewProps" + }, + "src": "uui-core/src/data/processing/views/types.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "AsyncListViewProps", + "print": [ + "interface AsyncListViewProps extends BaseArrayListViewProps, AsyncDataSourceConfig {", + "}" + ] + }, + "props": [ { "uid": "getId", "name": "getId", @@ -2214,7 +2234,8 @@ "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 An item to get ID of" + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { @@ -2223,7 +2244,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2241,7 +2262,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2256,7 +2277,10 @@ " - 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)" + " 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": { @@ -2265,7 +2289,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2284,7 +2308,7 @@ "typeValue": { "raw": "DataRowOptions" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2297,16 +2321,17 @@ " 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 An item to get options for" + " @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) => DataRowOptions" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2315,7 +2340,9 @@ "comment": { "raw": [ "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + " 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": { @@ -2324,7 +2351,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2354,7 +2381,7 @@ "explicit" ] }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2362,8 +2389,12 @@ "name": "selectAll", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -2371,19 +2402,16 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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`." + "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": { @@ -2392,75 +2420,100 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:BaseArrayListViewProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "BaseArrayListViewProps", - "nameFull": "BaseArrayListViewProps" - }, - "src": "uui-core/src/data/processing/views/ArrayListView.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "BaseArrayListViewProps", - "print": [ - "interface BaseArrayListViewProps extends BaseListViewProps {", - " /** A pure function that gets search value for each item.", - " Default: (item) => item.name.", - " */", - " getSearchFields?(item: TItem): string[];", - " /** A pure function that gets sorting value for current sorting value */", - " sortBy?(item: TItem, sorting: SortingOption): any;", - " /** A pure function that returns filter callback to be applied for each item.", - " * The callback should return true, if item passed the filter.", - " * */", - " getFilter?(filter: TFilter): (item: TItem) => boolean;", - " /**", - " * 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": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "A pure function that gets search value for each item.", - " Default: (item) => item.name." + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "(item: TItem) => string[]" + "raw": "(item: TItem) => boolean" + }, + "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": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "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 }, { @@ -2477,23 +2530,25 @@ "editor": { "type": "func" }, + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "getFilter", - "name": "getFilter", + "uid": "getSearchFields", + "name": "getSearchFields", "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." + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "(filter: TFilter) => (item: TItem) => boolean" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:SearchConfig", "required": false }, { @@ -2526,8 +2581,71 @@ "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": "(filter: TFilter) => (item: TItem) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FilterConfig", "required": false }, + { + "uid": "api", + "name": "api", + "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" + ] + }, + "typeValue": { + "raw": "() => Promise" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:AsyncDataSourceConfig", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:BaseArrayListViewProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "BaseArrayListViewProps", + "nameFull": "BaseArrayListViewProps" + }, + "src": "uui-core/src/data/processing/views/types.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "BaseArrayListViewProps", + "print": [ + "interface BaseArrayListViewProps extends BaseListViewProps, SortConfig, SearchConfig, FilterConfig {", + "}" + ] + }, + "props": [ { "uid": "getId", "name": "getId", @@ -2535,7 +2653,8 @@ "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 An item to get ID of" + " @param item - record, which id should be returned.", + " @returns item id." ] }, "typeValue": { @@ -2544,7 +2663,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2562,7 +2681,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2577,7 +2696,10 @@ " - 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)" + " 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": { @@ -2586,7 +2708,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2605,7 +2727,7 @@ "typeValue": { "raw": "DataRowOptions" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2618,16 +2740,17 @@ " 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 An item to get options for" + " @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) => DataRowOptions" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2636,7 +2759,9 @@ "comment": { "raw": [ "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + " 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": { @@ -2645,7 +2770,7 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2675,7 +2800,7 @@ "explicit" ] }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { @@ -2683,8 +2808,12 @@ "name": "selectAll", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -2692,19 +2821,16 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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`." + "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": { @@ -2713,143 +2839,91 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:BaseDatePickerProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "BaseDatePickerProps", - "nameFull": "BaseDatePickerProps" - }, - "src": "uui-core/src/types/components/datePicker/BaseDatePicker.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "BaseDatePickerProps", - "print": [ - "interface BaseDatePickerProps extends IEditable, ICanFocus, IDisableable, IHasPlaceholder, ICanBeReadonly, IAnalyticableOnChange, IHasForwardedRef {", - " /** Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format) */", - " format?: string;", - " /** Filter selectable days. Days, for which this callback returns false - will be disabled */", - " filter?(day: Dayjs): boolean;", - " /** Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons */", - " renderTarget?(props: IDropdownToggler): ReactNode;", - " /** Defines where to place calendar icon */", - " iconPosition?: 'left' | 'right';", - " /**", - " * Disable clearing date value (e.g. via cross icon)", - " * @default false", - " */", - " disableClear?: boolean;", - " /** Overrides rendering of the single day. For example, to highlight certain days */", - " renderDay?: (day: Dayjs, onDayClick: (day: Dayjs) => void) => ReactElement;", - " /** If this function returns true, the day will be highlighted as holiday */", - " isHoliday?: (day: Dayjs) => boolean;", - " /** Called when component lose focus */", - " onBlur?: (e?: React.FocusEvent) => void;", - " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", - " placement?: Placement;", - " /** Any HTML attributes (native or 'data-') to put on date picker parts */", - " rawProps?: {", - " /** Any HTML attributes (native or 'data-') to put on date picker input */", - " input?: IHasRawProps>['rawProps'];", - " /** Any HTML attributes (native or 'data-') to put on date picker body */", - " body?: IHasRawProps>['rawProps'];", - " };", - " /** CSS class(es) to put on datepicker input */", - " inputCx?: CX;", - " /** CSS class(es) to put on datepicker body */", - " bodyCx?: CX;", - "}" - ] - }, - "props": [ + }, { - "uid": "format", - "name": "format", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + "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:PatchOptions", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Filter selectable days. Days, for which this callback returns false - will be disabled" + "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": "(day: Dayjs) => boolean" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "renderTarget", - "name": "renderTarget", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons" + "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": "(props: IDropdownToggler) => React.ReactNode" + "raw": "(item: TItem) => string" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Defines where to place calendar icon" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "'left' | 'right'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] + "raw": "IMap | IImmutableMap" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "disableClear", - "name": "disableClear", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "Disable clearing date value (e.g. via cross icon)", - " @default false" + "If enabled, items position is fixed between sorting.", + " @default true" ], "tags": { - "@default": false + "@default": true } }, "typeValue": { @@ -2858,412 +2932,368 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "renderDay", - "name": "renderDay", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Overrides rendering of the single day. For example, to highlight certain days" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "isHoliday", - "name": "isHoliday", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "If this function returns true, the day will be highlighted as holiday" + "A pure function that gets search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:SearchConfig", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", "comment": { "raw": [ - "Called when component lose focus" - ] + "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": "(e?: React.FocusEvent | undefined) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:SearchConfig", "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "getFilter", + "name": "getFilter", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "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": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "(filter: TFilter) => (item: TItem) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "func" }, + "from": "@epam/uui-core:FilterConfig", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:BaseDataSourceConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "BaseDataSourceConfig", + "nameFull": "BaseDataSourceConfig" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "BaseDataSourceConfig", + "print": [ + "interface BaseDataSourceConfig extends PatchOptions {", + " /**", + " * 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.", + " */", + " getId?(item: TItem): TId;", + " /**", + " * 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.", + " */", + " complexIds?: boolean;", + " /** 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.", + " */", + " getParentId?(item: TItem): TId | undefined;", + " /**", + " * 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", + " */", + " rowOptions?: DataRowOptions;", + " /**", + " * 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.", + " */", + " getRowOptions?(item: TItem, index?: number): DataRowOptions;", + " /**", + " * 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.", + " */", + " isFoldedByDefault?(item: TItem, state: DataSourceState): boolean;", + " /**", + " * 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.", + " */", + " cascadeSelection?: CascadeSelection;", + " /**", + " * Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " * @default true", + " */", + " selectAll?: true | false;", + " /**", + " * 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`.", + " */", + " showSelectedOnly?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "rawProps", - "name": "rawProps", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on date picker parts" + "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": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" + "raw": "(item: TItem) => TId" + }, + "editor": { + "type": "func" }, "required": false }, { - "uid": "inputCx", - "name": "inputCx", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "CSS class(es) to put on datepicker input" + "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 | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "typeValueRef": "@epam/uui-core:ClassValue", "required": false }, { - "uid": "bodyCx", - "name": "bodyCx", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "CSS class(es) to put on datepicker body" + "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": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(item: TItem) => TId | undefined" + }, + "editor": { + "type": "func" }, - "typeValueRef": "@epam/uui-core:ClassValue", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "True if component contains invalid input" + "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": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:ICanBeInvalid", "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": "boolean" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "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:ICanBeReadonly", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "cascadeSelection", + "name": "cascadeSelection", "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": "null | string" - }, - "editor": { - "type": "string" - }, - "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: string | null) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onFocus", - "name": "onFocus", - "comment": { - "raw": [ - "Called when component gets input focus" + "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": "(e: React.FocusEvent) => void" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "func" - }, - "from": "@epam/uui-core:ICanFocus", - "required": false - }, - { - "uid": "placeholder", - "name": "placeholder", - "comment": { - "raw": [ - "Placeholder to display when empty" - ] - }, - "typeValue": { - "raw": "any" - }, - "from": "@epam/uui-core:IHasPlaceholder", - "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)." + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" ] }, - "typeValue": { - "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", - "comment": { - "raw": [ - "this ref is passed to the underlying component" - ] - }, - "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" - }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:BaseListViewProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "BaseListViewProps", - "nameFull": "BaseListViewProps" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "BaseListViewProps", - "print": [ - "// eslint-disable-next-line @typescript-eslint/no-unused-vars", - "interface BaseListViewProps {", - " /**", - " * Should return unique ID of the TItem", - " * If omitted, we assume that every TItem has and unique id in its 'id' field.", - " * @param item An item to get ID of", - " */", - " getId?(item: TItem): TId;", - " /**", - " * 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.", - " */", - " complexIds?: boolean;", - " /** 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)", - " */", - " getParentId?(item: TItem): TId | undefined;", - " /**", - " * 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", - " */", - " rowOptions?: DataRowOptions;", - " /**", - " * 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 An item to get options for", - " */", - " getRowOptions?(item: TItem, index: number): DataRowOptions;", - " /**", - " * Can be specified to unfold all or some items at start.", - " * If not specified, all rows would be folded.", - " */", - " isFoldedByDefault?(item: TItem, state: DataSourceState): boolean;", - " /**", - " * 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.", - " */", - " cascadeSelection?: CascadeSelection;", - " /**", - " * Enables or disables \"select all\" checkbox. Default is true.", - " */", - " selectAll?: true | false;", - " /**", - " * 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`.", - " */", - " backgroundReload?: boolean;", - "}" - ] - }, - "props": [ - { - "uid": "getId", - "name": "getId", + "uid": "selectAll", + "name": "selectAll", "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 An item to get ID of" - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "(item: TItem) => TId" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "required": false }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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." + "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": { @@ -3275,120 +3305,88 @@ "required": false }, { - "uid": "getParentId", - "name": "getParentId", + "uid": "isDeleted", + "name": "isDeleted", "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)" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" + "raw": "(item: TItem) => boolean" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "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": "DataRowOptions" - }, - "required": false - }, - { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "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 An item to get options for" + "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, index: number) => DataRowOptions" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + "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, state: DataSourceState) => boolean" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "patch", + "name": "patch", "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." + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" - }, - "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "raw": "IMap | IImmutableMap" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -3396,91 +3394,75 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "sortBy", + "name": "sortBy", "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`." + "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:SortConfig", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:BaseRangeDatePickerProps": { + "@epam/uui-core:BaseDatePickerProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "BaseRangeDatePickerProps", - "nameFull": "BaseRangeDatePickerProps" + "name": "BaseDatePickerProps", + "nameFull": "BaseDatePickerProps" }, - "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", + "src": "uui-core/src/types/components/datePicker/BaseDatePicker.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "BaseRangeDatePickerProps", + "raw": "BaseDatePickerProps", "print": [ - "interface BaseRangeDatePickerProps extends IEditable, IDisableable, ICanBeReadonly, IAnalyticableOnChange, IHasForwardedRef {", + "interface BaseDatePickerProps extends IEditable, ICanFocus, IDisableable, IHasPlaceholder, ICanBeReadonly, IAnalyticableOnChange, IHasForwardedRef {", " /** Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format) */", " format?: string;", " /** Filter selectable days. Days, for which this callback returns false - will be disabled */", " filter?(day: Dayjs): boolean;", - " /** Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach RangeDatePicker to other components, e.g. Buttons */", + " /** Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons */", " renderTarget?(props: IDropdownToggler): ReactNode;", - " /** Allows to add a custom footer to the Picker's dropdown body */", - " renderFooter?(value: RangeDatePickerValue): ReactNode;", - " /** Overrides rendering of the single day. For example, to highlight certain days */", - " renderDay?: (day: Dayjs, onDayClick: (day: Dayjs) => void) => ReactElement;", - " /**", - " * Range presets (like 'this week', 'this month', etc.) to display at the right of the Picker's body.", - " * UUI provides defaults in the 'rangeDatePickerPresets' exported variable - you can use it as is, or build on top of it (e.g. add your presets)", - " */", - " presets?: RangeDatePickerPresets;", + " /** Defines where to place calendar icon */", + " iconPosition?: 'left' | 'right';", " /**", - " * Disables clearing component (with the cross icon)", + " * Disable clearing date value (e.g. via cross icon)", " * @default false", " */", " disableClear?: boolean;", - " /**", - " * Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)", - " * @default 'bottom-start'", - " */", - " placement?: Placement;", + " /** Overrides rendering of the single day. For example, to highlight certain days */", + " renderDay?: (day: Dayjs, onDayClick: (day: Dayjs) => void) => ReactElement;", " /** If this function returns true, the day will be highlighted as holiday */", " isHoliday?: (day: Dayjs) => boolean;", - " /** Called when component gets input focus */", - " onFocus?: (e: React.FocusEvent, inputType: 'from' | 'to') => void;", - " /** Called when component looses input focus */", - " onBlur?: (e: React.FocusEvent, inputType: 'from' | 'to') => void;", - " /** Called when component is opened/closed */", - " onOpenChange?: (isOpen: boolean) => void;", - " /** rawProps as HTML attributes */", + " /** Called when component lose focus */", + " onBlur?: (e?: React.FocusEvent) => void;", + " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", + " placement?: Placement;", + " /** Any HTML attributes (native or 'data-') to put on date picker parts */", " rawProps?: {", - " /** Any HTML attributes (native or 'data-') to put on 'from' input */", - " from?: IHasRawProps>['rawProps'];", - " /** Any HTML attributes (native or 'data-') to put on 'to' input */", - " to?: IHasRawProps>['rawProps'];", + " /** Any HTML attributes (native or 'data-') to put on date picker input */", + " input?: IHasRawProps>['rawProps'];", " /** Any HTML attributes (native or 'data-') to put on date picker body */", " body?: IHasRawProps>['rawProps'];", " };", - " /** CSS class(es) to put on rangeDatePicker input */", + " /** CSS class(es) to put on datepicker input */", " inputCx?: CX;", " /** CSS class(es) to put on datepicker body */", " bodyCx?: CX;", @@ -3525,7 +3507,7 @@ "name": "renderTarget", "comment": { "raw": [ - "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach RangeDatePicker to other components, e.g. Buttons" + "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons" ] }, "typeValue": { @@ -3537,49 +3519,23 @@ "required": false }, { - "uid": "renderFooter", - "name": "renderFooter", - "comment": { - "raw": [ - "Allows to add a custom footer to the Picker's dropdown body" - ] - }, - "typeValue": { - "raw": "(value: RangeDatePickerValue) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "renderDay", - "name": "renderDay", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Overrides rendering of the single day. For example, to highlight certain days" + "Defines where to place calendar icon" ] }, "typeValue": { - "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" + "raw": "'left' | 'right'" }, "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "presets", - "name": "presets", - "comment": { - "raw": [ - "Range presets (like 'this week', 'this month', etc.) to display at the right of the Picker's body.", - " UUI provides defaults in the 'rangeDatePickerPresets' exported variable - you can use it as is, or build on top of it (e.g. add your presets)" + "type": "oneOf", + "options": [ + "left", + "right" ] }, - "typeValue": { - "raw": "RangeDatePickerPresets" - }, "required": false }, { @@ -3587,7 +3543,7 @@ "name": "disableClear", "comment": { "raw": [ - "Disables clearing component (with the cross icon)", + "Disable clearing date value (e.g. via cross icon)", " @default false" ], "tags": { @@ -3603,39 +3559,18 @@ "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "renderDay", + "name": "renderDay", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)", - " @default 'bottom-start'" - ], - "tags": { - "@default": "bottom-start" - } + "Overrides rendering of the single day. For example, to highlight certain days" + ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "component" }, "required": false }, @@ -3655,32 +3590,16 @@ }, "required": false }, - { - "uid": "onFocus", - "name": "onFocus", - "comment": { - "raw": [ - "Called when component gets input focus" - ] - }, - "typeValue": { - "raw": "(e: React.FocusEvent, inputType: 'from' | 'to') => void" - }, - "editor": { - "type": "func" - }, - "required": false - }, { "uid": "onBlur", "name": "onBlur", "comment": { "raw": [ - "Called when component looses input focus" + "Called when component lose focus" ] }, "typeValue": { - "raw": "(e: React.FocusEvent, inputType: 'from' | 'to') => void" + "raw": "(e?: React.FocusEvent | undefined) => void" }, "editor": { "type": "func" @@ -3688,18 +3607,35 @@ "required": false }, { - "uid": "onOpenChange", - "name": "onOpenChange", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "Called when component is opened/closed" + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "(isOpen: boolean) => void" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, "required": false }, @@ -3708,11 +3644,11 @@ "name": "rawProps", "comment": { "raw": [ - "rawProps as HTML attributes" + "Any HTML attributes (native or 'data-') to put on date picker parts" ] }, "typeValue": { - "raw": "{ from?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; to?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" + "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, "required": false }, @@ -3721,7 +3657,7 @@ "name": "inputCx", "comment": { "raw": [ - "CSS class(es) to put on rangeDatePicker input" + "CSS class(es) to put on datepicker input" ] }, "typeValue": { @@ -3821,7 +3757,10 @@ ] }, "typeValue": { - "raw": "RangeDatePickerValue" + "raw": "null | string" + }, + "editor": { + "type": "string" }, "from": "@epam/uui-core:IControlled", "required": true @@ -3835,7 +3774,7 @@ ] }, "typeValue": { - "raw": "(newValue: RangeDatePickerValue) => void" + "raw": "(newValue: string | null) => void" }, "editor": { "type": "func" @@ -3844,166 +3783,119 @@ "required": true }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "onFocus", + "name": "onFocus", "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)." + "Called when component gets input focus" ] }, "typeValue": { - "raw": "(newValue: RangeDatePickerValue | null, oldValue: RangeDatePickerValue | null) => AnalyticsEvent" + "raw": "(e: React.FocusEvent) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + "raw": "any" }, - "from": "@epam/uui-core:IHasForwardedRef", + "from": "@epam/uui-core:IHasPlaceholder", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:BatchPromiseOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "BatchPromiseOptions", - "nameFull": "BatchPromiseOptions" - }, - "src": "uui-core/src/helpers/batch.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "BatchPromiseOptions", - "print": [ - "interface BatchPromiseOptions {", - " /** Minimum time (in ms) to pass after the last call, before triggering the batch */", - " throttleMs?: number;", - "}" - ] - }, - "props": [ + }, { - "uid": "throttleMs", - "name": "throttleMs", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Minimum time (in ms) to pass after the last call, before triggering the batch" + "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": "number" + "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" }, "editor": { - "type": "number" + "type": "func" + }, + "from": "@epam/uui-core:IAnalyticableOnChange", + "required": false + }, + { + "uid": "forwardedRef", + "name": "forwardedRef", + "comment": { + "raw": [ + "this ref is passed to the underlying component" + ] + }, + "typeValue": { + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" }, + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:BlockTypes": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "BlockTypes", - "nameFull": "BlockTypes" - }, - "src": "uui-core/src/services/ApiContext.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'attachment' | 'iframe' | 'image'", - "print": [ - "type BlockTypes = 'attachment' | 'iframe' | 'image';" - ] - } - } - }, - "@epam/uui-core:CascadeSelection": { + "@epam/uui-core:BaseListViewProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "CascadeSelection", - "nameFull": "CascadeSelection" + "name": "BaseListViewProps", + "nameFull": "BaseListViewProps" }, "src": "uui-core/src/types/dataSources.ts", "exported": true }, - "details": { - "kind": 265, - "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'", - "print": [ - "type CascadeSelection = boolean | typeof CascadeSelectionTypes.EXPLICIT | typeof CascadeSelectionTypes.IMPLICIT;" - ] - } - } - }, - "@epam/uui-core:CheckboxCoreProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "CheckboxCoreProps", - "nameFull": "CheckboxCoreProps" - }, - "src": "uui-core/src/types/components/Checkbox.ts", - "exported": true - }, "details": { "kind": 264, "typeValue": { - "raw": "CheckboxCoreProps", + "raw": "BaseListViewProps", "print": [ - "interface CheckboxCoreProps extends ICheckable, ICanFocus, IHasCX, ICanBeInvalid, IHasLabel, ICanBeReadonly, IAnalyticableOnChange, IHasRawProps>, IHasForwardedRef {", + "interface BaseListViewProps extends BaseDataSourceConfig {", "}" ] }, "props": [ { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "True if component contains invalid input" + "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:ICanBeInvalid", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "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": { @@ -4012,1376 +3904,1503 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "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": "boolean" + "raw": "(item: TItem) => TId | undefined" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "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": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "value", - "name": "value", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "The current value of 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": "boolean" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "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": "(newValue: boolean) => void" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "indeterminate", - "name": "indeterminate", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" + "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" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, - "from": "@epam/uui-core:ICheckable", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "Called when component gets input focus" - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Called when component looses input focus" + "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": "(e: React.FocusEvent) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(item: TItem) => boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "label", - "name": "label", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." + "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": "React.ReactNode" + "raw": "(item: TItem) => symbol" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasLabel", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "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)." + "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": "(newValue: boolean | null, oldValue: boolean | null) => AnalyticsEvent" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "React.LabelHTMLAttributes & Record<`data-${string}`, string>" + "raw": "IMap | IImmutableMap" }, - "from": "@epam/uui-core:IHasRawProps", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "this ref is passed to the underlying component" - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "null | (instance: HTMLLabelElement | null) => void | React.MutableRefObject" + "raw": "boolean" }, - "from": "@epam/uui-core:IHasForwardedRef", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:PatchOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ClassValue": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ClassValue", - "nameFull": "ClassValue" - }, - "src": "uui-core/src/helpers/cx.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "undefined | null | string | number | boolean | ClassDictionary | ClassArray", - "print": [ - "/* The ClassValue type is a union type that represents the valid values that can be passed as arguments to the classnames function. It can be one of the following types:", - "- string: A string representing a class name.", - "- number: A number representing a class name. This is useful when using CSS modules.", - "- ClassDictionary: An object whose keys are class names and values are booleans. If the value is true, the corresponding class name will be included in the resulting string, otherwise it will be omitted.", - "- ClassArray: An array of values of type ClassValue. This allows you to pass multiple class names or class dictionaries as arguments to classnames.", - "- undefined: If undefined is passed as an argument, it will be ignored.", - "- null: If null is passed as an argument, it will be ignored.", - "- boolean: If a boolean value is passed as an argument, it will be ignored if it is false and included if it is true. */", - "type ClassValue = string | number | ClassDictionary | ClassArray | undefined | null | boolean;" - ] - } - } - }, - "@epam/uui-core:ColumnsConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ColumnsConfig", - "nameFull": "ColumnsConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "ColumnsConfig", - "print": [ - "type ColumnsConfig = {", - " /** Config for each column */", - " [key: string]: IColumnConfig;", - "};" - ] - }, - "props": [ + }, { - "uid": "[key: string]", - "name": "[key: string]", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Config for each column" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "IColumnConfig" + "raw": "(item: TItem, sorting: SortingOption) => any" }, - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:SortConfig", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:CommonContexts": { + "@epam/uui-core:BaseRangeDatePickerProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "CommonContexts", - "nameFull": "CommonContexts" + "name": "BaseRangeDatePickerProps", + "nameFull": "BaseRangeDatePickerProps" }, - "src": "uui-core/src/types/contexts.ts", + "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "CommonContexts", + "raw": "BaseRangeDatePickerProps", "print": [ - "interface CommonContexts extends UuiContexts {", - " /** Api definitions */", - " api: TApi & ApiExtensions;", - " /** App context, any app global settings. */", - " uuiApp: TAppContext;", - " /** React router history instance */", - " history?: IHistory4;", + "interface BaseRangeDatePickerProps extends IEditable, IDisableable, ICanBeReadonly, IAnalyticableOnChange, IHasForwardedRef {", + " /** Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format) */", + " format?: string;", + " /** Filter selectable days. Days, for which this callback returns false - will be disabled */", + " filter?(day: Dayjs): boolean;", + " /** Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach RangeDatePicker to other components, e.g. Buttons */", + " renderTarget?(props: IDropdownToggler): ReactNode;", + " /** Allows to add a custom footer to the Picker's dropdown body */", + " renderFooter?(value: RangeDatePickerValue): ReactNode;", + " /** Overrides rendering of the single day. For example, to highlight certain days */", + " renderDay?: (day: Dayjs, onDayClick: (day: Dayjs) => void) => ReactElement;", + " /**", + " * Range presets (like 'this week', 'this month', etc.) to display at the right of the Picker's body.", + " * UUI provides defaults in the 'rangeDatePickerPresets' exported variable - you can use it as is, or build on top of it (e.g. add your presets)", + " */", + " presets?: RangeDatePickerPresets;", + " /**", + " * Disables clearing component (with the cross icon)", + " * @default false", + " */", + " disableClear?: boolean;", + " /**", + " * Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)", + " * @default 'bottom-start'", + " */", + " placement?: Placement;", + " /** If this function returns true, the day will be highlighted as holiday */", + " isHoliday?: (day: Dayjs) => boolean;", + " /** Called when component gets input focus */", + " onFocus?: (e: React.FocusEvent, inputType: 'from' | 'to') => void;", + " /** Called when component looses input focus */", + " onBlur?: (e: React.FocusEvent, inputType: 'from' | 'to') => void;", + " /** Called when component is opened/closed */", + " onOpenChange?: (isOpen: boolean) => void;", + " /** rawProps as HTML attributes */", + " rawProps?: {", + " /** Any HTML attributes (native or 'data-') to put on 'from' input */", + " from?: IHasRawProps>['rawProps'];", + " /** Any HTML attributes (native or 'data-') to put on 'to' input */", + " to?: IHasRawProps>['rawProps'];", + " /** Any HTML attributes (native or 'data-') to put on date picker body */", + " body?: IHasRawProps>['rawProps'];", + " };", + " /** CSS class(es) to put on rangeDatePicker input */", + " inputCx?: CX;", + " /** CSS class(es) to put on datepicker body */", + " bodyCx?: CX;", "}" ] }, "props": [ { - "uid": "api", - "name": "api", + "uid": "format", + "name": "format", "comment": { "raw": [ - "Api definitions" + "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" ] }, "typeValue": { - "raw": "TApi & ApiExtensions" + "raw": "string" }, - "required": true + "editor": { + "type": "string" + }, + "required": false }, { - "uid": "uuiApp", - "name": "uuiApp", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "App context, any app global settings." + "Filter selectable days. Days, for which this callback returns false - will be disabled" ] }, "typeValue": { - "raw": "TAppContext" + "raw": "(day: Dayjs) => boolean" }, - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "history", - "name": "history", + "uid": "renderTarget", + "name": "renderTarget", "comment": { "raw": [ - "React router history instance" + "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach RangeDatePicker to other components, e.g. Buttons" ] }, "typeValue": { - "raw": "IHistory4" + "raw": "(props: IDropdownToggler) => React.ReactNode" + }, + "editor": { + "type": "component" }, "required": false }, { - "uid": "uuiApi", - "name": "uuiApi", + "uid": "renderFooter", + "name": "renderFooter", "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" + "Allows to add a custom footer to the Picker's dropdown body" ] }, "typeValue": { - "raw": "IApiContext" + "raw": "(value: RangeDatePickerValue) => React.ReactNode" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "component" + }, + "required": false }, { - "uid": "uuiRouter", - "name": "uuiRouter", + "uid": "renderDay", + "name": "renderDay", "comment": { "raw": [ - "Instance of react-router wrapped by UUI adapter" + "Overrides rendering of the single day. For example, to highlight certain days" ] }, "typeValue": { - "raw": "IRouterContext" + "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "component" + }, + "required": false }, { - "uid": "uuiModals", - "name": "uuiModals", + "uid": "presets", + "name": "presets", "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" + "Range presets (like 'this week', 'this month', etc.) to display at the right of the Picker's body.", + " UUI provides defaults in the 'rangeDatePickerPresets' exported variable - you can use it as is, or build on top of it (e.g. add your presets)" ] }, "typeValue": { - "raw": "IModalContext" + "raw": "RangeDatePickerPresets" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "required": false }, { - "uid": "uuiDnD", - "name": "uuiDnD", + "uid": "disableClear", + "name": "disableClear", "comment": { "raw": [ - "Drag and Drop service for dnd operations.", - " See more here - https://uui.epam.com/documents?id=dragAndDrop" - ] + "Disables clearing component (with the cross icon)", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "IDndContext" + "raw": "boolean" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "bool" + }, + "required": false }, { - "uid": "uuiUserSettings", - "name": "uuiUserSettings", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "UserSettings service allows you to store user data in localStorage." - ] + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)", + " @default 'bottom-start'" + ], + "tags": { + "@default": "bottom-start" + } }, "typeValue": { - "raw": "IUserSettingsContext" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] + }, + "required": false }, { - "uid": "uuiAnalytics", - "name": "uuiAnalytics", + "uid": "isHoliday", + "name": "isHoliday", "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" + "If this function returns true, the day will be highlighted as holiday" ] }, "typeValue": { - "raw": "IAnalyticsContext" + "raw": "(day: Dayjs) => boolean" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "uuiErrors", - "name": "uuiErrors", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Error service allows you to report errors.", - " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "IErrorContext" + "raw": "(e: React.FocusEvent, inputType: 'from' | 'to') => void" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "uuiNotifications", - "name": "uuiNotifications", + "uid": "onBlur", + "name": "onBlur", "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" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "INotificationContext" + "raw": "(e: React.FocusEvent, inputType: 'from' | 'to') => void" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "uuiLayout", - "name": "uuiLayout", + "uid": "onOpenChange", + "name": "onOpenChange", "comment": { "raw": [ - "Layout service. Used to manage layout for overlays like modals, dropdowns, etc." + "Called when component is opened/closed" ] }, "typeValue": { - "raw": "ILayoutContext" + "raw": "(isOpen: boolean) => void" }, - "from": "@epam/uui-core:UuiContexts", - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "uuiLocks", - "name": "uuiLocks", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Lock service.", - " See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts" + "rawProps as HTML attributes" ] }, "typeValue": { - "raw": "ILockContext" + "raw": "{ from?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; to?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, - "from": "@epam/uui-core:UuiContexts", - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ContextProviderProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ContextProviderProps", - "nameFull": "ContextProviderProps" - }, - "src": "uui-core/src/services/ContextProvider.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ContextProviderProps", - "print": [ - "interface ContextProviderProps extends UuiServicesProps, IHasChildren {", - " /** Callback to load the AppContext data. AppContext is used to load global data, before application mount */", - " loadAppContext?: (api: TApi) => Promise;", - " /** Called when all contexts were initiated */", - " onInitCompleted(svc: CommonContexts): void;", - " /** Instance of react-router history.", - " * Note, that it should be the same object which you passed to the Router.", - " * */", - " history?: IHistory4;", - " /** Code of Google Analytics.", - " * If provided, user interactions events will be sent to your GA.", - " * */", - " gaCode?: string;", - "}" - ] - }, - "props": [ + "required": false + }, { - "uid": "loadAppContext", - "name": "loadAppContext", + "uid": "inputCx", + "name": "inputCx", "comment": { "raw": [ - "Callback to load the AppContext data. AppContext is used to load global data, before application mount" + "CSS class(es) to put on rangeDatePicker input" ] }, "typeValue": { - "raw": "(api: TApi) => Promise" - }, - "editor": { - "type": "func" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", "required": false }, { - "uid": "onInitCompleted", - "name": "onInitCompleted", + "uid": "bodyCx", + "name": "bodyCx", "comment": { "raw": [ - "Called when all contexts were initiated" + "CSS class(es) to put on datepicker body" ] }, "typeValue": { - "raw": "(svc: CommonContexts) => void" - }, - "editor": { - "type": "func" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "required": true + "typeValueRef": "@epam/uui-core:ClassValue", + "required": false }, { - "uid": "history", - "name": "history", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Instance of react-router history.", - " Note, that it should be the same object which you passed to the Router." + "True if component contains invalid input" ] }, "typeValue": { - "raw": "IHistory4" + "raw": "boolean" }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "gaCode", - "name": "gaCode", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Code of Google Analytics.", - " If provided, user interactions events will be sent to your GA." + "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": "apiDefinition", - "name": "apiDefinition", + "uid": "isReadonly", + "name": "isReadonly", "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)'" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "(processRequest: IProcessRequest) => TApi" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:UuiServicesProps", + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "apiReloginPath", - "name": "apiReloginPath", + "uid": "isRequired", + "name": "isRequired", "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" - } + "Marks that component's value is required and shouldn't be empty" + ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "apiPingPath", - "name": "apiPingPath", + "uid": "value", + "name": "value", "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" - } + "The current value of component" + ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "RangeDatePickerValue" }, - "from": "@epam/uui-core:ApiContextProps", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "apiServerUrl", - "name": "apiServerUrl", + "uid": "onValueChange", + "name": "onValueChange", "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": "" - } + "Called when value needs to be changed (usually due to user interaction)" + ] }, "typeValue": { - "raw": "string" + "raw": "(newValue: RangeDatePickerValue) => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "fetch", - "name": "fetch", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", - " By default, standard fetch will be used." + "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": "typeof fetch" + "raw": "(newValue: RangeDatePickerValue | null, oldValue: RangeDatePickerValue | null) => AnalyticsEvent" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "children", - "name": "children", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Component children" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:CX": { + "@epam/uui-core:BatchPromiseOptions": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "CX", - "nameFull": "CX" + "name": "BatchPromiseOptions", + "nameFull": "BatchPromiseOptions" }, - "src": "uui-core/src/types/objects.ts", + "src": "uui-core/src/helpers/batch.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "BatchPromiseOptions", + "print": [ + "interface BatchPromiseOptions {", + " /** Minimum time (in ms) to pass after the last call, before triggering the batch */", + " throttleMs?: number;", + "}" + ] + }, + "props": [ + { + "uid": "throttleMs", + "name": "throttleMs", + "comment": { + "raw": [ + "Minimum time (in ms) to pass after the last call, before triggering the batch" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:BlockTypes": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "BlockTypes", + "nameFull": "BlockTypes" + }, + "src": "uui-core/src/services/ApiContext.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "undefined | null | string | number | boolean | ClassDictionary | ClassArray", + "raw": "'attachment' | 'iframe' | 'image'", "print": [ - "// CX type is a union type that represents the valid values to pass CSS classes", - "type CX = ClassValue;" + "type BlockTypes = 'attachment' | 'iframe' | 'image';" ] } } }, - "@epam/uui-core:DataColumnProps": { + "@epam/uui-core:CascadeSelection": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataColumnProps", - "nameFull": "DataColumnProps" + "name": "CascadeSelection", + "nameFull": "CascadeSelection" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "boolean | 'implicit' | 'explicit'", + "print": [ + "type CascadeSelection = boolean | typeof CascadeSelectionTypes.EXPLICIT | typeof CascadeSelectionTypes.IMPLICIT;" + ] + } + } + }, + "@epam/uui-core:CascadeSelectionService": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "CascadeSelectionService", + "nameFull": "CascadeSelectionService" + }, + "src": "uui-core/src/data/processing/views/dataRows/services/useCascadeSelectionService.ts", + "comment": { + "raw": [ + "A service which provides cascade selection functionality with loading missing records." + ] }, - "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataColumnProps", + "raw": "CascadeSelectionService", "print": [ - "interface DataColumnProps extends ICanBeFixed, IHasCX, IClickable, IHasRawProps, Attributes {", - " /**", - " * 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.", - " */", - " key: string;", - " /** Column caption. Can be a plain text, or any React Component */", - " caption?: React.ReactNode;", - " /**", - " * 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", - " */", - " width: number;", - " /** Minimal width to which column can be resized manually */", - " minWidth?: number;", - " /** The flex grow for the column. Allows column to grow in width if there's spare horizontal space */", - " grow?: number;", - " /** Aligns cell and header content horizontally */", - " textAlign?: 'left' | 'center' | 'right';", - " /** Aligns only cell content horizontally */", - " justifyContent?: CSS.JustifyContentProperty;", - " /** Align cell content vertically */", - " alignSelf?: CSS.AlignSelfProperty;", - " /**", - " * Enables sorting arrows on the column.", - " * Sorting state is kept in DataSourceState.sorting", - " */", - " isSortable?: boolean;", - " /** Disallows to hide column via ColumnsConfiguration */", - " isAlwaysVisible?: boolean;", - " /** Makes column hidden by default. User can turn it on later, via ColumnsConfiguration */", - " isHiddenByDefault?: boolean;", - " /** Info tooltip displayed in the table header */", - " info?: React.ReactNode;", - " /**", - " * 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.", - " */", - " isFilterActive?: (filter: TFilter, column: DataColumnProps) => boolean;", - " /** A pure function that defines that column value can be copied to the other column. */", - " canCopy?: (cell: DataTableSelectedCellData) => boolean;", - " /** A pure function that defines that column accepts copying other column value into it */", - " canAcceptCopy?: (from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean;", - " /** Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component. */", - " allowResizing?: boolean;", - " /** Render the cell content. The item props is the value of the whole row (TItem). */", - " render?(item: TItem, props: DataRowProps): any;", - " /** Overrides rendering of the whole cell */", - " renderCell?(cellProps: RenderCellProps): any;", - " /**", - " * 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.", - " */", - " renderDropdown?(): React.ReactNode;", + "/**", + " * A service which provides cascade selection functionality with loading missing records.", + " */", + "interface CascadeSelectionService {", " /**", - " * 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.", - " */", - " renderFilter?(lens: ILens, dropdownProps: IDropdownBodyProps): React.ReactNode;", - " /** 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.", + " * 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.", " */", - " renderTooltip?(column: DataColumnProps): React.ReactNode;", + " handleCascadeSelection: (isChecked: boolean, checkedId?: TId, isRoot?: boolean, checked?: TId[]) => Promise;", "}" ] }, "props": [ { - "uid": "key", - "name": "key", + "uid": "handleCascadeSelection", + "name": "handleCascadeSelection", "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." + "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": "string" + "raw": "(isChecked: boolean, checkedId?: TId | undefined, isRoot?: boolean | undefined, checked?: TId[] | undefined) => Promise" }, "editor": { - "type": "string" + "type": "func" }, "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:CheckboxCoreProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "CheckboxCoreProps", + "nameFull": "CheckboxCoreProps" + }, + "src": "uui-core/src/types/components/Checkbox.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "CheckboxCoreProps", + "print": [ + "interface CheckboxCoreProps extends ICheckable, ICanFocus, IHasCX, ICanBeInvalid, IHasLabel, ICanBeReadonly, IAnalyticableOnChange, IHasRawProps>, IHasForwardedRef {", + "}" + ] + }, + "props": [ { - "uid": "caption", - "name": "caption", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Column caption. Can be a plain text, or any React Component" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "width", - "name": "width", + "uid": "isDisabled", + "name": "isDisabled", "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" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDisableable", + "required": false }, { - "uid": "minWidth", - "name": "minWidth", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Minimal width to which column can be resized manually" + "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": "grow", - "name": "grow", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "The flex grow for the column. Allows column to grow in width if there's spare horizontal space" + "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": "textAlign", - "name": "textAlign", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Aligns cell and header content horizontally" + "The current value of component" ] }, "typeValue": { - "raw": "'left' | 'right' | 'center'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "center" - ] + "type": "bool" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "justifyContent", - "name": "justifyContent", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Aligns only cell content horizontally" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "string" + "raw": "(newValue: boolean) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "alignSelf", - "name": "alignSelf", + "uid": "indeterminate", + "name": "indeterminate", "comment": { "raw": [ - "Align cell content vertically" + "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, + "from": "@epam/uui-core:ICheckable", "required": false }, { - "uid": "isSortable", - "name": "isSortable", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Enables sorting arrows on the column.", - " Sorting state is kept in DataSourceState.sorting" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "isAlwaysVisible", - "name": "isAlwaysVisible", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "Disallows to hide column via ColumnsConfiguration" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "isHiddenByDefault", - "name": "isHiddenByDefault", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Makes column hidden by default. User can turn it on later, via ColumnsConfiguration" + "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": "info", - "name": "info", + "uid": "label", + "name": "label", "comment": { "raw": [ - "Info tooltip displayed in the table header" + "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": "isFilterActive", - "name": "isFilterActive", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "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." + "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": "(filter: TFilter, column: DataColumnProps) => boolean" + "raw": "(newValue: boolean | null, oldValue: boolean | null) => AnalyticsEvent" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "canCopy", - "name": "canCopy", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "A pure function that defines that column value can be copied to the other column." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(cell: DataTableSelectedCellData) => boolean" - }, - "editor": { - "type": "func" + "raw": "React.LabelHTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "canAcceptCopy", - "name": "canAcceptCopy", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "A pure function that defines that column accepts copying other column value into it" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "(from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean" - }, - "editor": { - "type": "func" + "raw": "null | (instance: HTMLLabelElement | null) => void | React.MutableRefObject" }, + "from": "@epam/uui-core:IHasForwardedRef", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ClassValue": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ClassValue", + "nameFull": "ClassValue" + }, + "src": "uui-core/src/helpers/cx.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "undefined | null | string | number | boolean | ClassDictionary | ClassArray", + "print": [ + "/* The ClassValue type is a union type that represents the valid values that can be passed as arguments to the classnames function. It can be one of the following types:", + "- string: A string representing a class name.", + "- number: A number representing a class name. This is useful when using CSS modules.", + "- ClassDictionary: An object whose keys are class names and values are booleans. If the value is true, the corresponding class name will be included in the resulting string, otherwise it will be omitted.", + "- ClassArray: An array of values of type ClassValue. This allows you to pass multiple class names or class dictionaries as arguments to classnames.", + "- undefined: If undefined is passed as an argument, it will be ignored.", + "- null: If null is passed as an argument, it will be ignored.", + "- boolean: If a boolean value is passed as an argument, it will be ignored if it is false and included if it is true. */", + "type ClassValue = string | number | ClassDictionary | ClassArray | undefined | null | boolean;" + ] + } + } + }, + "@epam/uui-core:ColumnsConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ColumnsConfig", + "nameFull": "ColumnsConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ColumnsConfig", + "print": [ + "type ColumnsConfig = {", + " /** Config for each column */", + " [key: string]: IColumnConfig;", + "};" + ] + }, + "props": [ { - "uid": "allowResizing", - "name": "allowResizing", + "uid": "[key: string]", + "name": "[key: string]", "comment": { "raw": [ - "Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component." + "Config for each column" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IColumnConfig" }, - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:CommonContexts": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "CommonContexts", + "nameFull": "CommonContexts" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "CommonContexts", + "print": [ + "interface CommonContexts extends UuiContexts {", + " /** Api definitions */", + " api: TApi & ApiExtensions;", + " /** App context, any app global settings. */", + " uuiApp: TAppContext;", + " /** React router history instance */", + " history?: IHistory4;", + "}" + ] + }, + "props": [ { - "uid": "render", - "name": "render", + "uid": "api", + "name": "api", "comment": { "raw": [ - "Render the cell content. The item props is the value of the whole row (TItem)." + "Api definitions" ] }, "typeValue": { - "raw": "(item: TItem, props: DataRowProps) => any" - }, - "editor": { - "type": "func" + "raw": "TApi & ApiExtensions" }, - "required": false + "required": true }, { - "uid": "renderCell", - "name": "renderCell", + "uid": "uuiApp", + "name": "uuiApp", "comment": { "raw": [ - "Overrides rendering of the whole cell" + "App context, any app global settings." ] }, "typeValue": { - "raw": "(cellProps: RenderCellProps) => any" - }, - "editor": { - "type": "func" + "raw": "TAppContext" }, - "required": false + "required": true }, { - "uid": "renderDropdown", - "name": "renderDropdown", + "uid": "history", + "name": "history", "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." + "React router history instance" ] }, "typeValue": { - "raw": "() => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "IHistory4" }, "required": false }, { - "uid": "renderFilter", - "name": "renderFilter", + "uid": "uuiApi", + "name": "uuiApi", "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." + "Api service allows you to process requests with an error handling.", + " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" ] }, "typeValue": { - "raw": "(lens: ILens, dropdownProps: IDropdownBodyProps) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "IApiContext" }, - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true }, { - "uid": "renderTooltip", - "name": "renderTooltip", + "uid": "uuiRouter", + "name": "uuiRouter", "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." + "Instance of react-router wrapped by UUI adapter" ] }, "typeValue": { - "raw": "(column: DataColumnProps) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "IRouterContext" }, - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true }, { - "uid": "fix", - "name": "fix", + "uid": "uuiModals", + "name": "uuiModals", "comment": { "raw": [ - "If specified, will make column fixed - it would not scroll horizontally" + "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": "'left' | 'right'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] + "raw": "IModalContext" }, - "from": "@epam/uui-core:ICanBeFixed", - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true }, { - "uid": "cx", - "name": "cx", + "uid": "uuiDnD", + "name": "uuiDnD", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Drag and Drop service for dnd operations.", + " See more here - https://uui.epam.com/documents?id=dragAndDrop" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "IDndContext" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true }, { - "uid": "onClick", - "name": "onClick", + "uid": "uuiUserSettings", + "name": "uuiUserSettings", "comment": { "raw": [ - "Called when component is clicked" + "UserSettings service allows you to store user data in localStorage." ] }, "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" + "raw": "IUserSettingsContext" }, - "from": "@epam/uui-core:IClickable", - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "uuiAnalytics", + "name": "uuiAnalytics", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying 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": "HTMLDivElement & Record<`data-${string}`, string>" + "raw": "IAnalyticsContext" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataPickerCellProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataPickerCellProps", - "nameFull": "DataPickerCellProps" - }, - "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "Props for cells in pickers." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataPickerCellProps", - "print": [ - "/** Props for cells in pickers. */", - "interface DataPickerCellProps extends IHasCX {", - " /** Key to use as component's key. */", - " key: string;", - " /** DataRowProps object for the picker row where a cell is placed. */", - " rowProps: DataRowProps;", - " /** Render the cell content. The item props is the value of the whole row (TItem). */", - " renderItem(item: TItem, rowProps: DataRowProps): ReactNode;", - "}" - ] - }, - "props": [ + "from": "@epam/uui-core:UuiContexts", + "required": true + }, { - "uid": "key", - "name": "key", + "uid": "uuiErrors", + "name": "uuiErrors", "comment": { "raw": [ - "Key to use as component's key." + "Error service allows you to report errors.", + " See more here - https://uui.epam.com/documents?id=apiContext&category=contexts" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "IErrorContext" }, + "from": "@epam/uui-core:UuiContexts", "required": true }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "uuiNotifications", + "name": "uuiNotifications", "comment": { "raw": [ - "DataRowProps object for the picker row where a cell is placed." + "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": "DataRowProps" + "raw": "INotificationContext" }, - "typeValueRef": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:UuiContexts", "required": true }, { - "uid": "renderItem", - "name": "renderItem", + "uid": "uuiLayout", + "name": "uuiLayout", "comment": { "raw": [ - "Render the cell content. The item props is the value of the whole row (TItem)." + "Layout service. Used to manage layout for overlays like modals, dropdowns, etc." ] }, "typeValue": { - "raw": "(item: TItem, rowProps: DataRowProps) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "ILayoutContext" }, + "from": "@epam/uui-core:UuiContexts", "required": true }, { - "uid": "cx", - "name": "cx", + "uid": "uuiLocks", + "name": "uuiLocks", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Lock service.", + " See more here - https://uui.epam.com/documents?id=lockContextDoc&category=contexts" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "ILockContext" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "from": "@epam/uui-core:UuiContexts", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:DataQuery": { + "@epam/uui-core:ContextProviderProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataQuery", - "nameFull": "DataQuery" + "name": "ContextProviderProps", + "nameFull": "ContextProviderProps" }, - "src": "uui-core/src/types/dataQuery.ts", + "src": "uui-core/src/services/ContextProvider.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataQuery", + "raw": "ContextProviderProps", "print": [ - "interface DataQuery extends Pick, 'sorting' | 'range' | 'search'> {", - " /** The filter object value with predicates, by which data should be filtered. */", - " filter?: DataQueryFilter;", + "interface ContextProviderProps extends UuiServicesProps, IHasChildren {", + " /** Callback to load the AppContext data. AppContext is used to load global data, before application mount */", + " loadAppContext?: (api: TApi) => Promise;", + " /** Called when all contexts were initiated */", + " onInitCompleted(svc: CommonContexts): void;", + " /** Instance of react-router history.", + " * Note, that it should be the same object which you passed to the Router.", + " * */", + " history?: IHistory4;", + " /** Code of Google Analytics.", + " * If provided, user interactions events will be sent to your GA.", + " * */", + " gaCode?: string;", "}" ] }, "props": [ { - "uid": "filter", - "name": "filter", + "uid": "loadAppContext", + "name": "loadAppContext", "comment": { "raw": [ - "The filter object value with predicates, by which data should be filtered." + "Callback to load the AppContext data. AppContext is used to load global data, before application mount" ] }, "typeValue": { - "raw": "DataQueryFilter" + "raw": "(api: TApi) => Promise" + }, + "editor": { + "type": "func" }, "required": false }, { - "uid": "search", - "name": "search", - "comment": { + "uid": "onInitCompleted", + "name": "onInitCompleted", + "comment": { "raw": [ - "The search string, by which data should be searched." + "Called when all contexts were initiated" + ] + }, + "typeValue": { + "raw": "(svc: CommonContexts) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "history", + "name": "history", + "comment": { + "raw": [ + "Instance of react-router history.", + " Note, that it should be the same object which you passed to the Router." + ] + }, + "typeValue": { + "raw": "IHistory4" + }, + "required": false + }, + { + "uid": "gaCode", + "name": "gaCode", + "comment": { + "raw": [ + "Code of Google Analytics.", + " If provided, user interactions events will be sent to your GA." ] }, "typeValue": { @@ -5390,240 +5409,379 @@ "editor": { "type": "string" }, - "from": "@epam/uui-core:LazyDataSourceApiRequest", "required": false }, { - "uid": "sorting", - "name": "sorting", + "uid": "apiDefinition", + "name": "apiDefinition", "comment": { "raw": [ - "Sorting options, by which data should be sorted." + "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": "SortingOption[]" + "raw": "(processRequest: IProcessRequest) => TApi" }, - "from": "@epam/uui-core:LazyDataSourceApiRequest", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:UuiServicesProps", "required": false }, { - "uid": "range", - "name": "range", + "uid": "apiReloginPath", + "name": "apiReloginPath", "comment": { "raw": [ - "Specifies a range of the rows to be retrieved." + "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" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", + "required": false + }, + { + "uid": "apiPingPath", + "name": "apiPingPath", + "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" + } + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", + "required": false + }, + { + "uid": "apiServerUrl", + "name": "apiServerUrl", + "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": "" + } + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:ApiContextProps", + "required": false + }, + { + "uid": "fetch", + "name": "fetch", + "comment": { + "raw": [ + "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", + " By default, standard fetch will be used." ] }, "typeValue": { - "raw": "LazyDataSourceApiRequestRange" + "raw": "typeof fetch" }, - "from": "@epam/uui-core:LazyDataSourceApiRequest", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ApiContextProps", + "required": false + }, + { + "uid": "children", + "name": "children", + "comment": { + "raw": [ + "Component children" + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataQueryFilter": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataQueryFilter", - "nameFull": "DataQueryFilter" - }, - "src": "uui-core/src/types/dataQuery.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "DataQueryFilter", - "print": [ - "type DataQueryFilter = {", - " [TPropName in keyof T]?: DataQueryFilterCondition;", - "};" - ] - } - } - }, - "@epam/uui-core:DataQueryFilterCondition": { + "@epam/uui-core:CX": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataQueryFilterCondition", - "nameFull": "DataQueryFilterCondition" + "name": "CX", + "nameFull": "CX" }, - "src": "uui-core/src/types/dataQuery.ts", + "src": "uui-core/src/types/objects.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "TField | FilterPredicate", + "raw": "undefined | null | string | number | boolean | ClassDictionary | ClassArray", "print": [ - "type DataQueryFilterCondition = TField | FilterPredicate;" + "// CX type is a union type that represents the valid values to pass CSS classes", + "type CX = ClassValue;" ] } } }, - "@epam/uui-core:DataRowOptions": { + "@epam/uui-core:DataColumnProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataRowOptions", - "nameFull": "DataRowOptions" - }, - "src": "uui-core/src/types/dataRows.ts", - "comment": { - "raw": [ - "A part of the DataRowProps, which can be configured for each data row via getRowOptions callback.", - " Other props in DataRowProps are computed when generating rows." - ] + "name": "DataColumnProps", + "nameFull": "DataColumnProps" }, + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataRowOptions", + "raw": "DataColumnProps", "print": [ - "/** A part of the DataRowProps, which can be configured for each data row via getRowOptions callback.", - " * Other props in DataRowProps are computed when generating rows.", - " */", - "interface DataRowOptions extends Partial>, IHasValidationMessage {", - " /** If row needs a checkbox, this field should be specified, and it props can be configured here */", - " checkbox?: {", - " isVisible: boolean;", - " } & IDisableable & ICanBeInvalid;", - " /** True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop) */", - " isSelectable?: boolean;", - " /** Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc. */", - " dnd?: IDndActor;", - " /** Row click handler */", - " onClick?(rowProps: DataRowProps): void;", - " /** Can be specified to make row act as a link (plain or SPA) */", - " link?: Link;", + "interface DataColumnProps extends ICanBeFixed, IHasCX, IClickable, IHasRawProps, Attributes {", " /**", - " * A pure function that gets pinned state for each row.", - " * If row pinned, it means that it will be sticky inside their parent section.", - " * */", - " pin?(rowProps: DataRowProps): boolean;", + " * 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.", + " */", + " key: string;", + " /** Column caption. Can be a plain text, or any React Component */", + " caption?: React.ReactNode;", + " /**", + " * 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", + " */", + " width: number;", + " /** Minimal width to which column can be resized manually */", + " minWidth?: number;", + " /** The flex grow for the column. Allows column to grow in width if there's spare horizontal space */", + " grow?: number;", + " /** Aligns cell and header content horizontally */", + " textAlign?: 'left' | 'center' | 'right';", + " /** Aligns only cell content horizontally */", + " justifyContent?: CSS.JustifyContentProperty;", + " /** Align cell content vertically */", + " alignSelf?: CSS.AlignSelfProperty;", + " /**", + " * Enables sorting arrows on the column.", + " * Sorting state is kept in DataSourceState.sorting", + " */", + " isSortable?: boolean;", + " /** Disallows to hide column via ColumnsConfiguration */", + " isAlwaysVisible?: boolean;", + " /** Makes column hidden by default. User can turn it on later, via ColumnsConfiguration */", + " isHiddenByDefault?: boolean;", + " /** Info tooltip displayed in the table header */", + " info?: React.ReactNode;", + " /**", + " * 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.", + " */", + " isFilterActive?: (filter: TFilter, column: DataColumnProps) => boolean;", + " /** A pure function that defines that column value can be copied to the other column. */", + " canCopy?: (cell: DataTableSelectedCellData) => boolean;", + " /** A pure function that defines that column accepts copying other column value into it */", + " canAcceptCopy?: (from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean;", + " /** Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component. */", + " allowResizing?: boolean;", + " /** Render the cell content. The item props is the value of the whole row (TItem). */", + " render?(item: TItem, props: DataRowProps): any;", + " /** Overrides rendering of the whole cell */", + " renderCell?(cellProps: RenderCellProps): any;", + " /**", + " * 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.", + " */", + " renderDropdown?(): React.ReactNode;", + " /**", + " * 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.", + " */", + " renderFilter?(lens: ILens, dropdownProps: IDropdownBodyProps): React.ReactNode;", + " /** 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.", + " */", + " renderTooltip?(column: DataColumnProps): React.ReactNode;", "}" ] }, "props": [ { - "uid": "checkbox", - "name": "checkbox", + "uid": "key", + "name": "key", "comment": { "raw": [ - "If row needs a checkbox, this field should be specified, and it props can be configured here" + "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": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "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", "required": false }, { - "uid": "isSelectable", - "name": "isSelectable", + "uid": "width", + "name": "width", "comment": { "raw": [ - "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" + "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": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "required": false + "required": true }, { - "uid": "dnd", - "name": "dnd", + "uid": "minWidth", + "name": "minWidth", "comment": { "raw": [ - "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." + "Minimal width to which column can be resized manually" ] }, "typeValue": { - "raw": "IDndActor" + "raw": "number" + }, + "editor": { + "type": "number" }, "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "grow", + "name": "grow", "comment": { "raw": [ - "Row click handler" + "The flex grow for the column. Allows column to grow in width if there's spare horizontal space" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": false }, { - "uid": "link", - "name": "link", + "uid": "textAlign", + "name": "textAlign", "comment": { "raw": [ - "Can be specified to make row act as a link (plain or SPA)" + "Aligns cell and header content horizontally" ] }, "typeValue": { - "raw": "Link" + "raw": "'left' | 'right' | 'center'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right", + "center" + ] }, "required": false }, { - "uid": "pin", - "name": "pin", + "uid": "justifyContent", + "name": "justifyContent", "comment": { "raw": [ - "A pure function that gets pinned state for each row.", - " If row pinned, it means that it will be sticky inside their parent section." + "Aligns only cell content horizontally" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => boolean" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "alignSelf", + "name": "alignSelf", "comment": { "raw": [ - "True if component contains invalid input" + "Align cell content vertically" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "isSortable", + "name": "isSortable", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Enables sorting arrows on the column.", + " Sorting state is kept in DataSourceState.sorting" ] }, "typeValue": { @@ -5632,15 +5790,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isAlwaysVisible", + "name": "isAlwaysVisible", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Disallows to hide column via ColumnsConfiguration" ] }, "typeValue": { @@ -5649,15 +5806,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", "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": { @@ -5666,419 +5822,2234 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeRequired", "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": "TItem" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IControlled", + "typeValueRef": "@types/react:ReactNode", "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: TItem) => void" + "raw": "(filter: TFilter, column: DataColumnProps) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "canCopy", + "name": "canCopy", "comment": { "raw": [ - "Message describing why the value is invalid" + "A pure function that defines that column value can be copied to the other column." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(cell: DataTableSelectedCellData) => boolean" + }, + "editor": { + "type": "func" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataRowPathItem": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataRowPathItem", - "nameFull": "DataRowPathItem" - }, - "src": "uui-core/src/types/dataRows.ts", - "comment": { - "raw": [ - "Holds parent info for data rows" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataRowPathItem", - "print": [ - "/** Holds parent info for data rows */", - "interface DataRowPathItem {", - " /** Item ID */", - " id: TId;", - " /** Item value */", - " value: TItem;", - " /** If true, indicates that this item last child of his parent */", - " isLastChild: boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "id", - "name": "id", + "uid": "canAcceptCopy", + "name": "canAcceptCopy", "comment": { "raw": [ - "Item ID" + "A pure function that defines that column accepts copying other column value into it" ] }, "typeValue": { - "raw": "TId" + "raw": "(from: DataTableSelectedCellData, to: DataTableSelectedCellData) => boolean" }, - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "value", - "name": "value", + "uid": "allowResizing", + "name": "allowResizing", "comment": { "raw": [ - "Item value" + "Pass true, to enable column resizing. By default, will be used global 'allowColumnsResizing' value from DataTable component." ] }, "typeValue": { - "raw": "TItem" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "required": false }, { - "uid": "isLastChild", - "name": "isLastChild", + "uid": "render", + "name": "render", "comment": { "raw": [ - "If true, indicates that this item last child of his parent" + "Render the cell content. The item props is the value of the whole row (TItem)." ] }, "typeValue": { - "raw": "boolean" + "raw": "(item: TItem, props: DataRowProps) => any" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "renderCell", + "name": "renderCell", + "comment": { + "raw": [ + "Overrides rendering of the whole cell" + ] + }, + "typeValue": { + "raw": "(cellProps: RenderCellProps) => any" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "renderDropdown", + "name": "renderDropdown", + "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." + ] + }, + "typeValue": { + "raw": "() => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "renderFilter", + "name": "renderFilter", + "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." + ] + }, + "typeValue": { + "raw": "(lens: ILens, dropdownProps: IDropdownBodyProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "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." + ] + }, + "typeValue": { + "raw": "(column: DataColumnProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "fix", + "name": "fix", + "comment": { + "raw": [ + "If specified, will make column fixed - it would not scroll horizontally" + ] + }, + "typeValue": { + "raw": "'left' | 'right'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] + }, + "from": "@epam/uui-core:ICanBeFixed", + "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": "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": "rawProps", + "name": "rawProps", + "comment": { + "raw": [ + "Any HTML attributes (native or 'data-') to put on the underlying component" + ] + }, + "typeValue": { + "raw": "HTMLDivElement & Record<`data-${string}`, string>" + }, + "from": "@epam/uui-core:IHasRawProps", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataPickerCellProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataPickerCellProps", + "nameFull": "DataPickerCellProps" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "Props for cells in pickers." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataPickerCellProps", + "print": [ + "/** Props for cells in pickers. */", + "interface DataPickerCellProps extends IHasCX {", + " /** Key to use as component's key. */", + " key: string;", + " /** DataRowProps object for the picker row where a cell is placed. */", + " rowProps: DataRowProps;", + " /** Render the cell content. The item props is the value of the whole row (TItem). */", + " renderItem(item: TItem, rowProps: DataRowProps): ReactNode;", + "}" + ] + }, + "props": [ + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "Key to use as component's key." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "uid": "rowProps", + "name": "rowProps", + "comment": { + "raw": [ + "DataRowProps object for the picker row where a cell is placed." + ] + }, + "typeValue": { + "raw": "DataRowProps" + }, + "typeValueRef": "@epam/uui-core:DataRowProps", + "required": true + }, + { + "uid": "renderItem", + "name": "renderItem", + "comment": { + "raw": [ + "Render the cell content. The item props is the value of the whole row (TItem)." + ] + }, + "typeValue": { + "raw": "(item: TItem, rowProps: DataRowProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "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" + ] + }, + "typeValue": { + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataQuery": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataQuery", + "nameFull": "DataQuery" + }, + "src": "uui-core/src/types/dataQuery.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataQuery", + "print": [ + "interface DataQuery extends Pick, 'sorting' | 'range' | 'search'> {", + " /** The filter object value with predicates, by which data should be filtered. */", + " filter?: DataQueryFilter;", + "}" + ] + }, + "props": [ + { + "uid": "filter", + "name": "filter", + "comment": { + "raw": [ + "The filter object value with predicates, by which data should be filtered." + ] + }, + "typeValue": { + "raw": "DataQueryFilter" + }, + "required": false + }, + { + "uid": "sorting", + "name": "sorting", + "comment": { + "raw": [ + "Sorting options, by which data should be sorted." + ] + }, + "typeValue": { + "raw": "SortingOption[]" + }, + "from": "@epam/uui-core:LazyDataSourceApiRequest", + "required": false + }, + { + "uid": "range", + "name": "range", + "comment": { + "raw": [ + "Specifies a range of the rows to be retrieved." + ] + }, + "typeValue": { + "raw": "LazyDataSourceApiRequestRange" + }, + "from": "@epam/uui-core:LazyDataSourceApiRequest", + "required": false + }, + { + "uid": "search", + "name": "search", + "comment": { + "raw": [ + "The search string, by which data should be searched." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:LazyDataSourceApiRequest", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataQueryFilter": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataQueryFilter", + "nameFull": "DataQueryFilter" + }, + "src": "uui-core/src/types/dataQuery.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "DataQueryFilter", + "print": [ + "type DataQueryFilter = {", + " [TPropName in keyof T]?: DataQueryFilterCondition;", + "};" + ] + } + } + }, + "@epam/uui-core:DataQueryFilterCondition": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataQueryFilterCondition", + "nameFull": "DataQueryFilterCondition" + }, + "src": "uui-core/src/types/dataQuery.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "TField | FilterPredicate", + "print": [ + "type DataQueryFilterCondition = TField | FilterPredicate;" + ] + } + } + }, + "@epam/uui-core:DataRowOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataRowOptions", + "nameFull": "DataRowOptions" + }, + "src": "uui-core/src/types/dataRows.ts", + "comment": { + "raw": [ + "A part of the DataRowProps, which can be configured for each data row via getRowOptions callback.", + " Other props in DataRowProps are computed when generating rows." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataRowOptions", + "print": [ + "/** A part of the DataRowProps, which can be configured for each data row via getRowOptions callback.", + " * Other props in DataRowProps are computed when generating rows.", + " */", + "interface DataRowOptions extends Partial>, IHasValidationMessage {", + " /** If row needs a checkbox, this field should be specified, and it props can be configured here */", + " checkbox?: {", + " isVisible: boolean;", + " } & IDisableable & ICanBeInvalid;", + " /** True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop) */", + " isSelectable?: boolean;", + " /** Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc. */", + " dnd?: IDndActor;", + " /** Row click handler */", + " onClick?(rowProps: DataRowProps): void;", + " /** Can be specified to make row act as a link (plain or SPA) */", + " link?: Link;", + " /**", + " * A pure function that gets pinned state for each row.", + " * If row pinned, it means that it will be sticky inside their parent section.", + " * */", + " pin?(rowProps: DataRowProps): boolean;", + "}" + ] + }, + "props": [ + { + "uid": "checkbox", + "name": "checkbox", + "comment": { + "raw": [ + "If row needs a checkbox, this field should be specified, and it props can be configured here" + ] + }, + "typeValue": { + "raw": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + }, + "required": false + }, + { + "uid": "isSelectable", + "name": "isSelectable", + "comment": { + "raw": [ + "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "dnd", + "name": "dnd", + "comment": { + "raw": [ + "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." + ] + }, + "typeValue": { + "raw": "IDndActor" + }, + "required": false + }, + { + "uid": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Row click handler" + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "link", + "name": "link", + "comment": { + "raw": [ + "Can be specified to make row act as a link (plain or SPA)" + ] + }, + "typeValue": { + "raw": "Link" + }, + "required": false + }, + { + "uid": "pin", + "name": "pin", + "comment": { + "raw": [ + "A pure function that gets pinned state for each row.", + " If row pinned, it means that it will be sticky inside their parent section." + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => boolean" + }, + "editor": { + "type": "func" + }, + "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": "TItem" + }, + "from": "@epam/uui-core:IControlled", + "required": false + }, + { + "uid": "onValueChange", + "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": false + }, + { + "uid": "validationMessage", + "name": "validationMessage", + "comment": { + "raw": [ + "Message describing why the value is invalid" + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataRowPathItem": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataRowPathItem", + "nameFull": "DataRowPathItem" + }, + "src": "uui-core/src/types/dataRows.ts", + "comment": { + "raw": [ + "Holds parent info for data rows" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataRowPathItem", + "print": [ + "/** Holds parent info for data rows */", + "interface DataRowPathItem {", + " /** Item ID */", + " id: TId;", + " /** Item value */", + " value: TItem;", + " /** If true, indicates that this item last child of his parent */", + " isLastChild: boolean;", + "}" + ] + }, + "props": [ + { + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "Item ID" + ] + }, + "typeValue": { + "raw": "TId" + }, + "required": true + }, + { + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "Item value" + ] + }, + "typeValue": { + "raw": "TItem" + }, + "required": true + }, + { + "uid": "isLastChild", + "name": "isLastChild", + "comment": { + "raw": [ + "If true, indicates that this item last child of his parent" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataRowProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataRowProps", + "nameFull": "DataRowProps" + }, + "src": "uui-core/src/types/dataRows.ts", + "comment": { + "raw": [ + "DataRowProps is a base shape of props, passed to items in various lists or trees.", + "", + " Despite 'Row' in it's name, it doesn't directly connected to a table.", + " We use DataRowProps as a base for DataTableRowProps and DataPickerRowProps.", + " But it can also be used for any user-built list, tree, custom picker rows, or even a grid of cards.", + "", + " Array of DataRowProps describes a part of hierarchical list, while still being a flat array (not a tree of some kind).", + " We use depth, indent, path, and other props to show row's place in the hierarchy.", + " This is very handy to handle rendering, especially in virtual scrolling scenarios.", + "", + " DataSources primary job is to convert various data stores into arrays of DataRowProps." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "DataRowProps", + "print": [ + "/** DataRowProps is a base shape of props, passed to items in various lists or trees.", + " *", + " * Despite 'Row' in it's name, it doesn't directly connected to a table.", + " * We use DataRowProps as a base for DataTableRowProps and DataPickerRowProps.", + " * But it can also be used for any user-built list, tree, custom picker rows, or even a grid of cards.", + " *", + " * Array of DataRowProps describes a part of hierarchical list, while still being a flat array (not a tree of some kind).", + " * We use depth, indent, path, and other props to show row's place in the hierarchy.", + " * This is very handy to handle rendering, especially in virtual scrolling scenarios.", + " *", + " * DataSources primary job is to convert various data stores into arrays of DataRowProps.", + " */", + "type DataRowProps = FlexRowProps & DataRowOptions & {", + " /** ID of the TItem rows displays */", + " id: TId;", + " /** Key to be used as component's key when rendering. Usually, it's stringified ID */", + " rowKey: string;", + " /** Index of the row, from the top of the list. This doesn't account any hierarchy. */", + " index: number;", + " /** The data item (TItem) row displays. Will be undefined if isLoading = true. */", + " value: TItem | undefined;", + " /** ID of the parent TItem */", + " parentId?: TId;", + " /** Hierarchical path from the root node to the item (excluding the item itself) */", + " path?: DataRowPathItem[];", + " /* visual */", + " /** Depth of the row in tree, 0 for the top-level */", + " depth?: number;", + " /** Indent of the item, to show hierarchy.", + " * Unlike depth, it contains additional logic, to not add unnecessary indents:", + " * if all children of node has no children, all nodes would get the same indent as parent.", + " */", + " indent?: number;", + " /** True if row is in loading state. 'value' is empty in this case */", + " isLoading?: boolean;", + " /** True if item doesn't exist in a dataSource */", + " isUnknown?: boolean;", + " /** True if row be folded or unfolded (usually because it contains children) */", + " isFoldable?: boolean;", + " /** True if row is currently folded */", + " isFolded?: boolean;", + " /** True if row is checked with checkbox */", + " isChecked?: boolean;", + " /** True if row has checkbox and can be checkable */", + " isCheckable?: boolean;", + " /** True if some of row's children are checked.", + " * Used to show 'indefinite' checkbox state, to show user that something inside is checked */", + " isChildrenChecked?: boolean;", + " /** True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes) */", + " isSelected?: boolean;", + " /** True if any of row's children is selected. */", + " isChildrenSelected?: boolean;", + " /** True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row */", + " isFocused?: boolean;", + " /** True if row is the last child of his parent */", + " isLastChild?: boolean;", + " /* events */", + " /** Handles row folding change.", + " * We demand to pass the row as well, to avoid creating closures for each row.", + " */", + " onFold?(rowProps: DataRowProps): void;", + " /** Handles row click.", + " * We demand to pass the row as well, to avoid creating closures for each row.", + " */", + " onClick?(rowProps: DataRowProps): void;", + " /** Handles row checkbox change.", + " * We demand to pass the row as well, to avoid creating closures for each row.", + " */", + " onCheck?(rowProps: DataRowProps): void;", + " /** Handles row selection.", + " * We demand to pass the row as well, to avoid creating closures for each row.", + " */", + " onSelect?(rowProps: DataRowProps): void;", + " /** Handles row focusing.", + " */", + " onFocus?(focusedIndex: number): void;", + " /** True if row pinned, it means that it will be sticky inside his nesting level */", + " isPinned?: boolean;", + "};" + ] + }, + "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": "onClick", + "name": "onClick", + "comment": { + "raw": [ + "Called when component is clicked" + ] + }, + "typeValue": { + "raw": "((e?: any) => void) & ((rowProps: DataRowProps) => void) & ((rowProps: DataRowProps) => void)" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IClickable", + "required": false + }, + { + "uid": "key", + "name": "key", + "typeValue": { + "raw": "null | string | number" + }, + "from": "@types/react:Attributes", + "required": false + }, + { + "uid": "children", + "name": "children", + "comment": { + "raw": [ + "Component children" + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", + "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 + }, + { + "uid": "alignItems", + "name": "alignItems", + "comment": { + "raw": [ + "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", + " @default 'center'" + ], + "tags": { + "@default": "center" + } + }, + "typeValue": { + "raw": "'top' | 'bottom' | 'center' | 'stretch'" + }, + "editor": { + "type": "oneOf", + "options": [ + "top", + "bottom", + "center", + "stretch" + ] + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false + }, + { + "uid": "justifyContent", + "name": "justifyContent", + "comment": { + "raw": [ + "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" + ] + }, + "typeValue": { + "raw": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" + }, + "editor": { + "type": "oneOf", + "options": [ + "center", + "space-around", + "space-between", + "space-evenly", + "end", + "start" + ] + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false + }, + { + "uid": "columnGap", + "name": "columnGap", + "comment": { + "raw": [ + "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + ] + }, + "typeValue": { + "raw": "number | '6' | '12' | '18' | '24' | '36'" + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false + }, + { + "uid": "rowGap", + "name": "rowGap", + "comment": { + "raw": [ + "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + ] + }, + "typeValue": { + "raw": "number | '6' | '12' | '18' | '24' | '36'" + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false + }, + { + "uid": "checkbox", + "name": "checkbox", + "comment": { + "raw": [ + "If row needs a checkbox, this field should be specified, and it props can be configured here" + ] + }, + "typeValue": { + "raw": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + }, + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "isSelectable", + "name": "isSelectable", + "comment": { + "raw": [ + "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "dnd", + "name": "dnd", + "comment": { + "raw": [ + "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." + ] + }, + "typeValue": { + "raw": "IDndActor" + }, + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "link", + "name": "link", + "comment": { + "raw": [ + "Can be specified to make row act as a link (plain or SPA)" + ] + }, + "typeValue": { + "raw": "Link" + }, + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "pin", + "name": "pin", + "comment": { + "raw": [ + "A pure function that gets pinned state for each row.", + " If row pinned, it means that it will be sticky inside their parent section." + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => boolean" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataRowOptions", + "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": "TItem" + }, + "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: TItem) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": false + }, + { + "uid": "validationMessage", + "name": "validationMessage", + "comment": { + "raw": [ + "Message describing why the value is invalid" + ] + }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", + "required": false + }, + { + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "ID of the TItem rows displays" + ] + }, + "typeValue": { + "raw": "TId" + }, + "required": true + }, + { + "uid": "rowKey", + "name": "rowKey", + "comment": { + "raw": [ + "Key to be used as component's key when rendering. Usually, it's stringified ID" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "uid": "index", + "name": "index", + "comment": { + "raw": [ + "Index of the row, from the top of the list. This doesn't account any hierarchy." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": true + }, + { + "uid": "parentId", + "name": "parentId", + "comment": { + "raw": [ + "ID of the parent TItem" + ] + }, + "typeValue": { + "raw": "TId" + }, + "required": false + }, + { + "uid": "path", + "name": "path", + "comment": { + "raw": [ + "Hierarchical path from the root node to the item (excluding the item itself)" + ] + }, + "typeValue": { + "raw": "DataRowPathItem[]" + }, + "required": false + }, + { + "uid": "depth", + "name": "depth", + "comment": { + "raw": [ + "Depth of the row in tree, 0 for the top-level" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "indent", + "name": "indent", + "comment": { + "raw": [ + "Indent of the item, to show hierarchy.", + " Unlike depth, it contains additional logic, to not add unnecessary indents:", + " if all children of node has no children, all nodes would get the same indent as parent." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "isLoading", + "name": "isLoading", + "comment": { + "raw": [ + "True if row is in loading state. 'value' is empty in this case" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isUnknown", + "name": "isUnknown", + "comment": { + "raw": [ + "True if item doesn't exist in a dataSource" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isFoldable", + "name": "isFoldable", + "comment": { + "raw": [ + "True if row be folded or unfolded (usually because it contains children)" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isFolded", + "name": "isFolded", + "comment": { + "raw": [ + "True if row is currently folded" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isChecked", + "name": "isChecked", + "comment": { + "raw": [ + "True if row is checked with checkbox" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isCheckable", + "name": "isCheckable", + "comment": { + "raw": [ + "True if row has checkbox and can be checkable" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isChildrenChecked", + "name": "isChildrenChecked", + "comment": { + "raw": [ + "True if some of row's children are checked.", + " Used to show 'indefinite' checkbox state, to show user that something inside is checked" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isSelected", + "name": "isSelected", + "comment": { + "raw": [ + "True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes)" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isChildrenSelected", + "name": "isChildrenSelected", + "comment": { + "raw": [ + "True if any of row's children is selected." + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isFocused", + "name": "isFocused", + "comment": { + "raw": [ + "True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "isLastChild", + "name": "isLastChild", + "comment": { + "raw": [ + "True if row is the last child of his parent" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "onFold", + "name": "onFold", + "comment": { + "raw": [ + "Handles row folding change.", + " We demand to pass the row as well, to avoid creating closures for each row." + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onCheck", + "name": "onCheck", + "comment": { + "raw": [ + "Handles row checkbox change.", + " We demand to pass the row as well, to avoid creating closures for each row." + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onSelect", + "name": "onSelect", + "comment": { + "raw": [ + "Handles row selection.", + " We demand to pass the row as well, to avoid creating closures for each row." + ] + }, + "typeValue": { + "raw": "(rowProps: DataRowProps) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onFocus", + "name": "onFocus", + "comment": { + "raw": [ + "Handles row focusing." + ] + }, + "typeValue": { + "raw": "(focusedIndex: number) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "isPinned", + "name": "isPinned", + "comment": { + "raw": [ + "True if row pinned, it means that it will be sticky inside his nesting level" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataSourceListCounts": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataSourceListCounts", + "nameFull": "DataSourceListCounts" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "DataSourceListCounts", + "print": [ + "type DataSourceListCounts = {", + " /**", + " * Count of rows, after applying filter, and folding on tree nodes.", + " * Obsolete! Please switch to exactRowsCount / knownRowsCount", + " */", + " rowsCount?: number;", + " /** Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count */", + " exactRowsCount?: number;", + " /**", + " * 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.", + " */", + " knownRowsCount?: number;", + " /** Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children */", + " totalCount?: number;", + "};" + ] + }, + "props": [ + { + "uid": "rowsCount", + "name": "rowsCount", + "comment": { + "raw": [ + "Count of rows, after applying filter, and folding on tree nodes.", + " Obsolete! Please switch to exactRowsCount / knownRowsCount" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "exactRowsCount", + "name": "exactRowsCount", + "comment": { + "raw": [ + "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "knownRowsCount", + "name": "knownRowsCount", + "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." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "totalCount", + "name": "totalCount", + "comment": { + "raw": [ + "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataSourceListProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataSourceListProps", + "nameFull": "DataSourceListProps" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataSourceListProps", + "print": [ + "interface DataSourceListProps extends DataSourceListCounts {", + " /**", + " * ICheckable object for Select All behavior.", + " * If omitted, Select All action will be absent.", + " * */", + " selectAll?: ICheckable;", + " /** Signals that data is reloading on search/sort/filter/reload. */", + " isReloading?: boolean;", + "}" + ] + }, + "props": [ + { + "uid": "selectAll", + "name": "selectAll", + "comment": { + "raw": [ + "ICheckable object for Select All behavior.", + " If omitted, Select All action will be absent." + ] + }, + "typeValue": { + "raw": "ICheckable" + }, + "required": false + }, + { + "uid": "isReloading", + "name": "isReloading", + "comment": { + "raw": [ + "Signals that data is reloading on search/sort/filter/reload." + ] + }, + "typeValue": { + "raw": "boolean" }, "editor": { "type": "bool" }, - "required": true + "required": false + }, + { + "uid": "rowsCount", + "name": "rowsCount", + "comment": { + "raw": [ + "Count of rows, after applying filter, and folding on tree nodes.", + " Obsolete! Please switch to exactRowsCount / knownRowsCount" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataSourceListCounts", + "required": false + }, + { + "uid": "exactRowsCount", + "name": "exactRowsCount", + "comment": { + "raw": [ + "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataSourceListCounts", + "required": false + }, + { + "uid": "knownRowsCount", + "name": "knownRowsCount", + "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." + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataSourceListCounts", + "required": false + }, + { + "uid": "totalCount", + "name": "totalCount", + "comment": { + "raw": [ + "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataSourceListCounts", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataRowProps": { + "@epam/uui-core:DataSourceState": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataRowProps", - "nameFull": "DataRowProps" + "name": "DataSourceState", + "nameFull": "DataSourceState" }, - "src": "uui-core/src/types/dataRows.ts", + "src": "uui-core/src/types/dataSources.ts", "comment": { "raw": [ - "DataRowProps is a base shape of props, passed to items in various lists or trees.", - "", - " Despite 'Row' in it's name, it doesn't directly connected to a table.", - " We use DataRowProps as a base for DataTableRowProps and DataPickerRowProps.", - " But it can also be used for any user-built list, tree, custom picker rows, or even a grid of cards.", - "", - " Array of DataRowProps describes a part of hierarchical list, while still being a flat array (not a tree of some kind).", - " We use depth, indent, path, and other props to show row's place in the hierarchy.", - " This is very handy to handle rendering, especially in virtual scrolling scenarios.", - "", - " DataSources primary job is to convert various data stores into arrays of DataRowProps." + "Holds state of a components displaying lists - like tables. Holds virtual list position, filter, search, selection, etc." ] }, "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "DataRowProps", + "raw": "DataSourceState", "print": [ - "/** DataRowProps is a base shape of props, passed to items in various lists or trees.", - " *", - " * Despite 'Row' in it's name, it doesn't directly connected to a table.", - " * We use DataRowProps as a base for DataTableRowProps and DataPickerRowProps.", - " * But it can also be used for any user-built list, tree, custom picker rows, or even a grid of cards.", - " *", - " * Array of DataRowProps describes a part of hierarchical list, while still being a flat array (not a tree of some kind).", - " * We use depth, indent, path, and other props to show row's place in the hierarchy.", - " * This is very handy to handle rendering, especially in virtual scrolling scenarios.", - " *", - " * DataSources primary job is to convert various data stores into arrays of DataRowProps.", - " */", - "type DataRowProps = FlexRowProps & DataRowOptions & {", - " /** ID of the TItem rows displays */", - " id: TId;", - " /** Key to be used as component's key when rendering. Usually, it's stringified ID */", - " rowKey: string;", - " /** Index of the row, from the top of the list. This doesn't account any hierarchy. */", - " index: number;", - " /** The data item (TItem) row displays. Will be undefined if isLoading = true. */", - " value: TItem | undefined;", - " /** ID of the parent TItem */", - " parentId?: TId;", - " /** Hierarchical path from the root node to the item (excluding the item itself) */", - " path?: DataRowPathItem[];", - " /* visual */", - " /** Depth of the row in tree, 0 for the top-level */", - " depth?: number;", - " /** Indent of the item, to show hierarchy.", - " * Unlike depth, it contains additional logic, to not add unnecessary indents:", - " * if all children of node has no children, all nodes would get the same indent as parent.", - " */", - " indent?: number;", - " /** True if row is in loading state. 'value' is empty in this case */", - " isLoading?: boolean;", - " /** True if item doesn't exist in a dataSource */", - " isUnknown?: boolean;", - " /** True if row be folded or unfolded (usually because it contains children) */", - " isFoldable?: boolean;", - " /** True if row is currently folded */", - " isFolded?: boolean;", - " /** True if row is checked with checkbox */", - " isChecked?: boolean;", - " /** True if row has checkbox and can be checkable */", - " isCheckable?: boolean;", - " /** True if some of row's children are checked.", - " * Used to show 'indefinite' checkbox state, to show user that something inside is checked */", - " isChildrenChecked?: boolean;", - " /** True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes) */", - " isSelected?: boolean;", - " /** True if any of row's children is selected. */", - " isChildrenSelected?: boolean;", - " /** True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row */", - " isFocused?: boolean;", - " /** True if row is the last child of his parent */", - " isLastChild?: boolean;", - " /* events */", - " /** Handles row folding change.", - " * We demand to pass the row as well, to avoid creating closures for each row.", - " */", - " onFold?(rowProps: DataRowProps): void;", - " /** Handles row click.", - " * We demand to pass the row as well, to avoid creating closures for each row.", - " */", - " onClick?(rowProps: DataRowProps): void;", - " /** Handles row checkbox change.", - " * We demand to pass the row as well, to avoid creating closures for each row.", - " */", - " onCheck?(rowProps: DataRowProps): void;", - " /** Handles row selection.", - " * We demand to pass the row as well, to avoid creating closures for each row.", - " */", - " onSelect?(rowProps: DataRowProps): void;", - " /** Handles row focusing.", - " */", - " onFocus?(focusedIndex: number): void;", - " /** True if row pinned, it means that it will be sticky inside his nesting level */", - " isPinned?: boolean;", - "};" + "/** Holds state of a components displaying lists - like tables. Holds virtual list position, filter, search, selection, etc. */", + "interface DataSourceState, TId = any> extends VirtualListState {", + " /**", + " * Search value, used to filter data based on it.", + " * Included in the API request object when using a LazyDataSource.", + " * For Array and Async data sources, searching is performed internally by the datasource.", + " * */", + " search?: string;", + " /** Array of checked items IDs */", + " checked?: TId[];", + " /**", + " * A map of item IDs to their folding state.", + " * If an item ID is present with a `true` value, it's folded; otherwise, it's not folded.", + " * */", + " folded?: Record;", + " /**", + " * Filter value used to filter data based on it.", + " * Included in the API request object when using a LazyDataSource.", + " * For Array and Async data sources, filtering is performed internally by the datasource.", + " * */", + " filter?: TFilter;", + " /**", + " * Sorting value, used to sort data based on it.", + " * Included in the API request object when using a LazyDataSource.", + " * For Array and Async data sources, sorting is performed internally by the datasource.", + " * */", + " sorting?: SortingOption[];", + " /** ID of selected item. It can be only one selected item at the moment. */", + " selectedId?: TId;", + " /** Index of currently focused item */", + " focusedIndex?: number;", + " /** Current page number */", + " page?: number;", + " /** The amount of items per page */", + " pageSize?: number;", + " /**", + " * Provides default folding of nodes if the opposite value is not present in the folded map.", + " * It is used to collapse/expand all nodes.", + " */", + " foldAll?: boolean;", + "}" ] }, "props": [ { - "uid": "cx", - "name": "cx", + "uid": "search", + "name": "search", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Search value, used to filter data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, searching is performed internally by the datasource." ] }, "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": "onClick", - "name": "onClick", + "uid": "checked", + "name": "checked", "comment": { "raw": [ - "Called when component is clicked" + "Array of checked items IDs" ] }, "typeValue": { - "raw": "((e?: any) => void) & ((rowProps: DataRowProps) => void) & ((rowProps: DataRowProps) => void)" + "raw": "TId[]" }, - "editor": { - "type": "func" + "required": false + }, + { + "uid": "folded", + "name": "folded", + "comment": { + "raw": [ + "A map of item IDs to their folding state.", + " If an item ID is present with a `true` value, it's folded; otherwise, it's not folded." + ] + }, + "typeValue": { + "raw": "Record" }, - "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "key", - "name": "key", + "uid": "filter", + "name": "filter", + "comment": { + "raw": [ + "Filter value used to filter data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, filtering is performed internally by the datasource." + ] + }, "typeValue": { - "raw": "null | string | number" + "raw": "TFilter" }, - "from": "@types/react:Attributes", "required": false }, { - "uid": "children", - "name": "children", + "uid": "sorting", + "name": "sorting", "comment": { "raw": [ - "Component children" + "Sorting value, used to sort data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, sorting is performed internally by the datasource." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "SortingOption[]" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "selectedId", + "name": "selectedId", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "ID of selected item. It can be only one selected item at the moment." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "TId" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "alignItems", - "name": "alignItems", + "uid": "focusedIndex", + "name": "focusedIndex", "comment": { "raw": [ - "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", - " @default 'center'" - ], - "tags": { - "@default": "center" - } + "Index of currently focused item" + ] }, "typeValue": { - "raw": "'top' | 'bottom' | 'center' | 'stretch'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "top", - "bottom", - "center", - "stretch" + "type": "number" + }, + "required": false + }, + { + "uid": "page", + "name": "page", + "comment": { + "raw": [ + "Current page number" ] }, - "from": "@epam/uui-core:FlexRowProps", + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, "required": false }, { - "uid": "justifyContent", - "name": "justifyContent", + "uid": "pageSize", + "name": "pageSize", "comment": { "raw": [ - "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" + "The amount of items per page" ] }, "typeValue": { - "raw": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "center", - "space-around", - "space-between", - "space-evenly", - "end", - "start" + "type": "number" + }, + "required": false + }, + { + "uid": "foldAll", + "name": "foldAll", + "comment": { + "raw": [ + "Provides default folding of nodes if the opposite value is not present in the folded map.", + " It is used to collapse/expand all nodes." ] }, - "from": "@epam/uui-core:FlexRowProps", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, "required": false }, { - "uid": "columnGap", - "name": "columnGap", + "uid": "scrollTo", + "name": "scrollTo", "comment": { "raw": [ - "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + "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." ] }, "typeValue": { - "raw": "number | '6' | '12' | '18' | '24' | '36'" + "raw": "ScrollToConfig" }, - "from": "@epam/uui-core:FlexRowProps", + "from": "@epam/uui-core:VirtualListState", "required": false }, { - "uid": "rowGap", - "name": "rowGap", + "uid": "topIndex", + "name": "topIndex", "comment": { "raw": [ - "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + "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 | '6' | '12' | '18' | '24' | '36'" + "raw": "number" }, - "from": "@epam/uui-core:FlexRowProps", + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:VirtualListRange", "required": false }, { - "uid": "checkbox", - "name": "checkbox", + "uid": "visibleCount", + "name": "visibleCount", "comment": { "raw": [ - "If row needs a checkbox, this field should be specified, and it props can be configured here" + "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": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:VirtualListRange", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataTableCellOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataTableCellOptions", + "nameFull": "DataTableCellOptions" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataTableCellOptions", + "print": [ + "interface DataTableCellOptions {", + " /** Key to use as component's key */", + " key: string;", + " /** DataTableRowsProps object for the table row the cell is at */", + " rowProps: DataTableRowProps;", + " /** DataColumnProps object for the column the cell is at */", + " column: DataColumnProps;", + " /** Column index in table */", + " index?: number;", + " /** True if the cell is in the first column */", + " isFirstColumn: boolean;", + " /** True if the cell is in the last column */", + " isLastColumn: boolean;", + " /** HTML tabIndex attribute to set on the cell */", + " tabIndex?: React.HTMLAttributes['tabIndex'];", + "}" + ] + }, + "props": [ + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "Key to use as component's key" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "uid": "rowProps", + "name": "rowProps", + "comment": { + "raw": [ + "DataTableRowsProps object for the table row the cell is at" + ] + }, + "typeValue": { + "raw": "DataTableRowProps" + }, + "required": true + }, + { + "uid": "column", + "name": "column", + "comment": { + "raw": [ + "DataColumnProps object for the column the cell is at" + ] + }, + "typeValue": { + "raw": "DataColumnProps" + }, + "required": true + }, + { + "uid": "index", + "name": "index", + "comment": { + "raw": [ + "Column index in table" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:DataRowOptions", "required": false }, { - "uid": "isSelectable", - "name": "isSelectable", + "uid": "isFirstColumn", + "name": "isFirstColumn", "comment": { "raw": [ - "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" + "True if the cell is in the first column" ] }, "typeValue": { @@ -6087,196 +8058,210 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowOptions", - "required": false + "required": true }, { - "uid": "dnd", - "name": "dnd", + "uid": "isLastColumn", + "name": "isLastColumn", "comment": { "raw": [ - "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." + "True if the cell is in the last column" ] }, "typeValue": { - "raw": "IDndActor" + "raw": "boolean" }, - "from": "@epam/uui-core:DataRowOptions", - "required": false + "editor": { + "type": "bool" + }, + "required": true }, { - "uid": "link", - "name": "link", + "uid": "tabIndex", + "name": "tabIndex", + "comment": { + "raw": [ + "HTML tabIndex attribute to set on the cell" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataTableCellProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataTableCellProps", + "nameFull": "DataTableCellProps" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataTableCellProps", + "print": [ + "interface DataTableCellProps extends DataTableCellOptions, IHasCX, Partial>, IHasValidationMessage {", + " /** Add-on controls to put before the cell content (folding arrow, checkbox, etc.) */", + " addons?: React.ReactNode;", + " /** Overrides default loading placeholder ('skeleton') rendering.", + " * By default: () => Unknown ", + " * */", + " renderPlaceholder?(cellProps: DataTableCellProps): React.ReactNode;", + " /** Overrides default unknown item rendering */", + " renderUnknown?(cellProps: DataTableCellProps): React.ReactNode;", + " /**", + " * If passed, the cell is rendered as editable - receives focus, show validation errors.", + " * All necessary props for the editor are passed as argument:", + " * - props implements IEditable and can be passed directly to suitable component (like TextInput)", + " * - ICanFocus props are passed as well. Component should implement it so cell focus highlight works properly", + " * - mode='cell' prop is passed to render UUI components in 'cell' mode", + " * - rowProps is passed, so you depend on additional info about the row itself", + " */", + " renderEditor?(props: RenderEditorProps): React.ReactNode;", + " /** Overrides default tooltip, used to show validation message if the cell is invalid */", + " renderTooltip?: (props: ICanBeInvalid & TooltipCoreProps) => React.ReactElement;", + "}" + ] + }, + "props": [ + { + "uid": "addons", + "name": "addons", "comment": { "raw": [ - "Can be specified to make row act as a link (plain or SPA)" + "Add-on controls to put before the cell content (folding arrow, checkbox, etc.)" ] }, "typeValue": { - "raw": "Link" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:DataRowOptions", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "pin", - "name": "pin", + "uid": "renderPlaceholder", + "name": "renderPlaceholder", "comment": { "raw": [ - "A pure function that gets pinned state for each row.", - " If row pinned, it means that it will be sticky inside their parent section." + "Overrides default loading placeholder ('skeleton') rendering.", + " By default: () => Unknown " ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => boolean" + "raw": "(cellProps: DataTableCellProps) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:DataRowOptions", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "renderUnknown", + "name": "renderUnknown", "comment": { "raw": [ - "True if component contains invalid input" + "Overrides default unknown item rendering" ] }, "typeValue": { - "raw": "boolean" + "raw": "(cellProps: DataTableCellProps) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "renderEditor", + "name": "renderEditor", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "If passed, the cell is rendered as editable - receives focus, show validation errors.", + " All necessary props for the editor are passed as argument:", + " - props implements IEditable and can be passed directly to suitable component (like TextInput)", + " - ICanFocus props are passed as well. Component should implement it so cell focus highlight works properly", + " - mode='cell' prop is passed to render UUI components in 'cell' mode", + " - rowProps is passed, so you depend on additional info about the row itself" ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: RenderEditorProps) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "renderTooltip", + "name": "renderTooltip", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Overrides default tooltip, used to show validation message if the cell is invalid" ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: ICanBeInvalid & TooltipCoreProps) => React.ReactElement>" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "key", + "name": "key", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Key to use as component's key" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false - }, - { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, - "typeValue": { - "raw": "TItem" + "type": "string" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "onValueChange", - "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": false - }, - { - "uid": "validationMessage", - "name": "validationMessage", - "comment": { - "raw": [ - "Message describing why the value is invalid" - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", - "required": false - }, - { - "uid": "id", - "name": "id", + "uid": "rowProps", + "name": "rowProps", "comment": { "raw": [ - "ID of the TItem rows displays" + "DataTableRowsProps object for the table row the cell is at" ] }, "typeValue": { - "raw": "TId" + "raw": "DataTableRowProps" }, + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { - "uid": "rowKey", - "name": "rowKey", + "uid": "column", + "name": "column", "comment": { "raw": [ - "Key to be used as component's key when rendering. Usually, it's stringified ID" + "DataColumnProps object for the column the cell is at" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "DataColumnProps" }, + "from": "@epam/uui-core:DataTableCellOptions", "required": true }, { @@ -6284,7 +8269,7 @@ "name": "index", "comment": { "raw": [ - "Index of the row, from the top of the list. This doesn't account any hierarchy." + "Column index in table" ] }, "typeValue": { @@ -6293,40 +8278,49 @@ "editor": { "type": "number" }, - "required": true + "from": "@epam/uui-core:DataTableCellOptions", + "required": false }, { - "uid": "parentId", - "name": "parentId", + "uid": "isFirstColumn", + "name": "isFirstColumn", "comment": { "raw": [ - "ID of the parent TItem" + "True if the cell is in the first column" ] }, "typeValue": { - "raw": "TId" + "raw": "boolean" }, - "required": false + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "path", - "name": "path", + "uid": "isLastColumn", + "name": "isLastColumn", "comment": { "raw": [ - "Hierarchical path from the root node to the item (excluding the item itself)" + "True if the cell is in the last column" ] }, "typeValue": { - "raw": "DataRowPathItem[]" + "raw": "boolean" }, - "required": false + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "depth", - "name": "depth", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "Depth of the row in tree, 0 for the top-level" + "HTML tabIndex attribute to set on the cell" ] }, "typeValue": { @@ -6335,32 +8329,30 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:DataTableCellOptions", "required": false }, { - "uid": "indent", - "name": "indent", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Indent of the item, to show hierarchy.", - " Unlike depth, it contains additional logic, to not add unnecessary indents:", - " if all children of node has no children, all nodes would get the same indent as parent." + "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": "isLoading", - "name": "isLoading", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "True if row is in loading state. 'value' is empty in this case" + "True if component contains invalid input" ] }, "typeValue": { @@ -6369,14 +8361,15 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isUnknown", - "name": "isUnknown", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "True if item doesn't exist in a dataSource" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -6385,14 +8378,15 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isFoldable", - "name": "isFoldable", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "True if row be folded or unfolded (usually because it contains children)" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -6401,14 +8395,15 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "isFolded", - "name": "isFolded", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "True if row is currently folded" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { @@ -6417,64 +8412,98 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "isChecked", - "name": "isChecked", + "uid": "value", + "name": "value", "comment": { "raw": [ - "True if row is checked with checkbox" + "The current value of component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TCellValue" }, + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "isCheckable", - "name": "isCheckable", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "True if row has checkbox and can be checkable" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: TCellValue) => void" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "isChildrenChecked", - "name": "isChildrenChecked", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "True if some of row's children are checked.", - " Used to show 'indefinite' checkbox state, to show user that something inside is checked" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataTableColumnsConfigOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataTableColumnsConfigOptions", + "nameFull": "DataTableColumnsConfigOptions" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataTableColumnsConfigOptions", + "print": [ + "interface DataTableColumnsConfigOptions {", + " /** If true, allows user to change columns order", + " * @default false", + " * */", + " allowColumnsReordering?: boolean;", + " /** If true, allows user to change columns width", + " * @default false", + " * */", + " allowColumnsResizing?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "isSelected", - "name": "isSelected", + "uid": "allowColumnsReordering", + "name": "allowColumnsReordering", "comment": { "raw": [ - "True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes)" - ] + "If true, allows user to change columns order", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { "raw": "boolean" @@ -6485,12 +8514,16 @@ "required": false }, { - "uid": "isChildrenSelected", - "name": "isChildrenSelected", + "uid": "allowColumnsResizing", + "name": "allowColumnsResizing", "comment": { "raw": [ - "True if any of row's children is selected." - ] + "If true, allows user to change columns width", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { "raw": "boolean" @@ -6499,13 +8532,39 @@ "type": "bool" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataTableConfigModalParams": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataTableConfigModalParams", + "nameFull": "DataTableConfigModalParams" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "DataTableConfigModalParams", + "print": [ + "type DataTableConfigModalParams = IEditable & {", + " /** Array of all table columns */", + " columns: DataColumnProps[];", + "};" + ] + }, + "props": [ { - "uid": "isFocused", - "name": "isFocused", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row" + "True if component contains invalid input" ] }, "typeValue": { @@ -6514,14 +8573,15 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "isLastChild", - "name": "isLastChild", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "True if row is the last child of his parent" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { @@ -6530,248 +8590,189 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "onFold", - "name": "onFold", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Handles row folding change.", - " We demand to pass the row as well, to avoid creating closures for each row." + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "onCheck", - "name": "onCheck", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Handles row checkbox change.", - " We demand to pass the row as well, to avoid creating closures for each row." + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "onSelect", - "name": "onSelect", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Handles row selection.", - " We demand to pass the row as well, to avoid creating closures for each row." + "The current value of component" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" - }, - "editor": { - "type": "func" + "raw": "DataSourceState, any>" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Handles row focusing." + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(focusedIndex: number) => void" + "raw": "(newValue: DataSourceState, any>) => void" }, "editor": { "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "isPinned", - "name": "isPinned", + "uid": "columns", + "name": "columns", "comment": { "raw": [ - "True if row pinned, it means that it will be sticky inside his nesting level" + "Array of all table columns" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataColumnProps[]" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:DataSourceListCounts": { + "@epam/uui-core:DataTableHeaderCellProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataSourceListCounts", - "nameFull": "DataSourceListCounts" + "name": "DataTableHeaderCellProps", + "nameFull": "DataTableHeaderCellProps" }, - "src": "uui-core/src/types/dataSources.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "DataSourceListCounts", + "raw": "DataTableHeaderCellProps", "print": [ - "type DataSourceListCounts = {", + "interface DataTableHeaderCellProps extends IEditable, IDropdownToggler, IHasCX, DataTableColumnsConfigOptions {", + " key: string;", + " column: DataColumnProps;", + " isFirstColumn: boolean;", + " isLastColumn: boolean;", + " selectAll?: ICheckable;", " /**", - " * Count of rows, after applying filter, and folding on tree nodes.", - " * Obsolete! Please switch to exactRowsCount / knownRowsCount", - " */", - " rowsCount?: number;", - " /** Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count */", - " exactRowsCount?: number;", + " * Enables collapse/expand all functionality.", + " * */", + " showFoldAll?: boolean;", " /**", - " * 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.", + " * Fold all click handler.", + " * If `showFoldAll` is not enabled, onFoldAll is not passed.", + " * */", + " onFoldAll?(): void;", + " /**", + " * Indicates if all nodes are folded.", " */", - " knownRowsCount?: number;", - " /** Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children */", - " totalCount?: number;", - "};" + " areAllFolded?: boolean;", + " isFilterActive?: boolean;", + " sortDirection?: SortDirection;", + " onSort(dir: SortDirection): void;", + " onDrop?(params: DropParams, DataColumnProps>): void;", + " renderFilter?: (dropdownProps: IDropdownBodyProps) => React.ReactNode;", + "}" ] }, "props": [ { - "uid": "rowsCount", - "name": "rowsCount", - "comment": { - "raw": [ - "Count of rows, after applying filter, and folding on tree nodes.", - " Obsolete! Please switch to exactRowsCount / knownRowsCount" - ] - }, + "uid": "key", + "name": "key", "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "required": false + "required": true }, { - "uid": "exactRowsCount", - "name": "exactRowsCount", - "comment": { - "raw": [ - "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" - ] - }, + "uid": "column", + "name": "column", "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "DataColumnProps" }, - "required": false + "required": true }, { - "uid": "knownRowsCount", - "name": "knownRowsCount", - "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." - ] - }, + "uid": "isFirstColumn", + "name": "isFirstColumn", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": false + "required": true }, { - "uid": "totalCount", - "name": "totalCount", - "comment": { - "raw": [ - "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" - ] - }, + "uid": "isLastColumn", + "name": "isLastColumn", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataSourceListProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataSourceListProps", - "nameFull": "DataSourceListProps" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataSourceListProps", - "print": [ - "interface DataSourceListProps extends DataSourceListCounts {", - " /**", - " * ICheckable object for Select All behavior.", - " * If omitted, Select All action will be absent.", - " * */", - " selectAll?: ICheckable;", - " /** Signals that data is reloading on search/sort/filter/reload. */", - " isReloading?: boolean;", - "}" - ] - }, - "props": [ + "required": true + }, { "uid": "selectAll", "name": "selectAll", - "comment": { - "raw": [ - "ICheckable object for Select All behavior.", - " If omitted, Select All action will be absent." - ] - }, "typeValue": { "raw": "ICheckable" }, "required": false }, { - "uid": "isReloading", - "name": "isReloading", + "uid": "showFoldAll", + "name": "showFoldAll", "comment": { "raw": [ - "Signals that data is reloading on search/sort/filter/reload." + "Enables collapse/expand all functionality." ] }, "typeValue": { @@ -6783,287 +8784,219 @@ "required": false }, { - "uid": "rowsCount", - "name": "rowsCount", + "uid": "onFoldAll", + "name": "onFoldAll", "comment": { "raw": [ - "Count of rows, after applying filter, and folding on tree nodes.", - " Obsolete! Please switch to exactRowsCount / knownRowsCount" + "Fold all click handler.", + " If `showFoldAll` is not enabled, onFoldAll is not passed." ] }, "typeValue": { - "raw": "number" + "raw": "() => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "exactRowsCount", - "name": "exactRowsCount", + "uid": "areAllFolded", + "name": "areAllFolded", "comment": { "raw": [ - "Count of rows, if all rows loaded. Can be null while initial loading, or if API doesn't return count" + "Indicates if all nodes are folded." ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "knownRowsCount", - "name": "knownRowsCount", - "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." - ] - }, + "uid": "isFilterActive", + "name": "isFilterActive", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:DataSourceListCounts", "required": false }, { - "uid": "totalCount", - "name": "totalCount", - "comment": { - "raw": [ - "Total count of items, before applying the filter. If there's a tree, it counts all nodes, including folded children" - ] - }, + "uid": "sortDirection", + "name": "sortDirection", "typeValue": { - "raw": "number" + "raw": "'asc' | 'desc'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "asc", + "desc" + ] }, - "from": "@epam/uui-core:DataSourceListCounts", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataSourceState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataSourceState", - "nameFull": "DataSourceState" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Holds state of a components displaying lists - like tables. Holds virtual list position, filter, search, selection, etc." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataSourceState", - "print": [ - "/** Holds state of a components displaying lists - like tables. Holds virtual list position, filter, search, selection, etc. */", - "interface DataSourceState, TId = any> extends VirtualListState {", - " /**", - " * Search value, used to filter data based on it.", - " * Included in the API request object when using a LazyDataSource.", - " * For Array and Async data sources, searching is performed internally by the datasource.", - " * */", - " search?: string;", - " /** Array of checked items IDs */", - " checked?: TId[];", - " /**", - " * A map of item IDs to their folding state.", - " * If an item ID is present with a `true` value, it's folded; otherwise, it's not folded.", - " * */", - " folded?: Record;", - " /**", - " * Filter value used to filter data based on it.", - " * Included in the API request object when using a LazyDataSource.", - " * For Array and Async data sources, filtering is performed internally by the datasource.", - " * */", - " filter?: TFilter;", - " /**", - " * Sorting value, used to sort data based on it.", - " * Included in the API request object when using a LazyDataSource.", - " * For Array and Async data sources, sorting is performed internally by the datasource.", - " * */", - " sorting?: SortingOption[];", - " /** ID of selected item. It can be only one selected item at the moment. */", - " selectedId?: TId;", - " /** Index of currently focused item */", - " focusedIndex?: number;", - " /** Current page number */", - " page?: number;", - " /** The amount of items per page */", - " pageSize?: number;", - " /**", - " * Provides default folding of nodes if the opposite value is not present in the folded map.", - " * It is used to collapse/expand all nodes.", - " */", - " foldAll?: boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "search", - "name": "search", - "comment": { - "raw": [ - "Search value, used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, searching is performed internally by the datasource." - ] + "uid": "onSort", + "name": "onSort", + "typeValue": { + "raw": "(dir: SortDirection) => void" + }, + "editor": { + "type": "func" }, + "required": true + }, + { + "uid": "onDrop", + "name": "onDrop", "typeValue": { - "raw": "string" + "raw": "(params: DropParams, DataColumnProps>) => void" }, "editor": { - "type": "string" + "type": "func" }, "required": false }, { - "uid": "checked", - "name": "checked", - "comment": { - "raw": [ - "Array of checked items IDs" - ] - }, + "uid": "renderFilter", + "name": "renderFilter", "typeValue": { - "raw": "TId[]" + "raw": "(dropdownProps: IDropdownBodyProps) => React.ReactNode" + }, + "editor": { + "type": "component" }, "required": false }, { - "uid": "folded", - "name": "folded", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "A map of item IDs to their folding state.", - " If an item ID is present with a `true` value, it's folded; otherwise, it's not folded." + "True if component contains invalid input" ] }, "typeValue": { - "raw": "Record" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Filter value used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, filtering is performed internally by the datasource." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "TFilter" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "sorting", - "name": "sorting", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Sorting value, used to sort data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, sorting is performed internally by the datasource." + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "SortingOption[]" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "selectedId", - "name": "selectedId", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "ID of selected item. It can be only one selected item at the moment." + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "TId" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "focusedIndex", - "name": "focusedIndex", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Index of currently focused item" + "The current value of component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "DataTableState" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "page", - "name": "page", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Current page number" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "number" + "raw": "(newValue: DataTableState) => void" }, "editor": { - "type": "number" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "pageSize", - "name": "pageSize", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "The amount of items per page" + "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:IDropdownToggler", "required": false }, { - "uid": "foldAll", - "name": "foldAll", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "Provides default folding of nodes if the opposite value is not present in the folded map.", - " It is used to collapse/expand all nodes." + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { @@ -7072,73 +9005,76 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "scrollTo", - "name": "scrollTo", + "uid": "cx", + "name": "cx", "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." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "ScrollToConfig" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:VirtualListState", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "topIndex", - "name": "topIndex", + "uid": "allowColumnsReordering", + "name": "allowColumnsReordering", "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" - ] + "If true, allows user to change columns order", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:VirtualListRange", + "from": "@epam/uui-core:DataTableColumnsConfigOptions", "required": false }, { - "uid": "visibleCount", - "name": "visibleCount", + "uid": "allowColumnsResizing", + "name": "allowColumnsResizing", "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." - ] + "If true, allows user to change columns width", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:VirtualListRange", + "from": "@epam/uui-core:DataTableColumnsConfigOptions", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataTableCellOptions": { + "@epam/uui-core:DataTableHeaderRowProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataTableCellOptions", - "nameFull": "DataTableCellOptions" + "name": "DataTableHeaderRowProps", + "nameFull": "DataTableHeaderRowProps" }, "src": "uui-core/src/types/tables.ts", "exported": true @@ -7146,143 +9082,253 @@ "details": { "kind": 264, "typeValue": { - "raw": "DataTableCellOptions", + "raw": "DataTableHeaderRowProps", "print": [ - "interface DataTableCellOptions {", - " /** Key to use as component's key */", - " key: string;", - " /** DataTableRowsProps object for the table row the cell is at */", - " rowProps: DataTableRowProps;", - " /** DataColumnProps object for the column the cell is at */", - " column: DataColumnProps;", - " /** Column index in table */", - " index?: number;", - " /** True if the cell is in the first column */", - " isFirstColumn: boolean;", - " /** True if the cell is in the last column */", - " isLastColumn: boolean;", - " /** HTML tabIndex attribute to set on the cell */", - " tabIndex?: React.HTMLAttributes['tabIndex'];", + "interface DataTableHeaderRowProps extends IEditable, IHasCX, DataTableColumnsConfigOptions {", + " columns: DataColumnProps[];", + " selectAll?: ICheckable;", + " /**", + " * Enables collapse/expand all functionality.", + " * */", + " showFoldAll?: boolean;", + " onConfigButtonClick?: (params: DataTableConfigModalParams) => any;", + " renderCell?: (props: DataTableHeaderCellProps) => React.ReactNode;", + " renderConfigButton?: () => React.ReactNode;", "}" ] }, "props": [ { - "uid": "key", - "name": "key", + "uid": "columns", + "name": "columns", + "typeValue": { + "raw": "DataColumnProps[]" + }, + "required": true + }, + { + "uid": "selectAll", + "name": "selectAll", + "typeValue": { + "raw": "ICheckable" + }, + "required": false + }, + { + "uid": "showFoldAll", + "name": "showFoldAll", + "comment": { + "raw": [ + "Enables collapse/expand all functionality." + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "onConfigButtonClick", + "name": "onConfigButtonClick", + "typeValue": { + "raw": "(params: DataTableConfigModalParams) => any" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "renderCell", + "name": "renderCell", + "typeValue": { + "raw": "(props: DataTableHeaderCellProps) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": false + }, + { + "uid": "renderConfigButton", + "name": "renderConfigButton", + "typeValue": { + "raw": "() => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "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": [ - "Key to use as component's key" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDisableable", + "required": false }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "DataTableRowsProps object for the table row the cell is at" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "DataTableRowProps" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeReadonly", + "required": false }, { - "uid": "column", - "name": "column", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "DataColumnProps object for the column the cell is at" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "DataColumnProps" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", + "required": false }, { - "uid": "index", - "name": "index", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Column index in table" + "The current value of component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "DataTableState" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "isFirstColumn", - "name": "isFirstColumn", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "True if the cell is in the first column" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: DataTableState) => void" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "isLastColumn", - "name": "isLastColumn", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "True if the cell is in the last column" + "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": "allowColumnsReordering", + "name": "allowColumnsReordering", + "comment": { + "raw": [ + "If true, allows user to change columns order", + " @default false" + ], + "tags": { + "@default": false + } + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:DataTableColumnsConfigOptions", + "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "allowColumnsResizing", + "name": "allowColumnsResizing", "comment": { "raw": [ - "HTML tabIndex attribute to set on the cell" - ] + "If true, allows user to change columns width", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, + "from": "@epam/uui-core:DataTableColumnsConfigOptions", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataTableCellProps": { + "@epam/uui-core:DataTableRowProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataTableCellProps", - "nameFull": "DataTableCellProps" + "name": "DataTableRowProps", + "nameFull": "DataTableRowProps" }, "src": "uui-core/src/types/tables.ts", "exported": true @@ -7290,57 +9336,49 @@ "details": { "kind": 264, "typeValue": { - "raw": "DataTableCellProps", + "raw": "DataTableRowProps", "print": [ - "interface DataTableCellProps extends DataTableCellOptions, IHasCX, Partial>, IHasValidationMessage {", - " /** Add-on controls to put before the cell content (folding arrow, checkbox, etc.) */", - " addons?: React.ReactNode;", - " /** Overrides default loading placeholder ('skeleton') rendering.", - " * By default: () => Unknown ", + "interface DataTableRowProps extends DataRowProps {", + " /** Array of visible columns */", + " columns?: DataColumnProps[];", + " /**", + " * Render callback for each cell at row.", + " * If omitted, default cell renderer will be used.", " * */", - " renderPlaceholder?(cellProps: DataTableCellProps): React.ReactNode;", - " /** Overrides default unknown item rendering */", - " renderUnknown?(cellProps: DataTableCellProps): React.ReactNode;", + " renderCell?: (props: DataTableCellProps) => ReactNode;", " /**", - " * If passed, the cell is rendered as editable - receives focus, show validation errors.", - " * All necessary props for the editor are passed as argument:", - " * - props implements IEditable and can be passed directly to suitable component (like TextInput)", - " * - ICanFocus props are passed as well. Component should implement it so cell focus highlight works properly", - " * - mode='cell' prop is passed to render UUI components in 'cell' mode", - " * - rowProps is passed, so you depend on additional info about the row itself", - " */", - " renderEditor?(props: RenderEditorProps): React.ReactNode;", - " /** Overrides default tooltip, used to show validation message if the cell is invalid */", - " renderTooltip?: (props: ICanBeInvalid & TooltipCoreProps) => React.ReactElement;", + " * Render callback for the drop marker. Rendered only if 'dnd' option was provided via getRowProps.", + " * If omitted, default renderer will be used.", + " * */", + " renderDropMarkers?: (props: DndActorRenderParams) => ReactNode;", "}" ] }, "props": [ { - "uid": "addons", - "name": "addons", + "uid": "columns", + "name": "columns", "comment": { "raw": [ - "Add-on controls to put before the cell content (folding arrow, checkbox, etc.)" + "Array of visible columns" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "DataColumnProps[]" }, - "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "renderPlaceholder", - "name": "renderPlaceholder", + "uid": "renderCell", + "name": "renderCell", "comment": { "raw": [ - "Overrides default loading placeholder ('skeleton') rendering.", - " By default: () => Unknown " + "Render callback for each cell at row.", + " If omitted, default cell renderer will be used." ] }, "typeValue": { - "raw": "(cellProps: DataTableCellProps) => React.ReactNode" + "raw": "(props: DataTableCellProps) => React.ReactNode" }, "editor": { "type": "component" @@ -7348,15 +9386,16 @@ "required": false }, { - "uid": "renderUnknown", - "name": "renderUnknown", + "uid": "renderDropMarkers", + "name": "renderDropMarkers", "comment": { "raw": [ - "Overrides default unknown item rendering" + "Render callback for the drop marker. Rendered only if 'dnd' option was provided via getRowProps.", + " If omitted, default renderer will be used." ] }, "typeValue": { - "raw": "(cellProps: DataTableCellProps) => React.ReactNode" + "raw": "(props: DndActorRenderParams) => React.ReactNode" }, "editor": { "type": "component" @@ -7364,127 +9403,175 @@ "required": false }, { - "uid": "renderEditor", - "name": "renderEditor", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "If passed, the cell is rendered as editable - receives focus, show validation errors.", - " All necessary props for the editor are passed as argument:", - " - props implements IEditable and can be passed directly to suitable component (like TextInput)", - " - ICanFocus props are passed as well. Component should implement it so cell focus highlight works properly", - " - mode='cell' prop is passed to render UUI components in 'cell' mode", - " - rowProps is passed, so you depend on additional info about the row itself" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "(props: RenderEditorProps) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "renderTooltip", - "name": "renderTooltip", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Overrides default tooltip, used to show validation message if the cell is invalid" + "Called when component is clicked" ] }, "typeValue": { - "raw": "(props: ICanBeInvalid & TooltipCoreProps) => React.ReactElement>" + "raw": "((e?: any) => void) & ((rowProps: DataRowProps) => void) & ((rowProps: DataRowProps) => void)" }, "editor": { - "type": "component" + "type": "func" }, + "from": "@epam/uui-core:IClickable", "required": false }, { "uid": "key", "name": "key", + "typeValue": { + "raw": "null | string | number" + }, + "from": "@types/react:Attributes", + "required": false + }, + { + "uid": "children", + "name": "children", "comment": { "raw": [ - "Key to use as component's key" + "Component children" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", + "required": false }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "DataTableRowsProps object for the table row the cell is at" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "DataTableRowProps" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "@epam/uui-core:IHasRawProps", + "required": false }, { - "uid": "column", - "name": "column", + "uid": "alignItems", + "name": "alignItems", "comment": { "raw": [ - "DataColumnProps object for the column the cell is at" - ] + "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", + " @default 'center'" + ], + "tags": { + "@default": "center" + } }, "typeValue": { - "raw": "DataColumnProps" + "raw": "'top' | 'bottom' | 'center' | 'stretch'" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "editor": { + "type": "oneOf", + "options": [ + "top", + "bottom", + "center", + "stretch" + ] + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false }, { - "uid": "index", - "name": "index", + "uid": "justifyContent", + "name": "justifyContent", "comment": { "raw": [ - "Column index in table" + "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" ] }, "typeValue": { - "raw": "number" + "raw": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "center", + "space-around", + "space-between", + "space-evenly", + "end", + "start" + ] }, - "from": "@epam/uui-core:DataTableCellOptions", + "from": "@epam/uui-core:FlexRowProps", "required": false }, { - "uid": "isFirstColumn", - "name": "isFirstColumn", + "uid": "columnGap", + "name": "columnGap", "comment": { "raw": [ - "True if the cell is in the first column" + "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" ] }, "typeValue": { - "raw": "boolean" + "raw": "number | '6' | '12' | '18' | '24' | '36'" }, - "editor": { - "type": "bool" + "from": "@epam/uui-core:FlexRowProps", + "required": false + }, + { + "uid": "rowGap", + "name": "rowGap", + "comment": { + "raw": [ + "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + ] }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "typeValue": { + "raw": "number | '6' | '12' | '18' | '24' | '36'" + }, + "from": "@epam/uui-core:FlexRowProps", + "required": false }, { - "uid": "isLastColumn", - "name": "isLastColumn", + "uid": "checkbox", + "name": "checkbox", "comment": { "raw": [ - "True if the cell is in the last column" + "If row needs a checkbox, this field should be specified, and it props can be configured here" + ] + }, + "typeValue": { + "raw": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + }, + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "isSelectable", + "name": "isSelectable", + "comment": { + "raw": [ + "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" ] }, "typeValue": { @@ -7493,39 +9580,53 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "@epam/uui-core:DataRowOptions", + "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "dnd", + "name": "dnd", "comment": { "raw": [ - "HTML tabIndex attribute to set on the cell" + "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." ] }, "typeValue": { - "raw": "number" + "raw": "IDndActor" }, - "editor": { - "type": "number" + "from": "@epam/uui-core:DataRowOptions", + "required": false + }, + { + "uid": "link", + "name": "link", + "comment": { + "raw": [ + "Can be specified to make row act as a link (plain or SPA)" + ] }, - "from": "@epam/uui-core:DataTableCellOptions", + "typeValue": { + "raw": "Link" + }, + "from": "@epam/uui-core:DataRowOptions", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "pin", + "name": "pin", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "A pure function that gets pinned state for each row.", + " If row pinned, it means that it will be sticky inside their parent section." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(rowProps: DataRowProps) => boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataRowOptions", "required": false }, { @@ -7605,10 +9706,10 @@ ] }, "typeValue": { - "raw": "TCellValue" + "raw": "TItem" }, "from": "@epam/uui-core:IControlled", - "required": false + "required": true }, { "uid": "onValueChange", @@ -7619,7 +9720,7 @@ ] }, "typeValue": { - "raw": "(newValue: TCellValue) => void" + "raw": "(newValue: TItem) => void" }, "editor": { "type": "func" @@ -7641,319 +9742,159 @@ "typeValueRef": "@types/react:ReactNode", "from": "@epam/uui-core:IHasValidationMessage", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataTableColumnsConfigOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataTableColumnsConfigOptions", - "nameFull": "DataTableColumnsConfigOptions" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataTableColumnsConfigOptions", - "print": [ - "interface DataTableColumnsConfigOptions {", - " /** If true, allows user to change columns order", - " * @default false", - " * */", - " allowColumnsReordering?: boolean;", - " /** If true, allows user to change columns width", - " * @default false", - " * */", - " allowColumnsResizing?: boolean;", - "}" - ] - }, - "props": [ - { - "uid": "allowColumnsReordering", - "name": "allowColumnsReordering", - "comment": { - "raw": [ - "If true, allows user to change columns order", - " @default false" - ], - "tags": { - "@default": false - } - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "required": false }, { - "uid": "allowColumnsResizing", - "name": "allowColumnsResizing", - "comment": { - "raw": [ - "If true, allows user to change columns width", - " @default false" - ], - "tags": { - "@default": false - } - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataTableConfigModalParams": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataTableConfigModalParams", - "nameFull": "DataTableConfigModalParams" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "DataTableConfigModalParams", - "print": [ - "type DataTableConfigModalParams = IEditable & {", - " /** Array of all table columns */", - " columns: DataColumnProps[];", - "};" - ] - }, - "props": [ - { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "id", + "name": "id", "comment": { "raw": [ - "True if component contains invalid input" + "ID of the TItem rows displays" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TId" }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false + "from": "@epam/uui-core:DataRowProps", + "required": true }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "rowKey", + "name": "rowKey", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Key to be used as component's key when rendering. Usually, it's stringified ID" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:IDisableable", - "required": false + "from": "@epam/uui-core:DataRowProps", + "required": true }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Index of the row, from the top of the list. This doesn't account any hierarchy." ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false + "from": "@epam/uui-core:DataRowProps", + "required": true }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "parentId", + "name": "parentId", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "ID of the parent TItem" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TId" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "value", - "name": "value", + "uid": "path", + "name": "path", "comment": { "raw": [ - "The current value of component" + "Hierarchical path from the root node to the item (excluding the item itself)" ] }, "typeValue": { - "raw": "DataSourceState, any>" + "raw": "DataRowPathItem[]" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "depth", + "name": "depth", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Depth of the row in tree, 0 for the top-level" ] }, "typeValue": { - "raw": "(newValue: DataSourceState, any>) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "columns", - "name": "columns", + "uid": "indent", + "name": "indent", "comment": { "raw": [ - "Array of all table columns" + "Indent of the item, to show hierarchy.", + " Unlike depth, it contains additional logic, to not add unnecessary indents:", + " if all children of node has no children, all nodes would get the same indent as parent." ] }, "typeValue": { - "raw": "DataColumnProps[]" - }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataTableHeaderCellProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataTableHeaderCellProps", - "nameFull": "DataTableHeaderCellProps" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataTableHeaderCellProps", - "print": [ - "interface DataTableHeaderCellProps extends IEditable, IDropdownToggler, IHasCX, DataTableColumnsConfigOptions {", - " key: string;", - " column: DataColumnProps;", - " isFirstColumn: boolean;", - " isLastColumn: boolean;", - " selectAll?: ICheckable;", - " /**", - " * Enables collapse/expand all functionality.", - " * */", - " showFoldAll?: boolean;", - " /**", - " * Fold all click handler.", - " * If `showFoldAll` is not enabled, onFoldAll is not passed.", - " * */", - " onFoldAll?(): void;", - " /**", - " * Indicates if all nodes are folded.", - " */", - " areAllFolded?: boolean;", - " isFilterActive?: boolean;", - " sortDirection?: SortDirection;", - " onSort(dir: SortDirection): void;", - " onDrop?(params: DropParams, DataColumnProps>): void;", - " renderFilter?: (dropdownProps: IDropdownBodyProps) => React.ReactNode;", - "}" - ] - }, - "props": [ - { - "uid": "key", - "name": "key", - "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "required": true + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "column", - "name": "column", - "typeValue": { - "raw": "DataColumnProps" + "uid": "isLoading", + "name": "isLoading", + "comment": { + "raw": [ + "True if row is in loading state. 'value' is empty in this case" + ] }, - "required": true - }, - { - "uid": "isFirstColumn", - "name": "isFirstColumn", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "isLastColumn", - "name": "isLastColumn", + "uid": "isUnknown", + "name": "isUnknown", + "comment": { + "raw": [ + "True if item doesn't exist in a dataSource" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "required": true - }, - { - "uid": "selectAll", - "name": "selectAll", - "typeValue": { - "raw": "ICheckable" - }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "showFoldAll", - "name": "showFoldAll", + "uid": "isFoldable", + "name": "isFoldable", "comment": { "raw": [ - "Enables collapse/expand all functionality." + "True if row be folded or unfolded (usually because it contains children)" ] }, "typeValue": { @@ -7962,31 +9903,32 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "onFoldAll", - "name": "onFoldAll", + "uid": "isFolded", + "name": "isFolded", "comment": { "raw": [ - "Fold all click handler.", - " If `showFoldAll` is not enabled, onFoldAll is not passed." + "True if row is currently folded" ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "areAllFolded", - "name": "areAllFolded", + "uid": "isChecked", + "name": "isChecked", "comment": { "raw": [ - "Indicates if all nodes are folded." + "True if row is checked with checkbox" ] }, "typeValue": { @@ -7995,73 +9937,50 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isFilterActive", - "name": "isFilterActive", + "uid": "isCheckable", + "name": "isCheckable", + "comment": { + "raw": [ + "True if row has checkbox and can be checkable" + ] + }, "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "sortDirection", - "name": "sortDirection", - "typeValue": { - "raw": "'asc' | 'desc'" - }, - "editor": { - "type": "oneOf", - "options": [ - "asc", - "desc" + "uid": "isChildrenChecked", + "name": "isChildrenChecked", + "comment": { + "raw": [ + "True if some of row's children are checked.", + " Used to show 'indefinite' checkbox state, to show user that something inside is checked" ] }, - "required": false - }, - { - "uid": "onSort", - "name": "onSort", - "typeValue": { - "raw": "(dir: SortDirection) => void" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "onDrop", - "name": "onDrop", - "typeValue": { - "raw": "(params: DropParams, DataColumnProps>) => void" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "renderFilter", - "name": "renderFilter", "typeValue": { - "raw": "(dropdownProps: IDropdownBodyProps) => React.ReactNode" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "isSelected", + "name": "isSelected", "comment": { "raw": [ - "True if component contains invalid input" + "True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes)" ] }, "typeValue": { @@ -8070,15 +9989,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "isChildrenSelected", + "name": "isChildrenSelected", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "True if any of row's children is selected." ] }, "typeValue": { @@ -8087,15 +10006,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isFocused", + "name": "isFocused", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row" ] }, "typeValue": { @@ -8104,15 +10023,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "isLastChild", + "name": "isLastChild", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "True if row is the last child of his parent" ] }, "typeValue": { @@ -8121,141 +10040,162 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "value", - "name": "value", + "uid": "onFold", + "name": "onFold", "comment": { "raw": [ - "The current value of component" + "Handles row folding change.", + " We demand to pass the row as well, to avoid creating closures for each row." ] }, "typeValue": { - "raw": "DataTableState" + "raw": "(rowProps: DataRowProps) => void" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "onCheck", + "name": "onCheck", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Handles row checkbox change.", + " We demand to pass the row as well, to avoid creating closures for each row." ] }, "typeValue": { - "raw": "(newValue: DataTableState) => void" + "raw": "(rowProps: DataRowProps) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:DataRowProps", + "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "onSelect", + "name": "onSelect", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "Handles row selection.", + " We demand to pass the row as well, to avoid creating closures for each row." ] }, "typeValue": { - "raw": "boolean" + "raw": "(rowProps: DataRowProps) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Handles row focusing." ] }, "typeValue": { - "raw": "boolean" + "raw": "(focusedIndex: number) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDropdownToggler", + "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "isPinned", + "name": "isPinned", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "True if row pinned, it means that it will be sticky inside his nesting level" ] }, "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:DataRowProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DataTableSelectedCellData": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DataTableSelectedCellData", + "nameFull": "DataTableSelectedCellData" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DataTableSelectedCellData", + "print": [ + "interface DataTableSelectedCellData {", + " /** Column props of the selected cell */", + " column: DataColumnProps;", + " /** Row props of the selected cell */", + " row: DataRowProps;", + "}" + ] + }, + "props": [ { - "uid": "allowColumnsReordering", - "name": "allowColumnsReordering", + "uid": "column", + "name": "column", "comment": { "raw": [ - "If true, allows user to change columns order", - " @default false" - ], - "tags": { - "@default": false - } + "Column props of the selected cell" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataColumnProps" }, - "from": "@epam/uui-core:DataTableColumnsConfigOptions", - "required": false + "required": true }, { - "uid": "allowColumnsResizing", - "name": "allowColumnsResizing", + "uid": "row", + "name": "row", "comment": { "raw": [ - "If true, allows user to change columns width", - " @default false" - ], - "tags": { - "@default": false - } + "Row props of the selected cell" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "DataRowProps" }, - "from": "@epam/uui-core:DataTableColumnsConfigOptions", - "required": false + "typeValueRef": "@epam/uui-core:DataRowProps", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:DataTableHeaderRowProps": { + "@epam/uui-core:DataTableState": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataTableHeaderRowProps", - "nameFull": "DataTableHeaderRowProps" + "name": "DataTableState", + "nameFull": "DataTableState" }, "src": "uui-core/src/types/tables.ts", "exported": true @@ -8263,303 +10203,330 @@ "details": { "kind": 264, "typeValue": { - "raw": "DataTableHeaderRowProps", + "raw": "DataTableState", "print": [ - "interface DataTableHeaderRowProps extends IEditable, IHasCX, DataTableColumnsConfigOptions {", - " columns: DataColumnProps[];", - " selectAll?: ICheckable;", - " /**", - " * Enables collapse/expand all functionality.", - " * */", - " showFoldAll?: boolean;", - " onConfigButtonClick?: (params: DataTableConfigModalParams) => any;", - " renderCell?: (props: DataTableHeaderCellProps) => React.ReactNode;", - " renderConfigButton?: () => React.ReactNode;", + "interface DataTableState extends DataSourceState {", + " /** Configuration of columns at the DataTable. Used to define column visibility, width and order */", + " columnsConfig?: ColumnsConfig;", + " /** Configuration of filter at the FilterPanel. Used to define filter visibility and order */", + " filtersConfig?: FiltersConfig;", + " /** ID of currently selected preset */", + " presetId?: number | null;", + " /** State which will not trigger data reloading, but will be stored in presets or URL */", + " viewState?: TViewState;", "}" ] }, "props": [ { - "uid": "columns", - "name": "columns", + "uid": "columnsConfig", + "name": "columnsConfig", + "comment": { + "raw": [ + "Configuration of columns at the DataTable. Used to define column visibility, width and order" + ] + }, "typeValue": { - "raw": "DataColumnProps[]" + "raw": "ColumnsConfig" }, - "required": true + "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "filtersConfig", + "name": "filtersConfig", + "comment": { + "raw": [ + "Configuration of filter at the FilterPanel. Used to define filter visibility and order" + ] + }, "typeValue": { - "raw": "ICheckable" + "raw": "FiltersConfig" }, "required": false }, { - "uid": "showFoldAll", - "name": "showFoldAll", + "uid": "presetId", + "name": "presetId", "comment": { "raw": [ - "Enables collapse/expand all functionality." + "ID of currently selected preset" ] }, "typeValue": { - "raw": "boolean" + "raw": "null | number" }, "editor": { - "type": "bool" + "type": "number" }, "required": false }, { - "uid": "onConfigButtonClick", - "name": "onConfigButtonClick", + "uid": "viewState", + "name": "viewState", + "comment": { + "raw": [ + "State which will not trigger data reloading, but will be stored in presets or URL" + ] + }, "typeValue": { - "raw": "(params: DataTableConfigModalParams) => any" + "raw": "TViewState" + }, + "required": false + }, + { + "uid": "search", + "name": "search", + "comment": { + "raw": [ + "Search value, used to filter data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, searching is performed internally by the datasource." + ] + }, + "typeValue": { + "raw": "string" }, "editor": { - "type": "func" + "type": "string" + }, + "from": "@epam/uui-core:DataSourceState", + "required": false + }, + { + "uid": "checked", + "name": "checked", + "comment": { + "raw": [ + "Array of checked items IDs" + ] + }, + "typeValue": { + "raw": "any[]" }, + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "renderCell", - "name": "renderCell", - "typeValue": { - "raw": "(props: DataTableHeaderCellProps) => React.ReactNode" + "uid": "folded", + "name": "folded", + "comment": { + "raw": [ + "A map of item IDs to their folding state.", + " If an item ID is present with a `true` value, it's folded; otherwise, it's not folded." + ] }, - "editor": { - "type": "component" + "typeValue": { + "raw": "Record" }, + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "renderConfigButton", - "name": "renderConfigButton", - "typeValue": { - "raw": "() => React.ReactNode" + "uid": "filter", + "name": "filter", + "comment": { + "raw": [ + "Filter value used to filter data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, filtering is performed internally by the datasource." + ] }, - "editor": { - "type": "component" + "typeValue": { + "raw": "TFilter" }, + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "sorting", + "name": "sorting", "comment": { "raw": [ - "True if component contains invalid input" + "Sorting value, used to sort data based on it.", + " Included in the API request object when using a LazyDataSource.", + " For Array and Async data sources, sorting is performed internally by the datasource." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "SortingOption[]" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "selectedId", + "name": "selectedId", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "ID of selected item. It can be only one selected item at the moment." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "any" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "focusedIndex", + "name": "focusedIndex", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Index of currently focused item" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "page", + "name": "page", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Current page number" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "value", - "name": "value", + "uid": "pageSize", + "name": "pageSize", "comment": { "raw": [ - "The current value of component" + "The amount of items per page" ] }, "typeValue": { - "raw": "DataTableState" + "raw": "number" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataSourceState", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "foldAll", + "name": "foldAll", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Provides default folding of nodes if the opposite value is not present in the folded map.", + " It is used to collapse/expand all nodes." ] }, "typeValue": { - "raw": "(newValue: DataTableState) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:DataSourceState", + "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "scrollTo", + "name": "scrollTo", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "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." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "ScrollToConfig" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "from": "@epam/uui-core:VirtualListState", "required": false }, { - "uid": "allowColumnsReordering", - "name": "allowColumnsReordering", + "uid": "topIndex", + "name": "topIndex", "comment": { "raw": [ - "If true, allows user to change columns order", - " @default false" - ], - "tags": { - "@default": false - } + "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": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:DataTableColumnsConfigOptions", + "from": "@epam/uui-core:VirtualListRange", "required": false }, { - "uid": "allowColumnsResizing", - "name": "allowColumnsResizing", + "uid": "visibleCount", + "name": "visibleCount", "comment": { "raw": [ - "If true, allows user to change columns width", - " @default false" - ], - "tags": { - "@default": false - } + "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": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:DataTableColumnsConfigOptions", + "from": "@epam/uui-core:VirtualListRange", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataTableRowProps": { + "@epam/uui-core:DatePickerCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataTableRowProps", - "nameFull": "DataTableRowProps" + "name": "DatePickerCoreProps", + "nameFull": "DatePickerCoreProps" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/types/components/datePicker/DatePicker.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataTableRowProps", + "raw": "DatePickerCoreProps", "print": [ - "interface DataTableRowProps extends DataRowProps {", - " /** Array of visible columns */", - " columns?: DataColumnProps[];", - " /**", - " * Render callback for each cell at row.", - " * If omitted, default cell renderer will be used.", - " * */", - " renderCell?: (props: DataTableCellProps) => ReactNode;", - " /**", - " * Render callback for the drop marker. Rendered only if 'dnd' option was provided via getRowProps.", - " * If omitted, default renderer will be used.", - " * */", - " renderDropMarkers?: (props: DndActorRenderParams) => ReactNode;", + "interface DatePickerCoreProps extends BaseDatePickerProps {", + " /** render prop to add a custom footer inside the DatePicker dropdown body */", + " renderFooter?(): ReactNode;", "}" ] }, "props": [ { - "uid": "columns", - "name": "columns", - "comment": { - "raw": [ - "Array of visible columns" - ] - }, - "typeValue": { - "raw": "DataColumnProps[]" - }, - "required": false - }, - { - "uid": "renderCell", - "name": "renderCell", + "uid": "renderFooter", + "name": "renderFooter", "comment": { "raw": [ - "Render callback for each cell at row.", - " If omitted, default cell renderer will be used." + "render prop to add a custom footer inside the DatePicker dropdown body" ] }, "typeValue": { - "raw": "(props: DataTableCellProps) => React.ReactNode" + "raw": "() => React.ReactNode" }, "editor": { "type": "component" @@ -8567,247 +10534,225 @@ "required": false }, { - "uid": "renderDropMarkers", - "name": "renderDropMarkers", + "uid": "format", + "name": "format", "comment": { "raw": [ - "Render callback for the drop marker. Rendered only if 'dnd' option was provided via getRowProps.", - " If omitted, default renderer will be used." + "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" ] }, "typeValue": { - "raw": "(props: DndActorRenderParams) => React.ReactNode" + "raw": "string" }, "editor": { - "type": "component" + "type": "string" }, + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Filter selectable days. Days, for which this callback returns false - will be disabled" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(day: Dayjs) => boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "renderTarget", + "name": "renderTarget", "comment": { "raw": [ - "Called when component is clicked" + "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons" ] }, "typeValue": { - "raw": "((e?: any) => void) & ((rowProps: DataRowProps) => void) & ((rowProps: DataRowProps) => void)" + "raw": "(props: IDropdownToggler) => React.ReactNode" }, "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IClickable", - "required": false - }, - { - "uid": "key", - "name": "key", - "typeValue": { - "raw": "null | string | number" + "type": "component" }, - "from": "@types/react:Attributes", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "children", - "name": "children", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Component children" + "Defines where to place calendar icon" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "'left' | 'right'" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", - "required": false - }, - { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" ] }, - "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" - }, - "from": "@epam/uui-core:IHasRawProps", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "alignItems", - "name": "alignItems", + "uid": "disableClear", + "name": "disableClear", "comment": { "raw": [ - "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", - " @default 'center'" + "Disable clearing date value (e.g. via cross icon)", + " @default false" ], "tags": { - "@default": "center" + "@default": false } }, "typeValue": { - "raw": "'top' | 'bottom' | 'center' | 'stretch'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "top", - "bottom", - "center", - "stretch" - ] + "type": "bool" }, - "from": "@epam/uui-core:FlexRowProps", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "justifyContent", - "name": "justifyContent", + "uid": "renderDay", + "name": "renderDay", "comment": { "raw": [ - "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" + "Overrides rendering of the single day. For example, to highlight certain days" ] }, "typeValue": { - "raw": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" + "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" }, "editor": { - "type": "oneOf", - "options": [ - "center", - "space-around", - "space-between", - "space-evenly", - "end", - "start" - ] + "type": "component" }, - "from": "@epam/uui-core:FlexRowProps", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "columnGap", - "name": "columnGap", + "uid": "isHoliday", + "name": "isHoliday", "comment": { "raw": [ - "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + "If this function returns true, the day will be highlighted as holiday" ] }, "typeValue": { - "raw": "number | '6' | '12' | '18' | '24' | '36'" - }, - "from": "@epam/uui-core:FlexRowProps", - "required": false - }, - { - "uid": "rowGap", - "name": "rowGap", - "comment": { - "raw": [ - "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" - ] + "raw": "(day: Dayjs) => boolean" }, - "typeValue": { - "raw": "number | '6' | '12' | '18' | '24' | '36'" + "editor": { + "type": "func" }, - "from": "@epam/uui-core:FlexRowProps", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "checkbox", - "name": "checkbox", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "If row needs a checkbox, this field should be specified, and it props can be configured here" + "Called when component lose focus" ] }, "typeValue": { - "raw": "{ isVisible: boolean; } & IDisableable & ICanBeInvalid" + "raw": "(e?: React.FocusEvent | undefined) => void" }, - "from": "@epam/uui-core:DataRowOptions", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "isSelectable", - "name": "isSelectable", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "True if row is selectable (for whole-row single-selection, multi-selection via checkbox are configured with the checkbox prop)" + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "boolean" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, - "from": "@epam/uui-core:DataRowOptions", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "dnd", - "name": "dnd", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Configures row drag-n-drop options - if it can be dragged, can rows can be dropped into it, etc." + "Any HTML attributes (native or 'data-') to put on date picker parts" ] }, "typeValue": { - "raw": "IDndActor" + "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" }, - "from": "@epam/uui-core:DataRowOptions", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "link", - "name": "link", + "uid": "inputCx", + "name": "inputCx", "comment": { "raw": [ - "Can be specified to make row act as a link (plain or SPA)" + "CSS class(es) to put on datepicker input" ] }, "typeValue": { - "raw": "Link" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DataRowOptions", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "pin", - "name": "pin", + "uid": "bodyCx", + "name": "bodyCx", "comment": { "raw": [ - "A pure function that gets pinned state for each row.", - " If row pinned, it means that it will be sticky inside their parent section." + "CSS class(es) to put on datepicker body" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => boolean" - }, - "editor": { - "type": "func" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "from": "@epam/uui-core:DataRowOptions", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { @@ -8887,7 +10832,10 @@ ] }, "typeValue": { - "raw": "TItem" + "raw": "null | string" + }, + "editor": { + "type": "string" }, "from": "@epam/uui-core:IControlled", "required": true @@ -8901,147 +10849,264 @@ ] }, "typeValue": { - "raw": "(newValue: TItem) => void" + "raw": "(newValue: string | null) => void" }, "editor": { "type": "func" }, "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "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": "validationMessage", - "name": "validationMessage", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "Message describing why the value is invalid" + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "any" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", + "from": "@epam/uui-core:IHasPlaceholder", "required": false }, { - "uid": "id", - "name": "id", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "ID of the TItem rows displays" + "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": "TId" + "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" }, - "from": "@epam/uui-core:DataRowProps", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IAnalyticableOnChange", + "required": false }, { - "uid": "rowKey", - "name": "rowKey", + "uid": "forwardedRef", + "name": "forwardedRef", + "comment": { + "raw": [ + "this ref is passed to the underlying component" + ] + }, + "typeValue": { + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + }, + "from": "@epam/uui-core:IHasForwardedRef", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DndActorProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DndActorProps", + "nameFull": "DndActorProps" + }, + "src": "uui-core/src/services/dnd/DndActor.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DndActorProps", + "print": [ + "interface DndActorProps extends IDndActor {", + " /** Render callback for DragActor content */", + " render(props: DndActorRenderParams): React.ReactNode;", + "}" + ] + }, + "props": [ + { + "uid": "render", + "name": "render", "comment": { "raw": [ - "Key to be used as component's key when rendering. Usually, it's stringified ID" + "Render callback for DragActor content" ] }, "typeValue": { - "raw": "string" + "raw": "(props: DndActorRenderParams) => React.ReactNode" }, "editor": { - "type": "string" + "type": "component" }, - "from": "@epam/uui-core:DataRowProps", "required": true }, { - "uid": "index", - "name": "index", + "uid": "srcData", + "name": "srcData", "comment": { "raw": [ - "Index of the row, from the top of the list. This doesn't account any hierarchy." + "Data used when this component acts as a drag source.", + " If provided, it means this component can be dragged. Can be used in combination with dstData." ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "TSrcData" }, - "from": "@epam/uui-core:DataRowProps", - "required": true + "from": "@epam/uui-core:IDndActor", + "required": false }, { - "uid": "parentId", - "name": "parentId", + "uid": "dstData", + "name": "dstData", "comment": { "raw": [ - "ID of the parent TItem" + "Data used when this component acts as a drop destination.", + " If provided, it means something can be dragged onto this component. Can be used in combination with srcData." ] }, "typeValue": { - "raw": "TId" + "raw": "TDstData" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDndActor", "required": false }, { - "uid": "path", - "name": "path", + "uid": "canAcceptDrop", + "name": "canAcceptDrop", "comment": { "raw": [ - "Hierarchical path from the root node to the item (excluding the item itself)" + "A pure function that gets permitted positions for a drop action" ] }, "typeValue": { - "raw": "DataRowPathItem[]" + "raw": "(params: AcceptDropParams) => Partial> | null" }, - "from": "@epam/uui-core:DataRowProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IDndActor", "required": false }, { - "uid": "depth", - "name": "depth", + "uid": "onDrop", + "name": "onDrop", "comment": { "raw": [ - "Depth of the row in tree, 0 for the top-level" + "Called when accepted drop action performed on this actor. Usually used to reorder and update items" ] }, "typeValue": { - "raw": "number" + "raw": "(data: DropParams) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDndActor", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DndActorRenderParams": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DndActorRenderParams", + "nameFull": "DndActorRenderParams" + }, + "src": "uui-core/src/types/dnd.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DndActorRenderParams", + "print": [ + "interface DndActorRenderParams {", + " /** True, if the element can be dragged. Doesn't mean that DnD is active. */", + " isDraggable: boolean;", + " /** True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost. */", + " isDraggedOut: boolean;", + " /** True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost. */", + " isDragGhost: boolean;", + " /** True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false) */", + " isDraggedOver: boolean;", + " /** True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true */", + " isDropAccepted: boolean;", + " /** True if any drag and drop operation is in progress, even if the element not being dragged */", + " isDndInProgress: boolean;", + " /** Drag data associated with the element. Specified always, even if there is no DnD operation happening. */", + " dragData?: any;", + " /** Drop position. Chosen from accepted drop positions according to pointer coordinates */", + " position?: DropPosition;", + " /**", + " * 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", + " */", + " eventHandlers: {", + " onTouchStart?(e: React.TouchEvent): void;", + " onPointerDown?(e: React.PointerEvent): void;", + " onPointerEnter?(e: React.PointerEvent): void;", + " onPointerMove?(e: React.PointerEvent): void;", + " onPointerLeave?(e: React.PointerEvent): void;", + " onPointerUp?(e: React.PointerEvent): void;", + " };", + " /**", + " * 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.", + " */", + " classNames: string[];", + " /** Ref to the DOM element to perform DnD actions */", + " ref?: React.Ref;", + "}" + ] + }, + "props": [ { - "uid": "indent", - "name": "indent", + "uid": "isDraggable", + "name": "isDraggable", "comment": { "raw": [ - "Indent of the item, to show hierarchy.", - " Unlike depth, it contains additional logic, to not add unnecessary indents:", - " if all children of node has no children, all nodes would get the same indent as parent." + "True, if the element can be dragged. Doesn't mean that DnD is active." ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isLoading", - "name": "isLoading", + "uid": "isDraggedOut", + "name": "isDraggedOut", "comment": { "raw": [ - "True if row is in loading state. 'value' is empty in this case" + "True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost." ] }, "typeValue": { @@ -9050,15 +11115,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isUnknown", - "name": "isUnknown", + "uid": "isDragGhost", + "name": "isDragGhost", "comment": { "raw": [ - "True if item doesn't exist in a dataSource" + "True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost." ] }, "typeValue": { @@ -9067,15 +11131,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isFoldable", - "name": "isFoldable", + "uid": "isDraggedOver", + "name": "isDraggedOver", "comment": { "raw": [ - "True if row be folded or unfolded (usually because it contains children)" + "True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false)" ] }, "typeValue": { @@ -9084,15 +11147,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isFolded", - "name": "isFolded", + "uid": "isDropAccepted", + "name": "isDropAccepted", "comment": { "raw": [ - "True if row is currently folded" + "True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true" ] }, "typeValue": { @@ -9101,15 +11163,14 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isChecked", - "name": "isChecked", + "uid": "isDndInProgress", + "name": "isDndInProgress", "comment": { "raw": [ - "True if row is checked with checkbox" + "True if any drag and drop operation is in progress, even if the element not being dragged" ] }, "typeValue": { @@ -9118,323 +11179,449 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isCheckable", - "name": "isCheckable", + "uid": "dragData", + "name": "dragData", "comment": { "raw": [ - "True if row has checkbox and can be checkable" + "Drag data associated with the element. Specified always, even if there is no DnD operation happening." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "any" }, - "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isChildrenChecked", - "name": "isChildrenChecked", + "uid": "position", + "name": "position", "comment": { "raw": [ - "True if some of row's children are checked.", - " Used to show 'indefinite' checkbox state, to show user that something inside is checked" + "Drop position. Chosen from accepted drop positions according to pointer coordinates" ] }, "typeValue": { - "raw": "boolean" + "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "left", + "right", + "top", + "bottom", + "inside" + ] }, - "from": "@epam/uui-core:DataRowProps", "required": false }, { - "uid": "isSelected", - "name": "isSelected", + "uid": "eventHandlers", + "name": "eventHandlers", "comment": { "raw": [ - "True if row is selected (in single-select mode, or in case when interface use both single row selection and checkboxes)" + "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": "boolean" - }, - "editor": { - "type": "bool" + "raw": "{ onTouchStart?(e: React.TouchEvent): void; onPointerDown?(e: React.PointerEvent): void; onPointerEnter?(e: React.PointerEvent): void; onPointerMove?(e: React.PointerEvent): void; onPointerLeave?(e: React.PointerEvent): void; onPointerUp?(e: React.PointerEvent): void; }" }, - "from": "@epam/uui-core:DataRowProps", - "required": false + "required": true }, { - "uid": "isChildrenSelected", - "name": "isChildrenSelected", + "uid": "classNames", + "name": "classNames", "comment": { "raw": [ - "True if any of row's children is selected." + "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": "boolean" + "raw": "string[]" }, - "editor": { - "type": "bool" + "required": true + }, + { + "uid": "ref", + "name": "ref", + "comment": { + "raw": [ + "Ref to the DOM element to perform DnD actions" + ] + }, + "typeValue": { + "raw": "null | (instance: any) => void | React.RefObject" }, - "from": "@epam/uui-core:DataRowProps", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DragGhostProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DragGhostProps", + "nameFull": "DragGhostProps" + }, + "src": "uui-core/src/services/dnd/DragGhost.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DragGhostProps", + "print": [ + "interface DragGhostProps {", + "}" + ] + } + } + }, + "@epam/uui-core:DropdownBodyProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DropdownBodyProps", + "nameFull": "DropdownBodyProps" + }, + "src": "uui-core/src/types/components/Dropdown.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "DropdownBodyProps", + "print": [ + "interface DropdownBodyProps extends IDropdownBodyProps {", + "}" + ] + }, + "props": [ { - "uid": "isFocused", - "name": "isFocused", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "True if row is focused. Focus can be changed via keyboard arrow keys, or by hovering mouse on top of the row" + "Call to close the Dropdown body" ] }, "typeValue": { - "raw": "boolean" + "raw": "() => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "isLastChild", - "name": "isLastChild", + "uid": "togglerWidth", + "name": "togglerWidth", "comment": { "raw": [ - "True if row is the last child of his parent" + "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-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "onFold", - "name": "onFold", + "uid": "togglerHeight", + "name": "togglerHeight", "comment": { "raw": [ - "Handles row folding change.", - " We demand to pass the row as well, to avoid creating closures for each row." + "The height of the toggler" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "onCheck", - "name": "onCheck", + "uid": "scheduleUpdate", + "name": "scheduleUpdate", "comment": { "raw": [ - "Handles row checkbox change.", - " We demand to pass the row as well, to avoid creating closures for each row." + "Call to force recompute dropdown position" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "onSelect", - "name": "onSelect", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "Handles row selection.", - " We demand to pass the row as well, to avoid creating closures for each row." + "Indicates that dropdown is open" ] }, "typeValue": { - "raw": "(rowProps: DataRowProps) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "arrowProps", + "name": "arrowProps", "comment": { "raw": [ - "Handles row focusing." + "Props that should be provided to the arrow component" ] }, "typeValue": { - "raw": "(focusedIndex: number) => void" - }, - "editor": { - "type": "func" + "raw": "PopperArrowProps" }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "isPinned", - "name": "isPinned", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "True if row pinned, it means that it will be sticky inside his nesting level" + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "boolean" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, - "from": "@epam/uui-core:DataRowProps", + "from": "@epam/uui-core:IDropdownBodyProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DataTableSelectedCellData": { + "@epam/uui-core:DropdownPlacement": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DataTableSelectedCellData", - "nameFull": "DataTableSelectedCellData" + "name": "DropdownPlacement", + "nameFull": "DropdownPlacement" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/types/components/Dropdown.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "Placement", + "print": [ + "type DropdownPlacement = Placement;" + ] + } + } + }, + "@epam/uui-core:DropdownProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DropdownProps", + "nameFull": "DropdownProps" + }, + "src": "uui-core/src/types/components/Dropdown.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DataTableSelectedCellData", + "raw": "DropdownProps", "print": [ - "interface DataTableSelectedCellData {", - " /** Column props of the selected cell */", - " column: DataColumnProps;", - " /** Row props of the selected cell */", - " row: DataRowProps;", + "interface DropdownProps extends Partial>, IHasForwardedRef {", + " /**", + " * Render callback for the dropdown target.", + " * Note, that it's required to pass 'props' parameters to the target component.", + " */", + " renderTarget: (props: IDropdownTogglerProps) => React.ReactNode;", + " /** Render callback for the dropdown body */", + " renderBody: (props: DropdownBodyProps) => React.ReactNode;", + " /** Called when dropdown was closed */", + " onClose?: () => void;", + " /** Disable dropdown opening */", + " isNotUnfoldable?: boolean;", + " /** zIndex for dropdown body", + " * By default used value received by LayoutContext", + " * */", + " zIndex?: number;", + " /** Defines dropdown body placement relative to target */", + " placement?: DropdownPlacement;", + " /** Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/} */", + " modifiers?: Modifier[];", + " /** Defines how much 'ms' user should hold mouse over target to open the dropdown", + " * This prop work only with openOnHover={true}", + " * @default 0", + " * */", + " openDelay?: number;", + " /** Defines after which delay dropdown will be closed, if user leave mouse from target.", + " * This prop work only with openOnHover={true}", + " * @default 0", + " * */", + " closeDelay?: number;", + " /** If true, dropdown will be opened by click on toggler.", + " * @default true", + " * */", + " openOnClick?: boolean;", + " /** If true, dropdown will be opened by hover on toggler.", + " * @default false", + " * */", + " openOnHover?: boolean;", + " /** If true, clicks on target will toggle dropdown open state.", + " * If false, click on target will only open dropdown and won't close it.", + " * @default true", + " * */", + " closeOnTargetClick?: boolean;", + " /** If true, dropdown will be closed on click outside body or toggler.", + " * @default true", + " * */", + " closeOnClickOutside?: boolean;", + " /** 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'", + " * */", + " closeOnMouseLeave?: 'toggler' | 'boundary' | false;", + " /**", + " * Node of portal target, where to render the dropdown body.", + " * By default, will be used global portal node.", + " * */", + " portalTarget?: HTMLElement;", + " /**", + " * Element relative to which dropdown will calculate position", + " * */", + " boundaryElement?: Boundary;", + " /** Pass false, if you do not want to close the dropdown in case Toggler move out of viewport.", + " * @default true", + " * */", + " closeBodyOnTogglerHidden?: boolean; // default: true;", "}" ] }, "props": [ { - "uid": "column", - "name": "column", + "uid": "renderTarget", + "name": "renderTarget", "comment": { "raw": [ - "Column props of the selected cell" + "Render callback for the dropdown target.", + " Note, that it's required to pass 'props' parameters to the target component." ] }, "typeValue": { - "raw": "DataColumnProps" + "raw": "(props: IDropdownTogglerProps) => React.ReactNode" + }, + "editor": { + "type": "component" }, "required": true }, { - "uid": "row", - "name": "row", + "uid": "renderBody", + "name": "renderBody", "comment": { "raw": [ - "Row props of the selected cell" + "Render callback for the dropdown body" ] }, "typeValue": { - "raw": "DataRowProps" + "raw": "(props: DropdownBodyProps) => React.ReactNode" + }, + "editor": { + "type": "component" }, - "typeValueRef": "@epam/uui-core:DataRowProps", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:DataTableState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DataTableState", - "nameFull": "DataTableState" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DataTableState", - "print": [ - "interface DataTableState extends DataSourceState {", - " /** Configuration of columns at the DataTable. Used to define column visibility, width and order */", - " columnsConfig?: ColumnsConfig;", - " /** Configuration of filter at the FilterPanel. Used to define filter visibility and order */", - " filtersConfig?: FiltersConfig;", - " /** ID of currently selected preset */", - " presetId?: number | null;", - " /** State which will not trigger data reloading, but will be stored in presets or URL */", - " viewState?: TViewState;", - "}" - ] - }, - "props": [ + }, { - "uid": "columnsConfig", - "name": "columnsConfig", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Configuration of columns at the DataTable. Used to define column visibility, width and order" + "Called when dropdown was closed" ] }, "typeValue": { - "raw": "ColumnsConfig" + "raw": "() => void" + }, + "editor": { + "type": "func" }, "required": false }, { - "uid": "filtersConfig", - "name": "filtersConfig", + "uid": "isNotUnfoldable", + "name": "isNotUnfoldable", "comment": { "raw": [ - "Configuration of filter at the FilterPanel. Used to define filter visibility and order" + "Disable dropdown opening" ] }, "typeValue": { - "raw": "FiltersConfig" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, "required": false }, { - "uid": "presetId", - "name": "presetId", + "uid": "zIndex", + "name": "zIndex", "comment": { "raw": [ - "ID of currently selected preset" + "zIndex for dropdown body", + " By default used value received by LayoutContext" ] }, "typeValue": { - "raw": "null | number" + "raw": "number" }, "editor": { "type": "number" @@ -9442,868 +11629,916 @@ "required": false }, { - "uid": "viewState", - "name": "viewState", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "State which will not trigger data reloading, but will be stored in presets or URL" + "Defines dropdown body placement relative to target" ] }, "typeValue": { - "raw": "TViewState" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, "required": false }, { - "uid": "search", - "name": "search", + "uid": "modifiers", + "name": "modifiers", "comment": { "raw": [ - "Search value, used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, searching is performed internally by the datasource." + "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "(StrictModifier | Partial>)[]" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "checked", - "name": "checked", + "uid": "openDelay", + "name": "openDelay", "comment": { "raw": [ - "Array of checked items IDs" - ] + "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": "any[]" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "folded", - "name": "folded", + "uid": "closeDelay", + "name": "closeDelay", "comment": { "raw": [ - "A map of item IDs to their folding state.", - " If an item ID is present with a `true` value, it's folded; otherwise, it's not folded." - ] + "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": "Record" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "openOnClick", + "name": "openOnClick", "comment": { "raw": [ - "Filter value used to filter data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, filtering is performed internally by the datasource." - ] + "If true, dropdown will be opened by click on toggler.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "TFilter" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "sorting", - "name": "sorting", + "uid": "openOnHover", + "name": "openOnHover", "comment": { "raw": [ - "Sorting value, used to sort data based on it.", - " Included in the API request object when using a LazyDataSource.", - " For Array and Async data sources, sorting is performed internally by the datasource." - ] + "If true, dropdown will be opened by hover on toggler.", + " @default false" + ], + "tags": { + "@default": false + } }, "typeValue": { - "raw": "SortingOption[]" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "selectedId", - "name": "selectedId", + "uid": "closeOnTargetClick", + "name": "closeOnTargetClick", "comment": { "raw": [ - "ID of selected item. It can be only one selected item at the moment." - ] + "If true, clicks on target will toggle dropdown open state.", + " If false, click on target will only open dropdown and won't close it.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "any" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "focusedIndex", - "name": "focusedIndex", + "uid": "closeOnClickOutside", + "name": "closeOnClickOutside", "comment": { "raw": [ - "Index of currently focused item" - ] + "If true, dropdown will be closed on click outside body or toggler.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "page", - "name": "page", + "uid": "closeOnMouseLeave", + "name": "closeOnMouseLeave", "comment": { "raw": [ - "Current page number" - ] + "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" + } }, "typeValue": { - "raw": "number" + "raw": "false | 'toggler' | 'boundary'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + false, + "toggler", + "boundary" + ] }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "pageSize", - "name": "pageSize", + "uid": "portalTarget", + "name": "portalTarget", "comment": { "raw": [ - "The amount of items per page" + "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": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "foldAll", - "name": "foldAll", + "uid": "boundaryElement", + "name": "boundaryElement", "comment": { "raw": [ - "Provides default folding of nodes if the opposite value is not present in the folded map.", - " It is used to collapse/expand all nodes." + "Element relative to which dropdown will calculate position" ] }, + "typeValue": { + "raw": "HTMLElement | HTMLElement[] | 'clippingParents'" + }, + "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" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:DataSourceState", "required": false }, { - "uid": "scrollTo", - "name": "scrollTo", + "uid": "value", + "name": "value", "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." + "The current value of component" ] }, "typeValue": { - "raw": "ScrollToConfig" + "raw": "boolean" }, - "from": "@epam/uui-core:VirtualListState", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "topIndex", - "name": "topIndex", + "uid": "onValueChange", + "name": "onValueChange", "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" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "number" + "raw": "(newValue: boolean) => void" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:VirtualListRange", + "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "visibleCount", - "name": "visibleCount", + "uid": "forwardedRef", + "name": "forwardedRef", "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." + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:VirtualListRange", + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DatePickerCoreProps": { + "@epam/uui-core:DropParams": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DatePickerCoreProps", - "nameFull": "DatePickerCoreProps" + "name": "DropParams", + "nameFull": "DropParams" }, - "src": "uui-core/src/types/components/datePicker/DatePicker.ts", + "src": "uui-core/src/types/dnd.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DatePickerCoreProps", + "raw": "DropParams", "print": [ - "interface DatePickerCoreProps extends BaseDatePickerProps {", - " /** render prop to add a custom footer inside the DatePicker dropdown body */", - " renderFooter?(): ReactNode;", + "interface DropParams extends AcceptDropParams {", + " /** Current drop position, indicates where item will be dropped relative to the destination */", + " position: DropPosition;", "}" ] }, "props": [ { - "uid": "renderFooter", - "name": "renderFooter", - "comment": { - "raw": [ - "render prop to add a custom footer inside the DatePicker dropdown body" - ] - }, - "typeValue": { - "raw": "() => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "required": false - }, - { - "uid": "format", - "name": "format", + "uid": "position", + "name": "position", "comment": { "raw": [ - "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + "Current drop position, indicates where item will be dropped relative to the destination" ] }, "typeValue": { - "raw": "string" + "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'" }, + "typeValueRef": "@epam/uui-core:DropPosition", "editor": { - "type": "string" - }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false - }, - { - "uid": "filter", - "name": "filter", - "comment": { - "raw": [ - "Filter selectable days. Days, for which this callback returns false - will be disabled" + "type": "oneOf", + "options": [ + "left", + "right", + "top", + "bottom", + "inside" ] }, - "typeValue": { - "raw": "(day: Dayjs) => boolean" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false + "required": true }, { - "uid": "renderTarget", - "name": "renderTarget", + "uid": "srcData", + "name": "srcData", "comment": { "raw": [ - "Overrides rendering of picker Target - component which triggers dropdown. Can be used to attach DatePicker to other components, e.g. Buttons" + "Source item data. This is the srcData of the actor that is being dropped into." ] }, "typeValue": { - "raw": "(props: IDropdownToggler) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "TSrcData" }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false + "from": "@epam/uui-core:AcceptDropParams", + "required": true }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "dstData", + "name": "dstData", "comment": { "raw": [ - "Defines where to place calendar icon" + "Destination item data. This is the dstData of the actor into which the drop is performed." ] }, "typeValue": { - "raw": "'left' | 'right'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] + "raw": "TDstData" }, - "from": "@epam/uui-core:BaseDatePickerProps", + "from": "@epam/uui-core:AcceptDropParams", "required": false }, { - "uid": "disableClear", - "name": "disableClear", - "comment": { - "raw": [ - "Disable clearing date value (e.g. via cross icon)", - " @default false" - ], - "tags": { - "@default": false - } - }, + "uid": "offsetLeft", + "name": "offsetLeft", "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false + "from": "@epam/uui-core:AcceptDropParams", + "required": true }, { - "uid": "renderDay", - "name": "renderDay", - "comment": { - "raw": [ - "Overrides rendering of the single day. For example, to highlight certain days" - ] - }, + "uid": "offsetTop", + "name": "offsetTop", "typeValue": { - "raw": "(day: Dayjs, onDayClick: (day: Dayjs) => void) => React.ReactElement>" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false + "from": "@epam/uui-core:AcceptDropParams", + "required": true }, { - "uid": "isHoliday", - "name": "isHoliday", - "comment": { - "raw": [ - "If this function returns true, the day will be highlighted as holiday" - ] - }, + "uid": "targetWidth", + "name": "targetWidth", "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false + "from": "@epam/uui-core:AcceptDropParams", + "required": true }, { - "uid": "onBlur", - "name": "onBlur", - "comment": { - "raw": [ - "Called when component lose focus" - ] - }, + "uid": "targetHeight", + "name": "targetHeight", "typeValue": { - "raw": "(e?: React.FocusEvent | undefined) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:BaseDatePickerProps", - "required": false - }, + "from": "@epam/uui-core:AcceptDropParams", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:DropPosition": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DropPosition", + "nameFull": "DropPosition" + }, + "src": "uui-core/src/types/dnd.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'", + "print": [ + "type DropPosition = 'top' | 'bottom' | 'left' | 'right' | 'inside';" + ] + } + } + }, + "@epam/uui-core:DropPositionOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "DropPositionOptions", + "nameFull": "DropPositionOptions<__type>" + }, + "src": "uui-core/src/types/dnd.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "Partial>", + "print": [ + "type DropPositionOptions = Partial>;" + ] + } + } + }, + "@epam/uui-core:ErrorPageInfo": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ErrorPageInfo", + "nameFull": "ErrorPageInfo" + }, + "src": "uui-core/src/services/ErrorContext.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ErrorPageInfo", + "print": [ + "interface ErrorPageInfo {", + " /** Error status code */", + " status?: number;", + " /** Title of error page */", + " title?: React.ReactNode;", + " /** Subtitle of error page */", + " subtitle?: React.ReactNode;", + " /** Url of error image to display on error page */", + " imageUrl?: string;", + " /** Url of error image to display on error page in case of mobile layout (app width < 720px) */", + " mobileImageUrl?: string;", + "}" + ] + }, + "props": [ { - "uid": "placement", - "name": "placement", + "uid": "status", + "name": "status", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "Error status code" ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "number" }, - "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "title", + "name": "title", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on date picker parts" + "Title of error page" ] }, "typeValue": { - "raw": "{ input?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; body?: (React.HTMLAttributes & Record<`data-${string}`, string>) | undefined; }" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:BaseDatePickerProps", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "inputCx", - "name": "inputCx", + "uid": "subtitle", + "name": "subtitle", "comment": { "raw": [ - "CSS class(es) to put on datepicker input" + "Subtitle of error page" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "React.ReactNode" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:BaseDatePickerProps", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "bodyCx", - "name": "bodyCx", + "uid": "imageUrl", + "name": "imageUrl", "comment": { "raw": [ - "CSS class(es) to put on datepicker body" + "Url of error image to display on error page" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "string" + }, + "editor": { + "type": "string" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "mobileImageUrl", + "name": "mobileImageUrl", "comment": { "raw": [ - "True if component contains invalid input" + "Url of error image to display on error page in case of mobile layout (app width < 720px)" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:ICanBeInvalid", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:FileUploadOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "FileUploadOptions", + "nameFull": "FileUploadOptions" + }, + "src": "uui-core/src/services/ApiContext.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "FileUploadOptions", + "print": [ + "interface FileUploadOptions {", + " /** Called during the file uploading, used to track upload progress */", + " onProgress?: (progress: number) => any;", + " /** Callback to receive the instance of xhr. Can be used to abort the request. */", + " getXHR?: (xhr: XMLHttpRequest) => any;", + "}" + ] + }, + "props": [ { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "onProgress", + "name": "onProgress", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Called during the file uploading, used to track upload progress" ] }, "typeValue": { - "raw": "boolean" + "raw": "(progress: number) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "getXHR", + "name": "getXHR", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Callback to receive the instance of xhr. Can be used to abort the request." ] }, "typeValue": { - "raw": "boolean" + "raw": "(xhr: XMLHttpRequest) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:FileUploadResponse": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "FileUploadResponse", + "nameFull": "FileUploadResponse" + }, + "src": "uui-core/src/services/ApiContext.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "FileUploadResponse", + "print": [ + "interface FileUploadResponse {", + " /** ID of the file */", + " id: number;", + " /** Name of the file */", + " name: string;", + " /** File size */", + " size: number;", + " /** Path to the file source */", + " path?: string;", + " /** Type of file representation. Used for UUI SlateRTE file displaying. */", + " type?: BlockTypes;", + " /** Extension of the file */", + " extension?: string;", + " /** Upload error */", + " error?: {", + " /** If true, indicates about error while file uploading */", + " isError: boolean;", + " /** Error message */", + " message?: string;", + " };", + "}" + ] + }, + "props": [ { - "uid": "isRequired", - "name": "isRequired", + "uid": "id", + "name": "id", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "ID of the file" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false + "required": true }, { - "uid": "value", - "name": "value", + "uid": "name", + "name": "name", "comment": { "raw": [ - "The current value of component" + "Name of the file" ] }, "typeValue": { - "raw": "null | string" + "raw": "string" }, "editor": { "type": "string" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "size", + "name": "size", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "File size" ] }, "typeValue": { - "raw": "(newValue: string | null) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "path", + "name": "path", "comment": { "raw": [ - "Called when component gets input focus" + "Path to the file source" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:ICanFocus", "required": false }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Placeholder to display when empty" + "Type of file representation. Used for UUI SlateRTE file displaying." ] }, "typeValue": { - "raw": "any" + "raw": "'attachment' | 'iframe' | 'image'" + }, + "editor": { + "type": "oneOf", + "options": [ + "attachment", + "iframe", + "image" + ] }, - "from": "@epam/uui-core:IHasPlaceholder", "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "extension", + "name": "extension", "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)." + "Extension of the file" ] }, "typeValue": { - "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "error", + "name": "error", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Upload error" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + "raw": "{ isError: boolean; message?: string | undefined; }" }, - "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DndActorProps": { + "@epam/uui-core:FilterConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DndActorProps", - "nameFull": "DndActorProps" + "name": "FilterConfig", + "nameFull": "FilterConfig" }, - "src": "uui-core/src/services/dnd/DndActor.tsx", + "src": "uui-core/src/types/dataSources.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DndActorProps", + "raw": "FilterConfig", "print": [ - "interface DndActorProps extends IDndActor {", - " /** Render callback for DragActor content */", - " render(props: DndActorRenderParams): React.ReactNode;", + "interface FilterConfig {", + " /**", + " * A pure function that returns filter callback to be applied for each item.", + " * The callback should return true, if item passed the filter.", + " */", + " getFilter?(filter: TFilter): (item: TItem) => boolean;", "}" ] }, "props": [ { - "uid": "render", - "name": "render", - "comment": { - "raw": [ - "Render callback for DragActor content" - ] - }, - "typeValue": { - "raw": "(props: DndActorRenderParams) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "required": true - }, - { - "uid": "srcData", - "name": "srcData", - "comment": { - "raw": [ - "Data used when this component acts as a drag source.", - " If provided, it means this component can be dragged. Can be used in combination with dstData." - ] - }, - "typeValue": { - "raw": "TSrcData" - }, - "from": "@epam/uui-core:IDndActor", - "required": false - }, - { - "uid": "dstData", - "name": "dstData", - "comment": { - "raw": [ - "Data used when this component acts as a drop destination.", - " If provided, it means something can be dragged onto this component. Can be used in combination with srcData." - ] - }, - "typeValue": { - "raw": "TDstData" - }, - "from": "@epam/uui-core:IDndActor", - "required": false - }, - { - "uid": "canAcceptDrop", - "name": "canAcceptDrop", - "comment": { - "raw": [ - "A pure function that gets permitted positions for a drop action" - ] - }, - "typeValue": { - "raw": "(params: AcceptDropParams) => Partial> | null" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IDndActor", - "required": false - }, - { - "uid": "onDrop", - "name": "onDrop", + "uid": "getFilter", + "name": "getFilter", "comment": { "raw": [ - "Called when accepted drop action performed on this actor. Usually used to reorder and update items" + "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": "(data: DropParams) => void" + "raw": "(filter: TFilter) => (item: TItem) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IDndActor", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DndActorRenderParams": { + "@epam/uui-core:FilterPredicate": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DndActorRenderParams", - "nameFull": "DndActorRenderParams" + "name": "FilterPredicate", + "nameFull": "FilterPredicate" }, - "src": "uui-core/src/types/dnd.ts", + "src": "uui-core/src/types/dataQuery.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "DndActorRenderParams", + "raw": "FilterPredicate", "print": [ - "interface DndActorRenderParams {", - " /** True, if the element can be dragged. Doesn't mean that DnD is active. */", - " isDraggable: boolean;", - " /** True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost. */", - " isDraggedOut: boolean;", - " /** True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost. */", - " isDragGhost: boolean;", - " /** True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false) */", - " isDraggedOver: boolean;", - " /** True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true */", - " isDropAccepted: boolean;", - " /** True if any drag and drop operation is in progress, even if the element not being dragged */", - " isDndInProgress: boolean;", - " /** Drag data associated with the element. Specified always, even if there is no DnD operation happening. */", - " dragData?: any;", - " /** Drop position. Chosen from accepted drop positions according to pointer coordinates */", - " position?: DropPosition;", - " /**", - " * 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", - " */", - " eventHandlers: {", - " onTouchStart?(e: React.TouchEvent): void;", - " onPointerDown?(e: React.PointerEvent): void;", - " onPointerEnter?(e: React.PointerEvent): void;", - " onPointerMove?(e: React.PointerEvent): void;", - " onPointerLeave?(e: React.PointerEvent): void;", - " onPointerUp?(e: React.PointerEvent): void;", - " };", - " /**", - " * 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.", - " */", - " classNames: string[];", - " /** Ref to the DOM element to perform DnD actions */", - " ref?: React.Ref;", - "}" + "type FilterPredicate = {", + " /** In. Should match some of these values. */", + " in?: TField[];", + " /** Not In. Should not match some of these values. */", + " nin?: TField[];", + " /** Should be null */", + " isNull?: boolean;", + " /** Greater than */", + " gt?: TField;", + " /** Greater than or equal */", + " gte?: TField;", + " /** Lower than */", + " lt?: TField;", + " /** Lower than or equal */", + " lte?: TField;", + " /** In range. Should be in these range */", + " inRange?: RangeValue;", + " /** Not in range. Should not be in these range */", + " notInRange?: RangeValue;", + " /** Equal */", + " eq?: TField;", + " /** Not equal */", + " neq?: TField;", + " /** Should not much provide predicates */", + " not?: FilterPredicate;", + "};" ] }, "props": [ { - "uid": "isDraggable", - "name": "isDraggable", + "uid": "in", + "name": "in", "comment": { "raw": [ - "True, if the element can be dragged. Doesn't mean that DnD is active." + "In. Should match some of these values." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TField[]" }, - "required": true + "required": false }, { - "uid": "isDraggedOut", - "name": "isDraggedOut", + "uid": "nin", + "name": "nin", "comment": { "raw": [ - "True, if the element is dragged out. True for placeholder left when it's element it dragged out. False for Drag Ghost." + "Not In. Should not match some of these values." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TField[]" }, - "required": true + "required": false }, { - "uid": "isDragGhost", - "name": "isDragGhost", + "uid": "isNull", + "name": "isNull", "comment": { "raw": [ - "True, if the element is rendered as Drag Ghost. All other flags are false for drag ghost." + "Should be null" ] }, "typeValue": { @@ -10312,130 +12547,122 @@ "editor": { "type": "bool" }, - "required": true + "required": false }, { - "uid": "isDraggedOver", - "name": "isDraggedOver", + "uid": "gt", + "name": "gt", "comment": { "raw": [ - "True, if the element is being dragged over, even if drop is not accepted by the element (canAcceptDrop returned false)" + "Greater than" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TField" }, - "required": true + "required": false }, { - "uid": "isDropAccepted", - "name": "isDropAccepted", + "uid": "gte", + "name": "gte", "comment": { "raw": [ - "True, if the element is being dragged over, and drop on it is accepted - canAcceptDrop returned true" + "Greater than or equal" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TField" }, - "required": true + "required": false }, { - "uid": "isDndInProgress", - "name": "isDndInProgress", + "uid": "lt", + "name": "lt", "comment": { "raw": [ - "True if any drag and drop operation is in progress, even if the element not being dragged" + "Lower than" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TField" }, - "required": true + "required": false }, { - "uid": "dragData", - "name": "dragData", + "uid": "lte", + "name": "lte", "comment": { "raw": [ - "Drag data associated with the element. Specified always, even if there is no DnD operation happening." + "Lower than or equal" ] }, "typeValue": { - "raw": "any" + "raw": "TField" }, "required": false }, { - "uid": "position", - "name": "position", + "uid": "inRange", + "name": "inRange", "comment": { "raw": [ - "Drop position. Chosen from accepted drop positions according to pointer coordinates" + "In range. Should be in these range" ] }, "typeValue": { - "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'" + "raw": "RangeValue" }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "top", - "bottom", - "inside" + "required": false + }, + { + "uid": "notInRange", + "name": "notInRange", + "comment": { + "raw": [ + "Not in range. Should not be in these range" ] }, + "typeValue": { + "raw": "RangeValue" + }, "required": false }, { - "uid": "eventHandlers", - "name": "eventHandlers", + "uid": "eq", + "name": "eq", "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" + "Equal" ] }, "typeValue": { - "raw": "{ onTouchStart?(e: React.TouchEvent): void; onPointerDown?(e: React.PointerEvent): void; onPointerEnter?(e: React.PointerEvent): void; onPointerMove?(e: React.PointerEvent): void; onPointerLeave?(e: React.PointerEvent): void; onPointerUp?(e: React.PointerEvent): void; }" + "raw": "TField" }, - "required": true + "required": false }, { - "uid": "classNames", - "name": "classNames", + "uid": "neq", + "name": "neq", "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." + "Not equal" ] }, "typeValue": { - "raw": "string[]" + "raw": "TField" }, - "required": true + "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "not", + "name": "not", "comment": { "raw": [ - "Ref to the DOM element to perform DnD actions" + "Should not much provide predicates" ] }, "typeValue": { - "raw": "null | (instance: any) => void | React.RefObject" + "raw": "FilterPredicate" }, "required": false } @@ -10443,1361 +12670,1625 @@ "propsFromUnion": false } }, - "@epam/uui-core:DragGhostProps": { + "@epam/uui-core:FilterPredicateName": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DragGhostProps", - "nameFull": "DragGhostProps" + "name": "FilterPredicateName", + "nameFull": "FilterPredicateName" }, - "src": "uui-core/src/services/dnd/DragGhost.tsx", + "src": "uui-core/src/types/dataQuery.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "DragGhostProps", + "raw": "'in' | 'nin' | 'isNull' | 'gt' | 'gte' | 'lt' | 'lte' | 'inRange' | 'notInRange' | 'eq' | 'neq' | 'not'", "print": [ - "interface DragGhostProps {", - "}" + "type FilterPredicateName = keyof FilterPredicate;" ] } } }, - "@epam/uui-core:DropdownBodyProps": { + "@epam/uui-core:FiltersConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DropdownBodyProps", - "nameFull": "DropdownBodyProps" + "name": "FiltersConfig", + "nameFull": "FiltersConfig" }, - "src": "uui-core/src/types/components/Dropdown.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "DropdownBodyProps", + "raw": "FiltersConfig", "print": [ - "interface DropdownBodyProps extends IDropdownBodyProps {", - "}" + "type FiltersConfig = {", + " [key in keyof TFilter]: IFilterConfig;", + "};" + ] + } + } + }, + "@epam/uui-core:FlexCellProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "FlexCellProps", + "nameFull": "FlexCellProps" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "FlexCellProps", + "print": [ + "type FlexCellProps = IHasCX & IClickable & IHasRawProps> & Attributes & IHasChildren & {", + " /** CSS width. Set to 'auto' to make FlexCell resize to it's content */", + " width?: number | 'auto' | '100%';", + " /** CSS min-width */", + " minWidth?: number;", + " /** Flexbox flex-grow property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-grow) */", + " grow?: number;", + " /** Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink) */", + " shrink?: number;", + " /** 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?: CSS.AlignSelfProperty;", + " /** Standard style attribute. Styles are added to element style, overriding supplied flex styles */", + " style?: React.CSSProperties;", + "};" ] }, "props": [ { - "uid": "onClose", - "name": "onClose", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Call to close the Dropdown body" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "() => void" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", + "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:IDropdownBodyProps", + "from": "@epam/uui-core:IClickable", "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" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "editor": { - "type": "number" + "from": "@epam/uui-core:IHasRawProps", + "required": false + }, + { + "uid": "key", + "name": "key", + "typeValue": { + "raw": "null | string | number" }, - "from": "@epam/uui-core:IDropdownBodyProps", + "from": "@types/react:Attributes", "required": false }, { - "uid": "togglerHeight", - "name": "togglerHeight", + "uid": "children", + "name": "children", "comment": { "raw": [ - "The height of the toggler" + "Component children" ] }, "typeValue": { - "raw": "number" + "raw": "React.ReactNode" }, - "editor": { - "type": "number" + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", + "required": false + }, + { + "uid": "width", + "name": "width", + "comment": { + "raw": [ + "CSS width. Set to 'auto' to make FlexCell resize to it's content" + ] + }, + "typeValue": { + "raw": "number | 'auto' | '100%'" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "scheduleUpdate", - "name": "scheduleUpdate", + "uid": "minWidth", + "name": "minWidth", "comment": { "raw": [ - "Call to force recompute dropdown position" + "CSS min-width" ] }, "typeValue": { - "raw": "() => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "grow", + "name": "grow", "comment": { "raw": [ - "Indicates that dropdown is open" + "Flexbox flex-grow property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-grow)" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "arrowProps", - "name": "arrowProps", + "uid": "shrink", + "name": "shrink", "comment": { "raw": [ - "Props that should be provided to the arrow component" + "Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink)" ] }, "typeValue": { - "raw": "PopperArrowProps" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:IDropdownBodyProps", "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "textAlign", + "name": "textAlign", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "CSS text-align property" ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "'left' | 'right' | 'center'" }, "editor": { "type": "oneOf", "options": [ "left", "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" + "center" ] }, - "from": "@epam/uui-core:IDropdownBodyProps", + "required": false + }, + { + "uid": "alignSelf", + "name": "alignSelf", + "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)" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "style", + "name": "style", + "comment": { + "raw": [ + "Standard style attribute. Styles are added to element style, overriding supplied flex styles" + ] + }, + "typeValue": { + "raw": "React.CSSProperties" + }, "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DropdownPlacement": { + "@epam/uui-core:FlexRowProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DropdownPlacement", - "nameFull": "DropdownPlacement" + "name": "FlexRowProps", + "nameFull": "FlexRowProps" }, - "src": "uui-core/src/types/components/Dropdown.ts", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "Placement", - "print": [ - "type DropdownPlacement = Placement;" - ] - } - } - }, - "@epam/uui-core:DropdownProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "DropdownProps", - "nameFull": "DropdownProps" - }, - "src": "uui-core/src/types/components/Dropdown.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "DropdownProps", + "raw": "FlexRowProps", "print": [ - "interface DropdownProps extends Partial>, IHasForwardedRef {", - " /**", - " * Render callback for the dropdown target.", - " * Note, that it's required to pass 'props' parameters to the target component.", - " */", - " renderTarget: (props: IDropdownTogglerProps) => React.ReactNode;", - " /** Render callback for the dropdown body */", - " renderBody: (props: DropdownBodyProps) => React.ReactNode;", - " /** Called when dropdown was closed */", - " onClose?: () => void;", - " /** Disable dropdown opening */", - " isNotUnfoldable?: boolean;", - " /** zIndex for dropdown body", - " * By default used value received by LayoutContext", - " * */", - " zIndex?: number;", - " /** Defines dropdown body placement relative to target */", - " placement?: DropdownPlacement;", - " /** Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/} */", - " modifiers?: Modifier[];", - " /** Defines how much 'ms' user should hold mouse over target to open the dropdown", - " * This prop work only with openOnHover={true}", - " * @default 0", - " * */", - " openDelay?: number;", - " /** Defines after which delay dropdown will be closed, if user leave mouse from target.", - " * This prop work only with openOnHover={true}", - " * @default 0", - " * */", - " closeDelay?: number;", - " /** If true, dropdown will be opened by click on toggler.", - " * @default true", - " * */", - " openOnClick?: boolean;", - " /** If true, dropdown will be opened by hover on toggler.", - " * @default false", - " * */", - " openOnHover?: boolean;", - " /** If true, clicks on target will toggle dropdown open state.", - " * If false, click on target will only open dropdown and won't close it.", - " * @default true", - " * */", - " closeOnTargetClick?: boolean;", - " /** If true, dropdown will be closed on click outside body or toggler.", - " * @default true", - " * */", - " closeOnClickOutside?: boolean;", - " /** 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'", - " * */", - " closeOnMouseLeave?: 'toggler' | 'boundary' | false;", - " /**", - " * Node of portal target, where to render the dropdown body.", - " * By default, will be used global portal node.", - " * */", - " portalTarget?: HTMLElement;", - " /**", - " * Element relative to which dropdown will calculate position", - " * */", - " boundaryElement?: Boundary;", - " /** Pass false, if you do not want to close the dropdown in case Toggler move out of viewport.", - " * @default true", + "type FlexRowProps = IHasCX & IClickable & Attributes & IHasChildren & IHasRawProps> & {", + " /** Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", + " * @default 'center'", " * */", - " closeBodyOnTogglerHidden?: boolean; // default: true;", - "}" + " alignItems?: 'top' | 'center' | 'bottom' | 'stretch';", + " /** Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) */", + " justifyContent?: 'center' | 'space-between' | 'space-around' | 'space-evenly' | 'start' | 'end';", + " /** Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap) */", + " columnGap?: number | '6' | '12' | '18' | '24' | '36';", + " /** Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap) */", + " rowGap?: number | '6' | '12' | '18' | '24' | '36';", + "};" ] }, "props": [ { - "uid": "renderTarget", - "name": "renderTarget", - "comment": { - "raw": [ - "Render callback for the dropdown target.", - " Note, that it's required to pass 'props' parameters to the target component." - ] - }, - "typeValue": { - "raw": "(props: IDropdownTogglerProps) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "required": true - }, - { - "uid": "renderBody", - "name": "renderBody", - "comment": { - "raw": [ - "Render callback for the dropdown body" - ] - }, - "typeValue": { - "raw": "(props: DropdownBodyProps) => React.ReactNode" - }, - "editor": { - "type": "component" - }, - "required": true - }, - { - "uid": "onClose", - "name": "onClose", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Called when dropdown was closed" + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "isNotUnfoldable", - "name": "isNotUnfoldable", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Disable dropdown opening" + "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": "zIndex", - "name": "zIndex", - "comment": { - "raw": [ - "zIndex for dropdown body", - " By default used value received by LayoutContext" - ] - }, + "uid": "key", + "name": "key", "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | string | number" }, + "from": "@types/react:Attributes", "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Defines dropdown body placement relative to target" + "Component children" ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "modifiers", - "name": "modifiers", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "(StrictModifier | Partial>)[]" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "openDelay", - "name": "openDelay", + "uid": "alignItems", + "name": "alignItems", "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" + "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", + " @default 'center'" ], "tags": { - "@default": 0 + "@default": "center" } }, "typeValue": { - "raw": "number" + "raw": "'top' | 'bottom' | 'center' | 'stretch'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "top", + "bottom", + "center", + "stretch" + ] }, "required": false }, { - "uid": "closeDelay", - "name": "closeDelay", + "uid": "justifyContent", + "name": "justifyContent", "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 - } + "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" + ] }, "typeValue": { - "raw": "number" + "raw": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "center", + "space-around", + "space-between", + "space-evenly", + "end", + "start" + ] }, "required": false }, { - "uid": "openOnClick", - "name": "openOnClick", + "uid": "columnGap", + "name": "columnGap", "comment": { "raw": [ - "If true, dropdown will be opened by click on toggler.", - " @default true" - ], - "tags": { - "@default": true - } + "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "number | '6' | '12' | '18' | '24' | '36'" }, "required": false }, { - "uid": "openOnHover", - "name": "openOnHover", + "uid": "rowGap", + "name": "rowGap", "comment": { "raw": [ - "If true, dropdown will be opened by hover on toggler.", - " @default false" - ], - "tags": { - "@default": false - } + "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "number | '6' | '12' | '18' | '24' | '36'" }, "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:FormProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "FormProps", + "nameFull": "FormProps" + }, + "src": "uui-core/src/data/forms/Form.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "FormProps", + "print": [ + "interface FormProps {", + " /** Current value of the form state */", + " value: T;", + " /**", + " * Render the form body, provided by form state", + " * */", + " renderForm: (props: IFormApi) => ReactNode;", + " /**", + " * Returns form metadata - information used to validate the form.", + " * @param state Metadata can depend on state, and will be re-computed on updates", + " */", + " getMetadata?(state: T): Metadata;", + " /**", + " * 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", + " */", + " onSave(state: T): Promise | void>;", + " /**", + " * 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.", + " * 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.", + " */", + " beforeLeave?: (() => Promise) | null;", + " /**", + " * 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.", + " */", + " loadUnsavedChanges?: () => Promise;", + " /**", + " * Called after successful save.", + " * @param state Saved state", + " * @param isSavedBeforeLeave true, if save is triggered via leaving the page, and \"Save Changes?\" dialog", + " */", + " onSuccess?(state: T, isSavedBeforeLeave?: boolean): any;", + " /** Called when save fails */", + " onError?(error: any): any;", + " /**", + " * The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)", + " */", + " settingsKey?: string;", + " /**", + " * 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", + " */", + " validationOn?: ValidationMode;", + "}" + ] + }, + "props": [ + { + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "Current value of the form state" + ] + }, + "typeValue": { + "raw": "T" + }, + "required": true }, { - "uid": "closeOnTargetClick", - "name": "closeOnTargetClick", + "uid": "renderForm", + "name": "renderForm", "comment": { "raw": [ - "If true, clicks on target will toggle dropdown open state.", - " If false, click on target will only open dropdown and won't close it.", - " @default true" - ], - "tags": { - "@default": true - } + "Render the form body, provided by form state" + ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: IFormApi) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "required": false + "required": true }, { - "uid": "closeOnClickOutside", - "name": "closeOnClickOutside", + "uid": "getMetadata", + "name": "getMetadata", "comment": { "raw": [ - "If true, dropdown will be closed on click outside body or toggler.", - " @default true" - ], - "tags": { - "@default": true - } + "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": "boolean" + "raw": "(state: T) => Metadata" }, "editor": { - "type": "bool" + "type": "func" }, "required": false }, { - "uid": "closeOnMouseLeave", - "name": "closeOnMouseLeave", + "uid": "onSave", + "name": "onSave", "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" - } + "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": "false | 'toggler' | 'boundary'" + "raw": "(state: T) => Promise>" }, "editor": { - "type": "oneOf", - "options": [ - false, - "toggler", - "boundary" - ] + "type": "func" }, - "required": false + "required": true }, { - "uid": "portalTarget", - "name": "portalTarget", + "uid": "beforeLeave", + "name": "beforeLeave", "comment": { "raw": [ - "Node of portal target, where to render the dropdown body.", - " By default, will be used global portal node." + "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.", + " 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": "HTMLElement" + "raw": "null | () => Promise" + }, + "editor": { + "type": "func" }, "required": false }, { - "uid": "boundaryElement", - "name": "boundaryElement", + "uid": "loadUnsavedChanges", + "name": "loadUnsavedChanges", "comment": { "raw": [ - "Element relative to which dropdown will calculate position" + "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": "HTMLElement | HTMLElement[] | 'clippingParents'" + "raw": "() => Promise" + }, + "editor": { + "type": "func" }, "required": false }, { - "uid": "closeBodyOnTogglerHidden", - "name": "closeBodyOnTogglerHidden", + "uid": "onSuccess", + "name": "onSuccess", "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 - } + "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" }, "required": false }, { - "uid": "value", - "name": "value", + "uid": "onError", + "name": "onError", "comment": { "raw": [ - "The current value of component" + "Called when save fails" ] }, "typeValue": { - "raw": "boolean" + "raw": "(error: any) => any" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "settingsKey", + "name": "settingsKey", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" ] }, "typeValue": { - "raw": "(newValue: boolean) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IControlled", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "validationOn", + "name": "validationOn", "comment": { "raw": [ - "this ref is passed to the underlying component" + "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": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + "raw": "'change' | 'save'" + }, + "editor": { + "type": "oneOf", + "options": [ + "change", + "save" + ] }, - "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DropParams": { + "@epam/uui-core:FormSaveResponse": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DropParams", - "nameFull": "DropParams" + "name": "FormSaveResponse", + "nameFull": "FormSaveResponse" }, - "src": "uui-core/src/types/dnd.ts", + "src": "uui-core/src/data/forms/Form.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "DropParams", + "raw": "FormSaveResponse", "print": [ - "interface DropParams extends AcceptDropParams {", - " /** Current drop position, indicates where item will be dropped relative to the destination */", - " position: DropPosition;", + "interface FormSaveResponse {", + " /** New form value, which will replace previous one */", + " form?: T;", + " /** Server-side validation state. It's applied in priority over client validation. */", + " validation?: ValidationState;", "}" ] }, "props": [ { - "uid": "position", - "name": "position", + "uid": "form", + "name": "form", "comment": { "raw": [ - "Current drop position, indicates where item will be dropped relative to the destination" + "New form value, which will replace previous one" ] }, "typeValue": { - "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'" - }, - "typeValueRef": "@epam/uui-core:DropPosition", - "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "top", - "bottom", - "inside" - ] + "raw": "T" }, - "required": true + "required": false }, { - "uid": "srcData", - "name": "srcData", + "uid": "validation", + "name": "validation", "comment": { "raw": [ - "Source item data. This is the srcData of the actor that is being dropped into." + "Server-side validation state. It's applied in priority over client validation." ] }, "typeValue": { - "raw": "TSrcData" + "raw": "ValidationState" }, - "from": "@epam/uui-core:AcceptDropParams", - "required": true - }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IAdaptiveItem": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IAdaptiveItem", + "nameFull": "IAdaptiveItem" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IAdaptiveItem", + "print": [ + "// TBD: remove when MainMenu old api of items providing will be removed", + "interface IAdaptiveItem {", + " estimatedWidth?: number;", + " priority?: number;", + " showInBurgerMenu?: boolean;", + " collapseToMore?: boolean;", + " collapsedContainer?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "dstData", - "name": "dstData", - "comment": { - "raw": [ - "Destination item data. This is the dstData of the actor into which the drop is performed." - ] - }, + "uid": "estimatedWidth", + "name": "estimatedWidth", "typeValue": { - "raw": "TDstData" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:AcceptDropParams", "required": false }, { - "uid": "offsetLeft", - "name": "offsetLeft", + "uid": "priority", + "name": "priority", "typeValue": { "raw": "number" }, "editor": { "type": "number" }, - "from": "@epam/uui-core:AcceptDropParams", - "required": true + "required": false }, { - "uid": "offsetTop", - "name": "offsetTop", + "uid": "showInBurgerMenu", + "name": "showInBurgerMenu", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:AcceptDropParams", - "required": true + "required": false }, { - "uid": "targetWidth", - "name": "targetWidth", + "uid": "collapseToMore", + "name": "collapseToMore", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:AcceptDropParams", - "required": true + "required": false }, { - "uid": "targetHeight", - "name": "targetHeight", + "uid": "collapsedContainer", + "name": "collapsedContainer", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "from": "@epam/uui-core:AcceptDropParams", - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:DropPosition": { + "@epam/uui-core:IAnalyticableClick": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DropPosition", - "nameFull": "DropPosition" + "name": "IAnalyticableClick", + "nameFull": "IAnalyticableClick" }, - "src": "uui-core/src/types/dnd.ts", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "'left' | 'right' | 'top' | 'bottom' | 'inside'", + "raw": "IAnalyticableClick", "print": [ - "type DropPosition = 'top' | 'bottom' | 'left' | 'right' | 'inside';" + "interface IAnalyticableClick {", + " /**", + " * 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).", + " */", + " clickAnalyticsEvent?: AnalyticsEvent;", + "}" ] - } + }, + "props": [ + { + "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)." + ] + }, + "typeValue": { + "raw": "null | { [key: string]: any; name: string; }" + }, + "required": false + } + ], + "propsFromUnion": false } }, - "@epam/uui-core:DropPositionOptions": { + "@epam/uui-core:IAnalyticableOnChange": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "DropPositionOptions", - "nameFull": "DropPositionOptions<__type>" + "name": "IAnalyticableOnChange", + "nameFull": "IAnalyticableOnChange" }, - "src": "uui-core/src/types/dnd.ts", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "Partial>", + "raw": "IAnalyticableOnChange", "print": [ - "type DropPositionOptions = Partial>;" + "interface IAnalyticableOnChange {", + " /**", + " * 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).", + " */", + " getValueChangeAnalyticsEvent?: (newValue: T | null, oldValue: T | null) => AnalyticsEvent;", + "}" ] - } + }, + "props": [ + { + "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: T | null, oldValue: T | null) => AnalyticsEvent" + }, + "editor": { + "type": "func" + }, + "required": false + } + ], + "propsFromUnion": false } }, - "@epam/uui-core:ErrorPageInfo": { + "@epam/uui-core:IAnalyticsContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ErrorPageInfo", - "nameFull": "ErrorPageInfo" + "name": "IAnalyticsContext", + "nameFull": "IAnalyticsContext" }, - "src": "uui-core/src/services/ErrorContext.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ErrorPageInfo", + "raw": "IAnalyticsContext", "print": [ - "interface ErrorPageInfo {", - " /** Error status code */", - " status?: number;", - " /** Title of error page */", - " title?: React.ReactNode;", - " /** Subtitle of error page */", - " subtitle?: React.ReactNode;", - " /** Url of error image to display on error page */", - " imageUrl?: string;", - " /** Url of error image to display on error page in case of mobile layout (app width < 720px) */", - " mobileImageUrl?: string;", + "interface IAnalyticsContext {", + " /** Sends event to the all listeners */", + " sendEvent(event?: AnalyticsEvent): void;", + " /** Adds analytic event listener */", + " addListener(listener: IAnalyticsListener): void;", "}" ] }, "props": [ { - "uid": "status", - "name": "status", - "comment": { - "raw": [ - "Error status code" - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false - }, - { - "uid": "title", - "name": "title", - "comment": { - "raw": [ - "Title of error page" - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "required": false - }, - { - "uid": "subtitle", - "name": "subtitle", - "comment": { - "raw": [ - "Subtitle of error page" - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "required": false - }, - { - "uid": "imageUrl", - "name": "imageUrl", + "uid": "sendEvent", + "name": "sendEvent", "comment": { "raw": [ - "Url of error image to display on error page" + "Sends event to the all listeners" ] }, "typeValue": { - "raw": "string" + "raw": "(event?: AnalyticsEvent | undefined) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "required": true }, { - "uid": "mobileImageUrl", - "name": "mobileImageUrl", + "uid": "addListener", + "name": "addListener", "comment": { "raw": [ - "Url of error image to display on error page in case of mobile layout (app width < 720px)" + "Adds analytic event listener" ] }, "typeValue": { - "raw": "string" + "raw": "(listener: IAnalyticsListener) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:FileUploadOptions": { + "@epam/uui-core:IAnalyticsListener": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FileUploadOptions", - "nameFull": "FileUploadOptions" + "name": "IAnalyticsListener", + "nameFull": "IAnalyticsListener" }, - "src": "uui-core/src/services/ApiContext.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "FileUploadOptions", + "raw": "IAnalyticsListener", "print": [ - "interface FileUploadOptions {", - " /** Called during the file uploading, used to track upload progress */", - " onProgress?: (progress: number) => any;", - " /** Callback to receive the instance of xhr. Can be used to abort the request. */", - " getXHR?: (xhr: XMLHttpRequest) => any;", + "interface IAnalyticsListener {", + " /** Defines how to send event to the analytics system */", + " sendEvent(event: AnalyticsEvent, parameters: Omit, eventType?: 'event' | 'pageView' | 'apiTiming'): void;", "}" ] }, "props": [ { - "uid": "onProgress", - "name": "onProgress", - "comment": { - "raw": [ - "Called during the file uploading, used to track upload progress" - ] - }, - "typeValue": { - "raw": "(progress: number) => any" - }, - "editor": { - "type": "func" - }, - "required": false - }, - { - "uid": "getXHR", - "name": "getXHR", + "uid": "sendEvent", + "name": "sendEvent", "comment": { "raw": [ - "Callback to receive the instance of xhr. Can be used to abort the request." + "Defines how to send event to the analytics system" ] }, "typeValue": { - "raw": "(xhr: XMLHttpRequest) => any" + "raw": "(event: AnalyticsEvent, parameters: Omit, eventType?: 'event' | 'pageView' | 'apiTiming' | undefined) => void" }, "editor": { "type": "func" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:FileUploadResponse": { + "@epam/uui-core:IApiContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FileUploadResponse", - "nameFull": "FileUploadResponse" + "name": "IApiContext", + "nameFull": "IApiContext" }, - "src": "uui-core/src/services/ApiContext.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "FileUploadResponse", + "raw": "IApiContext", "print": [ - "interface FileUploadResponse {", - " /** ID of the file */", - " id: number;", - " /** Name of the file */", - " name: string;", - " /** File size */", - " size: number;", - " /** Path to the file source */", - " path?: string;", - " /** Type of file representation. Used for UUI SlateRTE file displaying. */", - " type?: BlockTypes;", - " /** Extension of the file */", - " extension?: string;", - " /** Upload error */", - " error?: {", - " /** If true, indicates about error while file uploading */", - " isError: boolean;", - " /** Error message */", - " message?: string;", - " };", + "interface IApiContext extends IBaseContext {", + " /** Current status of api service.", + " * idle - service do nothing and ready to process new requests", + " * running - service is currently processing requests", + " * error - service received an error and stop processing requests, due to this error will be discarded", + " * recovery - service trying to restore connection and recover latest requests", + " * */", + " readonly status: ApiStatus;", + " /** Reason of why api trying to recover connection */", + " readonly recoveryReason: ApiRecoveryReason | null;", + " /** Returns currently processing or failed requests */", + " getActiveCalls(status?: ApiCallStatus): ApiCallInfo[];", + " /** Resets all errors */", + " reset(): void;", + " /** Starts fetch call with providing params */", + " processRequest(url: string, method: string, data?: any, options?: ApiCallOptions): Promise;", + " /** Starts file uploading using FormData */", + " uploadFile(url: string, file: File, options: FileUploadOptions): Promise;", + " /** 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'", + " * */", + " apiReloginPath: string;", "}" ] }, "props": [ { - "uid": "id", - "name": "id", + "uid": "status", + "name": "status", "comment": { "raw": [ - "ID of the file" + "Current status of api service.", + " idle - service do nothing and ready to process new requests", + " running - service is currently processing requests", + " error - service received an error and stop processing requests, due to this error will be discarded", + " recovery - service trying to restore connection and recover latest requests" ] }, "typeValue": { - "raw": "number" + "raw": "'running' | 'error' | 'idle' | 'recovery'" }, + "typeValueRef": "@epam/uui-core:ApiStatus", "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "running", + "error", + "idle", + "recovery" + ] }, "required": true }, { - "uid": "name", - "name": "name", + "uid": "recoveryReason", + "name": "recoveryReason", "comment": { "raw": [ - "Name of the file" + "Reason of why api trying to recover connection" ] }, "typeValue": { - "raw": "string" + "raw": "null | 'auth-lost' | 'connection-lost' | 'server-overload' | 'maintenance'" }, + "typeValueRef": "@epam/uui-core:ApiRecoveryReason", "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "auth-lost", + "connection-lost", + "server-overload", + "maintenance", + null + ] + }, + "required": false + }, + { + "uid": "getActiveCalls", + "name": "getActiveCalls", + "comment": { + "raw": [ + "Returns currently processing or failed requests" + ] + }, + "typeValue": { + "raw": "(status?: ApiCallStatus | undefined) => ApiCallInfo[]" + }, + "editor": { + "type": "func" }, "required": true }, { - "uid": "size", - "name": "size", + "uid": "reset", + "name": "reset", "comment": { "raw": [ - "File size" + "Resets all errors" ] }, "typeValue": { - "raw": "number" + "raw": "() => void" }, "editor": { - "type": "number" + "type": "func" }, "required": true }, { - "uid": "path", - "name": "path", + "uid": "processRequest", + "name": "processRequest", "comment": { "raw": [ - "Path to the file source" + "Starts fetch call with providing params" + ] + }, + "typeValue": { + "raw": "(url: string, method: string, data?: any, options?: ApiCallOptions | undefined) => Promise" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "uploadFile", + "name": "uploadFile", + "comment": { + "raw": [ + "Starts file uploading using FormData" ] }, + "typeValue": { + "raw": "(url: string, file: File, options: FileUploadOptions) => Promise" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "apiReloginPath", + "name": "apiReloginPath", + "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" + } + }, "typeValue": { "raw": "string" }, "editor": { "type": "string" }, - "required": false + "required": true }, { - "uid": "type", - "name": "type", + "uid": "subscribe", + "name": "subscribe", "comment": { "raw": [ - "Type of file representation. Used for UUI SlateRTE file displaying." + "Add your handler, which will be called on context updates" ] }, "typeValue": { - "raw": "'attachment' | 'iframe' | 'image'" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { - "type": "oneOf", - "options": [ - "attachment", - "iframe", - "image" - ] + "type": "func" }, - "required": false + "from": "@epam/uui-core:IBaseContext", + "required": true }, { - "uid": "extension", - "name": "extension", + "uid": "unsubscribe", + "name": "unsubscribe", "comment": { "raw": [ - "Extension of the file" + "Unsubscribe from context updates" ] }, "typeValue": { - "raw": "string" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IBaseContext", + "required": true }, { - "uid": "error", - "name": "error", + "uid": "destroyContext", + "name": "destroyContext", "comment": { "raw": [ - "Upload error" + "Manually destroy context and unsubscribe from all listeners" ] }, "typeValue": { - "raw": "{ isError: boolean; message?: string | undefined; }" + "raw": "() => void" }, - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IBaseContext", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:FilterPredicate": { + "@epam/uui-core:IBaseContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FilterPredicate", - "nameFull": "FilterPredicate" + "name": "IBaseContext", + "nameFull": "IBaseContext" }, - "src": "uui-core/src/types/dataQuery.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "FilterPredicate", + "raw": "IBaseContext", "print": [ - "type FilterPredicate = {", - " /** In. Should match some of these values. */", - " in?: TField[];", - " /** Not In. Should not match some of these values. */", - " nin?: TField[];", - " /** Should be null */", - " isNull?: boolean;", - " /** Greater than */", - " gt?: TField;", - " /** Greater than or equal */", - " gte?: TField;", - " /** Lower than */", - " lt?: TField;", - " /** Lower than or equal */", - " lte?: TField;", - " /** In range. Should be in these range */", - " inRange?: RangeValue;", - " /** Not in range. Should not be in these range */", - " notInRange?: RangeValue;", - " /** Equal */", - " eq?: TField;", - " /** Not equal */", - " neq?: TField;", - " /** Should not much provide predicates */", - " not?: FilterPredicate;", - "};" + "interface IBaseContext {", + " /** Add your handler, which will be called on context updates */", + " subscribe(handler: (state: TState) => void): void;", + " /** Unsubscribe from context updates */", + " unsubscribe(handler: (state: TState) => void): void;", + " /** Manually destroy context and unsubscribe from all listeners */", + " destroyContext: () => void;", + "}" ] }, "props": [ { - "uid": "in", - "name": "in", + "uid": "subscribe", + "name": "subscribe", "comment": { "raw": [ - "In. Should match some of these values." + "Add your handler, which will be called on context updates" + ] + }, + "typeValue": { + "raw": "(handler: (state: TState) => void) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "unsubscribe", + "name": "unsubscribe", + "comment": { + "raw": [ + "Unsubscribe from context updates" ] }, "typeValue": { - "raw": "TField[]" + "raw": "(handler: (state: TState) => void) => void" }, - "required": false + "editor": { + "type": "func" + }, + "required": true }, { - "uid": "nin", - "name": "nin", + "uid": "destroyContext", + "name": "destroyContext", "comment": { "raw": [ - "Not In. Should not match some of these values." + "Manually destroy context and unsubscribe from all listeners" ] }, "typeValue": { - "raw": "TField[]" + "raw": "() => void" }, - "required": false - }, + "editor": { + "type": "func" + }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IBasicPickerToggler": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IBasicPickerToggler", + "nameFull": "IBasicPickerToggler" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "Component can be used as Toggler control for pickers.", + " This interface is enough for basic pickers.", + " Picker togglers with search or advanced selection display should implement IPickerToggler interface" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IBasicPickerToggler", + "print": [ + "/**", + " * Component can be used as Toggler control for pickers.", + " * This interface is enough for basic pickers.", + " * Picker togglers with search or advanced selection display should implement IPickerToggler interface", + " */", + "interface IBasicPickerToggler extends IDropdownTogglerProps {", + " /** Call to clear toggler value */", + " onClear?(e?: any): void;", + "}" + ] + }, + "props": [ { - "uid": "isNull", - "name": "isNull", + "uid": "onClear", + "name": "onClear", "comment": { "raw": [ - "Should be null" + "Call to clear toggler value" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e?: any) => void" }, "editor": { - "type": "bool" + "type": "func" }, "required": false }, { - "uid": "gt", - "name": "gt", + "uid": "toggleDropdownOpening", + "name": "toggleDropdownOpening", "comment": { "raw": [ - "Greater than" + "Called when associated dropdown should open or close" ] }, "typeValue": { - "raw": "TField" + "raw": "(value: boolean) => void" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "gte", - "name": "gte", + "uid": "isInteractedOutside", + "name": "isInteractedOutside", "comment": { "raw": [ - "Greater than or equal" + "Called when component is interacted outside, to close the dropdown" ] }, "typeValue": { - "raw": "TField" + "raw": "(event: Event) => boolean" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "lt", - "name": "lt", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "Lower than" + "Toggler component ref" ] }, "typeValue": { - "raw": "TField" + "raw": "null | (instance: any) => void | React.RefObject" }, + "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "lte", - "name": "lte", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "Lower than or equal" + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { - "raw": "TField" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "inRange", - "name": "inRange", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "In range. Should be in these range" + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { - "raw": "RangeValue" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "notInRange", - "name": "notInRange", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Not in range. Should not be in these range" + "Called when component is clicked" ] }, "typeValue": { - "raw": "RangeValue" + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:IClickable", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ICanBeFixed": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ICanBeFixed", + "nameFull": "ICanBeFixed" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ICanBeFixed", + "print": [ + "type ICanBeFixed = {", + " /** If specified, will make column fixed - it would not scroll horizontally */", + " fix?: 'left' | 'right';", + "};" + ] + }, + "props": [ { - "uid": "eq", - "name": "eq", + "uid": "fix", + "name": "fix", "comment": { "raw": [ - "Equal" + "If specified, will make column fixed - it would not scroll horizontally" ] }, "typeValue": { - "raw": "TField" + "raw": "'left' | 'right'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ICanBeInvalid": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ICanBeInvalid", + "nameFull": "ICanBeInvalid" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component value can be invalid" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ICanBeInvalid", + "print": [ + "/** Component value can be invalid */", + "interface ICanBeInvalid {", + " /** True if component contains invalid input */", + " isInvalid?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "neq", - "name": "neq", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Not equal" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "TField" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ICanBeReadonly": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ICanBeReadonly", + "nameFull": "ICanBeReadonly" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component can be made read-only" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ICanBeReadonly", + "print": [ + "/** Component can be made read-only */", + "interface ICanBeReadonly {", + " /** Disable editing. Unlike isDisabled, keep component's value readable. */", + " isReadonly?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "not", - "name": "not", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Should not much provide predicates" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "FilterPredicate" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, "required": false } @@ -11805,260 +14296,401 @@ "propsFromUnion": false } }, - "@epam/uui-core:FilterPredicateName": { + "@epam/uui-core:ICanBeRequired": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FilterPredicateName", - "nameFull": "FilterPredicateName" + "name": "ICanBeRequired", + "nameFull": "ICanBeRequired" }, - "src": "uui-core/src/types/dataQuery.ts", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "'in' | 'nin' | 'isNull' | 'gt' | 'gte' | 'lt' | 'lte' | 'inRange' | 'notInRange' | 'eq' | 'neq' | 'not'", + "raw": "ICanBeRequired", "print": [ - "type FilterPredicateName = keyof FilterPredicate;" + "interface ICanBeRequired {", + " /** Marks that component's value is required and shouldn't be empty */", + " isRequired?: boolean;", + "}" ] - } + }, + "props": [ + { + "uid": "isRequired", + "name": "isRequired", + "comment": { + "raw": [ + "Marks that component's value is required and shouldn't be empty" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + } + ], + "propsFromUnion": false } }, - "@epam/uui-core:FiltersConfig": { + "@epam/uui-core:ICanFocus": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FiltersConfig", - "nameFull": "FiltersConfig" + "name": "ICanFocus", + "nameFull": "ICanFocus" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component can get input focus" + ] }, - "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "FiltersConfig", + "raw": "ICanFocus", "print": [ - "type FiltersConfig = {", - " [key in keyof TFilter]: IFilterConfig;", - "};" + "/** Component can get input focus */", + "interface ICanFocus {", + " /** Called when component gets input focus */", + " onFocus?: (e: React.FocusEvent) => void;", + " /** Called when component looses input focus */", + " onBlur?: (e: React.FocusEvent) => void;", + "}" ] - } + }, + "props": [ + { + "uid": "onFocus", + "name": "onFocus", + "comment": { + "raw": [ + "Called when component gets input focus" + ] + }, + "typeValue": { + "raw": "(e: React.FocusEvent) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onBlur", + "name": "onBlur", + "comment": { + "raw": [ + "Called when component looses input focus" + ] + }, + "typeValue": { + "raw": "(e: React.FocusEvent) => void" + }, + "editor": { + "type": "func" + }, + "required": false + } + ], + "propsFromUnion": false } }, - "@epam/uui-core:FlexCellProps": { + "@epam/uui-core:ICanRedirect": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FlexCellProps", - "nameFull": "FlexCellProps" + "name": "ICanRedirect", + "nameFull": "ICanRedirect" }, "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component acts as a link, and can redirect" + ] + }, "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "FlexCellProps", + "raw": "ICanRedirect", "print": [ - "type FlexCellProps = IHasCX & IClickable & IHasRawProps> & Attributes & IHasChildren & {", - " /** CSS width. Set to 'auto' to make FlexCell resize to it's content */", - " width?: number | 'auto' | '100%';", - " /** CSS min-width */", - " minWidth?: number;", - " /** Flexbox flex-grow property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-grow) */", - " grow?: number;", - " /** Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink) */", - " shrink?: number;", - " /** 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?: CSS.AlignSelfProperty;", - " /** Standard style attribute. Styles are added to element style, overriding supplied flex styles */", - " style?: React.CSSProperties;", - "};" + "/** Component acts as a link, and can redirect */", + "interface ICanRedirect {", + " /** Link object to redirect to for SPA-redirects */", + " link?: Link;", + " /** Href (URL) to redirect to, for non-SPA redirects */", + " href?: string;", + " /** Highlights component to show that link is active (browser is displaying the page to which link is pointing) */", + " isLinkActive?: boolean;", + " /** Controls where the link should be opened */", + " target?: '_blank';", + "}" ] }, "props": [ { - "uid": "cx", - "name": "cx", + "uid": "link", + "name": "link", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Link object to redirect to for SPA-redirects" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "Link" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "href", + "name": "href", "comment": { "raw": [ - "Called when component is clicked" + "Href (URL) to redirect to, for non-SPA redirects" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "isLinkActive", + "name": "isLinkActive", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "key", - "name": "key", + "uid": "target", + "name": "target", + "comment": { + "raw": [ + "Controls where the link should be opened" + ] + }, "typeValue": { - "raw": "null | string | number" + "raw": "'_blank'" + }, + "editor": { + "type": "oneOf", + "options": [ + "_blank" + ] }, - "from": "@types/react:Attributes", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ICheckable": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ICheckable", + "nameFull": "ICheckable" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "ICheckable", + "print": [ + "type ICheckable = IEditable & IDisableable & {", + " /** Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values */", + " indeterminate?: boolean;", + "};" + ] + }, + "props": [ { - "uid": "children", - "name": "children", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Component children" + "True if component contains invalid input" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { - "uid": "width", - "name": "width", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "CSS width. Set to 'auto' to make FlexCell resize to it's content" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "number | 'auto' | '100%'" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "minWidth", - "name": "minWidth", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "CSS min-width" + "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": "grow", - "name": "grow", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Flexbox flex-grow property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-grow)" + "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": "shrink", - "name": "shrink", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Flexbox shrink property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flex-shrink)" + "The current value of component" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "textAlign", - "name": "textAlign", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "CSS text-align property" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "'left' | 'right' | 'center'" + "raw": "(newValue: boolean) => void" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "center" - ] + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "alignSelf", - "name": "alignSelf", + "uid": "indeterminate", + "name": "indeterminate", "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)" + "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IClickable": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IClickable", + "nameFull": "IClickable" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component supports click action" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IClickable", + "print": [ + "/** Component supports click action */", + "interface IClickable {", + " /** Called when component is clicked */", + " onClick?(e?: any): void;", + "}" + ] + }, + "props": [ { - "uid": "style", - "name": "style", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "Standard style attribute. Styles are added to element style, overriding supplied flex styles" + "Called when component is clicked" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" }, "required": false } @@ -12066,252 +14698,297 @@ "propsFromUnion": false } }, - "@epam/uui-core:FlexRowProps": { + "@epam/uui-core:IColumnConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FlexRowProps", - "nameFull": "FlexRowProps" + "name": "IColumnConfig", + "nameFull": "IColumnConfig" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "FlexRowProps", + "raw": "IColumnConfig", "print": [ - "type FlexRowProps = IHasCX & IClickable & Attributes & IHasChildren & IHasRawProps> & {", - " /** Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", - " * @default 'center'", - " * */", - " alignItems?: 'top' | 'center' | 'bottom' | 'stretch';", - " /** Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) */", - " justifyContent?: 'center' | 'space-between' | 'space-around' | 'space-evenly' | 'start' | 'end';", - " /** Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap) */", - " columnGap?: number | '6' | '12' | '18' | '24' | '36';", - " /** Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap) */", - " rowGap?: number | '6' | '12' | '18' | '24' | '36';", - "};" + "type IColumnConfig = {", + " /** If true, the column will be shown in the FiltersPanel */", + " isVisible?: boolean;", + " /**", + " * Determines the order in which this column should appear in the table.", + " * The columns are sorted in ascending alphabetical order.", + " */", + " order?: string;", + " /** The width of the column */", + " width?: number;", + "} & ICanBeFixed;" ] }, "props": [ { - "uid": "cx", - "name": "cx", + "uid": "isVisible", + "name": "isVisible", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "If true, the column will be shown in the FiltersPanel" ] }, "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": "onClick", - "name": "onClick", + "uid": "order", + "name": "order", "comment": { "raw": [ - "Called when component is clicked" + "Determines the order in which this column should appear in the table.", + " The columns are sorted in ascending alphabetical order." ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "key", - "name": "key", + "uid": "width", + "name": "width", + "comment": { + "raw": [ + "The width of the column" + ] + }, "typeValue": { - "raw": "null | string | number" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@types/react:Attributes", "required": false }, { - "uid": "children", - "name": "children", + "uid": "fix", + "name": "fix", "comment": { "raw": [ - "Component children" + "If specified, will make column fixed - it would not scroll horizontally" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "'left' | 'right'" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] + }, + "from": "@epam/uui-core:ICanBeFixed", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:Icon": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "Icon", + "nameFull": "Icon" + }, + "src": "uui-core/src/types/objects.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "Icon", + "print": [ + "type Icon = React.FC;" + ] + } + } + }, + "@epam/uui-core:IContextProviderSsrProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IContextProviderSsrProps", + "nameFull": "IContextProviderSsrProps" + }, + "src": "uui-core/src/ssr/useUuiServicesSsr.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IContextProviderSsrProps", + "print": [ + "interface IContextProviderSsrProps extends UseUuiServicesProps {", + " router: any;", + "}" + ] + }, + "props": [ + { + "uid": "router", + "name": "router", + "typeValue": { + "raw": "any" + }, + "required": true + }, + { + "uid": "appContext", + "name": "appContext", + "comment": { + "raw": [ + "AppContext value" + ] + }, + "typeValue": { + "raw": "TAppContext" + }, + "from": "@epam/uui-core:UseUuiServicesProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "apiDefinition", + "name": "apiDefinition", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "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": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(processRequest: IProcessRequest) => TApi" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:UuiServicesProps", "required": false }, { - "uid": "alignItems", - "name": "alignItems", + "uid": "apiReloginPath", + "name": "apiReloginPath", "comment": { "raw": [ - "Flexbox align-items property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)", - " @default 'center'" + "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": "center" + "@default": "/auth/login" } }, "typeValue": { - "raw": "'top' | 'bottom' | 'center' | 'stretch'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "top", - "bottom", - "center", - "stretch" - ] + "type": "string" }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "justifyContent", - "name": "justifyContent", + "uid": "apiPingPath", + "name": "apiPingPath", "comment": { "raw": [ - "Flexbox justifyContent property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)" - ] + "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": "'center' | 'space-around' | 'space-between' | 'space-evenly' | 'end' | 'start'" + "raw": "string" }, "editor": { - "type": "oneOf", - "options": [ - "center", - "space-around", - "space-between", - "space-evenly", - "end", - "start" - ] + "type": "string" }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "columnGap", - "name": "columnGap", + "uid": "apiServerUrl", + "name": "apiServerUrl", "comment": { "raw": [ - "Flexbox column gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" - ] + "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": "number | '6' | '12' | '18' | '24' | '36'" + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@epam/uui-core:ApiContextProps", "required": false }, { - "uid": "rowGap", - "name": "rowGap", + "uid": "fetch", + "name": "fetch", "comment": { "raw": [ - "Flexbox row gap property [Flexbox Guide](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-gap-row-gap-column-gap)" + "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", + " By default, standard fetch will be used." ] }, "typeValue": { - "raw": "number | '6' | '12' | '18' | '24' | '36'" + "raw": "typeof fetch" }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ApiContextProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:FormProps": { + "@epam/uui-core:IControlled": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "FormProps", - "nameFull": "FormProps" + "name": "IControlled", + "nameFull": "IControlled" }, - "src": "uui-core/src/data/forms/Form.tsx", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "FormProps", + "raw": "IControlled", "print": [ - "interface FormProps {", - " /** Current value of the form state */", + "interface IControlled {", + " /** The current value of component */", " value: T;", - " /**", - " * Render the form body, provided by form state", - " * */", - " renderForm: (props: IFormApi) => ReactNode;", - " /**", - " * Returns form metadata - information used to validate the form.", - " * @param state Metadata can depend on state, and will be re-computed on updates", - " */", - " getMetadata?(state: T): Metadata;", - " /**", - " * 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", - " */", - " onSave(state: T): Promise | void>;", - " /**", - " * 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.", - " * 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.", - " */", - " beforeLeave?: (() => Promise) | null;", - " /**", - " * 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.", - " */", - " loadUnsavedChanges?: () => Promise;", - " /**", - " * Called after successful save.", - " * @param state Saved state", - " * @param isSavedBeforeLeave true, if save is triggered via leaving the page, and \"Save Changes?\" dialog", - " */", - " onSuccess?(state: T, isSavedBeforeLeave?: boolean): any;", - " /** Called when save fails */", - " onError?(error: any): any;", - " /**", - " * The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)", - " */", - " settingsKey?: string;", - " /**", - " * 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", - " */", - " validationOn?: ValidationMode;", + " /** Called when value needs to be changed (usually due to user interaction) */", + " onValueChange(newValue: T): void;", "}" ] }, @@ -12321,7 +14998,7 @@ "name": "value", "comment": { "raw": [ - "Current value of the form state" + "The current value of component" ] }, "typeValue": { @@ -12330,51 +15007,131 @@ "required": true }, { - "uid": "renderForm", - "name": "renderForm", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Render the form body, provided by form state" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(props: IFormApi) => React.ReactNode" + "raw": "(newValue: T) => void" }, "editor": { - "type": "component" + "type": "func" + }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IDataSource": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IDataSource", + "nameFull": "IDataSource" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IDataSource", + "print": [ + "interface IDataSource {", + " getId(item: TItem): TId;", + " getById(id: TId): TItem | void;", + " setItem(item: TItem): void;", + " useView(value: DataSourceState, onValueChange: SetDataSourceState, options?: any, deps?: any[]): IDataSourceView;", + "}" + ] + }, + "props": [ + { + "uid": "getId", + "name": "getId", + "typeValue": { + "raw": "(item: TItem) => TId" + }, + "editor": { + "type": "func" }, "required": true }, { - "uid": "getMetadata", - "name": "getMetadata", - "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" - ] + "uid": "getById", + "name": "getById", + "typeValue": { + "raw": "(id: TId) => void | TItem" + }, + "editor": { + "type": "func" }, + "required": true + }, + { + "uid": "setItem", + "name": "setItem", + "typeValue": { + "raw": "(item: TItem) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "useView", + "name": "useView", "typeValue": { - "raw": "(state: T) => Metadata" + "raw": "(value: DataSourceState, onValueChange: SetDataSourceState, options?: any, deps?: any[] | undefined) => IDataSourceView" }, "editor": { "type": "func" }, - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IDataSourceView": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IDataSourceView", + "nameFull": "IDataSourceView" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "IDataSourceView", + "print": [ + "// eslint-disable-next-line @typescript-eslint/no-unused-vars", + "type IDataSourceView = {", + " getConfig(): IDataSourceViewConfig;", + " getById(id: TId, index: number): DataRowProps;", + " getListProps(): DataSourceListProps;", + " getVisibleRows(): DataRowProps[];", + " getSelectedRowsCount(): number;", + " reload(): void;", + " clearAllChecked(): void;", + " selectAll?: ICheckable;", + "};" + ] + }, + "props": [ { - "uid": "onSave", - "name": "onSave", - "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" - ] - }, + "uid": "getConfig", + "name": "getConfig", "typeValue": { - "raw": "(state: T) => Promise>" + "raw": "() => IDataSourceViewConfig" }, "editor": { "type": "func" @@ -12382,166 +15139,76 @@ "required": true }, { - "uid": "beforeLeave", - "name": "beforeLeave", - "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.", - " 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." - ] - }, + "uid": "getById", + "name": "getById", "typeValue": { - "raw": "null | () => Promise" + "raw": "(id: TId, index: number) => DataRowProps" }, "editor": { "type": "func" }, - "required": false + "required": true }, { - "uid": "loadUnsavedChanges", - "name": "loadUnsavedChanges", - "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." - ] - }, + "uid": "getListProps", + "name": "getListProps", "typeValue": { - "raw": "() => Promise" + "raw": "() => DataSourceListProps" }, "editor": { "type": "func" }, - "required": false + "required": true }, { - "uid": "onSuccess", - "name": "onSuccess", - "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" - ] - }, + "uid": "getVisibleRows", + "name": "getVisibleRows", "typeValue": { - "raw": "(state: T, isSavedBeforeLeave?: boolean | undefined) => any" + "raw": "() => DataRowProps[]" }, "editor": { "type": "func" }, - "required": false + "required": true }, { - "uid": "onError", - "name": "onError", - "comment": { - "raw": [ - "Called when save fails" - ] - }, + "uid": "getSelectedRowsCount", + "name": "getSelectedRowsCount", "typeValue": { - "raw": "(error: any) => any" + "raw": "() => number" }, "editor": { "type": "func" }, - "required": false + "required": true }, { - "uid": "settingsKey", - "name": "settingsKey", - "comment": { - "raw": [ - "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" - ] - }, + "uid": "reload", + "name": "reload", "typeValue": { - "raw": "string" + "raw": "() => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "required": true }, { - "uid": "validationOn", - "name": "validationOn", - "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" - ] - }, + "uid": "clearAllChecked", + "name": "clearAllChecked", "typeValue": { - "raw": "'change' | 'save'" + "raw": "() => void" }, "editor": { - "type": "oneOf", - "options": [ - "change", - "save" - ] - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:FormSaveResponse": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "FormSaveResponse", - "nameFull": "FormSaveResponse" - }, - "src": "uui-core/src/data/forms/Form.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "FormSaveResponse", - "print": [ - "interface FormSaveResponse {", - " /** New form value, which will replace previous one */", - " form?: T;", - " /** Server-side validation state. It's applied in priority over client validation. */", - " validation?: ValidationState;", - "}" - ] - }, - "props": [ - { - "uid": "form", - "name": "form", - "comment": { - "raw": [ - "New form value, which will replace previous one" - ] - }, - "typeValue": { - "raw": "T" + "type": "func" }, - "required": false + "required": true }, { - "uid": "validation", - "name": "validation", - "comment": { - "raw": [ - "Server-side validation state. It's applied in priority over client validation." - ] - }, + "uid": "selectAll", + "name": "selectAll", "typeValue": { - "raw": "ValidationState" + "raw": "ICheckable" }, "required": false } @@ -12549,57 +15216,62 @@ "propsFromUnion": false } }, - "@epam/uui-core:IAdaptiveItem": { + "@epam/uui-core:IDataSourceViewConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IAdaptiveItem", - "nameFull": "IAdaptiveItem" + "name": "IDataSourceViewConfig", + "nameFull": "IDataSourceViewConfig" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/types/dataSources.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "IAdaptiveItem", + "raw": "IDataSourceViewConfig", "print": [ - "// TBD: remove when MainMenu old api of items providing will be removed", - "interface IAdaptiveItem {", - " estimatedWidth?: number;", - " priority?: number;", - " showInBurgerMenu?: boolean;", - " collapseToMore?: boolean;", - " collapsedContainer?: boolean;", - "}" + "type IDataSourceViewConfig = {", + " complexIds?: boolean;", + " cascadeSelection?: CascadeSelection;", + " selectAll?: true | false;", + " backgroundReload?: boolean;", + " flattenSearchResults?: boolean;", + "};" ] }, "props": [ { - "uid": "estimatedWidth", - "name": "estimatedWidth", + "uid": "complexIds", + "name": "complexIds", "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, "required": false }, { - "uid": "priority", - "name": "priority", + "uid": "cascadeSelection", + "name": "cascadeSelection", "typeValue": { - "raw": "number" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, "required": false }, { - "uid": "showInBurgerMenu", - "name": "showInBurgerMenu", + "uid": "selectAll", + "name": "selectAll", "typeValue": { "raw": "boolean" }, @@ -12609,8 +15281,8 @@ "required": false }, { - "uid": "collapseToMore", - "name": "collapseToMore", + "uid": "backgroundReload", + "name": "backgroundReload", "typeValue": { "raw": "boolean" }, @@ -12620,8 +15292,8 @@ "required": false }, { - "uid": "collapsedContainer", - "name": "collapsedContainer", + "uid": "flattenSearchResults", + "name": "flattenSearchResults", "typeValue": { "raw": "boolean" }, @@ -12634,42 +15306,47 @@ "propsFromUnion": false } }, - "@epam/uui-core:IAnalyticableClick": { + "@epam/uui-core:IDisableable": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IAnalyticableClick", - "nameFull": "IAnalyticableClick" + "name": "IDisableable", + "nameFull": "IDisableable" }, "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component can be disabled" + ] + }, "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IAnalyticableClick", + "raw": "IDisableable", "print": [ - "interface IAnalyticableClick {", - " /**", - " * 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).", - " */", - " clickAnalyticsEvent?: AnalyticsEvent;", + "/** Component can be disabled */", + "interface IDisableable {", + " /** Disable editing, and visually de-emphasize value of the component */", + " isDisabled?: boolean;", "}" ] }, "props": [ { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "isDisabled", + "name": "isDisabled", "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)." + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, "required": false } @@ -12677,257 +15354,133 @@ "propsFromUnion": false } }, - "@epam/uui-core:IAnalyticableOnChange": { + "@epam/uui-core:IDndActor": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IAnalyticableOnChange", - "nameFull": "IAnalyticableOnChange" + "name": "IDndActor", + "nameFull": "IDndActor" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/types/dnd.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IAnalyticableOnChange", + "raw": "IDndActor", "print": [ - "interface IAnalyticableOnChange {", - " /**", - " * 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).", + "interface IDndActor {", + " /** Data used when this component acts as a drag source.", + " * If provided, it means this component can be dragged. Can be used in combination with dstData.", " */", - " getValueChangeAnalyticsEvent?: (newValue: T | null, oldValue: T | null) => AnalyticsEvent;", + " srcData?: TSrcData;", + " /** Data used when this component acts as a drop destination.", + " * If provided, it means something can be dragged onto this component. Can be used in combination with srcData.", + " */", + " dstData?: TDstData;", + " /** A pure function that gets permitted positions for a drop action */", + " canAcceptDrop?(params: AcceptDropParams): DropPositionOptions | null;", + " /** Called when accepted drop action performed on this actor. Usually used to reorder and update items */", + " onDrop?(data: DropParams): void;", "}" ] }, "props": [ { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "srcData", + "name": "srcData", "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)." + "Data used when this component acts as a drag source.", + " If provided, it means this component can be dragged. Can be used in combination with dstData." ] }, "typeValue": { - "raw": "(newValue: T | null, oldValue: T | null) => AnalyticsEvent" - }, - "editor": { - "type": "func" + "raw": "TSrcData" }, "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IAnalyticsContext": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IAnalyticsContext", - "nameFull": "IAnalyticsContext" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IAnalyticsContext", - "print": [ - "interface IAnalyticsContext {", - " /** Sends event to the all listeners */", - " sendEvent(event?: AnalyticsEvent): void;", - " /** Adds analytic event listener */", - " addListener(listener: IAnalyticsListener): void;", - "}" - ] - }, - "props": [ + }, { - "uid": "sendEvent", - "name": "sendEvent", + "uid": "dstData", + "name": "dstData", "comment": { "raw": [ - "Sends event to the all listeners" + "Data used when this component acts as a drop destination.", + " If provided, it means something can be dragged onto this component. Can be used in combination with srcData." ] }, "typeValue": { - "raw": "(event?: AnalyticsEvent | undefined) => void" - }, - "editor": { - "type": "func" + "raw": "TDstData" }, - "required": true + "required": false }, { - "uid": "addListener", - "name": "addListener", + "uid": "canAcceptDrop", + "name": "canAcceptDrop", "comment": { "raw": [ - "Adds analytic event listener" + "A pure function that gets permitted positions for a drop action" ] }, "typeValue": { - "raw": "(listener: IAnalyticsListener) => void" + "raw": "(params: AcceptDropParams) => Partial> | null" }, "editor": { "type": "func" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IAnalyticsListener": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IAnalyticsListener", - "nameFull": "IAnalyticsListener" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IAnalyticsListener", - "print": [ - "interface IAnalyticsListener {", - " /** Defines how to send event to the analytics system */", - " sendEvent(event: AnalyticsEvent, parameters: Omit, eventType?: 'event' | 'pageView' | 'apiTiming'): void;", - "}" - ] - }, - "props": [ + "required": false + }, { - "uid": "sendEvent", - "name": "sendEvent", + "uid": "onDrop", + "name": "onDrop", "comment": { "raw": [ - "Defines how to send event to the analytics system" + "Called when accepted drop action performed on this actor. Usually used to reorder and update items" ] }, "typeValue": { - "raw": "(event: AnalyticsEvent, parameters: Omit, eventType?: 'event' | 'pageView' | 'apiTiming' | undefined) => void" + "raw": "(data: DropParams) => void" }, "editor": { "type": "func" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IApiContext": { + "@epam/uui-core:IDndContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IApiContext", - "nameFull": "IApiContext" + "name": "IDndContext", + "nameFull": "IDndContext" }, "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, - "typeValue": { - "raw": "IApiContext", - "print": [ - "interface IApiContext extends IBaseContext {", - " /** Current status of api service.", - " * idle - service do nothing and ready to process new requests", - " * running - service is currently processing requests", - " * error - service received an error and stop processing requests, due to this error will be discarded", - " * recovery - service trying to restore connection and recover latest requests", - " * */", - " readonly status: ApiStatus;", - " /** Reason of why api trying to recover connection */", - " readonly recoveryReason: ApiRecoveryReason | null;", - " /** Returns currently processing or failed requests */", - " getActiveCalls(status?: ApiCallStatus): ApiCallInfo[];", - " /** Resets all errors */", - " reset(): void;", - " /** Starts fetch call with providing params */", - " processRequest(url: string, method: string, data?: any, options?: ApiCallOptions): Promise;", - " /** Starts file uploading using FormData */", - " uploadFile(url: string, file: File, options: FileUploadOptions): Promise;", - " /** 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'", - " * */", - " apiReloginPath: string;", - "}" - ] - }, - "props": [ - { - "uid": "status", - "name": "status", - "comment": { - "raw": [ - "Current status of api service.", - " idle - service do nothing and ready to process new requests", - " running - service is currently processing requests", - " error - service received an error and stop processing requests, due to this error will be discarded", - " recovery - service trying to restore connection and recover latest requests" - ] - }, - "typeValue": { - "raw": "'running' | 'error' | 'idle' | 'recovery'" - }, - "typeValueRef": "@epam/uui-core:ApiStatus", - "editor": { - "type": "oneOf", - "options": [ - "running", - "error", - "idle", - "recovery" - ] - }, - "required": true - }, - { - "uid": "recoveryReason", - "name": "recoveryReason", - "comment": { - "raw": [ - "Reason of why api trying to recover connection" - ] - }, - "typeValue": { - "raw": "null | 'auth-lost' | 'connection-lost' | 'server-overload' | 'maintenance'" - }, - "typeValueRef": "@epam/uui-core:ApiRecoveryReason", - "editor": { - "type": "oneOf", - "options": [ - "auth-lost", - "connection-lost", - "server-overload", - "maintenance", - null - ] - }, - "required": false - }, + "typeValue": { + "raw": "IDndContext", + "print": [ + "interface IDndContext extends IBaseContext {", + " startDrag(node: Node, data: any, renderGhost: () => React.ReactNode): void;", + " endDrag(): void;", + " /** Indicates that drag in progress */", + " isDragging: boolean;", + " dragData?: any;", + " getMouseCoords: () => TMouseCoords;", + "}" + ] + }, + "props": [ { - "uid": "getActiveCalls", - "name": "getActiveCalls", - "comment": { - "raw": [ - "Returns currently processing or failed requests" - ] - }, + "uid": "startDrag", + "name": "startDrag", "typeValue": { - "raw": "(status?: ApiCallStatus | undefined) => ApiCallInfo[]" + "raw": "(node: Node, data: any, renderGhost: () => React.ReactNode) => void" }, "editor": { "type": "func" @@ -12935,13 +15488,8 @@ "required": true }, { - "uid": "reset", - "name": "reset", - "comment": { - "raw": [ - "Resets all errors" - ] - }, + "uid": "endDrag", + "name": "endDrag", "typeValue": { "raw": "() => void" }, @@ -12951,55 +15499,37 @@ "required": true }, { - "uid": "processRequest", - "name": "processRequest", + "uid": "isDragging", + "name": "isDragging", "comment": { "raw": [ - "Starts fetch call with providing params" + "Indicates that drag in progress" ] }, "typeValue": { - "raw": "(url: string, method: string, data?: any, options?: ApiCallOptions | undefined) => Promise" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "required": true }, { - "uid": "uploadFile", - "name": "uploadFile", - "comment": { - "raw": [ - "Starts file uploading using FormData" - ] - }, + "uid": "dragData", + "name": "dragData", "typeValue": { - "raw": "(url: string, file: File, options: FileUploadOptions) => Promise" - }, - "editor": { - "type": "func" + "raw": "any" }, - "required": true + "required": false }, { - "uid": "apiReloginPath", - "name": "apiReloginPath", - "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" - } - }, + "uid": "getMouseCoords", + "name": "getMouseCoords", "typeValue": { - "raw": "string" + "raw": "() => TMouseCoords" }, "editor": { - "type": "string" + "type": "func" }, "required": true }, @@ -13012,7 +15542,7 @@ ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "(handler: (state: DndContextState) => void) => void" }, "editor": { "type": "func" @@ -13029,7 +15559,7 @@ ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "(handler: (state: DndContextState) => void) => void" }, "editor": { "type": "func" @@ -13058,70 +15588,94 @@ "propsFromUnion": false } }, - "@epam/uui-core:IBaseContext": { + "@epam/uui-core:IDropdownBodyProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IBaseContext", - "nameFull": "IBaseContext" + "name": "IDropdownBodyProps", + "nameFull": "IDropdownBodyProps" }, - "src": "uui-core/src/types/contexts.ts", + "src": "uui-core/src/types/props.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IBaseContext", + "raw": "IDropdownBodyProps", "print": [ - "interface IBaseContext {", - " /** Add your handler, which will be called on context updates */", - " subscribe(handler: (state: TState) => void): void;", - " /** Unsubscribe from context updates */", - " unsubscribe(handler: (state: TState) => void): void;", - " /** Manually destroy context and unsubscribe from all listeners */", - " destroyContext: () => void;", + "interface IDropdownBodyProps {", + " /** Call to close the Dropdown body */", + " onClose?: () => void;", + " /** The width of the toggler, which can be used to adjust the body width to it */", + " togglerWidth?: number;", + " /** The height of the toggler */", + " togglerHeight?: number;", + " /** Call to force recompute dropdown position */", + " scheduleUpdate?: () => void;", + " /** Indicates that dropdown is open */", + " isOpen?: boolean;", + " /** Props that should be provided to the arrow component */", + " arrowProps?: PopperArrowProps;", + " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", + " placement?: Placement;", "}" ] }, "props": [ { - "uid": "subscribe", - "name": "subscribe", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Add your handler, which will be called on context updates" + "Call to close the Dropdown body" ] }, "typeValue": { - "raw": "(handler: (state: TState) => void) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "required": true + "required": false }, { - "uid": "unsubscribe", - "name": "unsubscribe", + "uid": "togglerWidth", + "name": "togglerWidth", "comment": { "raw": [ - "Unsubscribe from context updates" + "The width of the toggler, which can be used to adjust the body width to it" ] }, "typeValue": { - "raw": "(handler: (state: TState) => void) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "destroyContext", - "name": "destroyContext", + "uid": "togglerHeight", + "name": "togglerHeight", "comment": { "raw": [ - "Manually destroy context and unsubscribe from all listeners" + "The height of the toggler" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "scheduleUpdate", + "name": "scheduleUpdate", + "comment": { + "raw": [ + "Call to force recompute dropdown position" ] }, "typeValue": { @@ -13130,25 +15684,85 @@ "editor": { "type": "func" }, - "required": true + "required": false + }, + { + "uid": "isOpen", + "name": "isOpen", + "comment": { + "raw": [ + "Indicates that dropdown is open" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "arrowProps", + "name": "arrowProps", + "comment": { + "raw": [ + "Props that should be provided to the arrow component" + ] + }, + "typeValue": { + "raw": "PopperArrowProps" + }, + "required": false + }, + { + "uid": "placement", + "name": "placement", + "comment": { + "raw": [ + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + ] + }, + "typeValue": { + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] + }, + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IBasicPickerToggler": { + "@epam/uui-core:IDropdownToggler": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IBasicPickerToggler", - "nameFull": "IBasicPickerToggler" + "name": "IDropdownToggler", + "nameFull": "IDropdownToggler" }, - "src": "uui-core/src/types/pickers.ts", + "src": "uui-core/src/types/props.ts", "comment": { "raw": [ - "Component can be used as Toggler control for pickers.", - " This interface is enough for basic pickers.", - " Picker togglers with search or advanced selection display should implement IPickerToggler interface" + "Component can be used as Toggler control for dropdown menus" ] }, "exported": true @@ -13156,36 +15770,80 @@ "details": { "kind": 264, "typeValue": { - "raw": "IBasicPickerToggler", + "raw": "IDropdownToggler", "print": [ - "/**", - " * Component can be used as Toggler control for pickers.", - " * This interface is enough for basic pickers.", - " * Picker togglers with search or advanced selection display should implement IPickerToggler interface", - " */", - "interface IBasicPickerToggler extends IDropdownTogglerProps {", - " /** Call to clear toggler value */", - " onClear?(e?: any): void;", + "/** Component can be used as Toggler control for dropdown menus */", + "interface IDropdownToggler {", + " /** When isDropdown=true, indicate that dropdown is open with chevron icon */", + " isOpen?: boolean;", + " /** Shows chevron icon, enabling component to act as dropdown toggler */", + " isDropdown?: boolean;", "}" ] }, "props": [ { - "uid": "onClear", - "name": "onClear", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "Call to clear toggler value" + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "required": false }, + { + "uid": "isDropdown", + "name": "isDropdown", + "comment": { + "raw": [ + "Shows chevron icon, enabling component to act as dropdown toggler" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IDropdownTogglerProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IDropdownTogglerProps", + "nameFull": "IDropdownTogglerProps" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IDropdownTogglerProps", + "print": [ + "interface IDropdownTogglerProps extends IDropdownToggler, IClickable {", + " /** Called when associated dropdown should open or close */", + " toggleDropdownOpening?: (value: boolean) => void;", + " /** Called when component is interacted outside, to close the dropdown */", + " isInteractedOutside?: (event: Event) => boolean;", + " /** Toggler component ref */", + " ref?: React.Ref;", + "}" + ] + }, + "props": [ { "uid": "toggleDropdownOpening", "name": "toggleDropdownOpening", @@ -13200,7 +15858,6 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { @@ -13217,7 +15874,6 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { @@ -13231,7 +15887,6 @@ "typeValue": { "raw": "null | (instance: any) => void | React.RefObject" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { @@ -13289,63 +15944,17 @@ "propsFromUnion": false } }, - "@epam/uui-core:ICanBeFixed": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ICanBeFixed", - "nameFull": "ICanBeFixed" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "ICanBeFixed", - "print": [ - "type ICanBeFixed = {", - " /** If specified, will make column fixed - it would not scroll horizontally */", - " fix?: 'left' | 'right';", - "};" - ] - }, - "props": [ - { - "uid": "fix", - "name": "fix", - "comment": { - "raw": [ - "If specified, will make column fixed - it would not scroll horizontally" - ] - }, - "typeValue": { - "raw": "'left' | 'right'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] - }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ICanBeInvalid": { + "@epam/uui-core:IEditable": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ICanBeInvalid", - "nameFull": "ICanBeInvalid" + "name": "IEditable", + "nameFull": "IEditable" }, "src": "uui-core/src/types/props.ts", "comment": { "raw": [ - "Component value can be invalid" + "Component displays an editable value. Text Input is a basic example." ] }, "exported": true @@ -13353,12 +15962,10 @@ "details": { "kind": 264, "typeValue": { - "raw": "ICanBeInvalid", + "raw": "IEditable", "print": [ - "/** Component value can be invalid */", - "interface ICanBeInvalid {", - " /** True if component contains invalid input */", - " isInvalid?: boolean;", + "/** Component displays an editable value. Text Input is a basic example. */", + "interface IEditable extends ICanBeInvalid, IDisableable, ICanBeReadonly, ICanBeRequired, IControlled {", "}" ] }, @@ -13377,40 +15984,26 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ICanBeReadonly": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ICanBeReadonly", - "nameFull": "ICanBeReadonly" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component can be made read-only" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ICanBeReadonly", - "print": [ - "/** Component can be made read-only */", - "interface ICanBeReadonly {", - " /** Disable editing. Unlike isDisabled, keep component's value readable. */", - " isReadonly?: boolean;", - "}" - ] - }, - "props": [ + }, + { + "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", @@ -13425,34 +16018,9 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ICanBeRequired": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ICanBeRequired", - "nameFull": "ICanBeRequired" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ICanBeRequired", - "print": [ - "interface ICanBeRequired {", - " /** Marks that component's value is required and shouldn't be empty */", - " isRequired?: boolean;", - "}" - ] - }, - "props": [ + }, { "uid": "isRequired", "name": "isRequired", @@ -13467,89 +16035,55 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ICanFocus": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ICanFocus", - "nameFull": "ICanFocus" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component can get input focus" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ICanFocus", - "print": [ - "/** Component can get input focus */", - "interface ICanFocus {", - " /** Called when component gets input focus */", - " onFocus?: (e: React.FocusEvent) => void;", - " /** Called when component looses input focus */", - " onBlur?: (e: React.FocusEvent) => void;", - "}" - ] - }, - "props": [ + }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Called when component gets input focus" + "The current value of component" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" - }, - "editor": { - "type": "func" + "raw": "T" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Called when component looses input focus" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "(newValue: T) => void" }, "editor": { "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:ICanRedirect": { + "@epam/uui-core:IEditableDebouncerOptions": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ICanRedirect", - "nameFull": "ICanRedirect" + "name": "IEditableDebouncerOptions", + "nameFull": "IEditableDebouncerOptions" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/helpers/IEditableDebouncer.ts", "comment": { "raw": [ - "Component acts as a link, and can redirect" + "IEditableDebouncer component options." ] }, "exported": true @@ -13557,57 +16091,26 @@ "details": { "kind": 264, "typeValue": { - "raw": "ICanRedirect", + "raw": "IEditableDebouncerOptions", "print": [ - "/** Component acts as a link, and can redirect */", - "interface ICanRedirect {", - " /** Link object to redirect to for SPA-redirects */", - " link?: Link;", - " /** Href (URL) to redirect to, for non-SPA redirects */", - " href?: string;", - " /** Highlights component to show that link is active (browser is displaying the page to which link is pointing) */", - " isLinkActive?: boolean;", - " /** Controls where the link should be opened */", - " target?: '_blank';", + "/**", + " * IEditableDebouncer component options.", + " */", + "interface IEditableDebouncerOptions {", + " /** Pass true to disable debouncing */", + " disableDebounce?: boolean;", + " /** Debounce delay in ms. Default value is 500ms */", + " debounceDelay?: number;", "}" ] }, "props": [ { - "uid": "link", - "name": "link", - "comment": { - "raw": [ - "Link object to redirect to for SPA-redirects" - ] - }, - "typeValue": { - "raw": "Link" - }, - "required": false - }, - { - "uid": "href", - "name": "href", - "comment": { - "raw": [ - "Href (URL) to redirect to, for non-SPA redirects" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "isLinkActive", - "name": "isLinkActive", + "uid": "disableDebounce", + "name": "disableDebounce", "comment": { "raw": [ - "Highlights component to show that link is active (browser is displaying the page to which link is pointing)" + "Pass true to disable debouncing" ] }, "typeValue": { @@ -13619,21 +16122,18 @@ "required": false }, { - "uid": "target", - "name": "target", + "uid": "debounceDelay", + "name": "debounceDelay", "comment": { "raw": [ - "Controls where the link should be opened" + "Debounce delay in ms. Default value is 500ms" ] }, "typeValue": { - "raw": "'_blank'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "_blank" - ] + "type": "number" }, "required": false } @@ -13641,28 +16141,54 @@ "propsFromUnion": false } }, - "@epam/uui-core:ICheckable": { + "@epam/uui-core:IEditableDebouncerProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ICheckable", - "nameFull": "ICheckable" + "name": "IEditableDebouncerProps", + "nameFull": "IEditableDebouncerProps" + }, + "src": "uui-core/src/helpers/IEditableDebouncer.ts", + "comment": { + "raw": [ + "IEditableDebouncer component props." + ] }, - "src": "uui-core/src/types/props.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "ICheckable", + "raw": "IEditableDebouncerProps", "print": [ - "type ICheckable = IEditable & IDisableable & {", - " /** Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values */", - " indeterminate?: boolean;", - "};" + "/**", + " * IEditableDebouncer component props.", + " */", + "interface IEditableDebouncerProps extends IEditable, IEditableDebouncerOptions, IAnalyticableOnChange {", + " /**", + " * Render wrapped component.", + " */", + " render: (props: IEditable) => React.ReactNode;", + "}" ] }, "props": [ + { + "uid": "render", + "name": "render", + "comment": { + "raw": [ + "Render wrapped component." + ] + }, + "typeValue": { + "raw": "(props: IEditable) => React.ReactNode" + }, + "editor": { + "type": "component" + }, + "required": true + }, { "uid": "isInvalid", "name": "isInvalid", @@ -13740,10 +16266,7 @@ ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "T" }, "from": "@epam/uui-core:IControlled", "required": true @@ -13757,7 +16280,7 @@ ] }, "typeValue": { - "raw": "(newValue: boolean) => void" + "raw": "(newValue: T) => void" }, "editor": { "type": "func" @@ -13766,11 +16289,11 @@ "required": true }, { - "uid": "indeterminate", - "name": "indeterminate", + "uid": "disableDebounce", + "name": "disableDebounce", "comment": { "raw": [ - "Sets checkbox in indeterminate state (neither checked or unchecked), which usually means that children elements has both values" + "Pass true to disable debouncing" ] }, "typeValue": { @@ -13779,806 +16302,989 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:IEditableDebouncerOptions", + "required": false + }, + { + "uid": "debounceDelay", + "name": "debounceDelay", + "comment": { + "raw": [ + "Debounce delay in ms. Default value is 500ms" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:IEditableDebouncerOptions", + "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: T | null, oldValue: T | null) => AnalyticsEvent" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IClickable": { + "@epam/uui-core:IErrorContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IClickable", - "nameFull": "IClickable" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component supports click action" - ] + "name": "IErrorContext", + "nameFull": "IErrorContext" }, + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IClickable", + "raw": "IErrorContext", "print": [ - "/** Component supports click action */", - "interface IClickable {", - " /** Called when component is clicked */", - " onClick?(e?: any): void;", + "interface IErrorContext extends IBaseContext {", + " /** Current error */", + " currentError?: Error;", + " /** Reports error to context */", + " reportError(error: Error): void;", + " /** Sets an error handler callback */", + " onError(callback: Function): void;", + " /** Discard current error */", + " discardError(): void;", + " /** Discard errors and refresh app */", + " recover(): void;", "}" ] }, "props": [ { - "uid": "onClick", - "name": "onClick", + "uid": "currentError", + "name": "currentError", "comment": { "raw": [ - "Called when component is clicked" + "Current error" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "Error" + }, + "required": false + }, + { + "uid": "reportError", + "name": "reportError", + "comment": { + "raw": [ + "Reports error to context" + ] + }, + "typeValue": { + "raw": "(error: Error) => void" }, "editor": { "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IColumnConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IColumnConfig", - "nameFull": "IColumnConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "IColumnConfig", - "print": [ - "type IColumnConfig = {", - " /** If true, the column will be shown in the FiltersPanel */", - " isVisible?: boolean;", - " /**", - " * Determines the order in which this column should appear in the table.", - " * The columns are sorted in ascending alphabetical order.", - " */", - " order?: string;", - " /** The width of the column */", - " width?: number;", - "} & ICanBeFixed;" - ] - }, - "props": [ + "required": true + }, { - "uid": "isVisible", - "name": "isVisible", + "uid": "onError", + "name": "onError", "comment": { "raw": [ - "If true, the column will be shown in the FiltersPanel" + "Sets an error handler callback" ] }, "typeValue": { - "raw": "boolean" + "raw": "(callback: Function) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "required": false + "required": true }, { - "uid": "order", - "name": "order", + "uid": "discardError", + "name": "discardError", "comment": { "raw": [ - "Determines the order in which this column should appear in the table.", - " The columns are sorted in ascending alphabetical order." + "Discard current error" ] }, "typeValue": { - "raw": "string" + "raw": "() => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "required": true }, { - "uid": "width", - "name": "width", + "uid": "recover", + "name": "recover", "comment": { "raw": [ - "The width of the column" + "Discard errors and refresh app" ] }, "typeValue": { - "raw": "number" + "raw": "() => void" }, "editor": { - "type": "number" + "type": "func" }, - "required": false + "required": true }, { - "uid": "fix", - "name": "fix", + "uid": "subscribe", + "name": "subscribe", "comment": { "raw": [ - "If specified, will make column fixed - it would not scroll horizontally" + "Add your handler, which will be called on context updates" ] }, "typeValue": { - "raw": "'left' | 'right'" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right" + "type": "func" + }, + "from": "@epam/uui-core:IBaseContext", + "required": true + }, + { + "uid": "unsubscribe", + "name": "unsubscribe", + "comment": { + "raw": [ + "Unsubscribe from context updates" ] }, - "from": "@epam/uui-core:ICanBeFixed", - "required": false + "typeValue": { + "raw": "(handler: (state: {}) => void) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IBaseContext", + "required": true + }, + { + "uid": "destroyContext", + "name": "destroyContext", + "comment": { + "raw": [ + "Manually destroy context and unsubscribe from all listeners" + ] + }, + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IBaseContext", + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:Icon": { + "@epam/uui-core:IFilterConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "Icon", - "nameFull": "Icon" + "name": "IFilterConfig", + "nameFull": "IFilterConfig" }, - "src": "uui-core/src/types/objects.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "Icon", + "raw": "IFilterConfig", "print": [ - "type Icon = React.FC;" + "type IFilterConfig = {", + " /** If true, the filter will be shown in the FiltersPanel */", + " isVisible: boolean;", + " /**", + " * Determines the order in which this filter should appear in the filters list.", + " * The filters are sorted in ascending alphabetical order.", + " */", + " order?: string;", + "};" ] - } + }, + "props": [ + { + "uid": "isVisible", + "name": "isVisible", + "comment": { + "raw": [ + "If true, the filter will be shown in the FiltersPanel" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + }, + { + "uid": "order", + "name": "order", + "comment": { + "raw": [ + "Determines the order in which this filter should appear in the filters list.", + " The filters are sorted in ascending alphabetical order." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + } + ], + "propsFromUnion": false } }, - "@epam/uui-core:IContextProviderSsrProps": { + "@epam/uui-core:IFilterItemBodyProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IContextProviderSsrProps", - "nameFull": "IContextProviderSsrProps" + "name": "IFilterItemBodyProps", + "nameFull": "IFilterItemBodyProps" }, - "src": "uui-core/src/ssr/useUuiServicesSsr.tsx", + "src": "uui-core/src/types/components/filterItemBody.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "IContextProviderSsrProps", + "raw": "FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & { type: 'singlePicker' | 'multiPicker'; showSearch?: boolean | undefined; maxBodyHeight?: number | 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": [ - "interface IContextProviderSsrProps extends UseUuiServicesProps {", - " router: any;", - "}" + "type IFilterItemBodyProps = TableFiltersConfig & IEditable & IDropdownBodyProps & {", + " /** Name of currently selected predicate */", + " selectedPredicate?: string;", + "};" ] }, "props": [ { - "uid": "router", - "name": "router", + "uid": "title", + "name": "title", + "comment": { + "raw": [ + "Title of the filter, displayed in filter toggler and filter body" + ] + }, "typeValue": { - "raw": "any" + "raw": "string" + }, + "editor": { + "type": "string" }, + "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "appContext", - "name": "appContext", + "uid": "field", + "name": "field", "comment": { "raw": [ - "AppContext value" + "Field of filters object, where store the filter value" ] }, "typeValue": { - "raw": "TAppContext" + "raw": "keyof TFilter" }, - "from": "@epam/uui-core:UseUuiServicesProps", + "from": "@epam/uui-core:FilterConfigBase", + "required": true + }, + { + "uid": "columnKey", + "name": "columnKey", + "comment": { + "raw": [ + "Key of the column to which the filter is attached.", + " If omitted, filter won't be attached to the column." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "apiDefinition", - "name": "apiDefinition", + "uid": "isAlwaysVisible", + "name": "isAlwaysVisible", "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)'" + "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" ] }, "typeValue": { - "raw": "(processRequest: IProcessRequest) => TApi" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:UuiServicesProps", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "apiReloginPath", - "name": "apiReloginPath", + "uid": "predicates", + "name": "predicates", "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" - } + "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." + ] }, "typeValue": { - "raw": "string" + "raw": "IFilterPredicate[]" + }, + "from": "@epam/uui-core:FilterConfigBase", + "required": false + }, + { + "uid": "maxCount", + "name": "maxCount", + "comment": { + "raw": [ + "Count of words to show in the Filter toggler. By default, 2 item will be shown." + ] + }, + "typeValue": { + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "apiPingPath", - "name": "apiPingPath", + "uid": "togglerWidth", + "name": "togglerWidth", "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" - } + "Defines maxWidth of the filter toggler" + ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "apiServerUrl", - "name": "apiServerUrl", + "uid": "dataSource", + "name": "dataSource", "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": "" - } + "Datasource to get data for the picker" + ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "IDataSource" }, - "from": "@epam/uui-core:ApiContextProps", - "required": false + "from": "@epam/uui-core:PickerBaseOptions", + "required": true }, { - "uid": "fetch", - "name": "fetch", + "uid": "getName", + "name": "getName", "comment": { "raw": [ - "Allows to replace fetch implementation, for adding auth headers, mocking for testing, etc.", - " By default, standard fetch will be used." + "A pure function that gets entity name from entity object.", + " Default: (item) => item.name." ] }, "typeValue": { - "raw": "typeof fetch" + "raw": "(item: any) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ApiContextProps", + "from": "@epam/uui-core:PickerBaseOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IControlled": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IControlled", - "nameFull": "IControlled" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IControlled", - "print": [ - "interface IControlled {", - " /** The current value of component */", - " value: T;", - " /** Called when value needs to be changed (usually due to user interaction) */", - " onValueChange(newValue: T): void;", - "}" - ] - }, - "props": [ + }, { - "uid": "value", - "name": "value", + "uid": "renderRow", + "name": "renderRow", "comment": { "raw": [ - "The current value of component" + "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." ] }, "typeValue": { - "raw": "T" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, - "required": true + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Type of the filter" ] }, "typeValue": { - "raw": "(newValue: T) => void" + "raw": "'singlePicker' | 'multiPicker'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "singlePicker", + "multiPicker" + ] }, + "from": "@epam/uui-core:PickerFilterConfig", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IDataSource": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IDataSource", - "nameFull": "IDataSource" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IDataSource", - "print": [ - "interface IDataSource {", - " getId(item: TItem): TId;", - " getById(id: TId): TItem | void;", - " setItem(item: TItem): void;", - " getView(value: DataSourceState, onValueChange: (val: DataSourceState) => any, options?: any): IDataSourceView;", - " useView(value: DataSourceState, onValueChange: (val: DataSourceState) => any, options?: any, deps?: any[]): IDataSourceView;", - " unsubscribeView(onValueChange: (val: DataSourceState) => any): void;", - "}" - ] - }, - "props": [ + }, { - "uid": "getId", - "name": "getId", + "uid": "showSearch", + "name": "showSearch", + "comment": { + "raw": [ + "Pass false to hide search in picker body.", + " If omitted, true value will be used." + ] + }, "typeValue": { - "raw": "(item: TItem) => TId" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:PickerFilterConfig", + "required": false }, { - "uid": "getById", - "name": "getById", + "uid": "maxBodyHeight", + "name": "maxBodyHeight", + "comment": { + "raw": [ + "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" + ] + }, "typeValue": { - "raw": "(id: TId) => void | TItem" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "from": "@epam/uui-core:PickerFilterConfig", + "required": false }, { - "uid": "setItem", - "name": "setItem", + "uid": "isInvalid", + "name": "isInvalid", + "comment": { + "raw": [ + "True if component contains invalid input" + ] + }, "typeValue": { - "raw": "(item: TItem) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:ICanBeInvalid", + "required": false }, { - "uid": "getView", - "name": "getView", + "uid": "isDisabled", + "name": "isDisabled", + "comment": { + "raw": [ + "Disable editing, and visually de-emphasize value of the component" + ] + }, "typeValue": { - "raw": "(value: DataSourceState, onValueChange: (val: DataSourceState) => any, options?: any) => IDataSourceView" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDisableable", + "required": false }, { - "uid": "useView", - "name": "useView", + "uid": "isReadonly", + "name": "isReadonly", + "comment": { + "raw": [ + "Disable editing. Unlike isDisabled, keep component's value readable." + ] + }, "typeValue": { - "raw": "(value: DataSourceState, onValueChange: (val: DataSourceState) => any, options?: any, deps?: any[] | undefined) => IDataSourceView" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:ICanBeReadonly", + "required": false }, { - "uid": "unsubscribeView", - "name": "unsubscribeView", + "uid": "isRequired", + "name": "isRequired", + "comment": { + "raw": [ + "Marks that component's value is required and shouldn't be empty" + ] + }, "typeValue": { - "raw": "(onValueChange: (val: DataSourceState) => any) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IDataSourceView": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IDataSourceView", - "nameFull": "IDataSourceView" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "IDataSourceView", - "print": [ - "// eslint-disable-next-line @typescript-eslint/no-unused-vars", - "type IDataSourceView = {", - " getConfig(): IDataSourceViewConfig;", - " getById(id: TId, index: number): DataRowProps;", - " getListProps(): DataSourceListProps;", - " getRows(): DataRowProps[];", - " getSelectedRows(range?: VirtualListRange): DataRowProps[];", - " getSelectedRowsCount(): number;", - " reload(): void;", - " /**", - " * Activates IDataSourceView.", - " * After view activation, it becomes able to listen to updates.", - " */", - " activate(): void;", - " /**", - " * Deactivates IDataSourceView.", - " * After view deactivation, it becomes impossible to listen to updates.", - " */", - " deactivate(): void;", - " loadData(): void;", - " clearAllChecked(): void;", - " _forceUpdate(): void;", - " selectAll?: ICheckable;", - "};" - ] - }, - "props": [ + "from": "@epam/uui-core:ICanBeRequired", + "required": false + }, { - "uid": "getConfig", - "name": "getConfig", - "typeValue": { - "raw": "() => IDataSourceViewConfig" + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "The current value of component" + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "any" }, + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getById", - "name": "getById", + "uid": "onValueChange", + "name": "onValueChange", + "comment": { + "raw": [ + "Called when value needs to be changed (usually due to user interaction)" + ] + }, "typeValue": { - "raw": "(id: TId, index: number) => DataRowProps" + "raw": "(newValue: any) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "getListProps", - "name": "getListProps", + "uid": "onClose", + "name": "onClose", + "comment": { + "raw": [ + "Call to close the Dropdown body" + ] + }, "typeValue": { - "raw": "() => DataSourceListProps" + "raw": "() => void" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "getRows", - "name": "getRows", + "uid": "togglerHeight", + "name": "togglerHeight", + "comment": { + "raw": [ + "The height of the toggler" + ] + }, "typeValue": { - "raw": "() => DataRowProps[]" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "getSelectedRows", - "name": "getSelectedRows", + "uid": "scheduleUpdate", + "name": "scheduleUpdate", + "comment": { + "raw": [ + "Call to force recompute dropdown position" + ] + }, "typeValue": { - "raw": "(range?: VirtualListRange | undefined) => DataRowProps[]" + "raw": "() => void" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "getSelectedRowsCount", - "name": "getSelectedRowsCount", + "uid": "isOpen", + "name": "isOpen", + "comment": { + "raw": [ + "Indicates that dropdown is open" + ] + }, "typeValue": { - "raw": "() => number" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "reload", - "name": "reload", - "typeValue": { - "raw": "() => void" + "uid": "arrowProps", + "name": "arrowProps", + "comment": { + "raw": [ + "Props that should be provided to the arrow component" + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "PopperArrowProps" }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "activate", - "name": "activate", + "uid": "placement", + "name": "placement", "comment": { "raw": [ - "Activates IDataSourceView.", - " After view activation, it becomes able to listen to updates." + "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" ] }, "typeValue": { - "raw": "() => void" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, - "required": true + "from": "@epam/uui-core:IDropdownBodyProps", + "required": false }, { - "uid": "deactivate", - "name": "deactivate", + "uid": "selectedPredicate", + "name": "selectedPredicate", "comment": { "raw": [ - "Deactivates IDataSourceView.", - " After view deactivation, it becomes impossible to listen to updates." + "Name of currently selected predicate" ] }, "typeValue": { - "raw": "() => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "required": false }, { - "uid": "loadData", - "name": "loadData", + "uid": "filter", + "name": "filter", + "comment": { + "raw": [ + "Filter selectable days. Days, for which this callback returns false - will be disabled" + ] + }, "typeValue": { - "raw": "() => void" + "raw": "(day: Dayjs) => boolean" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:BaseDatePickerProps", + "required": false }, { - "uid": "clearAllChecked", - "name": "clearAllChecked", + "uid": "format", + "name": "format", + "comment": { + "raw": [ + "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + ] + }, "typeValue": { - "raw": "() => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "from": "@epam/uui-core:BaseDatePickerProps", + "required": false }, { - "uid": "_forceUpdate", - "name": "_forceUpdate", + "uid": "type_2", + "name": "type", + "comment": { + "raw": [ + "Type of the filter" + ] + }, "typeValue": { - "raw": "() => void" + "raw": "'datePicker'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "datePicker" + ] }, + "from": "@epam/uui-core:DatePickerFilterConfig", "required": true }, { - "uid": "selectAll", - "name": "selectAll", - "typeValue": { - "raw": "ICheckable" + "uid": "type_3", + "name": "type", + "comment": { + "raw": [ + "Type of the filter" + ] }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IDataSourceViewConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IDataSourceViewConfig", - "nameFull": "IDataSourceViewConfig" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "IDataSourceViewConfig", - "print": [ - "type IDataSourceViewConfig = {", - " complexIds?: boolean;", - " cascadeSelection?: CascadeSelection;", - " selectAll?: true | false;", - " backgroundReload?: boolean;", - " flattenSearchResults?: boolean;", - "};" - ] - }, - "props": [ - { - "uid": "complexIds", - "name": "complexIds", "typeValue": { - "raw": "boolean" + "raw": "'numeric'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "numeric" + ] }, - "required": false + "from": "@epam/uui-core:NumericFilterConfig", + "required": true }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "type_4", + "name": "type", + "comment": { + "raw": [ + "Type of the filter" + ] + }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "'rangeDatePicker'" }, "editor": { "type": "oneOf", "options": [ - false, - true, - "implicit", - "explicit" + "rangeDatePicker" ] }, - "required": false + "from": "@epam/uui-core:RangeDatePickerFilterConfig", + "required": true }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "type_5", + "name": "type", + "comment": { + "raw": [ + "Type of the filter" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "'custom'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "custom" + ] }, - "required": false + "from": "@epam/uui-core:CustomFilterConfig", + "required": true }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "render", + "name": "render", + "comment": { + "raw": [ + "Render callback for filter body" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "(props: IFilterItemBodyProps) => React.ReactElement>" }, "editor": { - "type": "bool" + "type": "component" }, - "required": false + "from": "@epam/uui-core:CustomFilterConfig", + "required": true }, { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", + "uid": "getTogglerValue", + "name": "getTogglerValue", + "comment": { + "raw": [ + "A pure function that gets value to display in filter toggler" + ] + }, "typeValue": { - "raw": "boolean" + "raw": "(props: IFilterItemBodyProps) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "required": false + "from": "@epam/uui-core:CustomFilterConfig", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:IDisableable": { + "@epam/uui-core:IFilterPredicate": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IDisableable", - "nameFull": "IDisableable" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component can be disabled" - ] + "name": "IFilterPredicate", + "nameFull": "IFilterPredicate" }, + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "IDisableable", + "raw": "IFilterPredicate", "print": [ - "/** Component can be disabled */", - "interface IDisableable {", - " /** Disable editing, and visually de-emphasize value of the component */", - " isDisabled?: boolean;", - "}" + "type IFilterPredicate = {", + " /** Name of the predicate, used to display */", + " name: string;", + " /** Predicate key, which wraps filter value.", + " * E.g. your have 'in' predicate for locationIds filter, the resulted filter object will be:", + " * filter: {", + " * locationIds: {", + " * in: [/selected location ids/]", + " * }", + " * }", + " * */", + " predicate: FilterPredicateName;", + " /** Pass true to make this predicate selected by default */", + " isDefault?: boolean;", + "};" ] }, "props": [ { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "name", + "name": "name", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Name of the predicate, used to display" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "uid": "predicate", + "name": "predicate", + "comment": { + "raw": [ + "Predicate key, which wraps filter value.", + " E.g. your have 'in' predicate for locationIds filter, the resulted filter object will be:", + " filter: {", + " locationIds: {", + " in: [/selected location ids/]", + " }", + " }" + ] + }, + "typeValue": { + "raw": "'in' | 'nin' | 'isNull' | 'gt' | 'gte' | 'lt' | 'lte' | 'inRange' | 'notInRange' | 'eq' | 'neq' | 'not'" + }, + "editor": { + "type": "oneOf", + "options": [ + "in", + "nin", + "isNull", + "gt", + "gte", + "lt", + "lte", + "inRange", + "notInRange", + "eq", + "neq", + "not" + ] + }, + "required": true + }, + { + "uid": "isDefault", + "name": "isDefault", + "comment": { + "raw": [ + "Pass true to make this predicate selected by default" ] }, "typeValue": { @@ -14593,133 +17299,149 @@ "propsFromUnion": false } }, - "@epam/uui-core:IDndActor": { + "@epam/uui-core:IFormApi": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IDndActor", - "nameFull": "IDndActor" + "name": "IFormApi", + "nameFull": "IFormApi" }, - "src": "uui-core/src/types/dnd.ts", + "src": "uui-core/src/data/forms/Form.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IDndActor", + "raw": "IFormApi", "print": [ - "interface IDndActor {", - " /** Data used when this component acts as a drag source.", - " * If provided, it means this component can be dragged. Can be used in combination with dstData.", + "interface IFormApi extends IEditable, ValidationState {", + " /**", + " * Lens - a helper to split parts of the form state, validation, and setState callbacks, and pass this to components", " */", - " srcData?: TSrcData;", - " /** Data used when this component acts as a drop destination.", - " * If provided, it means something can be dragged onto this component. Can be used in combination with srcData.", + " lens: ILens;", + " /**", + " * Sets form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", + " * The change is threated as user input - sets isChanged and creates undo endpoint", " */", - " dstData?: TDstData;", - " /** A pure function that gets permitted positions for a drop action */", - " canAcceptDrop?(params: AcceptDropParams): DropPositionOptions | null;", - " /** Called when accepted drop action performed on this actor. Usually used to reorder and update items */", - " onDrop?(data: DropParams): void;", + " setValue: (s: React.SetStateAction) => void;", + " /**", + " * Replaces form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", + " * The change is not threated as user input - it replaces last changed state, and doesn't create undo checkpoint.", + " */", + " replaceValue: (s: React.SetStateAction) => void;", + " /**", + " * Triggers save procedure - validation, calling props.onSave, and processing results", + " */", + " save(): void;", + " /**", + " * Undo to last checkpoint", + " */", + " undo(): void;", + " /**", + " * Redo last action", + " */", + " redo(): void;", + " /**", + " * Reverts all changes up to the initial or last saved state", + " */", + " revert(): void;", + " /**", + " * Try to leave form and ask to save unsaved changes", + " */", + " close(): Promise;", + " /**", + " * Forces form to validate value.", + " * Validation is usually done automatically, according to validationOn prop.", + " * Use this method only in corner cases.", + " */", + " validate(): ValidationState;", + " /** True if there are changes to undo */", + " canUndo: boolean;", + " /** True if there are changes to redo */", + " canRedo: boolean;", + " /** True if there are changes to revers */", + " canRevert: boolean;", + " /** True if form is changed since the initial state, or the last save */", + " isChanged: boolean;", + " /** True if save is in progress */", + " isInProgress: boolean;", "}" ] }, "props": [ { - "uid": "srcData", - "name": "srcData", + "uid": "lens", + "name": "lens", "comment": { "raw": [ - "Data used when this component acts as a drag source.", - " If provided, it means this component can be dragged. Can be used in combination with dstData." + "Lens - a helper to split parts of the form state, validation, and setState callbacks, and pass this to components" ] }, "typeValue": { - "raw": "TSrcData" + "raw": "ILens" }, - "required": false + "required": true }, { - "uid": "dstData", - "name": "dstData", + "uid": "setValue", + "name": "setValue", "comment": { "raw": [ - "Data used when this component acts as a drop destination.", - " If provided, it means something can be dragged onto this component. Can be used in combination with srcData." + "Sets form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", + " The change is threated as user input - sets isChanged and creates undo endpoint" ] }, "typeValue": { - "raw": "TDstData" + "raw": "(s: React.SetStateAction) => void" }, - "required": false + "editor": { + "type": "func" + }, + "required": true }, { - "uid": "canAcceptDrop", - "name": "canAcceptDrop", + "uid": "replaceValue", + "name": "replaceValue", "comment": { "raw": [ - "A pure function that gets permitted positions for a drop action" + "Replaces form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", + " The change is not threated as user input - it replaces last changed state, and doesn't create undo checkpoint." ] }, "typeValue": { - "raw": "(params: AcceptDropParams) => Partial> | null" + "raw": "(s: React.SetStateAction) => void" }, "editor": { "type": "func" }, - "required": false + "required": true }, { - "uid": "onDrop", - "name": "onDrop", + "uid": "save", + "name": "save", "comment": { "raw": [ - "Called when accepted drop action performed on this actor. Usually used to reorder and update items" + "Triggers save procedure - validation, calling props.onSave, and processing results" ] }, "typeValue": { - "raw": "(data: DropParams) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IDndContext": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IDndContext", - "nameFull": "IDndContext" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IDndContext", - "print": [ - "interface IDndContext extends IBaseContext {", - " startDrag(node: Node, data: any, renderGhost: () => React.ReactNode): void;", - " endDrag(): void;", - " /** Indicates that drag in progress */", - " isDragging: boolean;", - " dragData?: any;", - " getMouseCoords: () => TMouseCoords;", - "}" - ] - }, - "props": [ + "required": true + }, { - "uid": "startDrag", - "name": "startDrag", + "uid": "undo", + "name": "undo", + "comment": { + "raw": [ + "Undo to last checkpoint" + ] + }, "typeValue": { - "raw": "(node: Node, data: any, renderGhost: () => React.ReactNode) => void" + "raw": "() => void" }, "editor": { "type": "func" @@ -14727,8 +17449,13 @@ "required": true }, { - "uid": "endDrag", - "name": "endDrag", + "uid": "redo", + "name": "redo", + "comment": { + "raw": [ + "Redo last action" + ] + }, "typeValue": { "raw": "() => void" }, @@ -14738,34 +17465,49 @@ "required": true }, { - "uid": "isDragging", - "name": "isDragging", + "uid": "revert", + "name": "revert", "comment": { "raw": [ - "Indicates that drag in progress" + "Reverts all changes up to the initial or last saved state" ] }, "typeValue": { - "raw": "boolean" + "raw": "() => void" }, "editor": { - "type": "bool" + "type": "func" }, "required": true }, { - "uid": "dragData", - "name": "dragData", + "uid": "close", + "name": "close", + "comment": { + "raw": [ + "Try to leave form and ask to save unsaved changes" + ] + }, "typeValue": { - "raw": "any" + "raw": "() => Promise" }, - "required": false + "editor": { + "type": "func" + }, + "required": true }, { - "uid": "getMouseCoords", - "name": "getMouseCoords", + "uid": "validate", + "name": "validate", + "comment": { + "raw": [ + "Forces form to validate value.", + " Validation is usually done automatically, according to validationOn prop.", + " Use this method only in corner cases." + ] + }, "typeValue": { - "raw": "() => TMouseCoords" + "raw": "() => ValidationState" }, "editor": { "type": "func" @@ -14773,235 +17515,325 @@ "required": true }, { - "uid": "subscribe", - "name": "subscribe", + "uid": "canUndo", + "name": "canUndo", "comment": { "raw": [ - "Add your handler, which will be called on context updates" + "True if there are changes to undo" ] }, "typeValue": { - "raw": "(handler: (state: DndContextState) => void) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "unsubscribe", - "name": "unsubscribe", + "uid": "canRedo", + "name": "canRedo", "comment": { "raw": [ - "Unsubscribe from context updates" + "True if there are changes to redo" ] }, "typeValue": { - "raw": "(handler: (state: DndContextState) => void) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "destroyContext", - "name": "destroyContext", + "uid": "canRevert", + "name": "canRevert", "comment": { "raw": [ - "Manually destroy context and unsubscribe from all listeners" + "True if there are changes to revers" ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IBaseContext", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IDropdownBodyProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IDropdownBodyProps", - "nameFull": "IDropdownBodyProps" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IDropdownBodyProps", - "print": [ - "interface IDropdownBodyProps {", - " /** Call to close the Dropdown body */", - " onClose?: () => void;", - " /** The width of the toggler, which can be used to adjust the body width to it */", - " togglerWidth?: number;", - " /** The height of the toggler */", - " togglerHeight?: number;", - " /** Call to force recompute dropdown position */", - " scheduleUpdate?: () => void;", - " /** Indicates that dropdown is open */", - " isOpen?: boolean;", - " /** Props that should be provided to the arrow component */", - " arrowProps?: PopperArrowProps;", - " /** Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/) */", - " placement?: Placement;", - "}" - ] - }, - "props": [ + }, { - "uid": "onClose", - "name": "onClose", + "uid": "isChanged", + "name": "isChanged", + "comment": { + "raw": [ + "True if form is changed since the initial state, or the last save" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + }, + { + "uid": "isInProgress", + "name": "isInProgress", + "comment": { + "raw": [ + "True if save is in progress" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": true + }, + { + "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": [ - "Call to close the Dropdown body" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "() => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "togglerWidth", - "name": "togglerWidth", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "The width of the toggler, which can be used to adjust the body width to it" + "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": "togglerHeight", - "name": "togglerHeight", + "uid": "value", + "name": "value", "comment": { "raw": [ - "The height of the toggler" + "The current value of component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "T" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "scheduleUpdate", - "name": "scheduleUpdate", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Call to force recompute dropdown position" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "() => void" + "raw": "(newValue: T) => void" }, "editor": { "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "validationProps", + "name": "validationProps", "comment": { "raw": [ - "Indicates that dropdown is open" + "If T is a complex value (object or array), this property contains validation states of inner items" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "{ [key: string]: ValidationState; }" }, + "from": "@epam/uui-core:ValidationState", "required": false }, { - "uid": "arrowProps", - "name": "arrowProps", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "Props that should be provided to the arrow component" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "PopperArrowProps" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasCaption": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasCaption", + "nameFull": "IHasCaption" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component has a caption. E.g. Button" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasCaption", + "print": [ + "/** Component has a caption. E.g. Button */", + "interface IHasCaption {", + " /** Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions. */", + " caption?: ReactNode;", + "}" + ] + }, + "props": [ { - "uid": "placement", - "name": "placement", + "uid": "caption", + "name": "caption", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "React.ReactNode" }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" + "typeValueRef": "@types/react:ReactNode", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasChildren": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasChildren", + "nameFull": "IHasChildren" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component can have child components" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasChildren", + "print": [ + "/** Component can have child components */", + "interface IHasChildren {", + " /** Component children */", + " children?: ReactNode;", + "}" + ] + }, + "props": [ + { + "uid": "children", + "name": "children", + "comment": { + "raw": [ + "Component children" ] }, + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IDropdownToggler": { + "@epam/uui-core:IHasCX": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IDropdownToggler", - "nameFull": "IDropdownToggler" + "name": "IHasCX", + "nameFull": "IHasCX" }, "src": "uui-core/src/types/props.ts", "comment": { "raw": [ - "Component can be used as Toggler control for dropdown menus" + "Component can accept cx property, allowing to pass classes to put on component.", + " CX is a shortcut for 'classnames'.", + " The props accept string, arrays, object, recursively. All falsy values are thrown away. Examples:", + " - 'red' => 'red'", + " - ['red', 0, false, 'blue' ] => 'red blue'", + " - { 'red': true, 'blue': false, ['green', 'white']} => 'red green white'" ] }, "exported": true @@ -15009,47 +17841,86 @@ "details": { "kind": 264, "typeValue": { - "raw": "IDropdownToggler", + "raw": "IHasCX", "print": [ - "/** Component can be used as Toggler control for dropdown menus */", - "interface IDropdownToggler {", - " /** When isDropdown=true, indicate that dropdown is open with chevron icon */", - " isOpen?: boolean;", - " /** Shows chevron icon, enabling component to act as dropdown toggler */", - " isDropdown?: boolean;", + "/**", + " * Component can accept cx property, allowing to pass classes to put on component.", + " * CX is a shortcut for 'classnames'.", + " * The props accept string, arrays, object, recursively. All falsy values are thrown away. Examples:", + " * - 'red' => 'red'", + " * - ['red', 0, false, 'blue' ] => 'red blue'", + " * - { 'red': true, 'blue': false, ['green', 'white']} => 'red green white'", + " */", + "interface IHasCX {", + " /** CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details */", + " cx?: CX;", "}" ] }, "props": [ { - "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" }, + "typeValueRef": "@epam/uui-core:ClassValue", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasDirection": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasDirection", + "nameFull": "IHasDirection" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component has direction of child components." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasDirection", + "print": [ + "/** Component has direction of child components. */", + "interface IHasDirection {", + " /** Direction of child components. */", + " direction?: 'vertical' | 'horizontal';", + "}" + ] + }, + "props": [ { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "direction", + "name": "direction", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Direction of child components." ] }, "typeValue": { - "raw": "boolean" + "raw": "'vertical' | 'horizontal'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "vertical", + "horizontal" + ] }, "required": false } @@ -15057,12 +17928,12 @@ "propsFromUnion": false } }, - "@epam/uui-core:IDropdownTogglerProps": { + "@epam/uui-core:IHasForwardedRef": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IDropdownTogglerProps", - "nameFull": "IDropdownTogglerProps" + "name": "IHasForwardedRef", + "nameFull": "IHasForwardedRef" }, "src": "uui-core/src/types/props.ts", "exported": true @@ -15070,327 +17941,471 @@ "details": { "kind": 264, "typeValue": { - "raw": "IDropdownTogglerProps", + "raw": "IHasForwardedRef", "print": [ - "interface IDropdownTogglerProps extends IDropdownToggler, IClickable {", - " /** Called when associated dropdown should open or close */", - " toggleDropdownOpening?: (value: boolean) => void;", - " /** Called when component is interacted outside, to close the dropdown */", - " isInteractedOutside?: (event: Event) => boolean;", - " /** Toggler component ref */", - " ref?: React.Ref;", + "interface IHasForwardedRef {", + " /** this ref is passed to the underlying component */", + " forwardedRef?: ForwardedRef;", "}" ] }, "props": [ { - "uid": "toggleDropdownOpening", - "name": "toggleDropdownOpening", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Called when associated dropdown should open or close" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "(value: boolean) => void" - }, - "editor": { - "type": "func" + "raw": "null | (instance: T | null) => void | React.MutableRefObject" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasIcon": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasIcon", + "nameFull": "IHasIcon" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "An icon can be added to component" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasIcon", + "print": [ + "/** An icon can be added to component */", + "interface IHasIcon {", + " /** Icon can be a React element (usually an SVG element) */", + " icon?: Icon;", + " /** Position of the icon (left of right) */", + " iconPosition?: 'left' | 'right';", + " /** Click handler for the icon */", + " onIconClick?(): void;", + "}" + ] + }, + "props": [ { - "uid": "isInteractedOutside", - "name": "isInteractedOutside", + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "Called when component is interacted outside, to close the dropdown" + "Icon can be a React element (usually an SVG element)" ] }, "typeValue": { - "raw": "(event: Event) => boolean" + "raw": "Icon" }, "editor": { - "type": "func" + "type": "component" }, "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Toggler component ref" + "Position of the icon (left of right)" ] }, "typeValue": { - "raw": "null | (instance: any) => void | React.RefObject" + "raw": "'left' | 'right'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] }, "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "onIconClick", + "name": "onIconClick", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "Click handler for the icon" ] }, "typeValue": { - "raw": "boolean" + "raw": "() => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDropdownToggler", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasLabel": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasLabel", + "nameFull": "IHasLabel" + }, + "src": "uui-core/src/types/props.ts", + "comment": { + "raw": [ + "Component has label. E.g. User Name" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasLabel", + "print": [ + "/** Component has label. E.g. User Name */", + "interface IHasLabel {", + " /** Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels. */", + " label?: ReactNode;", + "}" + ] + }, + "props": [ { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "label", + "name": "label", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." ] }, "typeValue": { - "raw": "boolean" + "raw": "React.ReactNode" }, - "editor": { - "type": "bool" + "typeValueRef": "@types/react:ReactNode", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasPlaceholder": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasPlaceholder", + "nameFull": "IHasPlaceholder" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasPlaceholder", + "print": [ + "interface IHasPlaceholder {", + " /** Placeholder to display when empty */", + " placeholder?: any;", + "}" + ] + }, + "props": [ + { + "uid": "placeholder", + "name": "placeholder", + "comment": { + "raw": [ + "Placeholder to display when empty" + ] + }, + "typeValue": { + "raw": "any" }, - "from": "@epam/uui-core:IDropdownToggler", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasRawProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasRawProps", + "nameFull": "IHasRawProps" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "IHasRawProps", + "print": [ + "// Component allows to pass raw HTML props to put on the DOM element", + "type IHasRawProps = {", + " /** Any HTML attributes (native or 'data-') to put on the underlying component */", + " rawProps?: T & Record<`data-${string}`, string>;", + "};" + ] + }, + "props": [ + { + "uid": "rawProps", + "name": "rawProps", + "comment": { + "raw": [ + "Any HTML attributes (native or 'data-') to put on the underlying component" + ] + }, + "typeValue": { + "raw": "T & Record<`data-${string}`, string>" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasStyleAttrs": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasStyleAttrs", + "nameFull": "IHasStyleAttrs" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasStyleAttrs", + "print": [ + "interface IHasStyleAttrs {", + " /** CSS style prop to put on the component */", + " style?: React.CSSProperties;", + "}" + ] + }, + "props": [ { - "uid": "onClick", - "name": "onClick", + "uid": "style", + "name": "style", "comment": { "raw": [ - "Called when component is clicked" + "CSS style prop to put on the component" ] }, "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" + "raw": "React.CSSProperties" }, - "from": "@epam/uui-core:IClickable", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IEditable": { + "@epam/uui-core:IHasTabIndex": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IEditable", - "nameFull": "IEditable" + "name": "IHasTabIndex", + "nameFull": "IHasTabIndex" }, "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component displays an editable value. Text Input is a basic example." - ] - }, "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IEditable", + "raw": "IHasTabIndex", "print": [ - "/** Component displays an editable value. Text Input is a basic example. */", - "interface IEditable extends ICanBeInvalid, IDisableable, ICanBeReadonly, ICanBeRequired, IControlled {", + "// TBD: merge with ICanFocus?", + "interface IHasTabIndex {", + " /** Controls the order of keyboard navigation between components */", + " tabIndex?: React.HTMLAttributes['tabIndex'];", "}" ] }, "props": [ { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "tabIndex", + "name": "tabIndex", "comment": { "raw": [ - "True if component contains invalid input" + "Controls the order of keyboard navigation between components" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeInvalid", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHasValidationMessage": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHasValidationMessage", + "nameFull": "IHasValidationMessage" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHasValidationMessage", + "print": [ + "interface IHasValidationMessage {", + " /** Message describing why the value is invalid */", + " validationMessage?: ReactNode;", + "}" + ] + }, + "props": [ { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IDisableable", + "typeValueRef": "@types/react:ReactNode", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IHistory4": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IHistory4", + "nameFull": "IHistory4" + }, + "src": "uui-core/src/services/routing/HistoryAdaptedRouter.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IHistory4", + "print": [ + "interface IHistory4 {", + " location: Link;", + " push(link: Link): void;", + " replace(link: Link): void;", + " createHref(link: Link): string;", + " listen(listener: (location: Link) => void): () => void;", + " block(listener: (args: any) => any): () => void;", + "}" + ] + }, + "props": [ { - "uid": "isReadonly", - "name": "isReadonly", - "comment": { - "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] - }, + "uid": "location", + "name": "location", "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "Link" }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false + "required": true }, { - "uid": "isRequired", - "name": "isRequired", - "comment": { - "raw": [ - "Marks that component's value is required and shouldn't be empty" - ] - }, + "uid": "push", + "name": "push", "typeValue": { - "raw": "boolean" + "raw": "(link: Link) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false + "required": true }, { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, + "uid": "replace", + "name": "replace", "typeValue": { - "raw": "T" + "raw": "(link: Link) => void" + }, + "editor": { + "type": "func" }, - "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)" - ] - }, + "uid": "createHref", + "name": "createHref", "typeValue": { - "raw": "(newValue: T) => void" + "raw": "(link: Link) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IEditableDebouncerOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IEditableDebouncerOptions", - "nameFull": "IEditableDebouncerOptions" - }, - "src": "uui-core/src/helpers/IEditableDebouncer.ts", - "comment": { - "raw": [ - "IEditableDebouncer component options." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IEditableDebouncerOptions", - "print": [ - "/**", - " * IEditableDebouncer component options.", - " */", - "interface IEditableDebouncerOptions {", - " /** Pass true to disable debouncing */", - " disableDebounce?: boolean;", - " /** Debounce delay in ms. Default value is 500ms */", - " debounceDelay?: number;", - "}" - ] - }, - "props": [ + }, { - "uid": "disableDebounce", - "name": "disableDebounce", - "comment": { - "raw": [ - "Pass true to disable debouncing" - ] - }, + "uid": "listen", + "name": "listen", "typeValue": { - "raw": "boolean" + "raw": "(listener: (location: Link) => void) => () => void" }, "editor": { - "type": "bool" + "type": "func" }, - "required": false + "required": true }, { - "uid": "debounceDelay", - "name": "debounceDelay", - "comment": { - "raw": [ - "Debounce delay in ms. Default value is 500ms" - ] - }, + "uid": "block", + "name": "block", "typeValue": { - "raw": "number" + "raw": "(listener: (args: any) => any) => () => void" }, "editor": { - "type": "number" + "type": "func" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IEditableDebouncerProps": { + "@epam/uui-core:IImmutableMap": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IEditableDebouncerProps", - "nameFull": "IEditableDebouncerProps" + "name": "IImmutableMap", + "nameFull": "IImmutableMap" }, - "src": "uui-core/src/helpers/IEditableDebouncer.ts", + "src": "uui-core/src/types/objects.ts", "comment": { "raw": [ - "IEditableDebouncer component props." + "Immutable map." ] }, "exported": true @@ -15398,244 +18413,299 @@ "details": { "kind": 264, "typeValue": { - "raw": "IEditableDebouncerProps", + "raw": "IImmutableMap", "print": [ "/**", - " * IEditableDebouncer component props.", + " * Immutable map.", " */", - "interface IEditableDebouncerProps extends IEditable, IEditableDebouncerOptions, IAnalyticableOnChange {", + "interface IImmutableMap {", " /**", - " * Render wrapped 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).", + " * The example of implementation can be found in 'uui-core/src/data/processing/views/tree/ItemsMap.ts'.", " */", - " render: (props: IEditable) => React.ReactNode;", + " constructor: Function;", + " [Symbol.iterator](): IterableIterator<[", + " TKey,", + " TValue", + " ]>;", + " get(key: TKey): TValue | undefined;", + " /**", + " * Should return cloned map with new value in it. This operation is immutable.", + " * @param key - key of a map.", + " * @param value - value, to be set into a map, using the key.", + " */", + " set(key: TKey, value?: TValue): IImmutableMap;", + " /**", + " * Should return a cloned map, without data, located by the key. This operation is immutable.", + " * @param key", + " */", + " delete(key: TKey): IImmutableMap;", + " has(key: TKey): boolean;", + " size: number;", "}" ] }, "props": [ { - "uid": "render", - "name": "render", + "uid": "constructor", + "name": "constructor", "comment": { "raw": [ - "Render wrapped 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).", + " The example of implementation can be found in 'uui-core/src/data/processing/views/tree/ItemsMap.ts'." ] }, "typeValue": { - "raw": "(props: IEditable) => React.ReactNode" + "raw": "Function" + }, + "required": true + }, + { + "uid": "get", + "name": "get", + "typeValue": { + "raw": "(key: TKey) => TValue | undefined" }, "editor": { - "type": "component" + "type": "func" }, "required": true }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "set", + "name": "set", "comment": { "raw": [ - "True if component contains invalid input" + "Should return cloned map with new value in it. This operation is immutable.", + " @param key - key of a map.", + " @param value - value, to be set into a map, using the key." ] }, "typeValue": { - "raw": "boolean" + "raw": "(key: TKey, value?: TValue | undefined) => IImmutableMap" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false + "required": true }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "delete", + "name": "delete", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Should return a cloned map, without data, located by the key. This operation is immutable.", + " @param key" ] }, "typeValue": { - "raw": "boolean" + "raw": "(key: TKey) => IImmutableMap" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", - "required": false + "required": true }, { - "uid": "isReadonly", - "name": "isReadonly", - "comment": { - "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] - }, + "uid": "has", + "name": "has", "typeValue": { - "raw": "boolean" + "raw": "(key: TKey) => boolean" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false + "required": true }, { - "uid": "isRequired", - "name": "isRequired", - "comment": { - "raw": [ - "Marks that component's value is required and shouldn't be empty" - ] - }, + "uid": "size", + "name": "size", "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false + "required": true }, { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "The current value of component" - ] - }, + "uid": "[Symbol.iterator]", + "name": "[Symbol.iterator]", "typeValue": { - "raw": "T" + "raw": "() => IterableIterator<[TKey, TValue]>" + }, + "editor": { + "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ILayoutContext": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ILayoutContext", + "nameFull": "ILayoutContext" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ILayoutContext", + "print": [ + "interface ILayoutContext {", + " /** Returns the new layer. This layer will be higher than previous. */", + " getLayer(): LayoutLayer;", + " /** Removes provided layer from layers list */", + " releaseLayer(layer: LayoutLayer): void;", + " /**", + " * Returns portal root node.", + " * In simple cases it will be node with 'main' or 'root' id or document.body.", + " * Or it will return node with portalRootId.", + " */", + " getPortalRoot(): HTMLElement;", + " /**", + " * Returns unique id, which can be used as id for portal root.", + " * Usually used for cases with shadow DOM, to be able to find this portal root element if it's located under shadow DOM", + " */", + " getPortalRootId(): string;", + "}" + ] + }, + "props": [ { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "getLayer", + "name": "getLayer", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Returns the new layer. This layer will be higher than previous." ] }, "typeValue": { - "raw": "(newValue: T) => void" + "raw": "() => LayoutLayer" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "disableDebounce", - "name": "disableDebounce", + "uid": "releaseLayer", + "name": "releaseLayer", "comment": { "raw": [ - "Pass true to disable debouncing" + "Removes provided layer from layers list" ] }, "typeValue": { - "raw": "boolean" + "raw": "(layer: LayoutLayer) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IEditableDebouncerOptions", - "required": false + "required": true }, { - "uid": "debounceDelay", - "name": "debounceDelay", + "uid": "getPortalRoot", + "name": "getPortalRoot", "comment": { "raw": [ - "Debounce delay in ms. Default value is 500ms" + "Returns portal root node.", + " In simple cases it will be node with 'main' or 'root' id or document.body.", + " Or it will return node with portalRootId." ] }, "typeValue": { - "raw": "number" + "raw": "() => HTMLElement" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IEditableDebouncerOptions", - "required": false + "required": true }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "getPortalRootId", + "name": "getPortalRootId", "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)." + "Returns unique id, which can be used as id for portal root.", + " Usually used for cases with shadow DOM, to be able to find this portal root element if it's located under shadow DOM" ] }, "typeValue": { - "raw": "(newValue: T | null, oldValue: T | null) => AnalyticsEvent" + "raw": "() => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IAnalyticableOnChange", - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IErrorContext": { + "@epam/uui-core:ILens": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IErrorContext", - "nameFull": "IErrorContext" + "name": "ILens", + "nameFull": "ILens" }, - "src": "uui-core/src/types/contexts.ts", + "src": "uui-core/src/data/lenses/types.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IErrorContext", + "raw": "ILens", "print": [ - "interface IErrorContext extends IBaseContext {", - " /** Current error */", - " currentError?: Error;", - " /** Reports error to context */", - " reportError(error: Error): void;", - " /** Sets an error handler callback */", - " onError(callback: Function): void;", - " /** Discard current error */", - " discardError(): void;", - " /** Discard errors and refresh app */", - " recover(): void;", + "interface ILens {", + " /** Get lens value */", + " get(): TFocused;", + " /** Get lens value of the IMap or IImmutableMap by provided id. */", + " key(id: TId): ILens>>;", + " /** Set new lens value */", + " set(value: TFocused): void;", + " /** Updates lens value with returned value from provided callback.", + " * This callback received current lens value as a param", + " * */", + " update(fn: (current: TFocused) => TFocused): void;", + " /** Return a new lens on the provided field name */", + " prop(name: K): ILens>;", + " /** Return a new lens on item of array by provided index */", + " index(index: number): ILens>;", + " /** Add to the lens a setter callback, which received old and new value and should return new value for set.", + " * This callback will be called on any lens update", + " * */", + " onChange(fn: (oldValue: TFocused, newValue: TFocused) => TFocused): ILens;", + " /** Defines default lens value, which will be return in case of lens have 'null' or 'undefined' value */", + " default(value: TFocused): ILens;", + " /** Return IEditable interface, which accepted by UUI form components.", + " * Usually you just need to spread it to the component, e.g. { ...lens.prop('name').toProps() } */", + " toProps(): IEditable & ValidationState;", "}" ] }, "props": [ { - "uid": "currentError", - "name": "currentError", - "comment": { - "raw": [ - "Current error" - ] - }, - "typeValue": { - "raw": "Error" - }, - "required": false - }, - { - "uid": "reportError", - "name": "reportError", + "uid": "get", + "name": "get", "comment": { "raw": [ - "Reports error to context" + "Get lens value" ] }, "typeValue": { - "raw": "(error: Error) => void" + "raw": "() => TFocused" }, "editor": { "type": "func" @@ -15643,15 +18713,15 @@ "required": true }, { - "uid": "onError", - "name": "onError", + "uid": "key", + "name": "key", "comment": { "raw": [ - "Sets an error handler callback" + "Get lens value of the IMap or IImmutableMap by provided id." ] }, "typeValue": { - "raw": "(callback: Function) => void" + "raw": "(id: TId) => ILens>>" }, "editor": { "type": "func" @@ -15659,15 +18729,15 @@ "required": true }, { - "uid": "discardError", - "name": "discardError", + "uid": "set", + "name": "set", "comment": { "raw": [ - "Discard current error" + "Set new lens value" ] }, "typeValue": { - "raw": "() => void" + "raw": "(value: TFocused) => void" }, "editor": { "type": "func" @@ -15675,15 +18745,16 @@ "required": true }, { - "uid": "recover", - "name": "recover", + "uid": "update", + "name": "update", "comment": { "raw": [ - "Discard errors and refresh app" + "Updates lens value with returned value from provided callback.", + " This callback received current lens value as a param" ] }, "typeValue": { - "raw": "() => void" + "raw": "(fn: (current: TFocused) => TFocused) => void" }, "editor": { "type": "func" @@ -15691,337 +18762,409 @@ "required": true }, { - "uid": "subscribe", - "name": "subscribe", + "uid": "prop", + "name": "prop", "comment": { "raw": [ - "Add your handler, which will be called on context updates" + "Return a new lens on the provided field name" ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "(name: K) => ILens>" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "unsubscribe", - "name": "unsubscribe", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Unsubscribe from context updates" + "Return a new lens on item of array by provided index" ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "(index: number) => ILens>" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "destroyContext", - "name": "destroyContext", + "uid": "onChange", + "name": "onChange", "comment": { "raw": [ - "Manually destroy context and unsubscribe from all listeners" + "Add to the lens a setter callback, which received old and new value and should return new value for set.", + " This callback will be called on any lens update" ] }, "typeValue": { - "raw": "() => void" + "raw": "(fn: (oldValue: TFocused, newValue: TFocused) => TFocused) => ILens" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IBaseContext", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IFilterConfig": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IFilterConfig", - "nameFull": "IFilterConfig" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "IFilterConfig", - "print": [ - "type IFilterConfig = {", - " /** If true, the filter will be shown in the FiltersPanel */", - " isVisible: boolean;", - " /**", - " * Determines the order in which this filter should appear in the filters list.", - " * The filters are sorted in ascending alphabetical order.", - " */", - " order?: string;", - "};" - ] - }, - "props": [ + }, { - "uid": "isVisible", - "name": "isVisible", + "uid": "default", + "name": "default", "comment": { "raw": [ - "If true, the filter will be shown in the FiltersPanel" + "Defines default lens value, which will be return in case of lens have 'null' or 'undefined' value" ] }, "typeValue": { - "raw": "boolean" + "raw": "(value: TFocused) => ILens" }, "editor": { - "type": "bool" + "type": "func" }, "required": true }, { - "uid": "order", - "name": "order", + "uid": "toProps", + "name": "toProps", "comment": { "raw": [ - "Determines the order in which this filter should appear in the filters list.", - " The filters are sorted in ascending alphabetical order." + "Return IEditable interface, which accepted by UUI form components.", + " Usually you just need to spread it to the component, e.g. { ...lens.prop('name').toProps() }" ] }, "typeValue": { - "raw": "string" + "raw": "() => IEditable & ValidationState" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IFilterItemBodyProps": { + "@epam/uui-core:ILockContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IFilterItemBodyProps", - "nameFull": "IFilterItemBodyProps" + "name": "ILockContext", + "nameFull": "ILockContext" }, - "src": "uui-core/src/types/components/filterItemBody.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & { type: 'singlePicker' | 'multiPicker'; showSearch?: boolean | undefined; maxBodyHeight?: number | 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": "ILockContext", "print": [ - "type IFilterItemBodyProps = TableFiltersConfig & IEditable & IDropdownBodyProps & {", - " /** Name of currently selected predicate */", - " selectedPredicate?: string;", - "};" + "interface ILockContext {", + " /**", + " * Tries to take a lock, and sets tryRelease callback, which will be invoked when something tries to take control over.", + " * If a lock already exists, it tries to release the current lock and then set a new one", + " */", + " acquire(tryRelease: () => Promise): Promise;", + " /** Releases lock without calling tryRelease callback */", + " release(lock: object): void;", + " /** Tries to acquire a lock for the time while the action is being executed. */", + " withLock(action: () => Promise): Promise;", + " /** Returns currently active lock */", + " getCurrentLock: () => Lock | null;", + "}" ] }, "props": [ { - "uid": "title", - "name": "title", + "uid": "acquire", + "name": "acquire", "comment": { "raw": [ - "Title of the filter, displayed in filter toggler and filter body" + "Tries to take a lock, and sets tryRelease callback, which will be invoked when something tries to take control over.", + " If a lock already exists, it tries to release the current lock and then set a new one" ] }, "typeValue": { - "raw": "string" + "raw": "(tryRelease: () => Promise) => Promise" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "field", - "name": "field", + "uid": "release", + "name": "release", "comment": { "raw": [ - "Field of filters object, where store the filter value" + "Releases lock without calling tryRelease callback" ] }, "typeValue": { - "raw": "keyof TFilter" + "raw": "(lock: object) => void" + }, + "editor": { + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "columnKey", - "name": "columnKey", + "uid": "withLock", + "name": "withLock", "comment": { "raw": [ - "Key of the column to which the filter is attached.", - " If omitted, filter won't be attached to the column." + "Tries to acquire a lock for the time while the action is being executed." ] }, "typeValue": { - "raw": "string" + "raw": "(action: () => Promise) => Promise" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false + "required": true }, { - "uid": "isAlwaysVisible", - "name": "isAlwaysVisible", + "uid": "getCurrentLock", + "name": "getCurrentLock", "comment": { "raw": [ - "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" + "Returns currently active lock" ] }, "typeValue": { - "raw": "boolean" + "raw": "() => Lock | null" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IMap": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IMap", + "nameFull": "IMap" + }, + "src": "uui-core/src/types/objects.ts", + "comment": { + "raw": [ + "Mutable map." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IMap", + "print": [ + "/**", + " * Mutable map.", + " */", + "interface IMap {", + " /**", + " * 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).", + " */", + " constructor: Function;", + " [Symbol.iterator](): IterableIterator<[", + " TKey,", + " TValue", + " ]>;", + " get(key: TKey): TValue | undefined;", + " /**", + " * 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.", + " */", + " set(key: TKey, value?: TValue): IMap;", + " /**", + " * Should delete an element, located in a map by key. This operation is mutable.", + " * @param key", + " */", + " delete(key: TKey): boolean;", + " has(key: TKey): boolean;", + " size: number;", + "}" + ] + }, + "props": [ { - "uid": "predicates", - "name": "predicates", + "uid": "constructor", + "name": "constructor", "comment": { "raw": [ - "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." + "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": "IFilterPredicate[]" + "raw": "Function" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false + "required": true }, { - "uid": "maxCount", - "name": "maxCount", - "comment": { - "raw": [ - "Count of words to show in the Filter toggler. By default, 2 item will be shown." - ] - }, + "uid": "get", + "name": "get", "typeValue": { - "raw": "number" + "raw": "(key: TKey) => TValue | undefined" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false + "required": true }, { - "uid": "togglerWidth", - "name": "togglerWidth", + "uid": "set", + "name": "set", "comment": { "raw": [ - "Defines maxWidth of the filter toggler" + "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": "number" + "raw": "(key: TKey, value?: TValue | undefined) => IMap" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": false + "required": true }, { - "uid": "dataSource", - "name": "dataSource", + "uid": "delete", + "name": "delete", "comment": { "raw": [ - "Datasource to get data for the picker" + "Should delete an element, located in a map by key. This operation is mutable.", + " @param key" ] }, "typeValue": { - "raw": "IDataSource" + "raw": "(key: TKey) => boolean" + }, + "editor": { + "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": true }, { - "uid": "getName", - "name": "getName", - "comment": { - "raw": [ - "A pure function that gets entity name from entity object.", - " Default: (item) => item.name." - ] - }, + "uid": "has", + "name": "has", "typeValue": { - "raw": "(item: any) => string" + "raw": "(key: TKey) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "renderRow", - "name": "renderRow", - "comment": { - "raw": [ - "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." - ] - }, + "uid": "size", + "name": "size", "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "type", - "name": "type", - "comment": { - "raw": [ - "Type of the filter" - ] - }, + "uid": "[Symbol.iterator]", + "name": "[Symbol.iterator]", "typeValue": { - "raw": "'singlePicker' | 'multiPicker'" + "raw": "() => IterableIterator<[TKey, TValue]>" }, "editor": { - "type": "oneOf", - "options": [ - "singlePicker", - "multiPicker" - ] + "type": "func" }, - "from": "@epam/uui-core:PickerFilterConfig", "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IMapElement": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IMapElement", + "nameFull": "IMapElement" + }, + "src": "uui-core/src/data/lenses/types.ts", + "comment": { + "raw": [ + "IMap element, supported by ILens." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "IMapElement", + "print": [ + "/**", + " * IMap element, supported by ILens.", + " */", + "type IMapElement = MapType extends IMap ? Item : MapType extends IImmutableMap ? Item : never;" + ] + } + } + }, + "@epam/uui-core:IModal": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IModal", + "nameFull": "IModal" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IModal", + "print": [ + "interface IModal {", + " /** Indicates whether the modal is currently displayed */", + " isActive?: boolean;", + " /** Unique key of the modal */", + " key: string;", + " /** Modal zIndex value. Calculated via LayoutContext. */", + " zIndex: number;", + " /** Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value. */", + " success(result: TResult): void;", + " /** Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value. */", + " abort(result?: any): void;", + " /** Parameters that provided via second param of `modalContext.show` method */", + " parameters?: TParameters;", + " /** Depth of current modal layer */", + " depth?: number;", + "}" + ] + }, + "props": [ { - "uid": "showSearch", - "name": "showSearch", + "uid": "isActive", + "name": "isActive", "comment": { "raw": [ - "Pass false to hide search in picker body.", - " If omitted, true value will be used." + "Indicates whether the modal is currently displayed" ] }, "typeValue": { @@ -16030,131 +19173,155 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:PickerFilterConfig", "required": false }, { - "uid": "maxBodyHeight", - "name": "maxBodyHeight", + "uid": "key", + "name": "key", "comment": { "raw": [ - "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" + "Unique key of the modal" ] }, "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "from": "@epam/uui-core:PickerFilterConfig", - "required": false + "required": true }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "zIndex", + "name": "zIndex", "comment": { "raw": [ - "True if component contains invalid input" + "Modal zIndex value. Calculated via LayoutContext." ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:ICanBeInvalid", - "required": false + "required": true }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "success", + "name": "success", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value." ] }, "typeValue": { - "raw": "boolean" + "raw": "(result: TResult) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:IDisableable", - "required": false + "required": true }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "abort", + "name": "abort", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value." ] }, "typeValue": { - "raw": "boolean" + "raw": "(result?: any) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:ICanBeReadonly", - "required": false + "required": true }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "parameters", + "name": "parameters", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Parameters that provided via second param of `modalContext.show` method" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TParameters" }, - "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "value", - "name": "value", + "uid": "depth", + "name": "depth", "comment": { "raw": [ - "The current value of component" + "Depth of current modal layer" ] }, "typeValue": { - "raw": "any" + "raw": "number" }, - "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "onValueChange", - "name": "onValueChange", + "editor": { + "type": "number" + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IModalContext": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IModalContext", + "nameFull": "IModalContext" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IModalContext", + "print": [ + "interface IModalContext extends IBaseContext {", + " /** Shows provided modal component with defined params */", + " show(render: (props: IModal) => React.ReactNode, parameters?: TParameters): Promise;", + " /** Removes all active modals */", + " closeAll(): void;", + " /** Returns true, if some modal displayed */", + " isModalOperationActive(): boolean;", + " /** Returns all active modals */", + " getOperations(): ModalOperation[];", + "}" + ] + }, + "props": [ + { + "uid": "show", + "name": "show", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Shows provided modal component with defined params" ] }, "typeValue": { - "raw": "(newValue: any) => void" + "raw": "(render: (props: IModal) => React.ReactNode, parameters?: TParameters | undefined) => Promise" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onClose", - "name": "onClose", + "uid": "closeAll", + "name": "closeAll", "comment": { "raw": [ - "Call to close the Dropdown body" + "Removes all active modals" ] }, "typeValue": { @@ -16163,504 +19330,359 @@ "editor": { "type": "func" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "required": true }, { - "uid": "togglerHeight", - "name": "togglerHeight", + "uid": "isModalOperationActive", + "name": "isModalOperationActive", "comment": { "raw": [ - "The height of the toggler" + "Returns true, if some modal displayed" ] }, "typeValue": { - "raw": "number" + "raw": "() => boolean" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "required": true }, { - "uid": "scheduleUpdate", - "name": "scheduleUpdate", + "uid": "getOperations", + "name": "getOperations", "comment": { "raw": [ - "Call to force recompute dropdown position" + "Returns all active modals" ] }, "typeValue": { - "raw": "() => void" + "raw": "() => ModalOperation[]" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "required": true }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "subscribe", + "name": "subscribe", "comment": { "raw": [ - "Indicates that dropdown is open" + "Add your handler, which will be called on context updates" ] }, "typeValue": { - "raw": "boolean" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false - }, - { - "uid": "arrowProps", - "name": "arrowProps", - "comment": { - "raw": [ - "Props that should be provided to the arrow component" - ] - }, - "typeValue": { - "raw": "PopperArrowProps" + "type": "func" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "from": "@epam/uui-core:IBaseContext", + "required": true }, { - "uid": "placement", - "name": "placement", + "uid": "unsubscribe", + "name": "unsubscribe", "comment": { "raw": [ - "Dropdown position relative to the input. See [Popper Docs](@link https://popper.js.org/)" + "Unsubscribe from context updates" ] }, "typeValue": { - "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "func" }, - "from": "@epam/uui-core:IDropdownBodyProps", - "required": false + "from": "@epam/uui-core:IBaseContext", + "required": true }, { - "uid": "selectedPredicate", - "name": "selectedPredicate", + "uid": "destroyContext", + "name": "destroyContext", "comment": { "raw": [ - "Name of currently selected predicate" + "Manually destroy context and unsubscribe from all listeners" ] }, "typeValue": { - "raw": "string" + "raw": "() => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false - }, + "from": "@epam/uui-core:IBaseContext", + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:INotification": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "INotification", + "nameFull": "INotification" + }, + "src": "uui-core/src/types/props.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "INotification", + "print": [ + "interface INotification {", + " /** Call to close the notification with abort action. It's rejects `notificationContext.show()` promise. */", + " onClose?(): void;", + " /** Call to close the notification with success action. It's resolved `notificationContext.show()` promise. */", + " onSuccess?(): void;", + " /** Cancel notification closing timer */", + " clearTimer?(): void;", + " /** Reinitialize notification closing timer. It will be set to the provided notification duration. */", + " refreshTimer?(): void;", + " /** Unique id of the notification */", + " id: number;", + " /** Unique key of the notification */", + " key: string;", + "}" + ] + }, + "props": [ { - "uid": "filter", - "name": "filter", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Filter selectable days. Days, for which this callback returns false - will be disabled" + "Call to close the notification with abort action. It's rejects `notificationContext.show()` promise." ] }, "typeValue": { - "raw": "(day: Dayjs) => boolean" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "format", - "name": "format", + "uid": "onSuccess", + "name": "onSuccess", "comment": { "raw": [ - "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + "Call to close the notification with success action. It's resolved `notificationContext.show()` promise." ] }, "typeValue": { - "raw": "string" + "raw": "() => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:BaseDatePickerProps", "required": false }, { - "uid": "type_2", - "name": "type", - "comment": { - "raw": [ - "Type of the filter" - ] - }, - "typeValue": { - "raw": "'datePicker'" - }, - "editor": { - "type": "oneOf", - "options": [ - "datePicker" - ] - }, - "from": "@epam/uui-core:DatePickerFilterConfig", - "required": true - }, - { - "uid": "type_3", - "name": "type", - "comment": { - "raw": [ - "Type of the filter" - ] - }, - "typeValue": { - "raw": "'numeric'" - }, - "editor": { - "type": "oneOf", - "options": [ - "numeric" - ] - }, - "from": "@epam/uui-core:NumericFilterConfig", - "required": true - }, - { - "uid": "type_4", - "name": "type", + "uid": "clearTimer", + "name": "clearTimer", "comment": { "raw": [ - "Type of the filter" + "Cancel notification closing timer" ] }, "typeValue": { - "raw": "'rangeDatePicker'" + "raw": "() => void" }, "editor": { - "type": "oneOf", - "options": [ - "rangeDatePicker" - ] + "type": "func" }, - "from": "@epam/uui-core:RangeDatePickerFilterConfig", - "required": true + "required": false }, { - "uid": "type_5", - "name": "type", + "uid": "refreshTimer", + "name": "refreshTimer", "comment": { "raw": [ - "Type of the filter" + "Reinitialize notification closing timer. It will be set to the provided notification duration." ] }, "typeValue": { - "raw": "'custom'" + "raw": "() => void" }, "editor": { - "type": "oneOf", - "options": [ - "custom" - ] + "type": "func" }, - "from": "@epam/uui-core:CustomFilterConfig", - "required": true + "required": false }, { - "uid": "render", - "name": "render", + "uid": "id", + "name": "id", "comment": { "raw": [ - "Render callback for filter body" + "Unique id of the notification" ] }, "typeValue": { - "raw": "(props: IFilterItemBodyProps) => React.ReactElement>" + "raw": "number" }, "editor": { - "type": "component" + "type": "number" }, - "from": "@epam/uui-core:CustomFilterConfig", "required": true }, { - "uid": "getTogglerValue", - "name": "getTogglerValue", + "uid": "key", + "name": "key", "comment": { "raw": [ - "A pure function that gets value to display in filter toggler" + "Unique key of the notification" ] }, "typeValue": { - "raw": "(props: IFilterItemBodyProps) => React.ReactNode" + "raw": "string" }, "editor": { - "type": "component" + "type": "string" }, - "from": "@epam/uui-core:CustomFilterConfig", "required": true } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-core:IFilterPredicate": { + "@epam/uui-core:INotificationContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IFilterPredicate", - "nameFull": "IFilterPredicate" + "name": "INotificationContext", + "nameFull": "INotificationContext" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "IFilterPredicate", + "raw": "INotificationContext", "print": [ - "type IFilterPredicate = {", - " /** Name of the predicate, used to display */", - " name: string;", - " /** Predicate key, which wraps filter value.", - " * E.g. your have 'in' predicate for locationIds filter, the resulted filter object will be:", - " * filter: {", - " * locationIds: {", - " * in: [/selected location ids/]", - " * }", - " * }", - " * */", - " predicate: FilterPredicateName;", - " /** Pass true to make this predicate selected by default */", - " isDefault?: boolean;", - "};" + "interface INotificationContext extends IBaseContext {", + " /** Shows provided notification component with defined params */", + " show(render: (props: INotification) => React.ReactNode, notificationParams?: NotificationParams): Promise;", + " /** Returns all active notifications */", + " getNotifications(): NotificationOperation[];", + " /** Removes notification by their id */", + " remove(id: number): void;", + " /** Removes all active notification */", + " clearAll(): void;", + "}" ] }, "props": [ { - "uid": "name", - "name": "name", + "uid": "show", + "name": "show", "comment": { "raw": [ - "Name of the predicate, used to display" + "Shows provided notification component with defined params" ] }, "typeValue": { - "raw": "string" + "raw": "(render: (props: INotification) => React.ReactNode, notificationParams?: NotificationParams | undefined) => Promise" }, "editor": { - "type": "string" + "type": "func" }, "required": true }, { - "uid": "predicate", - "name": "predicate", + "uid": "getNotifications", + "name": "getNotifications", "comment": { "raw": [ - "Predicate key, which wraps filter value.", - " E.g. your have 'in' predicate for locationIds filter, the resulted filter object will be:", - " filter: {", - " locationIds: {", - " in: [/selected location ids/]", - " }", - " }" + "Returns all active notifications" ] }, "typeValue": { - "raw": "'in' | 'nin' | 'isNull' | 'gt' | 'gte' | 'lt' | 'lte' | 'inRange' | 'notInRange' | 'eq' | 'neq' | 'not'" + "raw": "() => NotificationOperation[]" }, "editor": { - "type": "oneOf", - "options": [ - "in", - "nin", - "isNull", - "gt", - "gte", - "lt", - "lte", - "inRange", - "notInRange", - "eq", - "neq", - "not" - ] + "type": "func" }, "required": true }, { - "uid": "isDefault", - "name": "isDefault", + "uid": "remove", + "name": "remove", "comment": { "raw": [ - "Pass true to make this predicate selected by default" + "Removes notification by their id" ] }, "typeValue": { - "raw": "boolean" + "raw": "(id: number) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IFormApi": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IFormApi", - "nameFull": "IFormApi" - }, - "src": "uui-core/src/data/forms/Form.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IFormApi", - "print": [ - "interface IFormApi extends IEditable, ValidationState {", - " /**", - " * Lens - a helper to split parts of the form state, validation, and setState callbacks, and pass this to components", - " */", - " lens: ILens;", - " /**", - " * Sets form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", - " * The change is threated as user input - sets isChanged and creates undo endpoint", - " */", - " setValue: (s: React.SetStateAction) => void;", - " /**", - " * Replaces form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", - " * The change is not threated as user input - it replaces last changed state, and doesn't create undo checkpoint.", - " */", - " replaceValue: (s: React.SetStateAction) => void;", - " /**", - " * Triggers save procedure - validation, calling props.onSave, and processing results", - " */", - " save(): void;", - " /**", - " * Undo to last checkpoint", - " */", - " undo(): void;", - " /**", - " * Redo last action", - " */", - " redo(): void;", - " /**", - " * Reverts all changes up to the initial or last saved state", - " */", - " revert(): void;", - " /**", - " * Try to leave form and ask to save unsaved changes", - " */", - " close(): Promise;", - " /**", - " * Forces form to validate value.", - " * Validation is usually done automatically, according to validationOn prop.", - " * Use this method only in corner cases.", - " */", - " validate(): ValidationState;", - " /** True if there are changes to undo */", - " canUndo: boolean;", - " /** True if there are changes to redo */", - " canRedo: boolean;", - " /** True if there are changes to revers */", - " canRevert: boolean;", - " /** True if form is changed since the initial state, or the last save */", - " isChanged: boolean;", - " /** True if save is in progress */", - " isInProgress: boolean;", - "}" - ] - }, - "props": [ + "required": true + }, { - "uid": "lens", - "name": "lens", + "uid": "clearAll", + "name": "clearAll", "comment": { "raw": [ - "Lens - a helper to split parts of the form state, validation, and setState callbacks, and pass this to components" + "Removes all active notification" ] }, "typeValue": { - "raw": "ILens" + "raw": "() => void" + }, + "editor": { + "type": "func" }, "required": true }, { - "uid": "setValue", - "name": "setValue", + "uid": "subscribe", + "name": "subscribe", "comment": { "raw": [ - "Sets form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", - " The change is threated as user input - sets isChanged and creates undo endpoint" + "Add your handler, which will be called on context updates" ] }, "typeValue": { - "raw": "(s: React.SetStateAction) => void" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "replaceValue", - "name": "replaceValue", + "uid": "unsubscribe", + "name": "unsubscribe", "comment": { "raw": [ - "Replaces form value. The signature is the same for setState in React.useState - either new value, or callback to update the value.", - " The change is not threated as user input - it replaces last changed state, and doesn't create undo checkpoint." + "Unsubscribe from context updates" ] }, "typeValue": { - "raw": "(s: React.SetStateAction) => void" + "raw": "(handler: (state: {}) => void) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "save", - "name": "save", + "uid": "destroyContext", + "name": "destroyContext", "comment": { "raw": [ - "Triggers save procedure - validation, calling props.onSave, and processing results" + "Manually destroy context and unsubscribe from all listeners" ] }, "typeValue": { @@ -16669,128 +19691,149 @@ "editor": { "type": "func" }, + "from": "@epam/uui-core:IBaseContext", "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IPickerToggler": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IPickerToggler", + "nameFull": "IPickerToggler" + }, + "src": "uui-core/src/types/pickers.ts", + "comment": { + "raw": [ + "Component can be used as Toggler control for pickers.", + " Only IDropdownToggler implementation is necessary for the picker to function.", + " Other props can be implemented for full-featured picker togglers." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IPickerToggler", + "print": [ + "/**", + " * Component can be used as Toggler control for pickers.", + " * Only IDropdownToggler implementation is necessary for the picker to function.", + " * Other props can be implemented for full-featured picker togglers.", + " */", + "interface IPickerToggler extends IBasicPickerToggler, Partial>, Partial, Partial, Partial {", + " /** Array of selected rows */", + " selection?: DataRowProps[];", + " /** Amount of selected items */", + " selectedRowsCount?: number;", + "}" + ] + }, + "props": [ { - "uid": "undo", - "name": "undo", + "uid": "selection", + "name": "selection", "comment": { "raw": [ - "Undo to last checkpoint" + "Array of selected rows" ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "DataRowProps[]" }, - "required": true + "required": false }, { - "uid": "redo", - "name": "redo", + "uid": "selectedRowsCount", + "name": "selectedRowsCount", "comment": { "raw": [ - "Redo last action" + "Amount of selected items" ] }, "typeValue": { - "raw": "() => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "revert", - "name": "revert", + "uid": "onClear", + "name": "onClear", "comment": { "raw": [ - "Reverts all changes up to the initial or last saved state" + "Call to clear toggler value" ] }, "typeValue": { - "raw": "() => void" + "raw": "(e?: any) => void" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:IBasicPickerToggler", + "required": false }, { - "uid": "close", - "name": "close", + "uid": "toggleDropdownOpening", + "name": "toggleDropdownOpening", "comment": { "raw": [ - "Try to leave form and ask to save unsaved changes" + "Called when associated dropdown should open or close" ] }, "typeValue": { - "raw": "() => Promise" + "raw": "(value: boolean) => void" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:IDropdownTogglerProps", + "required": false }, { - "uid": "validate", - "name": "validate", + "uid": "isInteractedOutside", + "name": "isInteractedOutside", "comment": { "raw": [ - "Forces form to validate value.", - " Validation is usually done automatically, according to validationOn prop.", - " Use this method only in corner cases." + "Called when component is interacted outside, to close the dropdown" ] }, "typeValue": { - "raw": "() => ValidationState" + "raw": "(event: Event) => boolean" }, "editor": { "type": "func" }, - "required": true - }, - { - "uid": "canUndo", - "name": "canUndo", - "comment": { - "raw": [ - "True if there are changes to undo" - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "required": true + "from": "@epam/uui-core:IDropdownTogglerProps", + "required": false }, { - "uid": "canRedo", - "name": "canRedo", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "True if there are changes to redo" + "Toggler component ref" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | (instance: any) => void | React.RefObject" }, - "required": true + "from": "@epam/uui-core:IDropdownTogglerProps", + "required": false }, { - "uid": "canRevert", - "name": "canRevert", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "True if there are changes to revers" + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { @@ -16799,14 +19842,15 @@ "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDropdownToggler", + "required": false }, { - "uid": "isChanged", - "name": "isChanged", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "True if form is changed since the initial state, or the last save" + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { @@ -16815,23 +19859,25 @@ "editor": { "type": "bool" }, - "required": true + "from": "@epam/uui-core:IDropdownToggler", + "required": false }, { - "uid": "isInProgress", - "name": "isInProgress", + "uid": "onClick", + "name": "onClick", "comment": { "raw": [ - "True if save is in progress" + "Called when component is clicked" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e?: any) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "required": true + "from": "@epam/uui-core:IClickable", + "required": false }, { "uid": "isInvalid", @@ -16910,10 +19956,13 @@ ] }, "typeValue": { - "raw": "T" + "raw": "string" + }, + "editor": { + "type": "string" }, "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { "uid": "onValueChange", @@ -16924,660 +19973,425 @@ ] }, "typeValue": { - "raw": "(newValue: T) => void" + "raw": "(newValue: string) => void" }, "editor": { "type": "func" }, "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "validationProps", - "name": "validationProps", - "comment": { - "raw": [ - "If T is a complex value (object or array), this property contains validation states of inner items" - ] - }, - "typeValue": { - "raw": "{ [key: string]: ValidationState; }" - }, - "from": "@epam/uui-core:ValidationState", "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "placeholder", + "name": "placeholder", "comment": { "raw": [ - "Message describing why the value is invalid" + "Placeholder to display when empty" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "any" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", + "from": "@epam/uui-core:IHasPlaceholder", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IHasCaption": { + "@epam/uui-core:IPresetsApi": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IHasCaption", - "nameFull": "IHasCaption" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component has a caption. E.g. Button" - ] + "name": "IPresetsApi", + "nameFull": "IPresetsApi" }, + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IHasCaption", + "raw": "IPresetsApi", "print": [ - "/** Component has a caption. E.g. Button */", - "interface IHasCaption {", - " /** Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions. */", - " caption?: ReactNode;", + "interface IPresetsApi {", + " /** ID of selected preset */", + " activePresetId: number | null;", + " /** Function that selects given preset */", + " choosePreset(preset: ITablePreset): void;", + " /** Function that gives preset name and create new preset with this name and current table state */", + " createNewPreset(name: string): Promise;", + " /** Function that gives preset and return if this preset changed or not */", + " hasPresetChanged(preset: ITablePreset): boolean;", + " /** Function that gives the preset and creat their duplicate */", + " duplicatePreset(preset: ITablePreset): void;", + " /** Function that deletes given preset */", + " deletePreset(preset: ITablePreset): Promise;", + " /** Function that updates given preset */", + " updatePreset(preset: ITablePreset): Promise;", + " /** Function that gives preset and return URL link on given preset */", + " getPresetLink(preset: ITablePreset): string;", + " /** Array of presets */", + " presets: ITablePreset[];", "}" ] }, "props": [ { - "uid": "caption", - "name": "caption", + "uid": "activePresetId", + "name": "activePresetId", "comment": { "raw": [ - "Caption. Can be a string, or React.Element. Certain components supports minimal markup (,,) in captions." + "ID of selected preset" ] }, "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasChildren": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasChildren", - "nameFull": "IHasChildren" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component can have child components" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasChildren", - "print": [ - "/** Component can have child components */", - "interface IHasChildren {", - " /** Component children */", - " children?: ReactNode;", - "}" - ] - }, - "props": [ - { - "uid": "children", - "name": "children", - "comment": { - "raw": [ - "Component children" - ] + "raw": "null | number" }, - "typeValue": { - "raw": "React.ReactNode" + "editor": { + "type": "number" }, - "typeValueRef": "@types/react:ReactNode", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasCX": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasCX", - "nameFull": "IHasCX" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component can accept cx property, allowing to pass classes to put on component.", - " CX is a shortcut for 'classnames'.", - " The props accept string, arrays, object, recursively. All falsy values are thrown away. Examples:", - " - 'red' => 'red'", - " - ['red', 0, false, 'blue' ] => 'red blue'", - " - { 'red': true, 'blue': false, ['green', 'white']} => 'red green white'" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasCX", - "print": [ - "/**", - " * Component can accept cx property, allowing to pass classes to put on component.", - " * CX is a shortcut for 'classnames'.", - " * The props accept string, arrays, object, recursively. All falsy values are thrown away. Examples:", - " * - 'red' => 'red'", - " * - ['red', 0, false, 'blue' ] => 'red blue'", - " * - { 'red': true, 'blue': false, ['green', 'white']} => 'red green white'", - " */", - "interface IHasCX {", - " /** CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details */", - " cx?: CX;", - "}" - ] - }, - "props": [ + }, { - "uid": "cx", - "name": "cx", + "uid": "choosePreset", + "name": "choosePreset", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Function that selects given preset" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(preset: ITablePreset) => void" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasDirection": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasDirection", - "nameFull": "IHasDirection" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component has direction of child components." - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasDirection", - "print": [ - "/** Component has direction of child components. */", - "interface IHasDirection {", - " /** Direction of child components. */", - " direction?: 'vertical' | 'horizontal';", - "}" - ] - }, - "props": [ + "editor": { + "type": "func" + }, + "required": true + }, { - "uid": "direction", - "name": "direction", + "uid": "createNewPreset", + "name": "createNewPreset", "comment": { "raw": [ - "Direction of child components." + "Function that gives preset name and create new preset with this name and current table state" ] }, "typeValue": { - "raw": "'vertical' | 'horizontal'" + "raw": "(name: string) => Promise" }, "editor": { - "type": "oneOf", - "options": [ - "vertical", - "horizontal" - ] + "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasForwardedRef": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasForwardedRef", - "nameFull": "IHasForwardedRef" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasForwardedRef", - "print": [ - "interface IHasForwardedRef {", - " /** this ref is passed to the underlying component */", - " forwardedRef?: ForwardedRef;", - "}" - ] - }, - "props": [ + "required": true + }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "hasPresetChanged", + "name": "hasPresetChanged", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Function that gives preset and return if this preset changed or not" ] }, "typeValue": { - "raw": "null | (instance: T | null) => void | React.MutableRefObject" + "raw": "(preset: ITablePreset) => boolean" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasIcon": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasIcon", - "nameFull": "IHasIcon" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "An icon can be added to component" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasIcon", - "print": [ - "/** An icon can be added to component */", - "interface IHasIcon {", - " /** Icon can be a React element (usually an SVG element) */", - " icon?: Icon;", - " /** Position of the icon (left of right) */", - " iconPosition?: 'left' | 'right';", - " /** Click handler for the icon */", - " onIconClick?(): void;", - "}" - ] - }, - "props": [ + "editor": { + "type": "func" + }, + "required": true + }, { - "uid": "icon", - "name": "icon", + "uid": "duplicatePreset", + "name": "duplicatePreset", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "Function that gives the preset and creat their duplicate" ] }, "typeValue": { - "raw": "Icon" + "raw": "(preset: ITablePreset) => void" }, "editor": { - "type": "component" + "type": "func" }, - "required": false + "required": true }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "deletePreset", + "name": "deletePreset", "comment": { "raw": [ - "Position of the icon (left of right)" + "Function that deletes given preset" ] }, "typeValue": { - "raw": "'left' | 'right'" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right" - ] + "type": "func" }, - "required": false + "required": true }, { - "uid": "onIconClick", - "name": "onIconClick", + "uid": "updatePreset", + "name": "updatePreset", "comment": { "raw": [ - "Click handler for the icon" + "Function that updates given preset" ] }, "typeValue": { - "raw": "() => void" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasLabel": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasLabel", - "nameFull": "IHasLabel" - }, - "src": "uui-core/src/types/props.ts", - "comment": { - "raw": [ - "Component has label. E.g. User Name" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasLabel", - "print": [ - "/** Component has label. E.g. User Name */", - "interface IHasLabel {", - " /** Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels. */", - " label?: ReactNode;", - "}" - ] - }, - "props": [ + "required": true + }, { - "uid": "label", - "name": "label", + "uid": "getPresetLink", + "name": "getPresetLink", "comment": { "raw": [ - "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." + "Function that gives preset and return URL link on given preset" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(preset: ITablePreset) => string" }, - "typeValueRef": "@types/react:ReactNode", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasPlaceholder": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasPlaceholder", - "nameFull": "IHasPlaceholder" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasPlaceholder", - "print": [ - "interface IHasPlaceholder {", - " /** Placeholder to display when empty */", - " placeholder?: any;", - "}" - ] - }, - "props": [ + "editor": { + "type": "func" + }, + "required": true + }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "presets", + "name": "presets", "comment": { "raw": [ - "Placeholder to display when empty" + "Array of presets" ] }, "typeValue": { - "raw": "any" + "raw": "ITablePreset[]" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IHasRawProps": { + "@epam/uui-core:IProcessRequest": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IHasRawProps", - "nameFull": "IHasRawProps" + "name": "IProcessRequest", + "nameFull": "IProcessRequest" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/services/ApiContext.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "raw": "IHasRawProps", + "raw": "IProcessRequest", "print": [ - "// Component allows to pass raw HTML props to put on the DOM element", - "type IHasRawProps = {", - " /** Any HTML attributes (native or 'data-') to put on the underlying component */", - " rawProps?: T & Record<`data-${string}`, string>;", - "};" + "type IProcessRequest = (url: string, method: string, data?: any, options?: ApiCallOptions) => Promise;" ] - }, - "props": [ - { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] - }, - "typeValue": { - "raw": "T & Record<`data-${string}`, string>" - }, - "required": false - } - ], - "propsFromUnion": false + } } }, - "@epam/uui-core:IHasStyleAttrs": { + "@epam/uui-core:IRouter6": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IHasStyleAttrs", - "nameFull": "IHasStyleAttrs" + "name": "IRouter6", + "nameFull": "IRouter6" + }, + "src": "uui-core/src/services/routing/interfaces/IRouter6.ts", + "comment": { + "raw": [ + "From: react-router version 6.14.0", + "", + " The type definition of the IRouter6 is not complete (It's OK as long as we only use a subset of its API)", + "", + " NOTE: Complete definitions of the router is located in @remix-run/router:", + " https://github.com/remix-run/react-router/blob/main/packages/router/router.ts#L57" + ] }, - "src": "uui-core/src/types/props.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "IHasStyleAttrs", + "raw": "IRouter6", "print": [ - "interface IHasStyleAttrs {", - " /** CSS style prop to put on the component */", - " style?: React.CSSProperties;", - "}" + "/**", + " * From: react-router version 6.14.0", + " *", + " * The type definition of the IRouter6 is not complete (It's OK as long as we only use a subset of its API)", + " *", + " * NOTE: Complete definitions of the router is located in @remix-run/router:", + " * https://github.com/remix-run/react-router/blob/main/packages/router/router.ts#L57", + " */", + "type IRouter6 = {", + " state: RouterState;", + " navigate(to: To | null, opts?: RouterNavigateOptions): Promise;", + " navigate(to: number): Promise;", + " getBlocker: (key: string, fn: BlockerFunction) => unknown;", + " subscribe: (fn: (state: RouterState) => void) => () => void;", + " deleteBlocker: (key: string) => void;", + " createHref(location: Location | URL): string;", + "};" ] }, "props": [ { - "uid": "style", - "name": "style", - "comment": { - "raw": [ - "CSS style prop to put on the component" - ] + "uid": "state", + "name": "state", + "typeValue": { + "raw": "RouterState" }, + "typeValueRef": "@epam/uui-core:RouterState", + "required": true + }, + { + "uid": "navigate", + "name": "navigate", "typeValue": { - "raw": "React.CSSProperties" + "raw": "{ (to: To | null, opts?: RouterNavigateOptions | undefined): Promise; (to: number): Promise; }" }, - "required": false + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "getBlocker", + "name": "getBlocker", + "typeValue": { + "raw": "(key: string, fn: BlockerFunction) => unknown" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "subscribe", + "name": "subscribe", + "typeValue": { + "raw": "(fn: (state: RouterState) => void) => () => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "deleteBlocker", + "name": "deleteBlocker", + "typeValue": { + "raw": "(key: string) => void" + }, + "editor": { + "type": "func" + }, + "required": true + }, + { + "uid": "createHref", + "name": "createHref", + "typeValue": { + "raw": "(location: Location | URL) => string" + }, + "editor": { + "type": "func" + }, + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IHasTabIndex": { + "@epam/uui-core:IRouterContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IHasTabIndex", - "nameFull": "IHasTabIndex" + "name": "IRouterContext", + "nameFull": "IRouterContext" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IHasTabIndex", + "raw": "IRouterContext", "print": [ - "// TBD: merge with ICanFocus?", - "interface IHasTabIndex {", - " /** Controls the order of keyboard navigation between components */", - " tabIndex?: React.HTMLAttributes['tabIndex'];", + "interface IRouterContext {", + " /** Returns current location link */", + " getCurrentLink(): Link;", + " /** Makes a SPA redirect to the provided link */", + " redirect(link?: Link | string): void;", + " /** Makes a SPA redirect to the provided link. Replaces the current entry in the history stack with a new one */", + " transfer(link: Link): void;", + " /** Returns true, if provided link match current location */", + " isActive(link: Link): boolean;", + " /** Creates href string based on provided link */", + " createHref(link: Link): string;", + " /** Subscribes to the router updates */", + " listen(listener: (link: Link) => void): () => void;", + " /**", + " * Blocks router changes. Can be used to show confirmation dialogs before the redirect.", + " * If block callback provide, all router changes will be blocked, you need to unblock and to retry them by yourself.", + " * */", + " block(callback: (link: Link) => void): () => void;", "}" ] }, "props": [ { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "getCurrentLink", + "name": "getCurrentLink", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Returns current location link" ] }, "typeValue": { - "raw": "number" + "raw": "() => Link" }, "editor": { - "type": "number" + "type": "func" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHasValidationMessage": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHasValidationMessage", - "nameFull": "IHasValidationMessage" - }, - "src": "uui-core/src/types/props.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHasValidationMessage", - "print": [ - "interface IHasValidationMessage {", - " /** Message describing why the value is invalid */", - " validationMessage?: ReactNode;", - "}" - ] - }, - "props": [ + "required": true + }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "redirect", + "name": "redirect", "comment": { "raw": [ - "Message describing why the value is invalid" + "Makes a SPA redirect to the provided link" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "(link?: string | Link | undefined) => void" }, - "typeValueRef": "@types/react:ReactNode", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:IHistory4": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IHistory4", - "nameFull": "IHistory4" - }, - "src": "uui-core/src/services/routing/HistoryAdaptedRouter.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "IHistory4", - "print": [ - "interface IHistory4 {", - " location: Link;", - " push(link: Link): void;", - " replace(link: Link): void;", - " createHref(link: Link): string;", - " listen(listener: (location: Link) => void): () => void;", - " block(listener: (args: any) => any): () => void;", - "}" - ] - }, - "props": [ - { - "uid": "location", - "name": "location", - "typeValue": { - "raw": "Link" + "editor": { + "type": "func" }, "required": true }, { - "uid": "push", - "name": "push", + "uid": "transfer", + "name": "transfer", + "comment": { + "raw": [ + "Makes a SPA redirect to the provided link. Replaces the current entry in the history stack with a new one" + ] + }, "typeValue": { "raw": "(link: Link) => void" }, @@ -17587,10 +20401,15 @@ "required": true }, { - "uid": "replace", - "name": "replace", + "uid": "isActive", + "name": "isActive", + "comment": { + "raw": [ + "Returns true, if provided link match current location" + ] + }, "typeValue": { - "raw": "(link: Link) => void" + "raw": "(link: Link) => boolean" }, "editor": { "type": "func" @@ -17600,6 +20419,11 @@ { "uid": "createHref", "name": "createHref", + "comment": { + "raw": [ + "Creates href string based on provided link" + ] + }, "typeValue": { "raw": "(link: Link) => string" }, @@ -17611,8 +20435,13 @@ { "uid": "listen", "name": "listen", + "comment": { + "raw": [ + "Subscribes to the router updates" + ] + }, "typeValue": { - "raw": "(listener: (location: Link) => void) => () => void" + "raw": "(listener: (link: Link) => void) => () => void" }, "editor": { "type": "func" @@ -17622,8 +20451,14 @@ { "uid": "block", "name": "block", + "comment": { + "raw": [ + "Blocks router changes. Can be used to show confirmation dialogs before the redirect.", + " If block callback provide, all router changes will be blocked, you need to unblock and to retry them by yourself." + ] + }, "typeValue": { - "raw": "(listener: (args: any) => any) => () => void" + "raw": "(callback: (link: Link) => void) => () => void" }, "editor": { "type": "func" @@ -17634,179 +20469,251 @@ "propsFromUnion": false } }, - "@epam/uui-core:ILayoutContext": { + "@epam/uui-core:ITablePreset": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ILayoutContext", - "nameFull": "ILayoutContext" + "name": "ITablePreset", + "nameFull": "ITablePreset" }, - "src": "uui-core/src/types/contexts.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ILayoutContext", + "raw": "ITablePreset", "print": [ - "interface ILayoutContext {", - " /** Returns the new layer. This layer will be higher than previous. */", - " getLayer(): LayoutLayer;", - " /** Removes provided layer from layers list */", - " releaseLayer(layer: LayoutLayer): void;", - " /**", - " * Returns portal root node.", - " * In simple cases it will be node with 'main' or 'root' id or document.body.", - " * Or it will return node with portalRootId.", - " */", - " getPortalRoot(): HTMLElement;", + "interface ITablePreset {", + " /** Name of the filter */", + " name: string;", + " /** Unique Id of the filter */", + " id: number | null;", + " /** If true, this preset can't be deleted or modified */", + " isReadonly?: boolean;", " /**", - " * Returns unique id, which can be used as id for portal root.", - " * Usually used for cases with shadow DOM, to be able to find this portal root element if it's located under shadow DOM", + " * Determines the order in which this preset should appear in the presets list.", + " * The columns are sorted in ascending alphabetical order.", " */", - " getPortalRootId(): string;", + " order?: string;", + " /** Filter value stored in the preset */", + " filter?: TFilter;", + " /** Columns config value stored in the preset */", + " columnsConfig?: ColumnsConfig;", + " /** Filters config value stored in the preset */", + " filtersConfig?: FiltersConfig;", + " /** Sorting value stored in the preset */", + " sorting?: SortingOption[];", + " /** View state value stored in the preset */", + " viewState?: TViewState;", "}" ] }, "props": [ { - "uid": "getLayer", - "name": "getLayer", + "uid": "name", + "name": "name", "comment": { "raw": [ - "Returns the new layer. This layer will be higher than previous." + "Name of the filter" ] }, "typeValue": { - "raw": "() => LayoutLayer" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, "required": true }, { - "uid": "releaseLayer", - "name": "releaseLayer", + "uid": "id", + "name": "id", "comment": { "raw": [ - "Removes provided layer from layers list" + "Unique Id of the filter" ] }, "typeValue": { - "raw": "(layer: LayoutLayer) => void" + "raw": "null | number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "getPortalRoot", - "name": "getPortalRoot", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Returns portal root node.", - " In simple cases it will be node with 'main' or 'root' id or document.body.", - " Or it will return node with portalRootId." + "If true, this preset can't be deleted or modified" ] }, "typeValue": { - "raw": "() => HTMLElement" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "required": false }, { - "uid": "getPortalRootId", - "name": "getPortalRootId", + "uid": "order", + "name": "order", "comment": { "raw": [ - "Returns unique id, which can be used as id for portal root.", - " Usually used for cases with shadow DOM, to be able to find this portal root element if it's located under shadow DOM" + "Determines the order in which this preset should appear in the presets list.", + " The columns are sorted in ascending alphabetical order." ] }, "typeValue": { - "raw": "() => string" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "required": false + }, + { + "uid": "filter", + "name": "filter", + "comment": { + "raw": [ + "Filter value stored in the preset" + ] + }, + "typeValue": { + "raw": "TFilter" + }, + "required": false + }, + { + "uid": "columnsConfig", + "name": "columnsConfig", + "comment": { + "raw": [ + "Columns config value stored in the preset" + ] + }, + "typeValue": { + "raw": "ColumnsConfig" + }, + "required": false + }, + { + "uid": "filtersConfig", + "name": "filtersConfig", + "comment": { + "raw": [ + "Filters config value stored in the preset" + ] + }, + "typeValue": { + "raw": "FiltersConfig" + }, + "required": false + }, + { + "uid": "sorting", + "name": "sorting", + "comment": { + "raw": [ + "Sorting value stored in the preset" + ] + }, + "typeValue": { + "raw": "SortingOption[]" + }, + "required": false + }, + { + "uid": "viewState", + "name": "viewState", + "comment": { + "raw": [ + "View state value stored in the preset" + ] + }, + "typeValue": { + "raw": "TViewState" + }, + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:ILens": { + "@epam/uui-core:ITableState": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ILens", - "nameFull": "ILens" + "name": "ITableState", + "nameFull": "ITableState" }, - "src": "uui-core/src/data/lenses/types.ts", + "src": "uui-core/src/types/tables.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ILens", + "raw": "ITableState", "print": [ - "interface ILens {", - " /** Get lens value */", - " get(): TFocused;", - " /** Set new lens value */", - " set(value: TFocused): void;", - " /** Updates lens value with returned value from provided callback.", - " * This callback received current lens value as a param", - " * */", - " update(fn: (current: TFocused) => TFocused): void;", - " /** Return a new lens on the provided field name */", - " prop(name: K): ILens>;", - " /** Return a new lens on item of array by provided index */", - " index(index: number): ILens>;", - " /** Add to the lens a setter callback, which received old and new value and should return new value for set.", - " * This callback will be called on any lens update", - " * */", - " onChange(fn: (oldValue: TFocused, newValue: TFocused) => TFocused): ILens;", - " /** Defines default lens value, which will be return in case of lens have 'null' or 'undefined' value */", - " default(value: TFocused): ILens;", - " /** Return IEditable interface, which accepted by UUI form components.", - " * Usually you just need to spread it to the component, e.g. { ...lens.prop('name').toProps() } */", - " toProps(): IEditable & ValidationState;", + "interface ITableState, TViewState = any> extends IPresetsApi {", + " /** Table state value */", + " tableState: DataTableState;", + " /** Function that updates table state value */", + " setTableState: Dispatch>>;", + " /** Function that updates filter value */", + " setFilter(filter: TFilter): void;", + " /** Function that updates columns config value */", + " setColumnsConfig(columnsConfig: ColumnsConfig): void;", + " /** Function that updates filters config value */", + " setFiltersConfig(filtersConfig: FiltersConfig): void;", "}" ] }, "props": [ { - "uid": "get", - "name": "get", + "uid": "tableState", + "name": "tableState", "comment": { "raw": [ - "Get lens value" + "Table state value" ] }, "typeValue": { - "raw": "() => TFocused" + "raw": "DataTableState" + }, + "required": true + }, + { + "uid": "setTableState", + "name": "setTableState", + "comment": { + "raw": [ + "Function that updates table state value" + ] + }, + "typeValue": { + "raw": "React.Dispatch>>" }, + "typeValueRef": "@types/react:Dispatch", "editor": { "type": "func" }, "required": true }, { - "uid": "set", - "name": "set", + "uid": "setFilter", + "name": "setFilter", "comment": { "raw": [ - "Set new lens value" + "Function that updates filter value" ] }, "typeValue": { - "raw": "(value: TFocused) => void" + "raw": "(filter: TFilter) => void" }, "editor": { "type": "func" @@ -17814,16 +20721,15 @@ "required": true }, { - "uid": "update", - "name": "update", + "uid": "setColumnsConfig", + "name": "setColumnsConfig", "comment": { "raw": [ - "Updates lens value with returned value from provided callback.", - " This callback received current lens value as a param" + "Function that updates columns config value" ] }, "typeValue": { - "raw": "(fn: (current: TFocused) => TFocused) => void" + "raw": "(columnsConfig: ColumnsConfig) => void" }, "editor": { "type": "func" @@ -17831,15 +20737,15 @@ "required": true }, { - "uid": "prop", - "name": "prop", + "uid": "setFiltersConfig", + "name": "setFiltersConfig", "comment": { "raw": [ - "Return a new lens on the provided field name" + "Function that updates filters config value" ] }, "typeValue": { - "raw": "(name: K) => ILens>" + "raw": "(filtersConfig: FiltersConfig) => void" }, "editor": { "type": "func" @@ -17847,251 +20753,186 @@ "required": true }, { - "uid": "index", - "name": "index", + "uid": "activePresetId", + "name": "activePresetId", "comment": { "raw": [ - "Return a new lens on item of array by provided index" + "ID of selected preset" ] }, "typeValue": { - "raw": "(index: number) => ILens>" + "raw": "null | number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "from": "@epam/uui-core:IPresetsApi", + "required": false }, { - "uid": "onChange", - "name": "onChange", + "uid": "choosePreset", + "name": "choosePreset", "comment": { "raw": [ - "Add to the lens a setter callback, which received old and new value and should return new value for set.", - " This callback will be called on any lens update" + "Function that selects given preset" ] }, "typeValue": { - "raw": "(fn: (oldValue: TFocused, newValue: TFocused) => TFocused) => ILens" + "raw": "(preset: ITablePreset) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true }, { - "uid": "default", - "name": "default", + "uid": "createNewPreset", + "name": "createNewPreset", "comment": { "raw": [ - "Defines default lens value, which will be return in case of lens have 'null' or 'undefined' value" + "Function that gives preset name and create new preset with this name and current table state" ] }, "typeValue": { - "raw": "(value: TFocused) => ILens" + "raw": "(name: string) => Promise" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true }, { - "uid": "toProps", - "name": "toProps", + "uid": "hasPresetChanged", + "name": "hasPresetChanged", "comment": { "raw": [ - "Return IEditable interface, which accepted by UUI form components.", - " Usually you just need to spread it to the component, e.g. { ...lens.prop('name').toProps() }" + "Function that gives preset and return if this preset changed or not" ] }, "typeValue": { - "raw": "() => IEditable & ValidationState" + "raw": "(preset: ITablePreset) => boolean" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ILockContext": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ILockContext", - "nameFull": "ILockContext" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ILockContext", - "print": [ - "interface ILockContext {", - " /**", - " * Tries to take a lock, and sets tryRelease callback, which will be invoked when something tries to take control over.", - " * If a lock already exists, it tries to release the current lock and then set a new one", - " */", - " acquire(tryRelease: () => Promise): Promise;", - " /** Releases lock without calling tryRelease callback */", - " release(lock: object): void;", - " /** Tries to acquire a lock for the time while the action is being executed. */", - " withLock(action: () => Promise): Promise;", - " /** Returns currently active lock */", - " getCurrentLock: () => Lock | null;", - "}" - ] - }, - "props": [ + }, { - "uid": "acquire", - "name": "acquire", + "uid": "duplicatePreset", + "name": "duplicatePreset", "comment": { "raw": [ - "Tries to take a lock, and sets tryRelease callback, which will be invoked when something tries to take control over.", - " If a lock already exists, it tries to release the current lock and then set a new one" + "Function that gives the preset and creat their duplicate" ] }, "typeValue": { - "raw": "(tryRelease: () => Promise) => Promise" + "raw": "(preset: ITablePreset) => void" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true }, { - "uid": "release", - "name": "release", + "uid": "deletePreset", + "name": "deletePreset", "comment": { "raw": [ - "Releases lock without calling tryRelease callback" + "Function that deletes given preset" ] }, "typeValue": { - "raw": "(lock: object) => void" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true }, { - "uid": "withLock", - "name": "withLock", + "uid": "updatePreset", + "name": "updatePreset", "comment": { "raw": [ - "Tries to acquire a lock for the time while the action is being executed." + "Function that updates given preset" ] }, "typeValue": { - "raw": "(action: () => Promise) => Promise" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", "required": true }, { - "uid": "getCurrentLock", - "name": "getCurrentLock", + "uid": "getPresetLink", + "name": "getPresetLink", "comment": { "raw": [ - "Returns currently active lock" + "Function that gives preset and return URL link on given preset" ] }, "typeValue": { - "raw": "() => Lock | null" + "raw": "(preset: ITablePreset) => string" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:IPresetsApi", + "required": true + }, + { + "uid": "presets", + "name": "presets", + "comment": { + "raw": [ + "Array of presets" + ] + }, + "typeValue": { + "raw": "ITablePreset[]" + }, + "from": "@epam/uui-core:IPresetsApi", "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IMap": { + "@epam/uui-core:ItemsMapParams": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IMap", - "nameFull": "IMap" + "name": "ItemsMapParams", + "nameFull": "ItemsMapParams" }, - "src": "uui-core/src/types/objects.ts", + "src": "uui-core/src/data/processing/views/tree/ItemsMap.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IMap", + "raw": "ItemsMapParams", "print": [ - "interface IMap {", - " constructor: Function;", - " [Symbol.iterator](): IterableIterator<[", - " TKey,", - " TValue", - " ]>;", - " get(key: TKey): TValue;", - " set(key: TKey, value: TValue): IMap;", - " has(key: TKey): boolean;", - " delete(key: TKey): boolean;", - " size: number;", + "interface ItemsMapParams {", + " getId: (item: TItem) => TId;", + " complexIds?: boolean;", "}" ] }, "props": [ { - "uid": "constructor", - "name": "constructor", - "typeValue": { - "raw": "Function" - }, - "required": true - }, - { - "uid": "get", - "name": "get", - "typeValue": { - "raw": "(key: TKey) => TValue" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "set", - "name": "set", - "typeValue": { - "raw": "(key: TKey, value: TValue) => IMap" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "has", - "name": "has", - "typeValue": { - "raw": "(key: TKey) => boolean" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "delete", - "name": "delete", + "uid": "getId", + "name": "getId", "typeValue": { - "raw": "(key: TKey) => boolean" + "raw": "(item: TItem) => TId" }, "editor": { "type": "func" @@ -18099,123 +20940,135 @@ "required": true }, { - "uid": "size", - "name": "size", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": true - }, - { - "uid": "[Symbol.iterator]", - "name": "[Symbol.iterator]", + "uid": "complexIds", + "name": "complexIds", "typeValue": { - "raw": "() => IterableIterator<[TKey, TValue]>" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IModal": { + "@epam/uui-core:ItemsStorageParams": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IModal", - "nameFull": "IModal" + "name": "ItemsStorageParams", + "nameFull": "ItemsStorageParams" }, - "src": "uui-core/src/types/props.ts", + "src": "uui-core/src/data/processing/views/tree/ItemsStorage.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IModal", + "raw": "ItemsStorageParams", "print": [ - "interface IModal {", - " /** Indicates whether the modal is currently displayed */", - " isActive?: boolean;", - " /** Unique key of the modal */", - " key: string;", - " /** Modal zIndex value. Calculated via LayoutContext. */", - " zIndex: number;", - " /** Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value. */", - " success(result: TResult): void;", - " /** Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value. */", - " abort(result?: any): void;", - " /** Parameters that provided via second param of `modalContext.show` method */", - " parameters?: TParameters;", - " /** Depth of current modal layer */", - " depth?: number;", + "interface ItemsStorageParams {", + " items?: TItem[];", + " params: ItemsMapParams;", "}" ] }, "props": [ { - "uid": "isActive", - "name": "isActive", - "comment": { - "raw": [ - "Indicates whether the modal is currently displayed" - ] - }, + "uid": "items", + "name": "items", "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TItem[]" }, "required": false }, { - "uid": "key", - "name": "key", - "comment": { - "raw": [ - "Unique key of the modal" - ] - }, + "uid": "params", + "name": "params", "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "ItemsMapParams" }, "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ITree": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ITree", + "nameFull": "ITree" + }, + "src": "uui-core/src/data/processing/views/tree/ITree.ts", + "comment": { + "raw": [ + "Proxy interface for a tree-like structure.", + " It is library/data-structure shape agnostic.", + " It provides a flexible way to represent existing data in a tree-like shape for the UUI internal usage, without repacking data in some specific form." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ITree", + "print": [ + "/**", + " * Proxy interface for a tree-like structure.", + " * It is library/data-structure shape agnostic.", + " * It provides a flexible way to represent existing data in a tree-like shape for the UUI internal usage, without repacking data in some specific form.", + " */", + "interface ITree {", + " /**", + " * Provides a tree configuration.", + " */", + " getParams(): ITreeParams;", + " /**", + " * Provides item's children and count/totalCount/assumedCount/status of its node.", + " * @param parentId - id of an item, which children info should be returned.", + " */", + " getItems(parentId?: TId): ITreeItemsInfo;", + " /**", + " * Item getter. Provides access to the item by its ID.", + " * @param id - ID of an item to be returned.", + " */", + " getById(id: TId): TItem | typeof NOT_FOUND_RECORD;", + "}" + ] + }, + "props": [ { - "uid": "zIndex", - "name": "zIndex", + "uid": "getParams", + "name": "getParams", "comment": { "raw": [ - "Modal zIndex value. Calculated via LayoutContext." + "Provides a tree configuration." ] }, "typeValue": { - "raw": "number" + "raw": "() => ITreeParams" }, "editor": { - "type": "number" + "type": "func" }, "required": true }, { - "uid": "success", - "name": "success", + "uid": "getItems", + "name": "getItems", "comment": { "raw": [ - "Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value." + "Provides item's children and count/totalCount/assumedCount/status of its node.", + " @param parentId - id of an item, which children info should be returned." ] }, "typeValue": { - "raw": "(result: TResult) => void" + "raw": "(parentId?: TId | undefined) => ITreeItemsInfo" }, "editor": { "type": "func" @@ -18223,303 +21076,300 @@ "required": true }, { - "uid": "abort", - "name": "abort", + "uid": "getById", + "name": "getById", "comment": { "raw": [ - "Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value." + "Item getter. Provides access to the item by its ID.", + " @param id - ID of an item to be returned." ] }, "typeValue": { - "raw": "(result?: any) => void" + "raw": "(id: TId) => TItem | typeof NOT_FOUND_RECORD" }, "editor": { "type": "func" }, "required": true - }, - { - "uid": "parameters", - "name": "parameters", - "comment": { - "raw": [ - "Parameters that provided via second param of `modalContext.show` method" - ] - }, - "typeValue": { - "raw": "TParameters" - }, - "required": false - }, - { - "uid": "depth", - "name": "depth", - "comment": { - "raw": [ - "Depth of current modal layer" - ] - }, - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" - }, - "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IModalContext": { + "@epam/uui-core:ITreeItemsInfo": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IModalContext", - "nameFull": "IModalContext" + "name": "ITreeItemsInfo", + "nameFull": "ITreeItemsInfo" + }, + "src": "uui-core/src/data/processing/views/tree/ITree.ts", + "comment": { + "raw": [ + "Items, status and state information, like count/assumedCount/totalCount of the ITree node." + ] }, - "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IModalContext", + "raw": "ITreeItemsInfo", "print": [ - "interface IModalContext extends IBaseContext {", - " /** Shows provided modal component with defined params */", - " show(render: (props: IModal) => React.ReactNode, parameters?: TParameters): Promise;", - " /** Removes all active modals */", - " closeAll(): void;", - " /** Returns true, if some modal displayed */", - " isModalOperationActive(): boolean;", - " /** Returns all active modals */", - " getOperations(): ModalOperation[];", + "/**", + " * Items, status and state information, like count/assumedCount/totalCount of the ITree node.", + " */", + "interface ITreeItemsInfo extends ITreeNodeInfo {", + " /**", + " * Tree node IDs.", + " */", + " ids: TId[];", + " /**", + " * ITree node loading/state status.", + " */", + " status: ITreeNodeStatus;", "}" ] }, "props": [ { - "uid": "show", - "name": "show", - "comment": { - "raw": [ - "Shows provided modal component with defined params" - ] - }, - "typeValue": { - "raw": "(render: (props: IModal) => React.ReactNode, parameters?: TParameters | undefined) => Promise" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "closeAll", - "name": "closeAll", + "uid": "ids", + "name": "ids", "comment": { "raw": [ - "Removes all active modals" + "Tree node IDs." ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "TId[]" }, "required": true }, { - "uid": "isModalOperationActive", - "name": "isModalOperationActive", + "uid": "status", + "name": "status", "comment": { "raw": [ - "Returns true, if some modal displayed" + "ITree node loading/state status." ] }, "typeValue": { - "raw": "() => boolean" + "raw": "'FULLY_LOADED' | 'PARTIALLY_LOADED' | 'EMPTY'" }, + "typeValueRef": "@epam/uui-core:ITreeNodeStatus", "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getOperations", - "name": "getOperations", - "comment": { - "raw": [ - "Returns all active modals" + "type": "oneOf", + "options": [ + "FULLY_LOADED", + "PARTIALLY_LOADED", + "EMPTY" ] }, - "typeValue": { - "raw": "() => ModalOperation[]" - }, - "editor": { - "type": "func" - }, "required": true }, { - "uid": "subscribe", - "name": "subscribe", + "uid": "count", + "name": "count", "comment": { "raw": [ - "Add your handler, which will be called on context updates" + "Count of the records, returned from server or explicitly counted from data.", + " If undefined, not all data is loaded from server." ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IBaseContext", - "required": true + "from": "@epam/uui-core:ITreeNodeInfo", + "required": false }, { - "uid": "unsubscribe", - "name": "unsubscribe", + "uid": "totalCount", + "name": "totalCount", "comment": { "raw": [ - "Unsubscribe from context updates" + "Total count of the records. Usually, is returned from server on a root node fetch." ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IBaseContext", - "required": true + "from": "@epam/uui-core:ITreeNodeInfo", + "required": false }, { - "uid": "destroyContext", - "name": "destroyContext", + "uid": "assumedCount", + "name": "assumedCount", "comment": { "raw": [ - "Manually destroy context and unsubscribe from all listeners" + "Assumed count, got from the `getChildCount` result." ] }, "typeValue": { - "raw": "() => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IBaseContext", - "required": true + "from": "@epam/uui-core:ITreeNodeInfo", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:INotification": { + "@epam/uui-core:ITreeLoadResult": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "INotification", - "nameFull": "INotification" + "name": "ITreeLoadResult", + "nameFull": "ITreeLoadResult" + }, + "src": "uui-core/src/data/processing/views/tree/Tree.ts", + "comment": { + "raw": [ + "Structured result of tree records loading." + ] }, - "src": "uui-core/src/types/props.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "INotification", + "raw": "ITreeLoadResult", "print": [ - "interface INotification {", - " /** Call to close the notification with abort action. It's rejects `notificationContext.show()` promise. */", - " onClose?(): void;", - " /** Call to close the notification with success action. It's resolved `notificationContext.show()` promise. */", - " onSuccess?(): void;", - " /** Cancel notification closing timer */", - " clearTimer?(): void;", - " /** Reinitialize notification closing timer. It will be set to the provided notification duration. */", - " refreshTimer?(): void;", - " /** Unique id of the notification */", - " id: number;", - " /** Unique key of the notification */", - " key: string;", + "/**", + " * Structured result of tree records loading.", + " */", + "interface ITreeLoadResult {", + " /**", + " * Loaded records.", + " */", + " loadedItems: TItem[];", + " /**", + " * Loaded records, structured by parents IDs.", + " */", + " byParentId: IMap;", + " /**", + " * Loading node info, like count/assumedCount/totalCount, by IDs.", + " */", + " nodeInfoById: IMap;", "}" ] }, "props": [ { - "uid": "onClose", - "name": "onClose", + "uid": "loadedItems", + "name": "loadedItems", "comment": { "raw": [ - "Call to close the notification with abort action. It's rejects `notificationContext.show()` promise." + "Loaded records." ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "TItem[]" }, - "required": false + "required": true }, { - "uid": "onSuccess", - "name": "onSuccess", + "uid": "byParentId", + "name": "byParentId", "comment": { "raw": [ - "Call to close the notification with success action. It's resolved `notificationContext.show()` promise." + "Loaded records, structured by parents IDs." ] }, "typeValue": { - "raw": "() => void" - }, - "editor": { - "type": "func" + "raw": "IMap" }, - "required": false + "required": true }, { - "uid": "clearTimer", - "name": "clearTimer", + "uid": "nodeInfoById", + "name": "nodeInfoById", "comment": { "raw": [ - "Cancel notification closing timer" + "Loading node info, like count/assumedCount/totalCount, by IDs." ] }, "typeValue": { - "raw": "() => void" + "raw": "IMap" }, - "editor": { - "type": "func" - }, - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ITreeNodeInfo": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ITreeNodeInfo", + "nameFull": "ITreeNodeInfo" + }, + "src": "uui-core/src/data/processing/views/tree/treeStructure/types.ts", + "comment": { + "raw": [ + "Info of the tree node." + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ITreeNodeInfo", + "print": [ + "/**", + " * Info of the tree node.", + " */", + "interface ITreeNodeInfo {", + " /**", + " * Count of the records, returned from server or explicitly counted from data.", + " * If undefined, not all data is loaded from server.", + " */", + " count?: number;", + " /**", + " * Total count of the records. Usually, is returned from server on a root node fetch.", + " */", + " totalCount?: number;", + " /**", + " * Assumed count, got from the `getChildCount` result.", + " */", + " assumedCount?: number;", + "}" + ] + }, + "props": [ { - "uid": "refreshTimer", - "name": "refreshTimer", + "uid": "count", + "name": "count", "comment": { "raw": [ - "Reinitialize notification closing timer. It will be set to the provided notification duration." + "Count of the records, returned from server or explicitly counted from data.", + " If undefined, not all data is loaded from server." ] }, "typeValue": { - "raw": "() => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": false }, { - "uid": "id", - "name": "id", + "uid": "totalCount", + "name": "totalCount", "comment": { "raw": [ - "Unique id of the notification" + "Total count of the records. Usually, is returned from server on a root node fetch." ] }, "typeValue": { @@ -18528,82 +21378,112 @@ "editor": { "type": "number" }, - "required": true + "required": false }, { - "uid": "key", - "name": "key", + "uid": "assumedCount", + "name": "assumedCount", "comment": { "raw": [ - "Unique key of the notification" + "Assumed count, got from the `getChildCount` result." ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:INotificationContext": { + "@epam/uui-core:ITreeNodeStatus": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "INotificationContext", - "nameFull": "INotificationContext" + "name": "ITreeNodeStatus", + "nameFull": "ITreeNodeStatus" + }, + "src": "uui-core/src/data/processing/views/tree/ITree.ts", + "comment": { + "raw": [ + "ITree node loading/state status." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'FULLY_LOADED' | 'PARTIALLY_LOADED' | 'EMPTY'", + "print": [ + "/**", + " * ITree node loading/state status.", + " */", + "type ITreeNodeStatus = typeof FULLY_LOADED | typeof PARTIALLY_LOADED | typeof EMPTY;" + ] + } + } + }, + "@epam/uui-core:ITreeParams": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ITreeParams", + "nameFull": "ITreeParams" + }, + "src": "uui-core/src/data/processing/views/tree/treeStructure/types.ts", + "comment": { + "raw": [ + "ITree configuration." + ] }, - "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "INotificationContext", + "raw": "ITreeParams", "print": [ - "interface INotificationContext extends IBaseContext {", - " /** Shows provided notification component with defined params */", - " show(render: (props: INotification) => React.ReactNode, notificationParams?: NotificationParams): Promise;", - " /** Returns all active notifications */", - " getNotifications(): NotificationOperation[];", - " /** Removes notification by their id */", - " remove(id: number): void;", - " /** Removes all active notification */", - " clearAll(): void;", + "/**", + " * ITree configuration.", + " */", + "interface ITreeParams {", + " /**", + " * Item ID getter.", + " */", + " getId(item: TItem): TId;", + " /**", + " * Item parent ID getter.", + " */", + " getParentId?(item: TItem): TId | undefined;", + " /**", + " * Item child count getter.", + " * @param item - item, which children count should be returned.", + " * @returns assumed children count. If unknown, it is better to return 1.", + " */", + " getChildCount?(item: TItem): number;", + " /**", + " * Enables support of ids of types Object, Array, etc.", + " */", + " complexIds?: boolean;", "}" ] }, "props": [ { - "uid": "show", - "name": "show", - "comment": { - "raw": [ - "Shows provided notification component with defined params" - ] - }, - "typeValue": { - "raw": "(render: (props: INotification) => React.ReactNode, notificationParams?: NotificationParams | undefined) => Promise" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getNotifications", - "name": "getNotifications", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Returns all active notifications" + "Item ID getter." ] }, "typeValue": { - "raw": "() => NotificationOperation[]" + "raw": "(item: TItem) => TId" }, "editor": { "type": "func" @@ -18611,228 +21491,267 @@ "required": true }, { - "uid": "remove", - "name": "remove", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Removes notification by their id" + "Item parent ID getter." ] }, "typeValue": { - "raw": "(id: number) => void" + "raw": "(item: TItem) => TId | undefined" }, "editor": { "type": "func" }, - "required": true + "required": false }, { - "uid": "clearAll", - "name": "clearAll", + "uid": "getChildCount", + "name": "getChildCount", "comment": { "raw": [ - "Removes all active notification" + "Item child count getter.", + " @param item - item, which children count should be returned.", + " @returns assumed children count. If unknown, it is better to return 1." ] }, "typeValue": { - "raw": "() => void" + "raw": "(item: TItem) => number" }, "editor": { "type": "func" }, - "required": true + "required": false }, { - "uid": "subscribe", - "name": "subscribe", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Add your handler, which will be called on context updates" + "Enables support of ids of types Object, Array, etc." ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IBaseContext", - "required": true - }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:IUserSettingsContext": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "IUserSettingsContext", + "nameFull": "IUserSettingsContext" + }, + "src": "uui-core/src/types/contexts.ts", + "comment": { + "raw": [ + "Save data to the localStorage" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "IUserSettingsContext", + "print": [ + "/** Save data to the localStorage */", + "interface IUserSettingsContext {", + " /** Gets value by key from localStorage */", + " get(key: any, initial?: TValue): TValue;", + " /** Sets value by key from localStorage */", + " set(key: any, value: TValue): void;", + "}" + ] + }, + "props": [ { - "uid": "unsubscribe", - "name": "unsubscribe", + "uid": "get", + "name": "get", "comment": { "raw": [ - "Unsubscribe from context updates" + "Gets value by key from localStorage" ] }, "typeValue": { - "raw": "(handler: (state: {}) => void) => void" + "raw": "(key: any, initial?: TValue | undefined) => TValue" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IBaseContext", "required": true }, { - "uid": "destroyContext", - "name": "destroyContext", + "uid": "set", + "name": "set", "comment": { "raw": [ - "Manually destroy context and unsubscribe from all listeners" + "Sets value by key from localStorage" ] }, "typeValue": { - "raw": "() => void" + "raw": "(key: any, value: TValue) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IBaseContext", "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:IPickerToggler": { + "@epam/uui-core:LabeledInputCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IPickerToggler", - "nameFull": "IPickerToggler" - }, - "src": "uui-core/src/types/pickers.ts", - "comment": { - "raw": [ - "Component can be used as Toggler control for pickers.", - " Only IDropdownToggler implementation is necessary for the picker to function.", - " Other props can be implemented for full-featured picker togglers." - ] + "name": "LabeledInputCoreProps", + "nameFull": "LabeledInputCoreProps" }, + "src": "uui-core/src/types/components/LabeledInput.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IPickerToggler", + "raw": "LabeledInputCoreProps", "print": [ - "/**", - " * Component can be used as Toggler control for pickers.", - " * Only IDropdownToggler implementation is necessary for the picker to function.", - " * Other props can be implemented for full-featured picker togglers.", - " */", - "interface IPickerToggler extends IBasicPickerToggler, Partial>, Partial, Partial, Partial {", - " /** Array of selected rows */", - " selection?: DataRowProps[];", - " /** Amount of selected items */", - " selectedRowsCount?: number;", + "interface LabeledInputCoreProps extends ICanBeInvalid, IHasCX, IHasLabel, IHasChildren, ICanBeRequired, IHasValidationMessage, IHasRawProps>, IHasForwardedRef {", + " /** Position of the label, relative to the wrapped component (top of left) */", + " labelPosition?: 'top' | 'left';", + " /** Info hint text to show in tooltip */", + " info?: ReactNode;", + " /** Marks related field as optional */", + " isOptional?: boolean;", + " /** 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", + " */", + " htmlFor?: string;", + " /** A value from LabeledInput children */", + " value?: any;", + " /** Maximum text length, in characters */", + " maxLength?: number;", + " /** Showing current text length, in characters and maxLength */", + " charCounter?: boolean;", + " /** Additional info positioned at the bottom of LabeledInput */", + " footnote?: ReactNode;", + " /** Additional info positioned to the right side of label */", + " sidenote?: ReactNode;", "}" ] }, "props": [ { - "uid": "selection", - "name": "selection", + "uid": "labelPosition", + "name": "labelPosition", "comment": { "raw": [ - "Array of selected rows" + "Position of the label, relative to the wrapped component (top of left)" ] }, "typeValue": { - "raw": "DataRowProps[]" + "raw": "'left' | 'top'" + }, + "editor": { + "type": "oneOf", + "options": [ + "left", + "top" + ] }, "required": false }, { - "uid": "selectedRowsCount", - "name": "selectedRowsCount", + "uid": "info", + "name": "info", "comment": { "raw": [ - "Amount of selected items" + "Info hint text to show in tooltip" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "onClear", - "name": "onClear", + "uid": "isOptional", + "name": "isOptional", "comment": { "raw": [ - "Call to clear toggler value" + "Marks related field as optional" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IBasicPickerToggler", "required": false }, { - "uid": "toggleDropdownOpening", - "name": "toggleDropdownOpening", + "uid": "htmlFor", + "name": "htmlFor", "comment": { "raw": [ - "Called when associated dropdown should open or close" + "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": { - "raw": "(value: boolean) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "isInteractedOutside", - "name": "isInteractedOutside", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Called when component is interacted outside, to close the dropdown" + "A value from LabeledInput children" ] }, "typeValue": { - "raw": "(event: Event) => boolean" - }, - "editor": { - "type": "func" + "raw": "any" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "maxLength", + "name": "maxLength", "comment": { "raw": [ - "Toggler component ref" + "Maximum text length, in characters" ] }, "typeValue": { - "raw": "null | (instance: any) => void | React.RefObject" + "raw": "number" + }, + "editor": { + "type": "number" }, - "from": "@epam/uui-core:IDropdownTogglerProps", "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "charCounter", + "name": "charCounter", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "Showing current text length, in characters and maxLength" ] }, "typeValue": { @@ -18841,41 +21760,34 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDropdownToggler", "required": false }, { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "footnote", + "name": "footnote", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "Additional info positioned at the bottom of LabeledInput" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IDropdownToggler", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "sidenote", + "name": "sidenote", "comment": { "raw": [ - "Called when component is clicked" + "Additional info positioned to the right side of label" ] }, "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IClickable", + "typeValueRef": "@types/react:ReactNode", "required": false }, { @@ -18896,37 +21808,48 @@ "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "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:IDisableable", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "label", + "name": "label", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Component label. Can be a string, or React.Element. Certain components supports minimal markup (,,) in labels." ] }, "typeValue": { - "raw": "boolean" + "raw": "React.ReactNode" }, - "editor": { - "type": "bool" + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasLabel", + "required": false + }, + { + "uid": "children", + "name": "children", + "comment": { + "raw": [ + "Component children" + ] }, - "from": "@epam/uui-core:ICanBeReadonly", + "typeValue": { + "raw": "React.ReactNode" + }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { @@ -18947,606 +21870,597 @@ "required": false }, { - "uid": "value", - "name": "value", + "uid": "validationMessage", + "name": "validationMessage", "comment": { "raw": [ - "The current value of component" + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IControlled", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "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: string) => void" - }, - "editor": { - "type": "func" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "Placeholder to display when empty" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "any" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:IHasPlaceholder", + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IPresetsApi": { + "@epam/uui-core:LayoutLayer": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IPresetsApi", - "nameFull": "IPresetsApi" + "name": "LayoutLayer", + "nameFull": "LayoutLayer" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/services/LayoutContext.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IPresetsApi", + "raw": "LayoutLayer", "print": [ - "interface IPresetsApi {", - " /** ID of selected preset */", - " activePresetId: number | null;", - " /** Function that selects given preset */", - " choosePreset(preset: ITablePreset): void;", - " /** Function that gives preset name and create new preset with this name and current table state */", - " createNewPreset(name: string): Promise;", - " /** Function that gives preset and return if this preset changed or not */", - " hasPresetChanged(preset: ITablePreset): boolean;", - " /** Function that gives the preset and creat their duplicate */", - " duplicatePreset(preset: ITablePreset): void;", - " /** Function that deletes given preset */", - " deletePreset(preset: ITablePreset): Promise;", - " /** Function that updates given preset */", - " updatePreset(preset: ITablePreset): Promise;", - " /** Function that gives preset and return URL link on given preset */", - " getPresetLink(preset: ITablePreset): string;", - " /** Array of presets */", - " presets: ITablePreset[];", + "interface LayoutLayer {", + " /** ID of the layer */", + " id: number;", + " /** Level of the layer depth */", + " depth: number;", + " /** zIndex of the layer */", + " zIndex: number;", "}" ] }, "props": [ { - "uid": "activePresetId", - "name": "activePresetId", + "uid": "id", + "name": "id", "comment": { "raw": [ - "ID of selected preset" + "ID of the layer" ] }, "typeValue": { - "raw": "null | number" + "raw": "number" }, "editor": { "type": "number" }, - "required": false + "required": true }, { - "uid": "choosePreset", - "name": "choosePreset", + "uid": "depth", + "name": "depth", "comment": { "raw": [ - "Function that selects given preset" + "Level of the layer depth" ] }, "typeValue": { - "raw": "(preset: ITablePreset) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": true }, { - "uid": "createNewPreset", - "name": "createNewPreset", + "uid": "zIndex", + "name": "zIndex", "comment": { "raw": [ - "Function that gives preset name and create new preset with this name and current table state" + "zIndex of the layer" ] }, "typeValue": { - "raw": "(name: string) => Promise" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": true - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:LazyDataSourceApi": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LazyDataSourceApi", + "nameFull": "LazyDataSourceApi" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Defines API to retrieve data for DataSources" + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "LazyDataSourceApi", + "print": [ + "/** Defines API to retrieve data for DataSources */", + "type LazyDataSourceApi = (", + "/** Defines input arguments for Lazy Data Source APIs */", + "request: LazyDataSourceApiRequest, ", + "/** Defines the context of API request. */", + "context?: LazyDataSourceApiRequestContext) => Promise>;" + ] + } + } + }, + "@epam/uui-core:LazyDataSourceApiRequest": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LazyDataSourceApiRequest", + "nameFull": "LazyDataSourceApiRequest" + }, + "src": "uui-core/src/types/dataSources.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "LazyDataSourceApiRequest", + "print": [ + "/** Defines input arguments for Lazy Data Source APIs */", + "// eslint-disable-next-line @typescript-eslint/no-unused-vars", + "interface LazyDataSourceApiRequest {", + " /**", + " * The filter object, by which data should be filtered.", + " * It is a merged result of filters from DataSourceState and LazyDataSourceProps.", + " */", + " filter?: TFilter;", + " /** Sorting options, by which data should be sorted. */", + " sorting?: SortingOption[];", + " /** The search string, by which data should be searched. */", + " search?: string;", + " /** Specifies a range of the rows to be retrieved. */", + " range?: LazyDataSourceApiRequestRange;", + " /** Page number for which data should be retrieved. */", + " page?: number;", + " /** Number of items at the page. */", + " pageSize?: number;", + " /**", + " * An array of item IDs to be retrieved from the API.", + " * Other request options like filter, search and others should be ignored when IDs are provided.", + " * Used for requesting specific items separately from the list.", + " */", + " ids?: TId[];", + "}" + ] + }, + "props": [ { - "uid": "hasPresetChanged", - "name": "hasPresetChanged", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "Function that gives preset and return if this preset changed or not" + "The filter object, by which data should be filtered.", + " It is a merged result of filters from DataSourceState and LazyDataSourceProps." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => boolean" + "raw": "TFilter" }, - "editor": { - "type": "func" + "required": false + }, + { + "uid": "sorting", + "name": "sorting", + "comment": { + "raw": [ + "Sorting options, by which data should be sorted." + ] }, - "required": true + "typeValue": { + "raw": "SortingOption[]" + }, + "required": false }, { - "uid": "duplicatePreset", - "name": "duplicatePreset", + "uid": "search", + "name": "search", "comment": { "raw": [ - "Function that gives the preset and creat their duplicate" + "The search string, by which data should be searched." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => void" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "required": false }, { - "uid": "deletePreset", - "name": "deletePreset", + "uid": "range", + "name": "range", "comment": { "raw": [ - "Function that deletes given preset" + "Specifies a range of the rows to be retrieved." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" - }, - "editor": { - "type": "func" + "raw": "LazyDataSourceApiRequestRange" }, - "required": true + "required": false }, { - "uid": "updatePreset", - "name": "updatePreset", + "uid": "page", + "name": "page", "comment": { "raw": [ - "Function that updates given preset" + "Page number for which data should be retrieved." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "getPresetLink", - "name": "getPresetLink", + "uid": "pageSize", + "name": "pageSize", "comment": { "raw": [ - "Function that gives preset and return URL link on given preset" + "Number of items at the page." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => string" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "presets", - "name": "presets", + "uid": "ids", + "name": "ids", "comment": { "raw": [ - "Array of presets" + "An array of item IDs to be retrieved from the API.", + " Other request options like filter, search and others should be ignored when IDs are provided.", + " Used for requesting specific items separately from the list." ] }, "typeValue": { - "raw": "ITablePreset[]" + "raw": "TId[]" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IProcessRequest": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "IProcessRequest", - "nameFull": "IProcessRequest" - }, - "src": "uui-core/src/services/ApiContext.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "IProcessRequest", - "print": [ - "type IProcessRequest = (url: string, method: string, data?: any, options?: ApiCallOptions) => Promise;" - ] - } - } - }, - "@epam/uui-core:IRouter6": { + "@epam/uui-core:LazyDataSourceApiRequestContext": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IRouter6", - "nameFull": "IRouter6" + "name": "LazyDataSourceApiRequestContext", + "nameFull": "LazyDataSourceApiRequestContext" }, - "src": "uui-core/src/services/routing/interfaces/IRouter6.ts", + "src": "uui-core/src/types/dataSources.ts", "comment": { "raw": [ - "From: react-router version 6.14.0", - "", - " The type definition of the IRouter6 is not complete (It's OK as long as we only use a subset of its API)", - "", - " NOTE: Complete definitions of the router is located in @remix-run/router:", - " https://github.com/remix-run/react-router/blob/main/packages/router/router.ts#L57" + "Defines the context of API request. E.g. parent if we require to retrieve sub-list of the tree" ] }, "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "IRouter6", + "raw": "LazyDataSourceApiRequestContext", "print": [ - "/**", - " * From: react-router version 6.14.0", - " *", - " * The type definition of the IRouter6 is not complete (It's OK as long as we only use a subset of its API)", - " *", - " * NOTE: Complete definitions of the router is located in @remix-run/router:", - " * https://github.com/remix-run/react-router/blob/main/packages/router/router.ts#L57", - " */", - "type IRouter6 = {", - " state: RouterState;", - " navigate(to: To | null, opts?: RouterNavigateOptions): Promise;", - " navigate(to: number): Promise;", - " getBlocker: (key: string, fn: BlockerFunction) => unknown;", - " subscribe: (fn: (state: RouterState) => void) => () => void;", - " deleteBlocker: (key: string) => void;", - " createHref(location: Location | URL): string;", - "};" + "/** Defines the context of API request. E.g. parent if we require to retrieve sub-list of the tree */", + "interface LazyDataSourceApiRequestContext {", + " /**", + " * The ID of the parent item whose children are being requested.", + " * Used for lazy-loading data in tree lists.", + " */", + " parentId?: TId | null;", + " /** The parent entity whose children are being requested */", + " parent?: TItem | null;", + "}" ] }, "props": [ { - "uid": "state", - "name": "state", - "typeValue": { - "raw": "RouterState" - }, - "typeValueRef": "@epam/uui-core:RouterState", - "required": true - }, - { - "uid": "navigate", - "name": "navigate", - "typeValue": { - "raw": "{ (to: To | null, opts?: RouterNavigateOptions | undefined): Promise; (to: number): Promise; }" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getBlocker", - "name": "getBlocker", - "typeValue": { - "raw": "(key: string, fn: BlockerFunction) => unknown" - }, - "editor": { - "type": "func" + "uid": "parentId", + "name": "parentId", + "comment": { + "raw": [ + "The ID of the parent item whose children are being requested.", + " Used for lazy-loading data in tree lists." + ] }, - "required": true - }, - { - "uid": "subscribe", - "name": "subscribe", "typeValue": { - "raw": "(fn: (state: RouterState) => void) => () => void" - }, - "editor": { - "type": "func" + "raw": "null | TId" }, - "required": true + "required": false }, { - "uid": "deleteBlocker", - "name": "deleteBlocker", - "typeValue": { - "raw": "(key: string) => void" - }, - "editor": { - "type": "func" + "uid": "parent", + "name": "parent", + "comment": { + "raw": [ + "The parent entity whose children are being requested" + ] }, - "required": true - }, - { - "uid": "createHref", - "name": "createHref", "typeValue": { - "raw": "(location: Location | URL) => string" - }, - "editor": { - "type": "func" + "raw": "null | TItem" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IRouterContext": { + "@epam/uui-core:LazyDataSourceApiRequestRange": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IRouterContext", - "nameFull": "IRouterContext" + "name": "LazyDataSourceApiRequestRange", + "nameFull": "LazyDataSourceApiRequestRange" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "The range (from/count) of required rows for LazyDataSourceApiRequest" + ] }, - "src": "uui-core/src/types/contexts.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "IRouterContext", + "raw": "LazyDataSourceApiRequestRange", "print": [ - "interface IRouterContext {", - " /** Returns current location link */", - " getCurrentLink(): Link;", - " /** Makes a SPA redirect to the provided link */", - " redirect(link?: Link | string): void;", - " /** Makes a SPA redirect to the provided link. Replaces the current entry in the history stack with a new one */", - " transfer(link: Link): void;", - " /** Returns true, if provided link match current location */", - " isActive(link: Link): boolean;", - " /** Creates href string based on provided link */", - " createHref(link: Link): string;", - " /** Subscribes to the router updates */", - " listen(listener: (link: Link) => void): () => void;", - " /**", - " * Blocks router changes. Can be used to show confirmation dialogs before the redirect.", - " * If block callback provide, all router changes will be blocked, you need to unblock and to retry them by yourself.", - " * */", - " block(callback: (link: Link) => void): () => void;", + "// Lazy Data Source API", + "/** The range (from/count) of required rows for LazyDataSourceApiRequest */", + "interface LazyDataSourceApiRequestRange {", + " /** Element index to fetch from. */", + " from: number;", + " /** Count of elements to be retrieved. */", + " count?: number;", "}" ] }, "props": [ { - "uid": "getCurrentLink", - "name": "getCurrentLink", - "comment": { - "raw": [ - "Returns current location link" - ] - }, - "typeValue": { - "raw": "() => Link" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "redirect", - "name": "redirect", + "uid": "from", + "name": "from", "comment": { "raw": [ - "Makes a SPA redirect to the provided link" + "Element index to fetch from." ] }, "typeValue": { - "raw": "(link?: string | Link | undefined) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, "required": true }, { - "uid": "transfer", - "name": "transfer", + "uid": "count", + "name": "count", "comment": { "raw": [ - "Makes a SPA redirect to the provided link. Replaces the current entry in the history stack with a new one" + "Count of elements to be retrieved." ] }, "typeValue": { - "raw": "(link: Link) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true - }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:LazyDataSourceApiResponse": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "LazyDataSourceApiResponse", + "nameFull": "LazyDataSourceApiResponse" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Defines Lazy Data Source APIs response shape" + ] + }, + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "LazyDataSourceApiResponse", + "print": [ + "/** Defines Lazy Data Source APIs response shape */", + "interface LazyDataSourceApiResponse {", + " /** List of items which was requested via API */", + " items: TItem[];", + " /**", + " * API can set 'from' field if it wants to return more items than what was requested in request.range.", + " * This can be used to return all items at once (with from:0, count: totalCount), or align response to pages.", + " */", + " from?: number;", + " /**", + " * Total count of items which match current filter and pagination.", + " * If not specified, total count will be detected only when user scrolls to the end of the list.", + " */", + " count?: number;", + " /**", + " * Total count of items which match current filter.", + " */", + " totalCount?: number;", + "}" + ] + }, + "props": [ { - "uid": "isActive", - "name": "isActive", + "uid": "items", + "name": "items", "comment": { "raw": [ - "Returns true, if provided link match current location" + "List of items which was requested via API" ] }, "typeValue": { - "raw": "(link: Link) => boolean" - }, - "editor": { - "type": "func" + "raw": "TItem[]" }, "required": true }, { - "uid": "createHref", - "name": "createHref", + "uid": "from", + "name": "from", "comment": { "raw": [ - "Creates href string based on provided link" + "API can set 'from' field if it wants to return more items than what was requested in request.range.", + " This can be used to return all items at once (with from:0, count: totalCount), or align response to pages." ] }, "typeValue": { - "raw": "(link: Link) => string" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "listen", - "name": "listen", + "uid": "count", + "name": "count", "comment": { "raw": [ - "Subscribes to the router updates" + "Total count of items which match current filter and pagination.", + " If not specified, total count will be detected only when user scrolls to the end of the list." ] }, "typeValue": { - "raw": "(listener: (link: Link) => void) => () => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false }, { - "uid": "block", - "name": "block", + "uid": "totalCount", + "name": "totalCount", "comment": { "raw": [ - "Blocks router changes. Can be used to show confirmation dialogs before the redirect.", - " If block callback provide, all router changes will be blocked, you need to unblock and to retry them by yourself." + "Total count of items which match current filter." ] }, "typeValue": { - "raw": "(callback: (link: Link) => void) => () => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "required": true + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:ITablePreset": { + "@epam/uui-core:LazyDataSourceProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ITablePreset", - "nameFull": "ITablePreset" + "name": "LazyDataSourceProps", + "nameFull": "LazyDataSourceProps" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/data/processing/LazyDataSource.tsx", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ITablePreset", + "raw": "LazyDataSourceProps", "print": [ - "interface ITablePreset {", - " /** Name of the filter */", - " name: string;", - " /** Unique Id of the filter */", - " id: number | null;", - " /** If true, this preset can't be deleted or modified */", - " isReadonly?: boolean;", - " /**", - " * Determines the order in which this preset should appear in the presets list.", - " * The columns are sorted in ascending alphabetical order.", - " */", - " order?: string;", - " /** Filter value stored in the preset */", - " filter?: TFilter;", - " /** Columns config value stored in the preset */", - " columnsConfig?: ColumnsConfig;", - " /** Filters config value stored in the preset */", - " filtersConfig?: FiltersConfig;", - " /** Sorting value stored in the preset */", - " sorting?: SortingOption[];", - " /** View state value stored in the preset */", - " viewState?: TViewState;", + "interface LazyDataSourceProps extends LazyListViewProps {", "}" ] }, "props": [ { - "uid": "name", - "name": "name", - "comment": { - "raw": [ - "Name of the filter" - ] - }, - "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" - }, - "required": true - }, - { - "uid": "id", - "name": "id", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Unique Id of the filter" + "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": "null | number" + "raw": "(item: TItem) => TId" }, "editor": { - "type": "number" + "type": "func" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "If true, this preset can't be deleted or modified" + "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": { @@ -19555,729 +22469,919 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "order", - "name": "order", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Determines the order in which this preset should appear in the presets list.", - " The columns are sorted in ascending alphabetical order." + "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": "string" + "raw": "(item: TItem) => TId | undefined" }, "editor": { - "type": "string" + "type": "func" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "Filter value stored in the preset" + "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": "TFilter" + "raw": "DataRowOptions" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "columnsConfig", - "name": "columnsConfig", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Columns config value stored in the preset" + "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": "ColumnsConfig" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "filtersConfig", - "name": "filtersConfig", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Filters config value stored in the preset" + "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": "FiltersConfig" + "raw": "(item: TItem, state: DataSourceState) => boolean" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "sorting", - "name": "sorting", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Sorting value stored in the preset" + "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": "SortingOption[]" + "raw": "boolean | 'implicit' | 'explicit'" }, - "required": false - }, - { - "uid": "viewState", - "name": "viewState", - "comment": { - "raw": [ - "View state value stored in the preset" + "editor": { + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" ] }, - "typeValue": { - "raw": "TViewState" - }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ITableState": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ITableState", - "nameFull": "ITableState" - }, - "src": "uui-core/src/types/tables.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ITableState", - "print": [ - "interface ITableState, TViewState = any> extends IPresetsApi {", - " /** Table state value */", - " tableState: DataTableState;", - " /** Function that updates table state value */", - " setTableState(newState: DataTableState): void;", - " /** Function that updates filter value */", - " setFilter(filter: TFilter): void;", - " /** Function that updates columns config value */", - " setColumnsConfig(columnsConfig: ColumnsConfig): void;", - " /** Function that updates filters config value */", - " setFiltersConfig(filtersConfig: FiltersConfig): void;", - "}" - ] - }, - "props": [ + }, { - "uid": "tableState", - "name": "tableState", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "Table state value" - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "DataTableState" + "raw": "boolean" }, - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "setTableState", - "name": "setTableState", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Function that updates table state value" + "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": "(newState: DataTableState) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "setFilter", - "name": "setFilter", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Function that updates filter value" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "(filter: TFilter) => void" + "raw": "(item: TItem) => boolean" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "setColumnsConfig", - "name": "setColumnsConfig", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Function that updates columns config value" + "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": "(columnsConfig: ColumnsConfig) => void" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "setFiltersConfig", - "name": "setFiltersConfig", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Function that updates filters config value" + "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": "(filtersConfig: FiltersConfig) => void" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "activePresetId", - "name": "activePresetId", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "ID of selected preset" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "null | number" - }, - "editor": { - "type": "number" + "raw": "IMap | IImmutableMap" }, - "from": "@epam/uui-core:IPresetsApi", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "choosePreset", - "name": "choosePreset", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "Function that selects given preset" - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "(preset: ITablePreset) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "createNewPreset", - "name": "createNewPreset", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Function that gives preset name and create new preset with this name and current table state" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "(name: string) => Promise" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:SortConfig", + "required": false }, { - "uid": "hasPresetChanged", - "name": "hasPresetChanged", + "uid": "api", + "name": "api", "comment": { "raw": [ - "Function that gives preset and return if this preset changed or not" + "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": "(preset: ITablePreset) => boolean" + "raw": "LazyDataSourceApi" }, + "typeValueRef": "@epam/uui-core:LazyDataSourceApi", "editor": { "type": "func" }, - "from": "@epam/uui-core:IPresetsApi", + "from": "@epam/uui-core:LazyDataSourceConfig", "required": true }, { - "uid": "duplicatePreset", - "name": "duplicatePreset", + "uid": "getChildCount", + "name": "getChildCount", "comment": { "raw": [ - "Function that gives the preset and creat their duplicate" + "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": "(preset: ITablePreset) => void" + "raw": "(item: TItem) => number" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "deletePreset", - "name": "deletePreset", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "Function that deletes given preset" + "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": "(preset: ITablePreset) => Promise" - }, - "editor": { - "type": "func" + "raw": "TFilter" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "updatePreset", - "name": "updatePreset", + "uid": "fetchStrategy", + "name": "fetchStrategy", "comment": { "raw": [ - "Function that updates given preset" + "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": "(preset: ITablePreset) => Promise" + "raw": "'sequential' | 'parallel'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "sequential", + "parallel" + ] }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "getPresetLink", - "name": "getPresetLink", + "uid": "backgroundReload", + "name": "backgroundReload", "comment": { "raw": [ - "Function that gives preset and return URL link on given preset" + "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": "(preset: ITablePreset) => string" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "presets", - "name": "presets", + "uid": "flattenSearchResults", + "name": "flattenSearchResults", "comment": { "raw": [ - "Array of presets" + "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": "ITablePreset[]" + "raw": "boolean" }, - "from": "@epam/uui-core:IPresetsApi", - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:ItemsComparator": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ItemsComparator", - "nameFull": "ItemsComparator" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "ItemsComparator", - "print": [ - "type ItemsComparator = (newItem: TItem, existingItem: TItem) => number;" - ] - } - } - }, - "@epam/uui-core:ITree": { + "@epam/uui-core:LazyListViewProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ITree", - "nameFull": "ITree" + "name": "LazyListViewProps", + "nameFull": "LazyListViewProps" }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", + "src": "uui-core/src/data/processing/views/types.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ITree", + "raw": "LazyListViewProps", "print": [ - "interface ITree {", - " clearStructure(): ITree;", - " getRootIds(): TId[];", - " getRootItems(): TItem[];", - " getById(id: TId): TItem | typeof NOT_FOUND_RECORD;", - " getChildren(item: TItem): TItem[];", - " getChildrenByParentId(parentId: TId): TItem[];", - " getChildrenIdsByParentId(parentId: TId): TId[];", - " getParentIdsRecursive(id: TId): TId[];", - " getParents(id: TId): TItem[];", - " getPathById(id: TId): DataRowPathItem[];", - " getPathItem(item: TItem): DataRowPathItem;", - " getNodeInfo(id: TId): ITreeNodeInfo;", - " isFlatList(): boolean;", - " patch(items: TItem[], isDeleted?: () => boolean, comparator?: ItemsComparator): ITree;", - " mergeItems(tree: ITree): ITree;", - " cascadeSelection(currentSelection: TId[], selectedId: TId | undefined, isSelected: boolean, options?: {", - " isSelectable?: (id: TId, item: TItem | typeof NOT_FOUND_RECORD) => boolean;", - " cascade?: CascadeSelection;", - " }): TId[];", - " load(options: LoadTreeOptions, value: Readonly, withNestedChildren?: boolean): Promise>;", - " loadMissing(options: LoadTreeOptions, value: Readonly): Promise>;", - " loadMissingIdsAndParents(options: LoadTreeOptions, idsToLoad: TId[]): Promise>;", - " getTotalCount(): number;", - " forEach(action: (item: TItem, id: TId, parentId: TId, stop: () => void) => void, options?: {", - " direction?: 'bottom-up' | 'top-down';", - " parentId?: TId;", - " includeParent?: boolean;", - " }): void;", - " forEachItem(action: (item: TItem, id: TId, parentId: TId) => void): void;", - " computeSubtotals(get: (item: TItem, hasChildren: boolean) => TSubtotals, add: (a: TSubtotals, b: TSubtotals) => TSubtotals): CompositeKeysMap | Map;", - " filter(options: ApplyFilterOptions): ITree;", - " search(options: ApplySearchOptions): ITree;", - " sort(options: ApplySortOptions): ITree;", + "interface LazyListViewProps extends BaseListViewProps, LazyDataSourceConfig {", "}" ] }, "props": [ { - "uid": "clearStructure", - "name": "clearStructure", - "typeValue": { - "raw": "() => ITree" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getRootIds", - "name": "getRootIds", - "typeValue": { - "raw": "() => TId[]" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getRootItems", - "name": "getRootItems", - "typeValue": { - "raw": "() => TItem[]" - }, - "editor": { - "type": "func" - }, - "required": true - }, - { - "uid": "getById", - "name": "getById", - "typeValue": { - "raw": "(id: TId) => TItem | typeof NOT_FOUND_RECORD" - }, - "editor": { - "type": "func" + "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." + ] }, - "required": true - }, - { - "uid": "getChildren", - "name": "getChildren", "typeValue": { - "raw": "(item: TItem) => TItem[]" + "raw": "(item: TItem) => TId" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getChildrenByParentId", - "name": "getChildrenByParentId", - "typeValue": { - "raw": "(parentId: TId) => TItem[]" - }, - "editor": { - "type": "func" + "uid": "complexIds", + "name": "complexIds", + "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." + ] }, - "required": true - }, - { - "uid": "getChildrenIdsByParentId", - "name": "getChildrenIdsByParentId", "typeValue": { - "raw": "(parentId: TId) => TId[]" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getParentIdsRecursive", - "name": "getParentIdsRecursive", + "uid": "getParentId", + "name": "getParentId", + "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." + ] + }, "typeValue": { - "raw": "(id: TId) => TId[]" + "raw": "(item: TItem) => TId | undefined" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getParents", - "name": "getParents", - "typeValue": { - "raw": "(id: TId) => TItem[]" + "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" + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "DataRowOptions" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getPathById", - "name": "getPathById", + "uid": "getRowOptions", + "name": "getRowOptions", + "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." + ] + }, "typeValue": { - "raw": "(id: TId) => DataRowPathItem[]" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getPathItem", - "name": "getPathItem", + "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) => DataRowPathItem" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "getNodeInfo", - "name": "getNodeInfo", + "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": "(id: TId) => ITreeNodeInfo" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "isFlatList", - "name": "isFlatList", + "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" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "patch", - "name": "patch", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", + "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`." + ] + }, "typeValue": { - "raw": "(items: TItem[], isDeleted?: () => boolean, comparator?: ItemsComparator | undefined) => ITree" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "mergeItems", - "name": "mergeItems", + "uid": "isDeleted", + "name": "isDeleted", + "comment": { + "raw": [ + "To enable deleting of the items, it is required to specify getter for deleted state." + ] + }, "typeValue": { - "raw": "(tree: ITree) => ITree" + "raw": "(item: TItem) => boolean" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "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": "(currentSelection: TId[], selectedId: TId | undefined, isSelected: boolean, options?: { isSelectable?: ((id: TId, item: TItem | typeof NOT_FOUND_RECORD) => boolean) | undefined; cascade?: CascadeSelection | undefined; } | undefined) => TId[]" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "load", - "name": "load", + "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": "(options: LoadTreeOptions, value: Readonly, any>>, withNestedChildren?: boolean | undefined) => Promise>" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "loadMissing", - "name": "loadMissing", - "typeValue": { - "raw": "(options: LoadTreeOptions, value: Readonly, any>>) => Promise>" + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "IMap | IImmutableMap" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "loadMissingIdsAndParents", - "name": "loadMissingIdsAndParents", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", + "comment": { + "raw": [ + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } + }, "typeValue": { - "raw": "(options: LoadTreeOptions, idsToLoad: TId[]) => Promise>" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "getTotalCount", - "name": "getTotalCount", + "uid": "sortBy", + "name": "sortBy", + "comment": { + "raw": [ + "A pure function that gets sorting value for current sorting value" + ] + }, "typeValue": { - "raw": "() => number" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:SortConfig", + "required": false }, { - "uid": "forEach", - "name": "forEach", + "uid": "api", + "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": "(action: (item: TItem, id: TId, parentId: TId, stop: () => void) => void, options?: { direction?: 'bottom-up' | 'top-down' | undefined; parentId?: TId | undefined; includeParent?: boolean | undefined; } | undefined) => void" + "raw": "LazyDataSourceApi" }, + "typeValueRef": "@epam/uui-core:LazyDataSourceApi", "editor": { "type": "func" }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": true }, { - "uid": "forEachItem", - "name": "forEachItem", + "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": "(action: (item: TItem, id: TId, parentId: TId) => void) => void" + "raw": "(item: TItem) => number" }, "editor": { "type": "func" }, - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "computeSubtotals", - "name": "computeSubtotals", - "typeValue": { - "raw": "(get: (item: TItem, hasChildren: boolean) => TSubtotals, add: (a: TSubtotals, b: TSubtotals) => TSubtotals) => CompositeKeysMap | Map" + "uid": "filter", + "name": "filter", + "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." + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "TFilter" }, - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "fetchStrategy", + "name": "fetchStrategy", + "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." + ] + }, "typeValue": { - "raw": "(options: ApplyFilterOptions) => ITree" + "raw": "'sequential' | 'parallel'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "sequential", + "parallel" + ] }, - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "search", - "name": "search", + "uid": "backgroundReload", + "name": "backgroundReload", + "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`." + ] + }, "typeValue": { - "raw": "(options: ApplySearchOptions) => ITree" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false }, { - "uid": "sort", - "name": "sort", + "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": "(options: ApplySortOptions) => ITree" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:IUserSettingsContext": { + "@epam/uui-core:LazyLoadedMapLoadCallback": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "IUserSettingsContext", - "nameFull": "IUserSettingsContext" + "name": "LazyLoadedMapLoadCallback", + "nameFull": "LazyLoadedMapLoadCallback" }, - "src": "uui-core/src/types/contexts.ts", + "src": "uui-core/src/helpers/LazyLoadedMap.ts", "comment": { "raw": [ - "Save data to the localStorage" + "An callback to pass to LazyLoadedMap constructor" + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "LazyLoadedMapLoadCallback", + "print": [ + "/**", + " * An callback to pass to LazyLoadedMap constructor", + " */", + "type LazyLoadedMapLoadCallback = (pending: TKey[]) => Promise<[", + " TKey,", + " TValue", + "][]>;" + ] + } + } + }, + "@epam/uui-core:Link": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "Link", + "nameFull": "Link" + }, + "src": "uui-core/src/types/objects.ts", + "comment": { + "raw": [ + "Defines location within SPA application" ] }, "exported": true @@ -20285,171 +23389,243 @@ "details": { "kind": 264, "typeValue": { - "raw": "IUserSettingsContext", + "raw": "Link", "print": [ - "/** Save data to the localStorage */", - "interface IUserSettingsContext {", - " /** Gets value by key from localStorage */", - " get(key: any, initial?: TValue): TValue;", - " /** Sets value by key from localStorage */", - " set(key: any, value: TValue): void;", + "/** Defines location within SPA application */", + "interface Link {", + " /** A URL pathname, beginning with a '/' */", + " pathname: string;", + " /** Object that will be parsed to the URL search params */", + " query?: any;", + " /** A URL search string, beginning with a '?' */", + " search?: string;", + " /** A unique string associated with this location. May be used to safely store", + " * and retrieve data in some other storage API, like `localStorage`.", + " *", + " * Note: This value is always \"default\" on the initial location.", + " */", + " key?: string;", + " /** A URL fragment identifier, beginning with a '#' */", + " hash?: string;", + " /** A value of arbitrary data associated with this location */", + " state?: any;", "}" ] }, "props": [ { - "uid": "get", - "name": "get", + "uid": "pathname", + "name": "pathname", "comment": { "raw": [ - "Gets value by key from localStorage" + "A URL pathname, beginning with a '/'" ] }, "typeValue": { - "raw": "(key: any, initial?: TValue | undefined) => TValue" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, "required": true }, { - "uid": "set", - "name": "set", + "uid": "query", + "name": "query", "comment": { "raw": [ - "Sets value by key from localStorage" + "Object that will be parsed to the URL search params" ] }, "typeValue": { - "raw": "(key: any, value: TValue) => void" + "raw": "any" + }, + "required": false + }, + { + "uid": "search", + "name": "search", + "comment": { + "raw": [ + "A URL search string, beginning with a '?'" + ] + }, + "typeValue": { + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "required": true + "required": false + }, + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "A unique string associated with this location. May be used to safely store", + " and retrieve data in some other storage API, like `localStorage`.", + "", + " Note: This value is always \"default\" on the initial location." + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "hash", + "name": "hash", + "comment": { + "raw": [ + "A URL fragment identifier, beginning with a '#'" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "state", + "name": "state", + "comment": { + "raw": [ + "A value of arbitrary data associated with this location" + ] + }, + "typeValue": { + "raw": "any" + }, + "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:LabeledInputCoreProps": { + "@epam/uui-core:LoadingStatus": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "LabeledInputCoreProps", - "nameFull": "LabeledInputCoreProps" + "name": "LoadingStatus", + "nameFull": "LoadingStatus" }, - "src": "uui-core/src/types/components/LabeledInput.tsx", + "src": "uui-core/src/helpers/LazyLoadedMap.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "typeof UNKNOWN | typeof LOADING | typeof PENDING | typeof LOADED | typeof FAILED", + "print": [ + "type LoadingStatus = typeof UNKNOWN | typeof LOADING | typeof PENDING | typeof LOADED | typeof FAILED;" + ] + } + } + }, + "@epam/uui-core:Metadata": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "Metadata", + "nameFull": "Metadata" + }, + "src": "uui-core/src/types/validation.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "LabeledInputCoreProps", + "raw": "Metadata", "print": [ - "interface LabeledInputCoreProps extends ICanBeInvalid, IHasCX, IHasLabel, IHasChildren, ICanBeRequired, IHasValidationMessage, IHasRawProps>, IHasForwardedRef {", - " /** Position of the label, relative to the wrapped component (top of left) */", - " labelPosition?: 'top' | 'left';", - " /** Info hint text to show in tooltip */", - " info?: ReactNode;", - " /** Marks related field as optional */", - " isOptional?: boolean;", - " /** 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", + "interface Metadata extends IDisableable, ICanBeReadonly, ICanBeRequired {", + " /** Metadata for the nested fields */", + " props?: {", + " [P in keyof T]?: Metadata;", + " };", + " /**", + " * Metadata for all fields of current level of object.", + " * Usually used for consistent validation of arrays.", " */", - " htmlFor?: string;", - " /** A value from LabeledInput children */", - " value?: any;", - " /** Maximum text length, in characters */", - " maxLength?: number;", - " /** Showing current text length, in characters and maxLength */", - " charCounter?: boolean;", - " /** Additional info positioned at the bottom of LabeledInput */", - " footnote?: ReactNode;", - " /** Additional info positioned to the right side of label */", - " sidenote?: ReactNode;", + " all?: Metadata>;", + " /** Defines minimal value to pass the validation */", + " minValue?: number;", + " /** Defines maximal value to pass the validation */", + " maxValue?: number;", + " /** Defines maximal length of the string to pass the validation */", + " maxLength?: number;", + " /** Array of your custom validators.", + " * Validator is a pure function that accept value and should return error message if this field is invalid.", + " * If validators provided, all other metadata options(e.g. isRequired, maxLength) will be ignored.", + " * */", + " validators?: CustomValidator[];", "}" ] }, "props": [ { - "uid": "labelPosition", - "name": "labelPosition", + "uid": "props", + "name": "props", "comment": { "raw": [ - "Position of the label, relative to the wrapped component (top of left)" + "Metadata for the nested fields" ] }, "typeValue": { - "raw": "'left' | 'top'" - }, - "editor": { - "type": "oneOf", - "options": [ - "left", - "top" - ] + "raw": "{ [P in keyof T]?: Metadata | undefined; }" }, "required": false }, { - "uid": "info", - "name": "info", + "uid": "all", + "name": "all", "comment": { "raw": [ - "Info hint text to show in tooltip" + "Metadata for all fields of current level of object.", + " Usually used for consistent validation of arrays." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "Metadata>" }, - "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "isOptional", - "name": "isOptional", + "uid": "minValue", + "name": "minValue", "comment": { "raw": [ - "Marks related field as optional" + "Defines minimal value to pass the validation" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, "required": false }, { - "uid": "htmlFor", - "name": "htmlFor", + "uid": "maxValue", + "name": "maxValue", "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" + "Defines maximal value to pass the validation" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" - }, - "required": false - }, - { - "uid": "value", - "name": "value", - "comment": { - "raw": [ - "A value from LabeledInput children" - ] - }, - "typeValue": { - "raw": "any" + "type": "number" }, "required": false }, @@ -20458,7 +23634,7 @@ "name": "maxLength", "comment": { "raw": [ - "Maximum text length, in characters" + "Defines maximal length of the string to pass the validation" ] }, "typeValue": { @@ -20470,55 +23646,43 @@ "required": false }, { - "uid": "charCounter", - "name": "charCounter", + "uid": "validators", + "name": "validators", "comment": { "raw": [ - "Showing current text length, in characters and maxLength" + "Array of your custom validators.", + " Validator is a pure function that accept value and should return error message if this field is invalid.", + " If validators provided, all other metadata options(e.g. isRequired, maxLength) will be ignored." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "CustomValidator[]" }, "required": false }, { - "uid": "footnote", - "name": "footnote", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Additional info positioned at the bottom of LabeledInput" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "required": false - }, - { - "uid": "sidenote", - "name": "sidenote", - "comment": { - "raw": [ - "Additional info positioned to the right side of label" - ] + "raw": "boolean" }, - "typeValue": { - "raw": "React.ReactNode" + "editor": { + "type": "bool" }, - "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "True if component contains invalid input" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { @@ -20527,60 +23691,86 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:ICanBeReadonly", "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" - }, - "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." - ] + "raw": "boolean" }, - "typeValue": { - "raw": "React.ReactNode" + "editor": { + "type": "bool" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasLabel", + "from": "@epam/uui-core:ICanBeRequired", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ModalBlockerProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ModalBlockerProps", + "nameFull": "ModalBlockerProps" + }, + "src": "uui-core/src/types/components/Modals.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ModalBlockerProps", + "print": [ + "interface ModalBlockerProps extends IModal, IHasCX, IHasChildren, IHasRawProps>, IHasForwardedRef {", + " /** Pass true to disabled locking focus inside modal.", + " * If omitted, first clickable element of modal will receive focus on mount and focus will be looped inside modal.", + " * */", + " disableFocusLock?: boolean;", + " /** Pass true to disabled modal closing by 'esc' key */", + " disableCloseByEsc?: boolean;", + " /** Pass true to disabled modal closing by click outside modal window */", + " disallowClickOutside?: boolean;", + " /**", + " * Pass true to disable modal close by router change.", + " * If omitted, modal window will be closed on any router change.", + " */", + " disableCloseOnRouterChange?: boolean;", + "}" + ] + }, + "props": [ { - "uid": "children", - "name": "children", + "uid": "disableFocusLock", + "name": "disableFocusLock", "comment": { "raw": [ - "Component children" + "Pass true to disabled locking focus inside modal.", + " If omitted, first clickable element of modal will receive focus on mount and focus will be looped inside modal." ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "disableCloseByEsc", + "name": "disableCloseByEsc", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Pass true to disabled modal closing by 'esc' key" ] }, "typeValue": { @@ -20589,112 +23779,73 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "validationMessage", - "name": "validationMessage", + "uid": "disallowClickOutside", + "name": "disallowClickOutside", "comment": { "raw": [ - "Message describing why the value is invalid" + "Pass true to disabled modal closing by click outside modal window" ] }, "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", - "required": false - }, - { - "uid": "rawProps", - "name": "rawProps", - "comment": { - "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" - ] + "raw": "boolean" }, - "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "disableCloseOnRouterChange", + "name": "disableCloseOnRouterChange", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Pass true to disable modal close by router change.", + " If omitted, modal window will be closed on any router change." ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, - "from": "@epam/uui-core:IHasForwardedRef", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:LayoutLayer": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LayoutLayer", - "nameFull": "LayoutLayer" - }, - "src": "uui-core/src/services/LayoutContext.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "LayoutLayer", - "print": [ - "interface LayoutLayer {", - " /** ID of the layer */", - " id: number;", - " /** Level of the layer depth */", - " depth: number;", - " /** zIndex of the layer */", - " zIndex: number;", - "}" - ] - }, - "props": [ + }, { - "uid": "id", - "name": "id", + "uid": "isActive", + "name": "isActive", "comment": { "raw": [ - "ID of the layer" + "Indicates whether the modal is currently displayed" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": true + "from": "@epam/uui-core:IModal", + "required": false }, { - "uid": "depth", - "name": "depth", + "uid": "key", + "name": "key", "comment": { "raw": [ - "Level of the layer depth" + "Unique key of the modal" ] }, "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, + "from": "@epam/uui-core:IModal", "required": true }, { @@ -20702,7 +23853,7 @@ "name": "zIndex", "comment": { "raw": [ - "zIndex of the layer" + "Modal zIndex value. Calculated via LayoutContext." ] }, "typeValue": { @@ -20711,147 +23862,63 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:IModal", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:LazyDataSourceApi": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyDataSourceApi", - "nameFull": "LazyDataSourceApi" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Defines API to retrieve data for DataSources" - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "LazyDataSourceApi", - "print": [ - "/** Defines API to retrieve data for DataSources */", - "type LazyDataSourceApi = (", - "/** Defines input arguments for Lazy Data Source APIs */", - "request: LazyDataSourceApiRequest, ", - "/** Defines the context of API request. */", - "context?: LazyDataSourceApiRequestContext) => Promise>;" - ] - } - } - }, - "@epam/uui-core:LazyDataSourceApiRequest": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyDataSourceApiRequest", - "nameFull": "LazyDataSourceApiRequest" - }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "LazyDataSourceApiRequest", - "print": [ - "/** Defines input arguments for Lazy Data Source APIs */", - "// eslint-disable-next-line @typescript-eslint/no-unused-vars", - "interface LazyDataSourceApiRequest {", - " /**", - " * The filter object, by which data should be filtered.", - " * It is a merged result of filters from DataSourceState and LazyDataSourceProps.", - " */", - " filter?: TFilter;", - " /** Sorting options, by which data should be sorted. */", - " sorting?: SortingOption[];", - " /** The search string, by which data should be searched. */", - " search?: string;", - " /** Specifies a range of the rows to be retrieved. */", - " range?: LazyDataSourceApiRequestRange;", - " /** Page number for which data should be retrieved. */", - " page?: number;", - " /** Number of items at the page. */", - " pageSize?: number;", - " /**", - " * An array of item IDs to be retrieved from the API.", - " * Other request options like filter, search and others should be ignored when IDs are provided.", - " * Used for requesting specific items separately from the list.", - " */", - " ids?: TId[];", - "}" - ] - }, - "props": [ - { - "uid": "filter", - "name": "filter", - "comment": { - "raw": [ - "The filter object, by which data should be filtered.", - " It is a merged result of filters from DataSourceState and LazyDataSourceProps." - ] - }, - "typeValue": { - "raw": "TFilter" - }, - "required": false }, { - "uid": "sorting", - "name": "sorting", + "uid": "success", + "name": "success", "comment": { "raw": [ - "Sorting options, by which data should be sorted." + "Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value." ] }, "typeValue": { - "raw": "SortingOption[]" + "raw": "(result: any) => void" }, - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IModal", + "required": true }, { - "uid": "search", - "name": "search", + "uid": "abort", + "name": "abort", "comment": { "raw": [ - "The search string, by which data should be searched." + "Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value." ] }, "typeValue": { - "raw": "string" + "raw": "(result?: any) => void" }, "editor": { - "type": "string" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IModal", + "required": true }, { - "uid": "range", - "name": "range", + "uid": "parameters", + "name": "parameters", "comment": { "raw": [ - "Specifies a range of the rows to be retrieved." + "Parameters that provided via second param of `modalContext.show` method" ] }, "typeValue": { - "raw": "LazyDataSourceApiRequestRange" + "raw": "any" }, + "from": "@epam/uui-core:IModal", "required": false }, { - "uid": "page", - "name": "page", + "uid": "depth", + "name": "depth", "comment": { "raw": [ - "Page number for which data should be retrieved." + "Depth of current modal layer" ] }, "typeValue": { @@ -20860,739 +23927,737 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:IModal", "required": false }, { - "uid": "pageSize", - "name": "pageSize", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Number of items at the page." + "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": "ids", - "name": "ids", + "uid": "children", + "name": "children", "comment": { "raw": [ - "An array of item IDs to be retrieved from the API.", - " Other request options like filter, search and others should be ignored when IDs are provided.", - " Used for requesting specific items separately from the list." + "Component children" ] }, "typeValue": { - "raw": "TId[]" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:LazyDataSourceApiRequestContext": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyDataSourceApiRequestContext", - "nameFull": "LazyDataSourceApiRequestContext" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Defines the context of API request. E.g. parent if we require to retrieve sub-list of the tree" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "LazyDataSourceApiRequestContext", - "print": [ - "/** Defines the context of API request. E.g. parent if we require to retrieve sub-list of the tree */", - "interface LazyDataSourceApiRequestContext {", - " /**", - " * The ID of the parent item whose children are being requested.", - " * Used for lazy-loading data in tree lists.", - " */", - " parentId?: TId | null;", - " /** The parent entity whose children are being requested */", - " parent?: TItem | null;", - "}" - ] - }, - "props": [ + }, { - "uid": "parentId", - "name": "parentId", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "The ID of the parent item whose children are being requested.", - " Used for lazy-loading data in tree lists." + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "null | TId" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" }, + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "parent", - "name": "parent", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "The parent entity whose children are being requested" + "this ref is passed to the underlying component" ] }, "typeValue": { - "raw": "null | TItem" + "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" }, + "from": "@epam/uui-core:IHasForwardedRef", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:LazyDataSourceApiRequestRange": { + "@epam/uui-core:ModalFooterCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "LazyDataSourceApiRequestRange", - "nameFull": "LazyDataSourceApiRequestRange" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "The range (from/count) of required rows for LazyDataSourceApiRequest" - ] + "name": "ModalFooterCoreProps", + "nameFull": "ModalFooterCoreProps" }, + "src": "uui-core/src/types/components/Modals.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "LazyDataSourceApiRequestRange", + "raw": "ModalFooterCoreProps", "print": [ - "// Lazy Data Source API", - "/** The range (from/count) of required rows for LazyDataSourceApiRequest */", - "interface LazyDataSourceApiRequestRange {", - " /** Element index to fetch from. */", - " from: number;", - " /** Count of elements to be retrieved. */", - " count?: number;", + "interface ModalFooterCoreProps extends IHasChildren, IHasCX, IHasRawProps> {", + " /** Pass true to enable the top border of ModalFooter */", + " borderTop?: boolean;", "}" ] }, "props": [ { - "uid": "from", - "name": "from", + "uid": "borderTop", + "name": "borderTop", "comment": { "raw": [ - "Element index to fetch from." + "Pass true to enable the top border of ModalFooter" ] }, "typeValue": { - "raw": "number" + "raw": "boolean" }, "editor": { - "type": "number" + "type": "bool" }, - "required": true + "required": false }, { - "uid": "count", - "name": "count", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Count of elements to be retrieved." + "Component children" ] }, "typeValue": { - "raw": "number" + "raw": "React.ReactNode" }, - "editor": { - "type": "number" + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", + "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:LazyDataSourceApiResponse": { + "@epam/uui-core:ModalHeaderCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "LazyDataSourceApiResponse", - "nameFull": "LazyDataSourceApiResponse" - }, - "src": "uui-core/src/types/dataSources.ts", - "comment": { - "raw": [ - "Defines Lazy Data Source APIs response shape" - ] + "name": "ModalHeaderCoreProps", + "nameFull": "ModalHeaderCoreProps" }, + "src": "uui-core/src/types/components/Modals.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "LazyDataSourceApiResponse", + "raw": "ModalHeaderCoreProps", "print": [ - "/** Defines Lazy Data Source APIs response shape */", - "interface LazyDataSourceApiResponse {", - " /** List of items which was requested via API */", - " items: TItem[];", - " /**", - " * API can set 'from' field if it wants to return more items than what was requested in request.range.", - " * This can be used to return all items at once (with from:0, count: totalCount), or align response to pages.", - " */", - " from?: number;", - " /**", - " * Total count of items which match current filter and pagination.", - " * If not specified, total count will be detected only when user scrolls to the end of the list.", - " */", - " count?: number;", - " /**", - " * Total count of items which match current filter.", - " */", - " totalCount?: number;", + "interface ModalHeaderCoreProps extends IHasChildren, IHasCX, IHasRawProps> {", + " /** Called when cross icon in ModalHeader is clicked */", + " onClose?: () => any;", + " /** Modal title to display in header */", + " title?: React.ReactNode;", "}" ] }, "props": [ { - "uid": "items", - "name": "items", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "List of items which was requested via API" + "Called when cross icon in ModalHeader is clicked" ] }, "typeValue": { - "raw": "TItem[]" + "raw": "() => any" }, - "required": true + "editor": { + "type": "func" + }, + "required": false }, { - "uid": "from", - "name": "from", + "uid": "title", + "name": "title", "comment": { "raw": [ - "API can set 'from' field if it wants to return more items than what was requested in request.range.", - " This can be used to return all items at once (with from:0, count: totalCount), or align response to pages." + "Modal title to display in header" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "count", - "name": "count", + "uid": "children", + "name": "children", "comment": { "raw": [ - "Total count of items which match current filter and pagination.", - " If not specified, total count will be detected only when user scrolls to the end of the list." + "Component children" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "React.ReactNode" }, + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "totalCount", - "name": "totalCount", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Total count of items which match current filter." + "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" ] }, "typeValue": { - "raw": "number" + "raw": "null | string | number | boolean | ClassDictionary | ClassArray" }, - "editor": { - "type": "number" + "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:LazyDataSourceProps": { + "@epam/uui-core:ModalOperation": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "LazyDataSourceProps", - "nameFull": "LazyDataSourceProps" + "name": "ModalOperation", + "nameFull": "ModalOperation" }, - "src": "uui-core/src/data/processing/LazyDataSource.tsx", + "src": "uui-core/src/services/ModalContext.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "LazyDataSourceProps", + "raw": "ModalOperation", "print": [ - "interface LazyDataSourceProps extends LazyListViewProps {", + "interface ModalOperation {", + " /** Modal component that should be rendered */", + " component?: React.ComponentType;", + " /** Modal component props */", + " props: IModal;", "}" ] }, "props": [ { - "uid": "api", - "name": "api", + "uid": "component", + "name": "component", "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)" + "Modal component that should be rendered" ] }, "typeValue": { - "raw": "LazyDataSourceApi" - }, - "typeValueRef": "@epam/uui-core:LazyDataSourceApi", - "editor": { - "type": "func" + "raw": "React.ComponentClass | React.FunctionComponent" }, - "from": "@epam/uui-core:LazyListViewProps", - "required": true + "required": false }, { - "uid": "getChildCount", - "name": "getChildCount", + "uid": "props", + "name": "props", "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." + "Modal component props" ] }, "typeValue": { - "raw": "(item: TItem) => number" + "raw": "IModal" }, - "editor": { - "type": "func" + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ModalWindowProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ModalWindowProps", + "nameFull": "ModalWindowProps" + }, + "src": "uui-core/src/types/components/Modals.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ModalWindowProps", + "print": [ + "interface ModalWindowProps extends VPanelProps, 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" }, - "from": "@epam/uui-core:LazyListViewProps", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "children", + "name": "children", "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." + "Component children" ] }, "typeValue": { - "raw": "TFilter" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:LazyListViewProps", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasChildren", "required": false }, { - "uid": "fetchStrategy", - "name": "fetchStrategy", + "uid": "onClick", + "name": "onClick", "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." + "Called when component is clicked" ] }, "typeValue": { - "raw": "'sequential' | 'parallel'" + "raw": "(e?: any) => void" }, "editor": { - "type": "oneOf", - "options": [ - "sequential", - "parallel" - ] + "type": "func" }, - "from": "@epam/uui-core:LazyListViewProps", + "from": "@epam/uui-core:IClickable", "required": false }, { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", + "uid": "rawProps", + "name": "rawProps", "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" + "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:LazyListViewProps", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { - "uid": "legacyLoadDataBehavior", - "name": "legacyLoadDataBehavior", + "uid": "forwardedRef", + "name": "forwardedRef", "comment": { "raw": [ - "This option is added for the purpose of supporting legacy behavior of fetching data", - " on `getRows` and `getListProps`, not to break users' own implementation of dataSources.", - " @default true" - ], - "tags": { - "@default": true - } + "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:LazyListViewProps", + "from": "@epam/uui-core:IHasForwardedRef", "required": false }, { - "uid": "getId", - "name": "getId", + "uid": "clickAnalyticsEvent", + "name": "clickAnalyticsEvent", "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 An item to get ID of" + "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": "(item: TItem) => TId" - }, - "editor": { - "type": "func" + "raw": "null | { [key: string]: any; name: string; }" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:IAnalyticableClick", "required": false }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "style", + "name": "style", "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." + "Native style attributes" ] }, + "typeValue": { + "raw": "React.CSSProperties" + }, + "from": "@epam/uui-core:VPanelProps", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:ModificationOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "ModificationOptions", + "nameFull": "ModificationOptions" + }, + "src": "uui-core/src/data/processing/views/tree/ItemsStorage.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "ModificationOptions", + "print": [ + "interface ModificationOptions {", + " reset?: boolean;", + " on?: 'load' | 'patch';", + "}" + ] + }, + "props": [ + { + "uid": "reset", + "name": "reset", "typeValue": { "raw": "boolean" }, "editor": { "type": "bool" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "getParentId", - "name": "getParentId", + "uid": "on", + "name": "on", + "typeValue": { + "raw": "'load' | 'patch'" + }, + "editor": { + "type": "oneOf", + "options": [ + "load", + "patch" + ] + }, + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:NotificationOperation": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "NotificationOperation", + "nameFull": "NotificationOperation" + }, + "src": "uui-core/src/services/NotificationContext.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "NotificationOperation", + "print": [ + "interface NotificationOperation {", + " /** Notification component that should be rendered */", + " component: React.ComponentType;", + " /** Notification component props */", + " props: INotification;", + " /** Notification config */", + " config: NotificationParams;", + "}" + ] + }, + "props": [ + { + "uid": "component", + "name": "component", "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)" + "Notification component that should be rendered" ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" - }, - "editor": { - "type": "func" + "raw": "React.ComponentType" }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false + "typeValueRef": "@types/react:ComponentType", + "required": true }, { - "uid": "rowOptions", - "name": "rowOptions", + "uid": "props", + "name": "props", "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" + "Notification component props" ] }, "typeValue": { - "raw": "DataRowOptions" + "raw": "INotification" }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false + "required": true }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "config", + "name": "config", "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 An item to get options for" + "Notification config" ] }, "typeValue": { - "raw": "(item: TItem, index: number) => DataRowOptions" - }, - "editor": { - "type": "func" + "raw": "NotificationParams" }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false - }, + "required": true + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:NotificationParams": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "NotificationParams", + "nameFull": "NotificationParams" + }, + "src": "uui-core/src/types/contexts.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "NotificationParams", + "print": [ + "interface NotificationParams {", + " /** Notification visibility duration in ms", + " * If 'forever' value provided, notification required manual action for closing.", + " */", + " duration?: number | 'forever';", + " /** Position of notification depends on screen corners */", + " position?: 'bot-left' | 'bot-right' | 'top-left' | 'top-right' | 'top-center' | 'bot-center';", + "}" + ] + }, + "props": [ { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "duration", + "name": "duration", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + "Notification visibility duration in ms", + " If 'forever' value provided, notification required manual action for closing." ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" - }, - "editor": { - "type": "func" + "raw": "number | 'forever'" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "position", + "name": "position", "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." + "Position of notification depends on screen corners" ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "'bot-left' | 'bot-right' | 'top-left' | 'top-right' | 'top-center' | 'bot-center'" }, "editor": { "type": "oneOf", "options": [ - false, - true, - "implicit", - "explicit" - ] - }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false - }, - { - "uid": "selectAll", - "name": "selectAll", - "comment": { - "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false - }, - { - "uid": "backgroundReload", - "name": "backgroundReload", - "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`." + "bot-left", + "bot-right", + "top-left", + "top-right", + "top-center", + "bot-center" ] }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "from": "@epam/uui-core:BaseListViewProps", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:LazyListViewProps": { + "@epam/uui-core:OnUpdate": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "LazyListViewProps", - "nameFull": "LazyListViewProps" + "name": "OnUpdate", + "nameFull": "OnUpdate" + }, + "src": "uui-core/src/data/processing/views/tree/ItemsStorage.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "OnUpdate", + "print": [ + "type OnUpdate = (newItemsMap: ItemsMap) => void;" + ] + } + } + }, + "@epam/uui-core:PatchOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PatchOptions", + "nameFull": "PatchOptions" + }, + "src": "uui-core/src/types/dataSources.ts", + "comment": { + "raw": [ + "Patch tree configuration." + ] }, - "src": "uui-core/src/data/processing/views/LazyListView.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "LazyListViewProps", + "raw": "PatchOptions", "print": [ - "interface LazyListViewProps extends BaseListViewProps {", - " /**", - " * 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)", - " */", - " api: LazyDataSourceApi;", - " /**", - " * 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.", - " */", - " getChildCount?(item: TItem): number;", + "/**", + " * Patch tree configuration.", + " */", + "interface PatchOptions extends SortConfig {", " /**", - " * 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.", + " * To enable deleting of the items, it is required to specify getter for deleted state.", " */", - " filter?: TFilter;", + " isDeleted?(item: TItem): boolean;", " /**", - " * 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.", + " * 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", " */", - " fetchStrategy?: 'sequential' | 'parallel';", + " getNewItemPosition?: (item: TItem) => PatchOrderingType;", " /**", - " * 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.", " */", - " flattenSearchResults?: boolean;", + " getItemTemporaryOrder?: (item: TItem) => string;", + " /**", + " * Items, which should be added/updated/deleted from the tree.", + " */", + " patch?: IMap | IImmutableMap;", " /**", - " * This option is added for the purpose of supporting legacy behavior of fetching data", - " * on `getRows` and `getListProps`, not to break users' own implementation of dataSources.", + " * If enabled, items position is fixed between sorting.", " * @default true", " */", - " legacyLoadDataBehavior?: boolean;", + " fixItemBetweenSortings?: boolean;", "}" ] }, "props": [ { - "uid": "api", - "name": "api", + "uid": "isDeleted", + "name": "isDeleted", "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)" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "LazyDataSourceApi" + "raw": "(item: TItem) => boolean" }, - "typeValueRef": "@epam/uui-core:LazyDataSourceApi", "editor": { "type": "func" }, - "required": true + "required": false }, { - "uid": "getChildCount", - "name": "getChildCount", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "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." + "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) => number" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" @@ -21600,74 +24665,44 @@ "required": false }, { - "uid": "filter", - "name": "filter", - "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." - ] - }, - "typeValue": { - "raw": "TFilter" - }, - "required": false - }, - { - "uid": "fetchStrategy", - "name": "fetchStrategy", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "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." + "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": "'sequential' | 'parallel'" + "raw": "(item: TItem) => string" }, "editor": { - "type": "oneOf", - "options": [ - "sequential", - "parallel" - ] + "type": "func" }, "required": false }, { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", + "uid": "patch", + "name": "patch", "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" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "IMap | IImmutableMap" }, "required": false }, { - "uid": "legacyLoadDataBehavior", - "name": "legacyLoadDataBehavior", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "This option is added for the purpose of supporting legacy behavior of fetching data", - " on `getRows` and `getListProps`, not to break users' own implementation of dataSources.", + "If enabled, items position is fixed between sorting.", " @default true" ], "tags": { @@ -21683,292 +24718,258 @@ "required": false }, { - "uid": "getId", - "name": "getId", + "uid": "sortBy", + "name": "sortBy", "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 An item to get ID of" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "(item: TItem) => TId" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", + "from": "@epam/uui-core:SortConfig", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:PatchOrderingType": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PatchOrderingType", + "nameFull": "PatchOrderingType" + }, + "src": "uui-core/src/data/processing/views/tree/types.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "symbol", + "print": [ + "type PatchOrderingType = typeof PatchOrdering.TOP | typeof PatchOrdering.BOTTOM;" + ] + } + } + }, + "@epam/uui-core:PickerBaseOptions": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerBaseOptions", + "nameFull": "PickerBaseOptions" + }, + "src": "uui-core/src/types/pickers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "PickerBaseOptions", + "print": [ + "type PickerBaseOptions = {", + " /** Name of the entity being selected. Affects wording like \"Please select [entity]\" */", + " entityName?: string;", + " /** Plural name of the entity being selected. Affects wording like \"X [entities] selected\" */", + " entityPluralName?: string;", + " /** Datasource to get data for the picker */", + " dataSource: IDataSource;", + " /** A pure function that gets entity name from entity object.", + " Default: (item) => item.name.", + " */", + " getName?: (item: TItem) => string;", + " /** Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc. */", + " renderRow?: (props: DataRowProps, dataSourceState: DataSourceState) => ReactNode;", + " /** Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks. */", + " getRowOptions?: (item: TItem, index: number) => DataRowOptions;", + " /** 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. */", + " renderNotFound?: (props: {", + " search: string;", + " onClose: () => void;", + " }) => ReactNode;", + " /** Defines which value is to set on clear. E.g. you can put an empty array instead of null for empty multi-select Pickers */", + " emptyValue?: undefined | null | [", + " ];", + " /** Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource */", + " sortBy?(item: TItem, sorting: SortingOption): any;", + " /** 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. */", + " filter?: any;", + " /** Defines sorting to pass to the DataSource */", + " sorting?: SortingOption;", + " /**", + " * 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.", + " */", + " cascadeSelection?: CascadeSelection;", + " /** You can return true for all, or some items to fold them. */", + " isFoldedByDefault?(item: TItem): boolean;", + " /** Given an item, should return an array of string fields to search on. By default, the search is performed on item.name field. */", + " getSearchFields?(item: TItem): string[];", + " /** Component ref */", + " ref?: React.Ref;", + "};" + ] + }, + "props": [ { - "uid": "complexIds", - "name": "complexIds", + "uid": "entityName", + "name": "entityName", "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." + "Name of the entity being selected. Affects wording like \"Please select [entity]\"" ] }, "typeValue": { - "raw": "boolean" + "raw": "string" }, "editor": { - "type": "bool" + "type": "string" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "getParentId", - "name": "getParentId", + "uid": "entityPluralName", + "name": "entityPluralName", "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)" + "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" ] }, "typeValue": { - "raw": "(item: TItem) => TId | undefined" + "raw": "string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "rowOptions", - "name": "rowOptions", + "uid": "dataSource", + "name": "dataSource", "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" + "Datasource to get data for the picker" ] }, "typeValue": { - "raw": "DataRowOptions" + "raw": "IDataSource" }, - "from": "@epam/uui-core:BaseListViewProps", - "required": false + "required": true }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "getName", + "name": "getName", "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 An item to get options for" + "A pure function that gets entity name from entity object.", + " Default: (item) => item.name." ] }, "typeValue": { - "raw": "(item: TItem, index: number) => DataRowOptions" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "renderRow", + "name": "renderRow", "comment": { "raw": [ - "Can be specified to unfold all or some items at start.", - " If not specified, all rows would be folded." + "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." ] }, "typeValue": { - "raw": "(item: TItem, state: DataSourceState) => boolean" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "getRowOptions", + "name": "getRowOptions", "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." + "Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks." ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "(item: TItem, index: number) => DataRowOptions" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "func" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "selectAll", - "name": "selectAll", + "uid": "renderNotFound", + "name": "renderNotFound", "comment": { "raw": [ - "Enables or disables \"select all\" checkbox. Default is true." + "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." ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" }, "editor": { - "type": "bool" + "type": "component" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false }, { - "uid": "backgroundReload", - "name": "backgroundReload", + "uid": "emptyValue", + "name": "emptyValue", "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`." + "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": "boolean" - }, - "editor": { - "type": "bool" + "raw": "null | []" }, - "from": "@epam/uui-core:BaseListViewProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:LazyLoadedMapLoadCallback": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LazyLoadedMapLoadCallback", - "nameFull": "LazyLoadedMapLoadCallback" - }, - "src": "uui-core/src/helpers/LazyLoadedMap.ts", - "comment": { - "raw": [ - "An callback to pass to LazyLoadedMap constructor" - ] - }, - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "LazyLoadedMapLoadCallback", - "print": [ - "/**", - " * An callback to pass to LazyLoadedMap constructor", - " */", - "type LazyLoadedMapLoadCallback = (pending: TKey[]) => Promise<[", - " TKey,", - " TValue", - "][]>;" - ] - } - } - }, - "@epam/uui-core:Link": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "Link", - "nameFull": "Link" - }, - "src": "uui-core/src/types/objects.ts", - "comment": { - "raw": [ - "Defines location within SPA application" - ] - }, - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "Link", - "print": [ - "/** Defines location within SPA application */", - "interface Link {", - " /** A URL pathname, beginning with a '/' */", - " pathname: string;", - " /** Object that will be parsed to the URL search params */", - " query?: any;", - " /** A URL search string, beginning with a '?' */", - " search?: string;", - " /** A unique string associated with this location. May be used to safely store", - " * and retrieve data in some other storage API, like `localStorage`.", - " *", - " * Note: This value is always \"default\" on the initial location.", - " */", - " key?: string;", - " /** A URL fragment identifier, beginning with a '#' */", - " hash?: string;", - " /** A value of arbitrary data associated with this location */", - " state?: any;", - "}" - ] - }, - "props": [ + }, { - "uid": "pathname", - "name": "pathname", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "A URL pathname, beginning with a '/'" + "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "string" + "type": "func" }, - "required": true + "required": false }, { - "uid": "query", - "name": "query", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "Object that will be parsed to the URL search params" + "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": { @@ -21977,66 +24978,89 @@ "required": false }, { - "uid": "search", - "name": "search", + "uid": "sorting", + "name": "sorting", "comment": { "raw": [ - "A URL search string, beginning with a '?'" + "Defines sorting to pass to the DataSource" ] }, "typeValue": { - "raw": "string" + "raw": "SortingOption" + }, + "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": "string" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, "required": false }, { - "uid": "key", - "name": "key", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "A unique string associated with this location. May be used to safely store", - " and retrieve data in some other storage API, like `localStorage`.", - "", - " Note: This value is always \"default\" on the initial location." + "You can return true for all, or some items to fold them." ] }, "typeValue": { - "raw": "string" + "raw": "(item: TItem) => boolean" }, "editor": { - "type": "string" + "type": "func" }, "required": false }, { - "uid": "hash", - "name": "hash", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "A URL fragment identifier, beginning with a '#'" + "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" }, "required": false }, { - "uid": "state", - "name": "state", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "A value of arbitrary data associated with this location" + "Component ref" ] }, "typeValue": { - "raw": "any" + "raw": "null | (instance: HTMLElement | null) => void | React.RefObject" }, "required": false } @@ -22044,443 +25068,335 @@ "propsFromUnion": false } }, - "@epam/uui-core:ListApiResponse": { + "@epam/uui-core:PickerBaseProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ListApiResponse", - "nameFull": "ListApiResponse" + "name": "PickerBaseProps", + "nameFull": "PickerBaseProps" }, - "src": "uui-core/src/data/processing/ListApiCache.tsx", + "src": "uui-core/src/types/pickers.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "ListApiResponse", + "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", "print": [ - "interface ListApiResponse {", - " /** Items according to the request. For items that are not fetched yet, null will be returned. */", - " items: TItem[];", - "}" + "type PickerBaseProps = PickerBaseOptions & PickerBindingProps & IAnalyticableOnChange & PickerShowSelectedOnly;" ] }, "props": [ { - "uid": "items", - "name": "items", + "uid": "entityName", + "name": "entityName", "comment": { "raw": [ - "Items according to the request. For items that are not fetched yet, null will be returned." + "Name of the entity being selected. Affects wording like \"Please select [entity]\"" ] }, "typeValue": { - "raw": "TItem[]" + "raw": "string" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ListApiSettings": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ListApiSettings", - "nameFull": "ListApiSettings" - }, - "src": "uui-core/src/data/processing/ListApiCache.tsx", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ListApiSettings", - "print": [ - "interface ListApiSettings {", - " /** Lazy List API used to fetch items */", - " api: LazyDataSourceApi;", - " /** Get ID from an item. Id is expected to be value-type, i.e. can be used as Map's key */", - " getId: (item: TItem) => TId;", - " /** Will be called after new data is fetched into the list */", - " onUpdate?: () => void;", - "}" - ] - }, - "props": [ + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:PickerBaseOptions", + "required": false + }, { - "uid": "api", - "name": "api", + "uid": "entityPluralName", + "name": "entityPluralName", "comment": { "raw": [ - "Lazy List API used to fetch items" + "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" ] }, "typeValue": { - "raw": "LazyDataSourceApi" + "raw": "string" }, - "typeValueRef": "@epam/uui-core:LazyDataSourceApi", "editor": { - "type": "func" + "type": "string" }, - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "getId", - "name": "getId", + "uid": "dataSource", + "name": "dataSource", "comment": { "raw": [ - "Get ID from an item. Id is expected to be value-type, i.e. can be used as Map's key" + "Datasource to get data for the picker" ] }, "typeValue": { - "raw": "(item: TItem) => TId" - }, - "editor": { - "type": "func" + "raw": "IDataSource" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": true }, { - "uid": "onUpdate", - "name": "onUpdate", + "uid": "getName", + "name": "getName", "comment": { "raw": [ - "Will be called after new data is fetched into the list" + "A pure function that gets entity name from entity object.", + " Default: (item) => item.name." ] }, "typeValue": { - "raw": "() => void" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:LoadingStatus": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LoadingStatus", - "nameFull": "LoadingStatus" - }, - "src": "uui-core/src/helpers/LazyLoadedMap.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "typeof UNKNOWN | typeof LOADING | typeof PENDING | typeof LOADED | typeof FAILED", - "print": [ - "type LoadingStatus = typeof UNKNOWN | typeof LOADING | typeof PENDING | typeof LOADED | typeof FAILED;" - ] - } - } - }, - "@epam/uui-core:LoadTreeOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "LoadTreeOptions", - "nameFull": "LoadTreeOptions" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "LoadTreeOptions", - "print": [ - "interface LoadTreeOptions extends Pick, 'api' | 'getChildCount' | 'filter' | 'fetchStrategy' | 'flattenSearchResults'> {", - " loadAllChildren?(id: TId): boolean;", - " isLoadStrict?: boolean;", - " isFolded?: (item: TItem) => boolean;", - "}" - ] - }, - "props": [ + }, { - "uid": "loadAllChildren", - "name": "loadAllChildren", + "uid": "renderRow", + "name": "renderRow", + "comment": { + "raw": [ + "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." + ] + }, "typeValue": { - "raw": "(id: TId) => boolean" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "isLoadStrict", - "name": "isLoadStrict", + "uid": "getRowOptions", + "name": "getRowOptions", + "comment": { + "raw": [ + "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": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "isFolded", - "name": "isFolded", + "uid": "renderNotFound", + "name": "renderNotFound", + "comment": { + "raw": [ + "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." + ] + }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" }, "editor": { - "type": "func" + "type": "component" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "emptyValue", + "name": "emptyValue", "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." + "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": "TFilter" + "raw": "null | []" }, - "from": "@epam/uui-core:LazyListViewProps", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "api", - "name": "api", + "uid": "sortBy", + "name": "sortBy", "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)" + "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" ] }, "typeValue": { - "raw": "LazyDataSourceApi" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:LazyListViewProps", - "required": true + "from": "@epam/uui-core:PickerBaseOptions", + "required": false }, { - "uid": "getChildCount", - "name": "getChildCount", + "uid": "filter", + "name": "filter", "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." + "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": "(item: TItem) => number" - }, - "editor": { - "type": "func" + "raw": "any" }, - "from": "@epam/uui-core:LazyListViewProps", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "fetchStrategy", - "name": "fetchStrategy", + "uid": "sorting", + "name": "sorting", "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." + "Defines sorting to pass to the DataSource" ] }, "typeValue": { - "raw": "'sequential' | 'parallel'" - }, - "editor": { - "type": "oneOf", - "options": [ - "sequential", - "parallel" - ] + "raw": "SortingOption" }, - "from": "@epam/uui-core:LazyListViewProps", + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "flattenSearchResults", - "name": "flattenSearchResults", + "uid": "cascadeSelection", + "name": "cascadeSelection", "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" + "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" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + false, + true, + "implicit", + "explicit" + ] }, - "from": "@epam/uui-core:LazyListViewProps", + "from": "@epam/uui-core:PickerBaseOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:Metadata": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "Metadata", - "nameFull": "Metadata" - }, - "src": "uui-core/src/types/validation.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "Metadata", - "print": [ - "interface Metadata extends IDisableable, ICanBeReadonly, ICanBeRequired {", - " /** Metadata for the nested fields */", - " props?: {", - " [P in keyof T]?: Metadata;", - " };", - " /**", - " * Metadata for all fields of current level of object.", - " * Usually used for consistent validation of arrays.", - " */", - " all?: Metadata>;", - " /** Defines minimal value to pass the validation */", - " minValue?: number;", - " /** Defines maximal value to pass the validation */", - " maxValue?: number;", - " /** Defines maximal length of the string to pass the validation */", - " maxLength?: number;", - " /** Array of your custom validators.", - " * Validator is a pure function that accept value and should return error message if this field is invalid.", - " * If validators provided, all other metadata options(e.g. isRequired, maxLength) will be ignored.", - " * */", - " validators?: CustomValidator[];", - "}" - ] - }, - "props": [ + }, { - "uid": "props", - "name": "props", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Metadata for the nested fields" + "You can return true for all, or some items to fold them." ] }, "typeValue": { - "raw": "{ [P in keyof T]?: Metadata | undefined; }" + "raw": "(item: TItem) => boolean" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "all", - "name": "all", + "uid": "getSearchFields", + "name": "getSearchFields", "comment": { "raw": [ - "Metadata for all fields of current level of object.", - " Usually used for consistent validation of arrays." + "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": "Metadata>" + "raw": "(item: TItem) => string[]" }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "minValue", - "name": "minValue", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "Defines minimal value to pass the validation" + "Component ref" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "null | (instance: HTMLElement | null) => void | React.RefObject" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "maxValue", - "name": "maxValue", + "uid": "selectionMode", + "name": "selectionMode", "comment": { "raw": [ - "Defines maximal value to pass the validation" + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "number" + "raw": "'single'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "single" + ] }, - "required": false + "from": "@epam/uui-core:SinglePickerProps", + "required": true }, { - "uid": "maxLength", - "name": "maxLength", + "uid": "valueType", + "name": "valueType", "comment": { "raw": [ - "Defines maximal length of the string to pass the validation" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "number" + "raw": "'id'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "id" + ] }, + "from": "@epam/uui-core:SinglePickerProps", "required": false }, { - "uid": "validators", - "name": "validators", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "Array of your custom validators.", - " Validator is a pure function that accept value and should return error message if this field is invalid.", - " If validators provided, all other metadata options(e.g. isRequired, maxLength) will be ignored." + "True if component contains invalid input" ] }, "typeValue": { - "raw": "CustomValidator[]" + "raw": "boolean" }, + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeInvalid", "required": false }, { @@ -22533,116 +25449,62 @@ }, "from": "@epam/uui-core:ICanBeRequired", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ModalBlockerProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ModalBlockerProps", - "nameFull": "ModalBlockerProps" - }, - "src": "uui-core/src/types/components/Modals.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ModalBlockerProps", - "print": [ - "interface ModalBlockerProps extends IModal, IHasCX, IHasChildren, IHasRawProps>, IHasForwardedRef {", - " /** Pass true to disabled locking focus inside modal.", - " * If omitted, first clickable element of modal will receive focus on mount and focus will be looped inside modal.", - " * */", - " disableFocusLock?: boolean;", - " /** Pass true to disabled modal closing by 'esc' key */", - " disableCloseByEsc?: boolean;", - " /** Pass true to disabled modal closing by click outside modal window */", - " disallowClickOutside?: boolean;", - " /**", - " * Pass true to disable modal close by router change.", - " * If omitted, modal window will be closed on any router change.", - " */", - " disableCloseOnRouterChange?: boolean;", - "}" - ] - }, - "props": [ - { - "uid": "disableFocusLock", - "name": "disableFocusLock", - "comment": { - "raw": [ - "Pass true to disabled locking focus inside modal.", - " If omitted, first clickable element of modal will receive focus on mount and focus will be looped inside modal." - ] - }, - "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" - }, - "required": false }, { - "uid": "disableCloseByEsc", - "name": "disableCloseByEsc", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Pass true to disabled modal closing by 'esc' key" + "The current value of component" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "TId" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "disallowClickOutside", - "name": "disallowClickOutside", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "Pass true to disabled modal closing by click outside modal window" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "boolean" + "raw": "(newValue: TId) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "disableCloseOnRouterChange", - "name": "disableCloseOnRouterChange", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Pass true to disable modal close by router change.", - " If omitted, modal window will be closed on any router change." + "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: any, oldValue: any) => AnalyticsEvent" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "isActive", - "name": "isActive", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Indicates whether the modal is currently displayed" + "Enables/disables selected rows only in Picker." ] }, "typeValue": { @@ -22651,774 +25513,696 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IModal", + "from": "@epam/uui-core:PickerShowSelectedOnly", "required": false }, { - "uid": "key", - "name": "key", + "uid": "valueType_2", + "name": "valueType", "comment": { "raw": [ - "Unique key of the modal" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "string" + "raw": "'entity'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "entity" + ] }, - "from": "@epam/uui-core:IModal", + "from": "@epam/uui-core:SinglePickerProps", "required": true }, { - "uid": "zIndex", - "name": "zIndex", + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "Modal zIndex value. Calculated via LayoutContext." + "The current value of component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "TItem" }, - "from": "@epam/uui-core:IModal", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "success", - "name": "success", + "uid": "onValueChange_2", + "name": "onValueChange", "comment": { "raw": [ - "Call to successfully close the modal. It's resolves `modalContext.show()` promise with provided value." + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "(result: any) => void" + "raw": "(newValue: TItem) => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IModal", + "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "abort", - "name": "abort", + "uid": "selectionMode_3", + "name": "selectionMode", "comment": { "raw": [ - "Call to close the modal with abort action. It's rejects `modalContext.show()` promise with provided value." + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "(result?: any) => void" + "raw": "'multi'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "multi" + ] }, - "from": "@epam/uui-core:IModal", + "from": "@epam/uui-core:ArrayPickerProps", "required": true }, { - "uid": "parameters", - "name": "parameters", + "uid": "valueType_3", + "name": "valueType", "comment": { "raw": [ - "Parameters that provided via second param of `modalContext.show` method" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "any" + "raw": "'id'" }, - "from": "@epam/uui-core:IModal", + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", "required": false }, { - "uid": "depth", - "name": "depth", + "uid": "value_3", + "name": "value", "comment": { "raw": [ - "Depth of current modal layer" + "The current value of component" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "TId[]" }, - "from": "@epam/uui-core:IModal", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "cx", - "name": "cx", + "uid": "onValueChange_3", + "name": "onValueChange", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(newValue: TId[]) => void" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "children", - "name": "children", + "uid": "valueType_4", + "name": "valueType", "comment": { "raw": [ - "Component children" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "'entity'" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", - "required": false + "editor": { + "type": "oneOf", + "options": [ + "entity" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", + "required": true }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "value_4", + "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": "TItem[]" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "onValueChange_4", + "name": "onValueChange", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "(newValue: TItem[]) => void" }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:ModalFooterCoreProps": { + "@epam/uui-core:PickerBindingProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ModalFooterCoreProps", - "nameFull": "ModalFooterCoreProps" + "name": "PickerBindingProps", + "nameFull": "PickerBindingProps" }, - "src": "uui-core/src/types/components/Modals.ts", + "src": "uui-core/src/types/pickers.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "ModalFooterCoreProps", + "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": [ - "interface ModalFooterCoreProps extends IHasChildren, IHasCX, IHasRawProps> {", - " /** Pass true to enable the top border of ModalFooter */", - " borderTop?: boolean;", - "}" + "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" ] }, "props": [ { - "uid": "borderTop", - "name": "borderTop", + "uid": "selectionMode", + "name": "selectionMode", "comment": { "raw": [ - "Pass true to enable the top border of ModalFooter" + "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" + ] }, - "required": false + "from": "@epam/uui-core:SinglePickerProps", + "required": true }, { - "uid": "children", - "name": "children", + "uid": "valueType", + "name": "valueType", "comment": { "raw": [ - "Component children" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "'id'" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "from": "@epam/uui-core:SinglePickerProps", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "isInvalid", + "name": "isInvalid", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "True if component contains invalid input" ] }, "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:ICanBeInvalid", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "isDisabled", + "name": "isDisabled", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Disable editing, and visually de-emphasize value of the component" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "boolean" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDisableable", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ModalHeaderCoreProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ModalHeaderCoreProps", - "nameFull": "ModalHeaderCoreProps" - }, - "src": "uui-core/src/types/components/Modals.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ModalHeaderCoreProps", - "print": [ - "interface ModalHeaderCoreProps extends IHasChildren, IHasCX, IHasRawProps> {", - " /** Called when cross icon in ModalHeader is clicked */", - " onClose?: () => any;", - " /** Modal title to display in header */", - " title?: React.ReactNode;", - "}" - ] - }, - "props": [ + }, { - "uid": "onClose", - "name": "onClose", + "uid": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Called when cross icon in ModalHeader is clicked" + "Disable editing. Unlike isDisabled, keep component's value readable." ] }, "typeValue": { - "raw": "() => any" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeReadonly", "required": false }, { - "uid": "title", - "name": "title", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Modal title to display in header" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "boolean" }, - "typeValueRef": "@types/react:ReactNode", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "children", - "name": "children", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Component children" + "The current value of component" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "TId" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "cx", - "name": "cx", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(newValue: TId) => void" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "valueType_2", + "name": "valueType", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "'entity'" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ModalOperation": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ModalOperation", - "nameFull": "ModalOperation" - }, - "src": "uui-core/src/services/ModalContext.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ModalOperation", - "print": [ - "interface ModalOperation {", - " /** Modal component that should be rendered */", - " component?: React.ComponentType;", - " /** Modal component props */", - " props: IModal;", - "}" - ] - }, - "props": [ + "editor": { + "type": "oneOf", + "options": [ + "entity" + ] + }, + "from": "@epam/uui-core:SinglePickerProps", + "required": true + }, { - "uid": "component", - "name": "component", + "uid": "value_2", + "name": "value", "comment": { "raw": [ - "Modal component that should be rendered" + "The current value of component" ] }, "typeValue": { - "raw": "React.ComponentClass | React.FunctionComponent" + "raw": "TItem" }, - "required": false + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "props", - "name": "props", + "uid": "onValueChange_2", + "name": "onValueChange", "comment": { "raw": [ - "Modal component props" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "IModal" + "raw": "(newValue: TItem) => void" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:IControlled", "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ModalWindowProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ModalWindowProps", - "nameFull": "ModalWindowProps" - }, - "src": "uui-core/src/types/components/Modals.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ModalWindowProps", - "print": [ - "interface ModalWindowProps extends VPanelProps, IHasForwardedRef {", - "}" - ] - }, - "props": [ + }, { - "uid": "cx", - "name": "cx", + "uid": "selectionMode_3", + "name": "selectionMode", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "'multi'" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", - "required": false + "editor": { + "type": "oneOf", + "options": [ + "multi" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", + "required": true }, { - "uid": "children", - "name": "children", + "uid": "valueType_3", + "name": "valueType", "comment": { "raw": [ - "Component children" + "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "React.ReactNode" + "raw": "'id'" }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasChildren", + "editor": { + "type": "oneOf", + "options": [ + "id" + ] + }, + "from": "@epam/uui-core:ArrayPickerProps", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "emptyValue", + "name": "emptyValue", "comment": { "raw": [ - "Called when component is clicked" + "Defines what to use as an empty value. If other value provided, it will be assumed as selection" ] }, "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" + "raw": "null | []" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:ArrayPickerProps", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "value_3", + "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": "forwardedRef", - "name": "forwardedRef", + "uid": "onValueChange_3", + "name": "onValueChange", "comment": { "raw": [ - "this ref is passed to the underlying component" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "null | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "(newValue: TId[]) => void" }, - "from": "@epam/uui-core:IHasForwardedRef", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true }, { - "uid": "clickAnalyticsEvent", - "name": "clickAnalyticsEvent", + "uid": "valueType_4", + "name": "valueType", "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 what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" ] }, "typeValue": { - "raw": "null | { [key: string]: any; name: string; }" + "raw": "'entity'" }, - "from": "@epam/uui-core:IAnalyticableClick", - "required": false + "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": "style", - "name": "style", + "uid": "onValueChange_4", + "name": "onValueChange", "comment": { "raw": [ - "Native style attributes" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "React.CSSProperties" + "raw": "(newValue: TItem[]) => void" }, - "from": "@epam/uui-core:VPanelProps", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:NotificationOperation": { + "@epam/uui-core:PickerBindingValueType": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "NotificationOperation", - "nameFull": "NotificationOperation" + "name": "PickerBindingValueType", + "nameFull": "PickerBindingValueType" }, - "src": "uui-core/src/services/NotificationContext.tsx", + "src": "uui-core/src/types/pickers.ts", "exported": true }, "details": { - "kind": 264, + "kind": 265, "typeValue": { - "raw": "NotificationOperation", + "raw": "'scalar' | 'array'", "print": [ - "interface NotificationOperation {", - " /** Notification component that should be rendered */", - " component: React.ComponentType;", - " /** Notification component props */", - " props: INotification;", - " /** Notification config */", - " config: NotificationParams;", - "}" + "type PickerBindingValueType = 'scalar' | 'array';" + ] + } + } + }, + "@epam/uui-core:PickerFilterConfig": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerFilterConfig", + "nameFull": "PickerFilterConfig" + }, + "src": "uui-core/src/types/tables.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "PickerFilterConfig", + "print": [ + "type PickerFilterConfig = FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & {", + " /** Type of the filter */", + " type: 'singlePicker' | 'multiPicker';", + " /**", + " * Pass false to hide search in picker body.", + " * If omitted, true value will be used.", + " */", + " showSearch?: boolean;", + " /** Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates) */", + " maxBodyHeight?: number;", + "};" ] }, "props": [ { - "uid": "component", - "name": "component", + "uid": "title", + "name": "title", "comment": { "raw": [ - "Notification component that should be rendered" + "Title of the filter, displayed in filter toggler and filter body" ] }, "typeValue": { - "raw": "React.ComponentType" + "raw": "string" }, - "typeValueRef": "@types/react:ComponentType", + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "props", - "name": "props", + "uid": "field", + "name": "field", "comment": { "raw": [ - "Notification component props" + "Field of filters object, where store the filter value" ] }, "typeValue": { - "raw": "INotification" + "raw": "keyof TFilter" }, + "from": "@epam/uui-core:FilterConfigBase", "required": true }, { - "uid": "config", - "name": "config", + "uid": "columnKey", + "name": "columnKey", "comment": { "raw": [ - "Notification config" + "Key of the column to which the filter is attached.", + " If omitted, filter won't be attached to the column." ] }, "typeValue": { - "raw": "NotificationParams" + "raw": "string" }, - "required": true - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:NotificationParams": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "NotificationParams", - "nameFull": "NotificationParams" - }, - "src": "uui-core/src/types/contexts.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "NotificationParams", - "print": [ - "interface NotificationParams {", - " /** Notification visibility duration in ms", - " * If 'forever' value provided, notification required manual action for closing.", - " */", - " duration?: number | 'forever';", - " /** Position of notification depends on screen corners */", - " position?: 'bot-left' | 'bot-right' | 'top-left' | 'top-right' | 'top-center' | 'bot-center';", - "}" - ] - }, - "props": [ + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:FilterConfigBase", + "required": false + }, { - "uid": "duration", - "name": "duration", + "uid": "isAlwaysVisible", + "name": "isAlwaysVisible", "comment": { "raw": [ - "Notification visibility duration in ms", - " If 'forever' value provided, notification required manual action for closing." + "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" ] }, "typeValue": { - "raw": "number | 'forever'" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "position", - "name": "position", + "uid": "predicates", + "name": "predicates", "comment": { "raw": [ - "Position of notification depends on screen corners" + "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." ] }, "typeValue": { - "raw": "'bot-left' | 'bot-right' | 'top-left' | 'top-right' | 'top-center' | 'bot-center'" - }, - "editor": { - "type": "oneOf", - "options": [ - "bot-left", - "bot-right", - "top-left", - "top-right", - "top-center", - "bot-center" - ] + "raw": "IFilterPredicate[]" }, + "from": "@epam/uui-core:FilterConfigBase", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:PickerBaseOptions": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerBaseOptions", - "nameFull": "PickerBaseOptions" - }, - "src": "uui-core/src/types/pickers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "PickerBaseOptions", - "print": [ - "type PickerBaseOptions = {", - " /** Name of the entity being selected. Affects wording like \"Please select [entity]\" */", - " entityName?: string;", - " /** Plural name of the entity being selected. Affects wording like \"X [entities] selected\" */", - " entityPluralName?: string;", - " /** Datasource to get data for the picker */", - " dataSource: IDataSource;", - " /** A pure function that gets entity name from entity object.", - " Default: (item) => item.name.", - " */", - " getName?: (item: TItem) => string;", - " /** Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc. */", - " renderRow?: (props: DataRowProps, dataSourceState: DataSourceState) => ReactNode;", - " /** Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks. */", - " getRowOptions?: (item: TItem, index: number) => DataRowOptions;", - " /** 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. */", - " renderNotFound?: (props: {", - " search: string;", - " onClose: () => void;", - " }) => ReactNode;", - " /** Defines which value is to set on clear. E.g. you can put an empty array instead of null for empty multi-select Pickers */", - " emptyValue?: undefined | null | [", - " ];", - " /** Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource */", - " sortBy?(item: TItem, sorting: SortingOption): any;", - " /** 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. */", - " filter?: any;", - " /** Defines sorting to pass to the DataSource */", - " sorting?: SortingOption;", - " /**", - " * 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.", - " */", - " cascadeSelection?: CascadeSelection;", - " /** You can return true for all, or some items to fold them. */", - " isFoldedByDefault?(item: TItem): boolean;", - " /** Given an item, should return an array of string fields to search on. By default, the search is performed on item.name field. */", - " getSearchFields?(item: TItem): string[];", - " /** Component ref */", - " ref?: React.Ref;", - "};" - ] - }, - "props": [ + }, { - "uid": "entityName", - "name": "entityName", + "uid": "maxCount", + "name": "maxCount", "comment": { "raw": [ - "Name of the entity being selected. Affects wording like \"Please select [entity]\"" + "Count of words to show in the Filter toggler. By default, 2 item will be shown." ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { - "uid": "entityPluralName", - "name": "entityPluralName", + "uid": "togglerWidth", + "name": "togglerWidth", "comment": { "raw": [ - "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" + "Defines maxWidth of the filter toggler" ] }, "typeValue": { - "raw": "string" + "raw": "number" }, "editor": { - "type": "string" + "type": "number" }, + "from": "@epam/uui-core:FilterConfigBase", "required": false }, { @@ -23430,8 +26214,9 @@ ] }, "typeValue": { - "raw": "IDataSource" + "raw": "IDataSource" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": true }, { @@ -23444,11 +26229,12 @@ ] }, "typeValue": { - "raw": "(item: TItem) => string" + "raw": "(item: any) => string" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { @@ -23460,204 +26246,390 @@ ] }, "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" }, "editor": { "type": "component" }, + "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks." + "Type of the filter" ] }, "typeValue": { - "raw": "(item: TItem, index: number) => DataRowOptions" + "raw": "'singlePicker' | 'multiPicker'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "singlePicker", + "multiPicker" + ] }, - "required": false + "required": true }, { - "uid": "renderNotFound", - "name": "renderNotFound", + "uid": "showSearch", + "name": "showSearch", "comment": { "raw": [ - "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." + "Pass false to hide search in picker body.", + " If omitted, true value will be used." ] }, "typeValue": { - "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, "required": false }, { - "uid": "emptyValue", - "name": "emptyValue", + "uid": "maxBodyHeight", + "name": "maxBodyHeight", "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" + "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" ] }, "typeValue": { - "raw": "null | []" + "raw": "number" + }, + "editor": { + "type": "number" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:PickerFooterProps": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "PickerFooterProps", + "nameFull": "PickerFooterProps" + }, + "src": "uui-core/src/types/pickers.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "PickerFooterProps", + "print": [ + "type PickerFooterProps = {", + " /** Instance of picker DataSource view */", + " view: IDataSourceView;", + " /** IEditable interface for the 'Show only selected' toggler */", + " showSelected: IEditable;", + " /** Call to clear picker selection */", + " clearSelection: () => void;", + " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", + " selectionMode: 'single' | 'multi';", + " /** If true, 'Clear' button will be disabled */", + " disableClear?: boolean;", + "};" + ] + }, + "props": [ { - "uid": "sortBy", - "name": "sortBy", + "uid": "view", + "name": "view", "comment": { "raw": [ - "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" + "Instance of picker DataSource view" ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" + "raw": "IDataSourceView" }, - "required": false + "typeValueRef": "@epam/uui-core:IDataSourceView", + "required": true }, { - "uid": "filter", - "name": "filter", + "uid": "showSelected", + "name": "showSelected", "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." + "IEditable interface for the 'Show only selected' toggler" ] }, "typeValue": { - "raw": "any" + "raw": "IEditable" }, - "required": false + "required": true }, { - "uid": "sorting", - "name": "sorting", + "uid": "clearSelection", + "name": "clearSelection", "comment": { "raw": [ - "Defines sorting to pass to the DataSource" + "Call to clear picker selection" ] }, "typeValue": { - "raw": "SortingOption" + "raw": "() => void" }, - "required": false + "editor": { + "type": "func" + }, + "required": true }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "selectionMode", + "name": "selectionMode", "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." + "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "'multi' | 'single'" }, "editor": { "type": "oneOf", "options": [ - false, - true, - "implicit", - "explicit" + "multi", + "single" ] }, - "required": false + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "disableClear", + "name": "disableClear", "comment": { "raw": [ - "You can return true for all, or some items to fold them." + "If true, 'Clear' button will be disabled" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@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": [ { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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." + "Enables/disables selected rows only in Picker." ] }, "typeValue": { - "raw": "(item: TItem) => string[]" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, "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:RangeDatePickerInputType": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RangeDatePickerInputType", + "nameFull": "RangeDatePickerInputType" + }, + "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "'from' | 'to'", + "print": [ + "type RangeDatePickerInputType = 'from' | 'to';" + ] + } + } + }, + "@epam/uui-core:RangeDatePickerPresets": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RangeDatePickerPresets", + "nameFull": "RangeDatePickerPresets" + }, + "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "RangeDatePickerPresets", + "print": [ + "type RangeDatePickerPresets = {", + " /** Preset config */", + " [key: string]: {", + " /** Name of the preset to display in rangeDatePicker body */", + " name: ReactNode;", + " /** A pure function that gets range value which will be applied by preset selection */", + " getRange: () => RangeDatePickerPresetValue;", + " };", + "};" + ] + }, + "props": [ { - "uid": "ref", - "name": "ref", + "uid": "[key: string]", + "name": "[key: string]", "comment": { "raw": [ - "Component ref" + "Preset config" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.RefObject" + "raw": "{ name: React.ReactNode; getRange: () => RangeDatePickerPresetValue; }" }, - "required": false + "required": true } ], "propsFromUnion": false } }, - "@epam/uui-core:PickerBaseProps": { + "@epam/uui-core:RangeDatePickerPresetValue": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "PickerBaseProps", - "nameFull": "PickerBaseProps" + "name": "RangeDatePickerPresetValue", + "nameFull": "RangeDatePickerPresetValue" }, - "src": "uui-core/src/types/pickers.ts", + "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", "exported": true }, "details": { "kind": 265, "typeValue": { - "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", + "raw": "RangeDatePickerPresetValue", "print": [ - "type PickerBaseProps = PickerBaseOptions & PickerBindingProps & IAnalyticableOnChange;" + "type RangeDatePickerPresetValue = {", + " /** Range from value */", + " from?: string;", + " /** Range to value */", + " to?: string;", + " /** Preset order in presets list */", + " order?: number;", + "};" ] }, "props": [ { - "uid": "entityName", - "name": "entityName", + "uid": "from", + "name": "from", "comment": { "raw": [ - "Name of the entity being selected. Affects wording like \"Please select [entity]\"" + "Range from value" ] }, "typeValue": { @@ -23666,15 +26638,14 @@ "editor": { "type": "string" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "entityPluralName", - "name": "entityPluralName", + "uid": "to", + "name": "to", "comment": { "raw": [ - "Plural name of the entity being selected. Affects wording like \"X [entities] selected\"" + "Range to value" ] }, "typeValue": { @@ -23683,268 +26654,337 @@ "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" - }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": true - }, - { - "uid": "getName", - "name": "getName", + "uid": "order", + "name": "order", "comment": { "raw": [ - "A pure function that gets entity name from entity object.", - " Default: (item) => item.name." + "Preset order in presets list" ] }, "typeValue": { - "raw": "(item: TItem) => string" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:RangeDatePickerValue": { + "summary": { + "module": "@epam/uui-core", + "typeName": { + "name": "RangeDatePickerValue", + "nameFull": "RangeDatePickerValue" + }, + "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "RangeDatePickerValue", + "print": [ + "interface RangeDatePickerValue {", + " /** RangeDatePicker 'from' value */", + " from: string | null;", + " /** RangeDatePicker 'to' value */", + " to: string | null;", + "}" + ] + }, + "props": [ { - "uid": "renderRow", - "name": "renderRow", + "uid": "from", + "name": "from", "comment": { "raw": [ - "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." + "RangeDatePicker 'from' value" ] }, "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "null | string" }, "editor": { - "type": "component" + "type": "string" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": false }, { - "uid": "getRowOptions", - "name": "getRowOptions", + "uid": "to", + "name": "to", "comment": { "raw": [ - "Gets options for each row. Allow to make rows non-selectable, as well as many other tweaks." + "RangeDatePicker 'to' value" ] }, "typeValue": { - "raw": "(item: TItem, index: number) => DataRowOptions" + "raw": "null | string" }, "editor": { - "type": "func" + "type": "string" }, - "from": "@epam/uui-core:PickerBaseOptions", "required": false - }, + } + ], + "propsFromUnion": false + } + }, + "@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;", + "}" + ] + }, + "props": [ { - "uid": "renderNotFound", - "name": "renderNotFound", + "uid": "rowLens", + "name": "rowLens", "comment": { "raw": [ - "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." + "Lens instance, wrapping IEditable on the row, to help binding to row's value.", + " E.g. " ] }, "typeValue": { - "raw": "(props: { search: string; onClose: () => void; }) => React.ReactNode" - }, - "editor": { - "type": "component" + "raw": "ILens" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "required": true }, { - "uid": "emptyValue", - "name": "emptyValue", + "uid": "key", + "name": "key", "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" + "Key to use as component's key" ] }, "typeValue": { - "raw": "null | []" + "raw": "string" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "sortBy", - "name": "sortBy", + "uid": "rowProps", + "name": "rowProps", "comment": { "raw": [ - "Defines how items should be sorted. By default, items are shown in order they are provided to the DataSource" + "DataTableRowsProps object for the table row the cell is at" ] }, "typeValue": { - "raw": "(item: TItem, sorting: SortingOption) => any" - }, - "editor": { - "type": "func" + "raw": "DataTableRowProps" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "filter", - "name": "filter", + "uid": "column", + "name": "column", "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." + "DataColumnProps object for the column the cell is at" ] }, "typeValue": { - "raw": "any" + "raw": "DataColumnProps" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "sorting", - "name": "sorting", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Defines sorting to pass to the DataSource" + "Column index in table" ] }, "typeValue": { - "raw": "SortingOption" + "raw": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", + "editor": { + "type": "number" + }, + "from": "@epam/uui-core:DataTableCellOptions", "required": false }, { - "uid": "cascadeSelection", - "name": "cascadeSelection", + "uid": "isFirstColumn", + "name": "isFirstColumn", "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." + "True if the cell is in the first column" ] }, "typeValue": { - "raw": "boolean | 'implicit' | 'explicit'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - false, - true, - "implicit", - "explicit" - ] + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "isFoldedByDefault", - "name": "isFoldedByDefault", + "uid": "isLastColumn", + "name": "isLastColumn", "comment": { "raw": [ - "You can return true for all, or some items to fold them." + "True if the cell is in the last column" ] }, "typeValue": { - "raw": "(item: TItem) => boolean" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "from": "@epam/uui-core:DataTableCellOptions", + "required": true }, { - "uid": "getSearchFields", - "name": "getSearchFields", + "uid": "tabIndex", + "name": "tabIndex", "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." + "HTML tabIndex attribute to set on the cell" ] }, "typeValue": { - "raw": "(item: TItem) => string[]" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:DataTableCellOptions", "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": "ref", - "name": "ref", + "uid": "rowProps", + "name": "rowProps", "comment": { "raw": [ - "Component ref" + "DataRowProps object of rendered row" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.RefObject" + "raw": "DataRowProps" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": false + "typeValueRef": "@epam/uui-core:DataRowProps", + "required": true }, { - "uid": "selectionMode", - "name": "selectionMode", + "uid": "mode", + "name": "mode", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "Cell mode signal the editor component to adapt it's visuals to cell editor" ] }, "typeValue": { - "raw": "'single'" + "raw": "'cell'" }, "editor": { "type": "oneOf", "options": [ - "single" + "cell" ] }, - "from": "@epam/uui-core:SinglePickerProps", "required": true }, { - "uid": "valueType", - "name": "valueType", + "uid": "ref", + "name": "ref", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "Ref to pass to the editor component.", + " It's required for correct focus/blur behavior." ] }, "typeValue": { - "raw": "'id'" - }, - "editor": { - "type": "oneOf", - "options": [ - "id" - ] + "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" }, - "from": "@epam/uui-core:SinglePickerProps", "required": false }, { @@ -24024,7 +27064,7 @@ ] }, "typeValue": { - "raw": "TId" + "raw": "TCellValue" }, "from": "@epam/uui-core:IControlled", "required": true @@ -24038,7 +27078,7 @@ ] }, "typeValue": { - "raw": "(newValue: TId) => void" + "raw": "(newValue: TCellValue) => void" }, "editor": { "type": "func" @@ -24047,206 +27087,320 @@ "required": true }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "validationMessage", + "name": "validationMessage", "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)." + "Message describing why the value is invalid" ] }, "typeValue": { - "raw": "(newValue: any, oldValue: any) => AnalyticsEvent" - }, - "editor": { - "type": "func" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "typeValueRef": "@types/react:ReactNode", + "from": "@epam/uui-core:IHasValidationMessage", "required": false }, { - "uid": "valueType_2", - "name": "valueType", + "uid": "onFocus", + "name": "onFocus", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "Called when component gets input focus" ] }, "typeValue": { - "raw": "'entity'" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "oneOf", - "options": [ - "entity" - ] + "type": "func" }, - "from": "@epam/uui-core:SinglePickerProps", - "required": true + "from": "@epam/uui-core:ICanFocus", + "required": false }, { - "uid": "value_2", - "name": "value", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "The current value of component" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "TItem" + "raw": "(e: React.FocusEvent) => void" }, - "from": "@epam/uui-core:IControlled", - "required": true - }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:ICanFocus", + "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": "onValueChange_2", - "name": "onValueChange", + "uid": "index", + "name": "index", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Index of the row to be scrolled to." ] }, "typeValue": { - "raw": "(newValue: TItem) => void" + "raw": "number" }, "editor": { - "type": "func" + "type": "number" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { - "uid": "selectionMode_3", - "name": "selectionMode", + "uid": "behavior", + "name": "behavior", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "Scrolling movement behavior." ] }, "typeValue": { - "raw": "'multi'" + "raw": "'auto' | 'instant' | 'smooth'" }, "editor": { "type": "oneOf", "options": [ - "multi" + "auto", + "instant", + "smooth" ] }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true + "required": false }, { - "uid": "valueType_3", - "name": "valueType", + "uid": "align", + "name": "align", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] + "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": "'id'" + "raw": "'top' | 'nearest'" }, "editor": { "type": "oneOf", "options": [ - "id" + "top", + "nearest" ] }, - "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 - }, + } + ], + "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_3", - "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: TId[]) => void" + "raw": "(item: TItem) => string[]" }, "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 + "required": false }, { - "uid": "onValueChange_4", - "name": "onValueChange", + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] + "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": "(newValue: TItem[]) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-core:PickerBindingProps": { + "@epam/uui-core:SetDataSourceState": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "PickerBindingProps", - "nameFull": "PickerBindingProps" + "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 @@ -24254,9 +27408,19 @@ "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", + "raw": "{ selectionMode: 'single'; valueType?: 'id' | undefined; } & IEditable | { selectionMode: 'single'; valueType: 'entity'; } & IEditable", "print": [ - "type PickerBindingProps = SinglePickerProps | ArrayPickerProps;" + "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": [ @@ -24277,7 +27441,6 @@ "single" ] }, - "from": "@epam/uui-core:SinglePickerProps", "required": true }, { @@ -24297,7 +27460,6 @@ "id" ] }, - "from": "@epam/uui-core:SinglePickerProps", "required": false }, { @@ -24416,7 +27578,6 @@ "entity" ] }, - "from": "@epam/uui-core:SinglePickerProps", "required": true }, { @@ -24449,173 +27610,341 @@ }, "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": [ { - "uid": "selectionMode_3", - "name": "selectionMode", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "'multi'" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "oneOf", - "options": [ - "multi" - ] + "type": "func" }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": true - }, + "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": "valueType_3", - "name": "valueType", + "uid": "constructor", + "name": "constructor", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "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": "'id'" + "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": "oneOf", - "options": [ - "id" - ] + "type": "func" }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": false + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "emptyValue", - "name": "emptyValue", + "uid": "set", + "name": "set", "comment": { "raw": [ - "Defines what to use as an empty value. If other value provided, it will be assumed as selection" + "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": "null | []" + "raw": "(key: TId, value?: { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; } | undefined) => IMap; newItems: TItem[]; }>" }, - "from": "@epam/uui-core:ArrayPickerProps", - "required": false + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IMap", + "required": true }, { - "uid": "value_3", - "name": "value", + "uid": "delete", + "name": "delete", "comment": { "raw": [ - "The current value of component" + "Should delete an element, located in a map by key. This operation is mutable.", + " @param key" ] }, "typeValue": { - "raw": "TId[]" + "raw": "(key: TId) => boolean" }, - "from": "@epam/uui-core:IControlled", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:IMap", "required": true }, { - "uid": "onValueChange_3", - "name": "onValueChange", - "comment": { - "raw": [ - "Called when value needs to be changed (usually due to user interaction)" - ] - }, + "uid": "has", + "name": "has", "typeValue": { - "raw": "(newValue: TId[]) => void" + "raw": "(key: TId) => boolean" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:IMap", "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)" - ] - }, + "uid": "size", + "name": "size", "typeValue": { - "raw": "'entity'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "entity" - ] + "type": "number" }, - "from": "@epam/uui-core:ArrayPickerProps", + "from": "@epam/uui-core:IMap", "required": true }, { - "uid": "value_4", - "name": "value", + "uid": "[Symbol.iterator]", + "name": "[Symbol.iterator]", + "typeValue": { + "raw": "() => IterableIterator<[TId, { top: TId[]; bottom: TId[]; updated: TId[]; moved: TId[]; withTempOrder: TId[]; updatedItemsMap: IMap; newItems: TItem[]; }]>" + }, + "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": [ - "The current value of component" + "Field of sorted entity under which sorting is performed" ] }, "typeValue": { - "raw": "TItem[]" + "raw": "keyof T" }, - "from": "@epam/uui-core:IControlled", "required": true }, { - "uid": "onValueChange_4", - "name": "onValueChange", + "uid": "direction", + "name": "direction", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Direction of a sorting" ] }, "typeValue": { - "raw": "(newValue: TItem[]) => void" + "raw": "'asc' | 'desc'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "asc", + "desc" + ] }, - "from": "@epam/uui-core:IControlled", - "required": true + "required": false } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-core:PickerBindingValueType": { + "@epam/uui-core:SpinnerCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "PickerBindingValueType", - "nameFull": "PickerBindingValueType" + "name": "SpinnerCoreProps", + "nameFull": "SpinnerCoreProps" }, - "src": "uui-core/src/types/pickers.ts", + "src": "uui-core/src/types/components/Spinner.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "'scalar' | 'array'", + "raw": "SpinnerCoreProps", "print": [ - "type PickerBindingValueType = 'scalar' | 'array';" + "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>" + }, + "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-core:PickerFilterConfig": { + "@epam/uui-core:TableFiltersConfig": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "PickerFilterConfig", - "nameFull": "PickerFilterConfig" + "name": "TableFiltersConfig", + "nameFull": "TableFiltersConfig" }, "src": "uui-core/src/types/tables.ts", "exported": true @@ -24623,19 +27952,9 @@ "details": { "kind": 265, "typeValue": { - "raw": "PickerFilterConfig", + "raw": "PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig", "print": [ - "type PickerFilterConfig = FilterConfigBase & Pick, 'dataSource' | 'getName' | 'renderRow'> & {", - " /** Type of the filter */", - " type: 'singlePicker' | 'multiPicker';", - " /**", - " * Pass false to hide search in picker body.", - " * If omitted, true value will be used.", - " */", - " showSearch?: boolean;", - " /** Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates) */", - " maxBodyHeight?: number;", - "};" + "type TableFiltersConfig = PickerFilterConfig | DatePickerFilterConfig | NumericFilterConfig | RangeDatePickerFilterConfig | CustomFilterConfig;" ] }, "props": [ @@ -24820,6 +28139,7 @@ "multiPicker" ] }, + "from": "@epam/uui-core:PickerFilterConfig", "required": true }, { @@ -24837,6 +28157,7 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-core:PickerFilterConfig", "required": false }, { @@ -24853,468 +28174,680 @@ "editor": { "type": "number" }, + "from": "@epam/uui-core:PickerFilterConfig", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:PickerFooterProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "PickerFooterProps", - "nameFull": "PickerFooterProps" - }, - "src": "uui-core/src/types/pickers.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "PickerFooterProps", - "print": [ - "type PickerFooterProps = {", - " /** Instance of picker DataSource view */", - " view: IDataSourceView;", - " /** IEditable interface for the 'Show only selected' toggler */", - " showSelected: IEditable;", - " /** Call to clear picker selection */", - " clearSelection: () => void;", - " /** If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected */", - " selectionMode: 'single' | 'multi';", - " /** If true, 'Clear' button will be disabled */", - " disableClear?: boolean;", - "};" - ] - }, - "props": [ + }, { - "uid": "view", - "name": "view", + "uid": "filter", + "name": "filter", "comment": { "raw": [ - "Instance of picker DataSource view" + "Filter selectable days. Days, for which this callback returns false - will be disabled" ] }, "typeValue": { - "raw": "IDataSourceView" + "raw": "(day: Dayjs) => boolean" }, - "typeValueRef": "@epam/uui-core:IDataSourceView", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDatePickerProps", + "required": false + }, + { + "uid": "format", + "name": "format", + "comment": { + "raw": [ + "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-core:BaseDatePickerProps", + "required": false + }, + { + "uid": "type_2", + "name": "type", + "comment": { + "raw": [ + "Type of the filter" + ] + }, + "typeValue": { + "raw": "'datePicker'" + }, + "editor": { + "type": "oneOf", + "options": [ + "datePicker" + ] + }, + "from": "@epam/uui-core:DatePickerFilterConfig", "required": true }, { - "uid": "showSelected", - "name": "showSelected", + "uid": "type_3", + "name": "type", "comment": { "raw": [ - "IEditable interface for the 'Show only selected' toggler" + "Type of the filter" ] }, "typeValue": { - "raw": "IEditable" + "raw": "'numeric'" + }, + "editor": { + "type": "oneOf", + "options": [ + "numeric" + ] }, + "from": "@epam/uui-core:NumericFilterConfig", "required": true }, { - "uid": "clearSelection", - "name": "clearSelection", + "uid": "type_4", + "name": "type", "comment": { "raw": [ - "Call to clear picker selection" + "Type of the filter" ] }, "typeValue": { - "raw": "() => void" + "raw": "'rangeDatePicker'" }, "editor": { - "type": "func" + "type": "oneOf", + "options": [ + "rangeDatePicker" + ] }, + "from": "@epam/uui-core:RangeDatePickerFilterConfig", "required": true }, { - "uid": "selectionMode", - "name": "selectionMode", + "uid": "type_5", + "name": "type", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" + "Type of the filter" ] }, "typeValue": { - "raw": "'multi' | 'single'" + "raw": "'custom'" }, "editor": { "type": "oneOf", "options": [ - "multi", - "single" + "custom" ] }, + "from": "@epam/uui-core:CustomFilterConfig", "required": true }, { - "uid": "disableClear", - "name": "disableClear", + "uid": "render", + "name": "render", "comment": { "raw": [ - "If true, 'Clear' button will be disabled" + "Render callback for filter body" ] }, "typeValue": { - "raw": "boolean" + "raw": "(props: IFilterItemBodyProps) => React.ReactElement>" }, "editor": { - "type": "bool" + "type": "component" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:RangeDatePickerInputType": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RangeDatePickerInputType", - "nameFull": "RangeDatePickerInputType" - }, - "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'from' | 'to'", - "print": [ - "type RangeDatePickerInputType = 'from' | 'to';" - ] - } - } - }, - "@epam/uui-core:RangeDatePickerPresets": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RangeDatePickerPresets", - "nameFull": "RangeDatePickerPresets" - }, - "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "RangeDatePickerPresets", - "print": [ - "type RangeDatePickerPresets = {", - " /** Preset config */", - " [key: string]: {", - " /** Name of the preset to display in rangeDatePicker body */", - " name: ReactNode;", - " /** A pure function that gets range value which will be applied by preset selection */", - " getRange: () => RangeDatePickerPresetValue;", - " };", - "};" - ] - }, - "props": [ + "from": "@epam/uui-core:CustomFilterConfig", + "required": true + }, { - "uid": "[key: string]", - "name": "[key: string]", + "uid": "getTogglerValue", + "name": "getTogglerValue", "comment": { "raw": [ - "Preset config" + "A pure function that gets value to display in filter toggler" ] }, "typeValue": { - "raw": "{ name: React.ReactNode; getRange: () => RangeDatePickerPresetValue; }" + "raw": "(props: IFilterItemBodyProps) => React.ReactNode" }, + "editor": { + "type": "component" + }, + "from": "@epam/uui-core:CustomFilterConfig", "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:RangeDatePickerPresetValue": { + "@epam/uui-core:TextInputCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "RangeDatePickerPresetValue", - "nameFull": "RangeDatePickerPresetValue" + "name": "TextInputCoreProps", + "nameFull": "TextInputCoreProps" }, - "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", + "src": "uui-core/src/types/components/TextInput.ts", "exported": true }, "details": { - "kind": 265, + "kind": 264, "typeValue": { - "raw": "RangeDatePickerPresetValue", + "raw": "TextInputCoreProps", "print": [ - "type RangeDatePickerPresetValue = {", - " /** Range from value */", - " from?: string;", - " /** Range to value */", - " to?: string;", - " /** Preset order in presets list */", - " order?: number;", - "};" + "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?: any): 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": "from", - "name": "from", + "uid": "onCancel", + "name": "onCancel", + "comment": { + "raw": [ + "Enables cancel (cross) icon, and fires when the icon is clicked" + ] + }, + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onAccept", + "name": "onAccept", + "comment": { + "raw": [ + "Enables accept (check) icon, and fires when the icon is clicked" + ] + }, + "typeValue": { + "raw": "() => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "onKeyDown", + "name": "onKeyDown", + "comment": { + "raw": [ + "keydown event handler to put on the HTML input element" + ] + }, + "typeValue": { + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" + }, + "required": false + }, + { + "uid": "autoFocus", + "name": "autoFocus", + "comment": { + "raw": [ + "Put focus on the element, when component is mounted" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "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", + "comment": { + "raw": [ + "Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp}" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "name", + "name": "name", + "comment": { + "raw": [ + "Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp}" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": false + }, + { + "uid": "maxLength", + "name": "maxLength", + "comment": { + "raw": [ + "Maximum input length in characters" + ] + }, + "typeValue": { + "raw": "number" + }, + "editor": { + "type": "number" + }, + "required": false + }, + { + "uid": "inputMode", + "name": "inputMode", + "comment": { + "raw": [ + "Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode}" + ] + }, + "typeValue": { + "raw": "'search' | 'numeric' | 'none' | 'text' | 'tel' | 'url' | 'email' | 'decimal'" + }, + "editor": { + "type": "oneOf", + "options": [ + "search", + "numeric", + "none", + "text", + "tel", + "url", + "email", + "decimal" + ] + }, + "required": false + }, + { + "uid": "id", + "name": "id", + "comment": { + "raw": [ + "HTML ID attribute for input" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "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": "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": "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": "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": "isReadonly", + "name": "isReadonly", "comment": { "raw": [ - "Range from value" + "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": "to", - "name": "to", + "uid": "isRequired", + "name": "isRequired", "comment": { "raw": [ - "Range to value" + "Marks that component's value is required and shouldn't be empty" ] }, "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, + "from": "@epam/uui-core:ICanBeRequired", "required": false }, { - "uid": "order", - "name": "order", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Preset order in presets list" + "The current value of component" ] }, "typeValue": { - "raw": "number" + "raw": "string" }, "editor": { - "type": "number" + "type": "string" }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:RangeDatePickerValue": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "RangeDatePickerValue", - "nameFull": "RangeDatePickerValue" - }, - "src": "uui-core/src/types/components/datePicker/BaseRangeDatePicker.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "RangeDatePickerValue", - "print": [ - "interface RangeDatePickerValue {", - " /** RangeDatePicker 'from' value */", - " from: string | null;", - " /** RangeDatePicker 'to' value */", - " to: string | null;", - "}" - ] - }, - "props": [ + "from": "@epam/uui-core:IControlled", + "required": true + }, { - "uid": "from", - "name": "from", + "uid": "onValueChange", + "name": "onValueChange", "comment": { "raw": [ - "RangeDatePicker 'from' value" + "Called when value needs to be changed (usually due to user interaction)" ] }, "typeValue": { - "raw": "null | string" + "raw": "(newValue: string | undefined) => void" }, "editor": { - "type": "string" + "type": "func" + }, + "from": "@epam/uui-core:IControlled", + "required": true + }, + { + "uid": "placeholder", + "name": "placeholder", + "comment": { + "raw": [ + "Placeholder to display when empty" + ] + }, + "typeValue": { + "raw": "any" }, + "from": "@epam/uui-core:IHasPlaceholder", "required": false }, { - "uid": "to", - "name": "to", + "uid": "icon", + "name": "icon", "comment": { "raw": [ - "RangeDatePicker 'to' value" + "Icon can be a React element (usually an SVG element)" ] }, "typeValue": { - "raw": "null | string" + "raw": "Icon" }, "editor": { - "type": "string" + "type": "component" }, + "from": "@epam/uui-core:IHasIcon", "required": false - } - ], - "propsFromUnion": false - } - }, - "@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;", - "}" - ] - }, - "props": [ + }, { - "uid": "rowLens", - "name": "rowLens", + "uid": "iconPosition", + "name": "iconPosition", "comment": { "raw": [ - "Lens instance, wrapping IEditable on the row, to help binding to row's value.", - " E.g. " + "Position of the icon (left of right)" ] }, "typeValue": { - "raw": "ILens" + "raw": "'left' | 'right'" }, - "required": true + "editor": { + "type": "oneOf", + "options": [ + "left", + "right" + ] + }, + "from": "@epam/uui-core:IHasIcon", + "required": false }, { - "uid": "key", - "name": "key", + "uid": "onIconClick", + "name": "onIconClick", "comment": { "raw": [ - "Key to use as component's key" + "Click handler for the icon" ] }, "typeValue": { - "raw": "string" + "raw": "() => void" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "@epam/uui-core:IHasIcon", + "required": false }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "isOpen", + "name": "isOpen", "comment": { "raw": [ - "DataTableRowsProps object for the table row the cell is at" + "When isDropdown=true, indicate that dropdown is open with chevron icon" ] }, "typeValue": { - "raw": "DataTableRowProps" + "raw": "boolean" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDropdownToggler", + "required": false }, { - "uid": "column", - "name": "column", + "uid": "isDropdown", + "name": "isDropdown", "comment": { "raw": [ - "DataColumnProps object for the column the cell is at" + "Shows chevron icon, enabling component to act as dropdown toggler" ] }, "typeValue": { - "raw": "DataColumnProps" + "raw": "boolean" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:IDropdownToggler", + "required": false }, { - "uid": "index", - "name": "index", + "uid": "getValueChangeAnalyticsEvent", + "name": "getValueChangeAnalyticsEvent", "comment": { "raw": [ - "Column index in table" + "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": "number" + "raw": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", + "from": "@epam/uui-core:IAnalyticableOnChange", "required": false }, { - "uid": "isFirstColumn", - "name": "isFirstColumn", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "True if the cell is in the first column" + "Any HTML attributes (native or 'data-') to put on the underlying component" ] }, "typeValue": { - "raw": "boolean" + "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + }, + "from": "@epam/uui-core:IHasRawProps", + "required": false + }, + { + "uid": "onFocus", + "name": "onFocus", + "comment": { + "raw": [ + "Called when component gets input focus" + ] + }, + "typeValue": { + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "@epam/uui-core:ICanFocus", + "required": false }, { - "uid": "isLastColumn", - "name": "isLastColumn", + "uid": "onBlur", + "name": "onBlur", "comment": { "raw": [ - "True if the cell is in the last column" + "Called when component looses input focus" ] }, "typeValue": { - "raw": "boolean" + "raw": "(e: React.FocusEvent) => void" }, "editor": { - "type": "bool" + "type": "func" }, - "from": "@epam/uui-core:DataTableCellOptions", - "required": true + "from": "@epam/uui-core:ICanFocus", + "required": false }, { "uid": "tabIndex", "name": "tabIndex", "comment": { "raw": [ - "HTML tabIndex attribute to set on the cell" + "Controls the order of keyboard navigation between components" ] }, "typeValue": { @@ -25323,154 +28856,144 @@ "editor": { "type": "number" }, - "from": "@epam/uui-core:DataTableCellOptions", + "from": "@epam/uui-core:IHasTabIndex", "required": false } ], "propsFromUnion": false } }, - "@epam/uui-core:RenderEditorProps": { + "@epam/uui-core:TooltipCoreProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "RenderEditorProps", - "nameFull": "RenderEditorProps" + "name": "TooltipCoreProps", + "nameFull": "TooltipCoreProps" }, - "src": "uui-core/src/types/tables.ts", + "src": "uui-core/src/types/components/Tooltip.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "RenderEditorProps", + "raw": "TooltipCoreProps", "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;", + "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": "rowProps", - "name": "rowProps", + "uid": "content", + "name": "content", "comment": { "raw": [ - "DataRowProps object of rendered row" + "Content to show in the tooltip (ReactNode)" ] }, "typeValue": { - "raw": "DataRowProps" + "raw": "any" }, - "typeValueRef": "@epam/uui-core:DataRowProps", - "required": true + "required": false }, { - "uid": "mode", - "name": "mode", + "uid": "renderContent", + "name": "renderContent", "comment": { "raw": [ - "Cell mode signal the editor component to adapt it's visuals to cell editor" + "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": "'cell'" + "raw": "() => any" }, "editor": { - "type": "oneOf", - "options": [ - "cell" - ] + "type": "func" }, - "required": true + "required": false }, { - "uid": "ref", - "name": "ref", + "uid": "offset", + "name": "offset", "comment": { "raw": [ - "Ref to pass to the editor component.", - " It's required for correct focus/blur behavior." + "See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/}" ] }, "typeValue": { - "raw": "null | (instance: HTMLElement | null) => void | React.MutableRefObject" + "raw": "OffsetsFunction | [number | null | undefined, number | null | undefined]" }, "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "children", + "name": "children", "comment": { "raw": [ - "True if component contains invalid input" + "React Node(s) to show tooltip for" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "React.ReactNode" }, - "from": "@epam/uui-core:ICanBeInvalid", + "typeValueRef": "@types/react:ReactNode", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "maxWidth", + "name": "maxWidth", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Max width of tooltip" ] }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, - "from": "@epam/uui-core:IDisableable", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "cx", + "name": "cx", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "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:ICanBeReadonly", + "typeValueRef": "@epam/uui-core:ClassValue", + "from": "@epam/uui-core:IHasCX", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "rawProps", + "name": "rawProps", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "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:ICanBeRequired", + "from": "@epam/uui-core:IHasRawProps", "required": false }, { @@ -25482,10 +29005,13 @@ ] }, "typeValue": { - "raw": "TCellValue" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { "uid": "onValueChange", @@ -25496,308 +29022,192 @@ ] }, "typeValue": { - "raw": "(newValue: TCellValue) => void" + "raw": "(newValue: boolean) => void" }, "editor": { "type": "func" }, "from": "@epam/uui-core:IControlled", - "required": true - }, - { - "uid": "validationMessage", - "name": "validationMessage", - "comment": { - "raw": [ - "Message describing why the value is invalid" - ] - }, - "typeValue": { - "raw": "React.ReactNode" - }, - "typeValueRef": "@types/react:ReactNode", - "from": "@epam/uui-core:IHasValidationMessage", "required": false }, { - "uid": "onFocus", - "name": "onFocus", + "uid": "onClose", + "name": "onClose", "comment": { "raw": [ - "Called when component gets input focus" + "Called when dropdown was closed" ] }, "typeValue": { - "raw": "(e: React.FocusEvent) => void" + "raw": "() => void" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-core:DropdownProps", "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 - } - ], - "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": "placement", + "name": "placement", "comment": { "raw": [ - "Index of the row to be scrolled to." + "Defines dropdown body placement relative to target" ] }, "typeValue": { - "raw": "number" + "raw": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" }, "editor": { - "type": "number" + "type": "oneOf", + "options": [ + "left", + "right", + "auto", + "auto-start", + "auto-end", + "top", + "bottom", + "top-start", + "top-end", + "bottom-start", + "bottom-end", + "right-start", + "right-end", + "left-start", + "left-end" + ] }, + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "behavior", - "name": "behavior", + "uid": "modifiers", + "name": "modifiers", "comment": { "raw": [ - "Scrolling movement behavior." + "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" ] }, "typeValue": { - "raw": "'auto' | 'instant' | 'smooth'" - }, - "editor": { - "type": "oneOf", - "options": [ - "auto", - "instant", - "smooth" - ] + "raw": "(StrictModifier | Partial>)[]" }, + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "align", - "name": "align", + "uid": "openDelay", + "name": "openDelay", "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.", - "", - " If `top` is specified, scrolling a list to a row to the top part of the container will happen in any case." + "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": "top" + "@default": 0 } }, "typeValue": { - "raw": "'top' | 'nearest'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "top", - "nearest" - ] + "type": "number" }, + "from": "@epam/uui-core:DropdownProps", "required": false - } - ], - "propsFromUnion": false - } - }, - "@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": "closeDelay", + "name": "closeDelay", "comment": { "raw": [ - "If 'single' provided - only one item is selected. In case of 'multi' - multiple items are selected" - ] + "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": "'single'" + "raw": "number" }, "editor": { - "type": "oneOf", - "options": [ - "single" - ] + "type": "number" }, - "required": true + "from": "@epam/uui-core:DropdownProps", + "required": false }, { - "uid": "valueType", - "name": "valueType", + "uid": "closeOnMouseLeave", + "name": "closeOnMouseLeave", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" - ] + "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" + } }, "typeValue": { - "raw": "'id'" + "raw": "false | 'toggler' | 'boundary'" }, "editor": { "type": "oneOf", "options": [ - "id" + false, + "toggler", + "boundary" ] }, + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "portalTarget", + "name": "portalTarget", "comment": { "raw": [ - "True if component contains invalid input" + "Node of portal target, where to render the dropdown body.", + " By default, will be used global portal node." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "HTMLElement" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "boundaryElement", + "name": "boundaryElement", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "Element relative to which dropdown will calculate position" ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "HTMLElement | HTMLElement[] | 'clippingParents'" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:DropdownProps", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "closeBodyOnTogglerHidden", + "name": "closeBodyOnTogglerHidden", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." - ] + "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" @@ -25805,333 +29215,436 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", + "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 Pick, 'rowOptions' | 'getRowOptions' | 'cascadeSelection'>, LoadMissingRecords, GetItemStatus {", + " /**", + " * Tree-like data, cascade selection should be performed on.", + " */", + " tree: ITree;", + "}" + ] + }, + "props": [ { - "uid": "isRequired", - "name": "isRequired", + "uid": "tree", + "name": "tree", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Tree-like data, cascade selection should be performed on." ] }, "typeValue": { - "raw": "boolean" - }, - "editor": { - "type": "bool" + "raw": "ITree" }, - "from": "@epam/uui-core:ICanBeRequired", - "required": false + "required": true }, { - "uid": "value", - "name": "value", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "The current value of component" + "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": "TId" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "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": "(newValue: TId) => void" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "valueType_2", - "name": "valueType", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Defines what to use in value/onValueChange: 'id' - item id (TId). 'entity' - the item itself (TItem)" + "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": "'entity'" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { "type": "oneOf", "options": [ - "entity" + false, + true, + "implicit", + "explicit" ] }, - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "value_2", - "name": "value", + "uid": "loadMissingRecordsOnCheck", + "name": "loadMissingRecordsOnCheck", "comment": { "raw": [ - "The current value of component" + "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": "TItem" + "raw": "(id: TId, isChecked: boolean, isRoot: boolean) => Promise>" }, - "from": "@epam/uui-core:IControlled", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:LoadMissingRecords", + "required": false }, { - "uid": "onValueChange_2", - "name": "onValueChange", + "uid": "getItemStatus", + "name": "getItemStatus", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "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": "(newValue: TItem) => void" + "raw": "(id: TId) => RecordStatus" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", - "required": true + "from": "@epam/uui-core:GetItemStatus", + "required": false } ], - "propsFromUnion": true + "propsFromUnion": false } }, - "@epam/uui-core:SortDirection": { + "@epam/uui-core:UseDataRowsProps": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "SortDirection", - "nameFull": "SortDirection" + "name": "UseDataRowsProps", + "nameFull": "UseDataRowsProps" }, - "src": "uui-core/src/types/dataSources.ts", - "exported": true - }, - "details": { - "kind": 265, - "typeValue": { - "raw": "'asc' | 'desc'", - "print": [ - "type SortDirection = 'asc' | 'desc';" + "src": "uui-core/src/data/processing/views/dataRows/useDataRows.ts", + "comment": { + "raw": [ + "`useDataRows` configuration." ] - } - } - }, - "@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", + "raw": "UseDataRowsProps", "print": [ - "interface SortingOption {", - " /** Field of sorted entity under which sorting is performed */", - " field: keyof T;", - " /** Direction of a sorting */", - " direction?: SortDirection;", + "/**", + " * `useDataRows` configuration.", + " */", + "interface UseDataRowsProps extends CommonTreeConfig, ITreeLoadingState, Partial>, GetItemStatus {", + " /**", + " * Tree-like data, rows to be built from.", + " */", + " tree: ITree;", "}" ] }, "props": [ { - "uid": "field", - "name": "field", + "uid": "tree", + "name": "tree", "comment": { "raw": [ - "Field of sorted entity under which sorting is performed" + "Tree-like data, rows to be built from." ] }, "typeValue": { - "raw": "keyof T" + "raw": "ITree" }, "required": true }, { - "uid": "direction", - "name": "direction", + "uid": "dataSourceState", + "name": "dataSourceState", "comment": { "raw": [ - "Direction of a sorting" + "State of the dataSource." ] }, "typeValue": { - "raw": "'asc' | 'desc'" + "raw": "DataSourceState" + }, + "from": "@epam/uui-core:CommonTreeConfig", + "required": true + }, + { + "uid": "setDataSourceState", + "name": "setDataSourceState", + "comment": { + "raw": [ + "DataSource state update handler." + ] + }, + "typeValue": { + "raw": "SetDataSourceState" }, + "typeValueRef": "@epam/uui-core:SetDataSourceState", "editor": { - "type": "oneOf", - "options": [ - "asc", - "desc" + "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 - } - ], - "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", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "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 | string | number | boolean | ClassDictionary | ClassArray" + "raw": "boolean" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "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": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "(item: TItem) => TId | undefined" }, - "from": "@epam/uui-core:IHasRawProps", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "forwardedRef", - "name": "forwardedRef", + "uid": "rowOptions", + "name": "rowOptions", "comment": { "raw": [ - "this ref is passed to the underlying component" + "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 | (instance: HTMLDivElement | null) => void | React.MutableRefObject" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:IHasForwardedRef", + "from": "@epam/uui-core:BaseDataSourceConfig", "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": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Title of the filter, displayed in filter toggler and filter body" + "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": "string" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "field", - "name": "field", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Field of filters object, where store the filter value" + "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": "keyof TFilter" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, - "from": "@epam/uui-core:FilterConfigBase", - "required": true + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "columnKey", - "name": "columnKey", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Key of the column to which the filter is attached.", - " If omitted, filter won't be attached to the column." + "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": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isAlwaysVisible", - "name": "isAlwaysVisible", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Pass true to make filter always visible in FilterPanel. User can't hide it via 'Add filter' dropdown" + "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": { @@ -26140,134 +29653,142 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "predicates", - "name": "predicates", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Array of available predicates for the filter. This predicated can be chosen by user and applied to the filter value." + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "IFilterPredicate[]" + "raw": "(item: TItem) => boolean" }, - "from": "@epam/uui-core:FilterConfigBase", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "maxCount", - "name": "maxCount", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Count of words to show in the Filter toggler. By default, 2 item will be shown." + "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": "number" + "raw": "(item: TItem) => symbol" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "togglerWidth", - "name": "togglerWidth", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Defines maxWidth of the filter toggler" + "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": "number" + "raw": "(item: TItem) => string" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:FilterConfigBase", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "dataSource", - "name": "dataSource", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Datasource to get data for the picker" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "IDataSource" + "raw": "IMap | IImmutableMap" }, - "from": "@epam/uui-core:PickerBaseOptions", - "required": true + "from": "@epam/uui-core:PatchOptions", + "required": false }, { - "uid": "getName", - "name": "getName", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "A pure function that gets entity name from entity object.", - " Default: (item) => item.name." - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "(item: any) => string" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "renderRow", - "name": "renderRow", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Allow to customize how each selectable row is rendered. Can be used to add subtitles, avatars, etc." + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "(props: DataRowProps, dataSourceState: DataSourceState, any>) => React.ReactNode" + "raw": "(item: TItem, sorting: SortingOption) => any" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:PickerBaseOptions", + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "type", - "name": "type", + "uid": "isFetching", + "name": "isFetching", "comment": { "raw": [ - "Type of the filter" + "Are tree records loading silently." ] }, "typeValue": { - "raw": "'singlePicker' | 'multiPicker'" + "raw": "boolean" }, "editor": { - "type": "oneOf", - "options": [ - "singlePicker", - "multiPicker" - ] + "type": "bool" }, - "from": "@epam/uui-core:PickerFilterConfig", - "required": true + "from": "@epam/uui-core:ITreeLoadingState", + "required": false }, { - "uid": "showSearch", - "name": "showSearch", + "uid": "isLoading", + "name": "isLoading", "comment": { "raw": [ - "Pass false to hide search in picker body.", - " If omitted, true value will be used." + "Are tree records loading loadly (show loading placeholders, etc)." ] }, "typeValue": { @@ -26276,288 +29797,309 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:PickerFilterConfig", + "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "maxBodyHeight", - "name": "maxBodyHeight", + "uid": "handleCascadeSelection", + "name": "handleCascadeSelection", "comment": { "raw": [ - "Height of picker items list in px. This height doesn't include height of body toolbars(sorting, predicates)" + "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": "(isChecked: boolean, checkedId?: TId | undefined, isRoot?: boolean | undefined, checked?: TId[] | undefined) => Promise" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:PickerFilterConfig", + "from": "@epam/uui-core:CascadeSelectionService", "required": false }, { - "uid": "filter", - "name": "filter", + "uid": "getItemStatus", + "name": "getItemStatus", "comment": { "raw": [ - "Filter selectable days. Days, for which this callback returns false - will be disabled" + "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": "(day: Dayjs) => boolean" + "raw": "(id: TId) => RecordStatus" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:BaseDatePickerProps", + "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": "format", - "name": "format", + "uid": "getId", + "name": "getId", "comment": { "raw": [ - "Date format string, see [dayjs docs](@link https://day.js.org/docs/en/display/format)" + "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": "string" + "raw": "(item: TItem) => TId" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:BaseDatePickerProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "type_2", - "name": "type", + "uid": "dataSourceState", + "name": "dataSourceState", "comment": { "raw": [ - "Type of the filter" + "State of the dataSource." ] }, "typeValue": { - "raw": "'datePicker'" + "raw": "DataSourceState" }, - "editor": { - "type": "oneOf", - "options": [ - "datePicker" - ] - }, - "from": "@epam/uui-core:DatePickerFilterConfig", + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "type_3", - "name": "type", + "uid": "setDataSourceState", + "name": "setDataSourceState", "comment": { "raw": [ - "Type of the filter" + "DataSource state update handler." ] }, "typeValue": { - "raw": "'numeric'" + "raw": "SetDataSourceState" }, "editor": { - "type": "oneOf", - "options": [ - "numeric" - ] + "type": "func" }, - "from": "@epam/uui-core:NumericFilterConfig", + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "type_4", - "name": "type", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "Type of the filter" + "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": "'rangeDatePicker'" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, "editor": { - "type": "oneOf", - "options": [ - "rangeDatePicker" - ] + "type": "func" }, - "from": "@epam/uui-core:RangeDatePickerFilterConfig", - "required": true - }, + "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": "type_5", - "name": "type", + "uid": "value", + "name": "value", "comment": { "raw": [ - "Type of the filter" + "Current value of the form state" ] }, "typeValue": { - "raw": "'custom'" - }, - "editor": { - "type": "oneOf", - "options": [ - "custom" - ] + "raw": "T" }, - "from": "@epam/uui-core:CustomFilterConfig", + "from": "@epam/uui-core:FormProps", "required": true }, { - "uid": "render", - "name": "render", + "uid": "getMetadata", + "name": "getMetadata", "comment": { "raw": [ - "Render callback for filter body" + "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": "(props: IFilterItemBodyProps) => React.ReactElement>" + "raw": "(state: T) => Metadata" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:CustomFilterConfig", - "required": true + "from": "@epam/uui-core:FormProps", + "required": false }, { - "uid": "getTogglerValue", - "name": "getTogglerValue", + "uid": "onSave", + "name": "onSave", "comment": { "raw": [ - "A pure function that gets value to display in filter toggler" + "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": "(props: IFilterItemBodyProps) => React.ReactNode" + "raw": "(state: T) => Promise>" }, "editor": { - "type": "component" + "type": "func" }, - "from": "@epam/uui-core:CustomFilterConfig", + "from": "@epam/uui-core:FormProps", "required": true - } - ], - "propsFromUnion": true - } - }, - "@epam/uui-core:TextInputCoreProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "TextInputCoreProps", - "nameFull": "TextInputCoreProps" - }, - "src": "uui-core/src/types/components/TextInput.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "TextInputCoreProps", - "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?: any): 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": "onCancel", - "name": "onCancel", + "uid": "beforeLeave", + "name": "beforeLeave", "comment": { "raw": [ - "Enables cancel (cross) icon, and fires when the icon is clicked" + "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.", + " 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": "() => void" + "raw": "null | () => Promise" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "onAccept", - "name": "onAccept", + "uid": "loadUnsavedChanges", + "name": "loadUnsavedChanges", "comment": { "raw": [ - "Enables accept (check) icon, and fires when the icon is clicked" + "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": "() => void" + "raw": "() => Promise" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "onKeyDown", - "name": "onKeyDown", + "uid": "onSuccess", + "name": "onSuccess", "comment": { "raw": [ - "keydown event handler to put on the HTML input element" + "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": "(e?: any) => void" + "raw": "(state: T, isSavedBeforeLeave?: boolean | undefined) => any" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "autoFocus", - "name": "autoFocus", + "uid": "onError", + "name": "onError", "comment": { "raw": [ - "Put focus on the element, when component is mounted" + "Called when save fails" ] }, "typeValue": { - "raw": "boolean" + "raw": "(error: any) => any" }, "editor": { - "type": "bool" + "type": "func" }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "type", - "name": "type", + "uid": "settingsKey", + "name": "settingsKey", "comment": { "raw": [ - "Standard 'type' attribute to put on the HTML input element (e.g. 'password')" + "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" ] }, "typeValue": { @@ -26566,136 +30108,233 @@ "editor": { "type": "string" }, + "from": "@epam/uui-core:FormProps", "required": false }, { - "uid": "autoComplete", - "name": "autoComplete", + "uid": "validationOn", + "name": "validationOn", "comment": { "raw": [ - "Standard [autocomplete attribute]{@link https://www.w3schools.com/tags/att_input_autocomplete.asp}" + "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": "string" + "raw": "'change' | 'save'" }, "editor": { - "type": "string" + "type": "oneOf", + "options": [ + "change", + "save" + ] + }, + "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;", + "}" + ] + }, + "props": [ + { + "uid": "dataSourceState", + "name": "dataSourceState", + "typeValue": { + "raw": "DataSourceState" + }, + "required": true + }, + { + "uid": "filter", + "name": "filter", + "typeValue": { + "raw": "TFilter" }, "required": false }, { - "uid": "name", - "name": "name", - "comment": { - "raw": [ - "Standard [name attribute]{@link https://www.w3schools.com/tags/att_input_name.asp}" - ] + "uid": "forceReload", + "name": "forceReload", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "required": false + }, + { + "uid": "backgroundReload", + "name": "backgroundReload", "typeValue": { - "raw": "string" + "raw": "boolean" }, "editor": { - "type": "string" + "type": "bool" }, "required": false }, { - "uid": "maxLength", - "name": "maxLength", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "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": [ + { + "uid": "columns", + "name": "columns", "comment": { "raw": [ - "Maximum input length in characters" + "Columns configuration, can be omitted if used without tables" ] }, "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "raw": "DataColumnProps[]" }, + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "inputMode", - "name": "inputMode", + "uid": "filters", + "name": "filters", "comment": { "raw": [ - "Standard [inputMode attribute]{@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode}" + "Filters configuration, can be omitted if you don't need filters" ] }, "typeValue": { - "raw": "'search' | 'numeric' | 'none' | 'text' | 'tel' | 'url' | 'email' | 'decimal'" + "raw": "TableFiltersConfig[]" }, - "editor": { - "type": "oneOf", - "options": [ - "search", - "numeric", - "none", - "text", - "tel", - "url", - "email", - "decimal" + "from": "@epam/uui-core:UseTableStateHookBaseParams", + "required": false + }, + { + "uid": "initialPresets", + "name": "initialPresets", + "comment": { + "raw": [ + "Initial presets array" ] }, + "typeValue": { + "raw": "ITablePreset[]" + }, + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "id", - "name": "id", + "uid": "onPresetCreate", + "name": "onPresetCreate", "comment": { "raw": [ - "HTML ID attribute for input" + "Called when preset was created. Should return the ID of new preset" ] }, "typeValue": { - "raw": "string" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { - "type": "string" + "type": "func" }, + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "cx", - "name": "cx", + "uid": "onPresetUpdate", + "name": "onPresetUpdate", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Called when preset was updated" ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "(preset: ITablePreset) => Promise" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:UseTableStateHookBaseParams", "required": false }, { - "uid": "onClick", - "name": "onClick", + "uid": "onPresetDelete", + "name": "onPresetDelete", "comment": { "raw": [ - "Called when component is clicked" + "Called when preset was deleted" ] }, "typeValue": { - "raw": "(e?: any) => void" + "raw": "(preset: ITablePreset) => Promise" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IClickable", + "from": "@epam/uui-core:UseTableStateHookBaseParams", "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": { @@ -26704,15 +30343,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:IDisableable", + "from": "@epam/uui-core:ICanBeInvalid", "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": { @@ -26721,7 +30360,7 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:IDisableable", "required": false }, { @@ -26767,13 +30406,10 @@ ] }, "typeValue": { - "raw": "string" - }, - "editor": { - "type": "string" + "raw": "DataTableState" }, "from": "@epam/uui-core:IControlled", - "required": true + "required": false }, { "uid": "onValueChange", @@ -26784,982 +30420,1157 @@ ] }, "typeValue": { - "raw": "(newValue: string | undefined) => void" + "raw": "(newValue: DataTableState) => void" }, "editor": { "type": "func" }, "from": "@epam/uui-core:IControlled", + "required": false + } + ], + "propsFromUnion": false + } + }, + "@epam/uui-core:UseTreeProps": { + "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." + ] + }, + "exported": true + }, + "details": { + "kind": 265, + "typeValue": { + "raw": "SyncTreeProps | AsyncTreeProps | LazyTreeProps", + "print": [ + "/**", + " * useTree hook configuration.", + " */", + "type UseTreeProps = (SyncTreeProps | AsyncTreeProps | LazyTreeProps);" + ] + }, + "props": [ + { + "uid": "dataSourceState", + "name": "dataSourceState", + "comment": { + "raw": [ + "State of the dataSource." + ] + }, + "typeValue": { + "raw": "DataSourceState" + }, + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "placeholder", - "name": "placeholder", + "uid": "setDataSourceState", + "name": "setDataSourceState", "comment": { "raw": [ - "Placeholder to display when empty" + "DataSource state update handler." ] }, "typeValue": { - "raw": "any" + "raw": "SetDataSourceState" }, - "from": "@epam/uui-core:IHasPlaceholder", + "typeValueRef": "@epam/uui-core: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": "icon", - "name": "icon", + "uid": "complexIds", + "name": "complexIds", "comment": { "raw": [ - "Icon can be a React element (usually an SVG element)" + "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": "Icon" + "raw": "boolean" }, "editor": { - "type": "component" + "type": "bool" }, - "from": "@epam/uui-core:IHasIcon", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "iconPosition", - "name": "iconPosition", + "uid": "getParentId", + "name": "getParentId", "comment": { "raw": [ - "Position of the icon (left of right)" + "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": "'left' | 'right'" + "raw": "(item: TItem) => TId | undefined" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right" + "type": "func" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false + }, + { + "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" ] }, - "from": "@epam/uui-core:IHasIcon", + "typeValue": { + "raw": "DataRowOptions" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "onIconClick", - "name": "onIconClick", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Click handler for the icon" + "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": "() => void" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IHasIcon", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isOpen", - "name": "isOpen", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "When isDropdown=true, indicate that dropdown is open with chevron icon" + "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:IDropdownToggler", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "isDropdown", - "name": "isDropdown", + "uid": "cascadeSelection", + "name": "cascadeSelection", "comment": { "raw": [ - "Shows chevron icon, enabling component to act as dropdown toggler" + "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:IDropdownToggler", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "getValueChangeAnalyticsEvent", - "name": "getValueChangeAnalyticsEvent", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "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)." + "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": "(newValue: string | null, oldValue: string | null) => AnalyticsEvent" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IAnalyticableOnChange", + "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": "onFocus", - "name": "onFocus", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Called when component gets input focus" + "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": "(e: React.FocusEvent) => void" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "onBlur", - "name": "onBlur", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Called when component looses input focus" + "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": "(e: React.FocusEvent) => void" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:ICanFocus", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "tabIndex", - "name": "tabIndex", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Controls the order of keyboard navigation between components" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "number" + "raw": "IMap | IImmutableMap" + }, + "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": "number" + "type": "bool" }, - "from": "@epam/uui-core:IHasTabIndex", + "from": "@epam/uui-core:PatchOptions", "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:TooltipCoreProps": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "TooltipCoreProps", - "nameFull": "TooltipCoreProps" - }, - "src": "uui-core/src/types/components/Tooltip.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "TooltipCoreProps", - "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;", - "}" - ] - }, - "props": [ + }, { - "uid": "content", - "name": "content", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Content to show in the tooltip (ReactNode)" + "A pure function that gets sorting value for current sorting value" ] }, "typeValue": { - "raw": "any" + "raw": "(item: TItem, sorting: SortingOption) => any" + }, + "editor": { + "type": "func" }, + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "renderContent", - "name": "renderContent", + "uid": "getSearchFields", + "name": "getSearchFields", "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 search value for each item.", + " @default (item) => item.name." ] }, "typeValue": { - "raw": "() => any" + "raw": "(item: TItem) => string[]" }, "editor": { "type": "func" }, + "from": "@epam/uui-core:SearchConfig", "required": false }, { - "uid": "offset", - "name": "offset", + "uid": "sortSearchByRelevance", + "name": "sortSearchByRelevance", "comment": { "raw": [ - "See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/offset/}" - ] + "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": "OffsetsFunction | [number | null | undefined, number | null | undefined]" + "raw": "boolean" + }, + "editor": { + "type": "bool" }, + "from": "@epam/uui-core:SearchConfig", "required": false }, { - "uid": "children", - "name": "children", + "uid": "getFilter", + "name": "getFilter", "comment": { "raw": [ - "React Node(s) to show tooltip for" + "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": "React.ReactNode" + "raw": "(filter: TFilter) => (item: TItem) => boolean" }, - "typeValueRef": "@types/react:ReactNode", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:FilterConfig", "required": false }, { - "uid": "maxWidth", - "name": "maxWidth", + "uid": "setItems", + "name": "setItems", "comment": { "raw": [ - "Max width of tooltip" + "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 }, { - "uid": "cx", - "name": "cx", + "uid": "items", + "name": "items", "comment": { "raw": [ - "CSS class(es) to put on component's root. See {@link https://github.com/JedWatson/classnames#usage} for details" + "Data, which should be represented by a DataSource." ] }, "typeValue": { - "raw": "null | string | number | boolean | ClassDictionary | ClassArray" + "raw": "TItem[]" }, - "typeValueRef": "@epam/uui-core:ClassValue", - "from": "@epam/uui-core:IHasCX", + "from": "@epam/uui-core:ArrayDataSourceConfig", "required": false }, { - "uid": "rawProps", - "name": "rawProps", + "uid": "type", + "name": "type", "comment": { "raw": [ - "Any HTML attributes (native or 'data-') to put on the underlying component" + "Type of the tree to be supported." ] }, "typeValue": { - "raw": "React.HTMLAttributes & Record<`data-${string}`, string>" + "raw": "'sync'" }, - "from": "@epam/uui-core:IHasRawProps", - "required": false + "editor": { + "type": "oneOf", + "options": [ + "sync" + ] + }, + "from": "@epam/uui-core:SyncTreeProps", + "required": true }, { - "uid": "value", - "name": "value", + "uid": "type_2", + "name": "type", "comment": { "raw": [ - "The current value of component" + "Type of the tree to be supported." ] }, "typeValue": { - "raw": "boolean" + "raw": "'async'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "async" + ] }, - "from": "@epam/uui-core:IControlled", - "required": false + "from": "@epam/uui-core:AsyncTreeProps", + "required": true }, { - "uid": "onValueChange", - "name": "onValueChange", + "uid": "isLoaded", + "name": "isLoaded", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "Disables loading of records, if isLoaded = true.", + " If isLoaded = true, items are taken from itemsMap.", + " @internal" ] }, "typeValue": { - "raw": "(newValue: boolean) => void" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:AsyncTreeProps", "required": false }, { - "uid": "onClose", - "name": "onClose", + "uid": "itemsMap", + "name": "itemsMap", "comment": { "raw": [ - "Called when dropdown was closed" + "Map of shared items." ] }, "typeValue": { - "raw": "() => void" + "raw": "ItemsMap" }, - "editor": { - "type": "func" + "from": "@epam/uui-core:SharedItemsState", + "required": false + }, + { + "uid": "itemsStatusMap", + "name": "itemsStatusMap", + "comment": { + "raw": [ + "Map of items statuses." + ] }, - "from": "@epam/uui-core:DropdownProps", + "typeValue": { + "raw": "IMap" + }, + "from": "@epam/uui-core:ItemsStatuses", "required": false }, { - "uid": "placement", - "name": "placement", + "uid": "api", + "name": "api", "comment": { "raw": [ - "Defines dropdown body placement relative to target" + "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": "'left' | 'right' | 'auto' | 'auto-start' | 'auto-end' | 'top' | 'bottom' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end'" + "raw": "() => Promise" }, "editor": { - "type": "oneOf", - "options": [ - "left", - "right", - "auto", - "auto-start", - "auto-end", - "top", - "bottom", - "top-start", - "top-end", - "bottom-start", - "bottom-end", - "right-start", - "right-end", - "left-start", - "left-end" - ] + "type": "func" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:AsyncDataSourceConfig", + "required": true }, { - "uid": "modifiers", - "name": "modifiers", + "uid": "api_2", + "name": "api", "comment": { "raw": [ - "Original popper.js modifiers. See [Popper docs]{@link https://popper.js.org/docs/v2/modifiers/}" + "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": "(StrictModifier | Partial>)[]" + "raw": "LazyDataSourceApi" }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "typeValueRef": "@epam/uui-core:LazyDataSourceApi", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", + "required": true }, { - "uid": "openDelay", - "name": "openDelay", + "uid": "getChildCount", + "name": "getChildCount", "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 - } + "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": "number" + "raw": "(item: TItem) => number" }, "editor": { - "type": "number" + "type": "func" }, - "from": "@epam/uui-core:DropdownProps", + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "closeDelay", - "name": "closeDelay", + "uid": "filter", + "name": "filter", "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 - } + "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": "number" - }, - "editor": { - "type": "number" + "raw": "TFilter" }, - "from": "@epam/uui-core:DropdownProps", + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "closeOnMouseLeave", - "name": "closeOnMouseLeave", + "uid": "fetchStrategy", + "name": "fetchStrategy", "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" - } + "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": "false | 'toggler' | 'boundary'" + "raw": "'sequential' | 'parallel'" }, "editor": { "type": "oneOf", "options": [ - false, - "toggler", - "boundary" + "sequential", + "parallel" ] }, - "from": "@epam/uui-core:DropdownProps", + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "portalTarget", - "name": "portalTarget", + "uid": "backgroundReload", + "name": "backgroundReload", "comment": { "raw": [ - "Node of portal target, where to render the dropdown body.", - " By default, will be used global portal node." + "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": "HTMLElement" + "raw": "boolean" }, - "from": "@epam/uui-core:DropdownProps", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "boundaryElement", - "name": "boundaryElement", + "uid": "flattenSearchResults", + "name": "flattenSearchResults", "comment": { "raw": [ - "Element relative to which dropdown will calculate position" + "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": "HTMLElement | HTMLElement[] | 'clippingParents'" + "raw": "boolean" }, - "from": "@epam/uui-core:DropdownProps", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:LazyDataSourceConfig", "required": false }, { - "uid": "closeBodyOnTogglerHidden", - "name": "closeBodyOnTogglerHidden", + "uid": "type_3", + "name": "type", "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 - } + "Type of the tree to be supported." + ] }, "typeValue": { - "raw": "boolean" + "raw": "'lazy'" }, "editor": { - "type": "bool" + "type": "oneOf", + "options": [ + "lazy" + ] }, - "from": "@epam/uui-core:DropdownProps", - "required": false + "from": "@epam/uui-core:LazyTreeProps", + "required": true } ], - "propsFromUnion": false + "propsFromUnion": true } }, - "@epam/uui-core:ITreeNodeInfo": { + "@epam/uui-core:UseTreeResult": { "summary": { "module": "@epam/uui-core", "typeName": { - "name": "ITreeNodeInfo", - "nameFull": "ITreeNodeInfo" + "name": "UseTreeResult", + "nameFull": "UseTreeResult" + }, + "src": "uui-core/src/data/processing/views/tree/hooks/types.ts", + "comment": { + "raw": [ + "Result of the useTree hook." + ] }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", "exported": true }, "details": { "kind": 264, "typeValue": { - "raw": "ITreeNodeInfo", + "raw": "UseTreeResult", "print": [ - "interface ITreeNodeInfo {", - " count?: number;", + "/**", + " * Result of the useTree hook.", + " */", + "interface UseTreeResult extends CommonTreeConfig, ITreeLoadingState, ITreeActions, LoadMissingRecords, GetItemStatus {", + " /**", + " * 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;", "}" ] }, "props": [ { - "uid": "count", - "name": "count", - "typeValue": { - "raw": "number" + "uid": "tree", + "name": "tree", + "comment": { + "raw": [ + "Tree-like data, rows to be build from." + ] }, - "editor": { - "type": "number" + "typeValue": { + "raw": "ITree" }, - "required": false + "required": true }, { - "uid": "totalCount", - "name": "totalCount", - "typeValue": { - "raw": "number" - }, - "editor": { - "type": "number" + "uid": "selectionTree", + "name": "selectionTree", + "comment": { + "raw": [ + "Tree-like data, selected rows to be build from and cascade selection should be performed on." + ] }, - "required": false - } - ], - "propsFromUnion": false - } - }, - "@epam/uui-core:ITreeParams": { - "summary": { - "module": "@epam/uui-core", - "typeName": { - "name": "ITreeParams", - "nameFull": "ITreeParams" - }, - "src": "uui-core/src/data/processing/views/tree/ITree.ts", - "exported": true - }, - "details": { - "kind": 264, - "typeValue": { - "raw": "ITreeParams", - "print": [ - "interface ITreeParams {", - " getId?(item: TItem): TId;", - " getParentId?(item: TItem): TId | undefined;", - " complexIds?: boolean;", - "}" - ] - }, - "props": [ - { - "uid": "getId", - "name": "getId", "typeValue": { - "raw": "(item: TItem) => TId" - }, - "editor": { - "type": "func" + "raw": "ITree" }, - "required": false + "required": true }, { - "uid": "getParentId", - "name": "getParentId", - "typeValue": { - "raw": "(item: TItem) => TId | undefined" + "uid": "treeWithoutPatch", + "name": "treeWithoutPatch", + "comment": { + "raw": [ + "Version of the tree before applying patch to it." + ] }, - "editor": { - "type": "func" + "typeValue": { + "raw": "ITree" }, - "required": false + "required": true }, { - "uid": "complexIds", - "name": "complexIds", + "uid": "totalCount", + "name": "totalCount", + "comment": { + "raw": [ + "Total count of the rows." + ] + }, "typeValue": { - "raw": "boolean" + "raw": "number" }, "editor": { - "type": "bool" + "type": "number" }, "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": "value", - "name": "value", + "uid": "dataSourceState", + "name": "dataSourceState", "comment": { "raw": [ - "Current value of the form state" + "State of the dataSource." ] }, "typeValue": { - "raw": "T" + "raw": "DataSourceState" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:CommonTreeConfig", "required": true }, { - "uid": "getMetadata", - "name": "getMetadata", + "uid": "setDataSourceState", + "name": "setDataSourceState", "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" + "DataSource state update handler." ] }, "typeValue": { - "raw": "(state: T) => Metadata" + "raw": "SetDataSourceState" }, + "typeValueRef": "@epam/uui-core:SetDataSourceState", "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", - "required": false + "from": "@epam/uui-core:CommonTreeConfig", + "required": true }, { - "uid": "onSave", - "name": "onSave", + "uid": "getId", + "name": "getId", "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" + "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": "(state: T) => Promise>" + "raw": "(item: TItem) => TId" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", - "required": true + "from": "@epam/uui-core:BaseDataSourceConfig", + "required": false }, { - "uid": "beforeLeave", - "name": "beforeLeave", + "uid": "complexIds", + "name": "complexIds", "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.", - " 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." + "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 | () => Promise" + "raw": "boolean" }, "editor": { - "type": "func" + "type": "bool" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "loadUnsavedChanges", - "name": "loadUnsavedChanges", + "uid": "getParentId", + "name": "getParentId", "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." + "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": "() => Promise" + "raw": "(item: TItem) => TId | undefined" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "onSuccess", - "name": "onSuccess", + "uid": "rowOptions", + "name": "rowOptions", "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" + "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": "(state: T, isSavedBeforeLeave?: boolean | undefined) => any" - }, - "editor": { - "type": "func" + "raw": "DataRowOptions" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "onError", - "name": "onError", + "uid": "getRowOptions", + "name": "getRowOptions", "comment": { "raw": [ - "Called when save fails" + "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": "(error: any) => any" + "raw": "(item: TItem, index?: number | undefined) => DataRowOptions" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "settingsKey", - "name": "settingsKey", + "uid": "isFoldedByDefault", + "name": "isFoldedByDefault", "comment": { "raw": [ - "The key, under which form save unsaved state usually to localstorage, via uuiUserSettings context)" + "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": "string" + "raw": "(item: TItem, state: DataSourceState) => boolean" }, "editor": { - "type": "string" + "type": "func" }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "validationOn", - "name": "validationOn", + "uid": "cascadeSelection", + "name": "cascadeSelection", "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" + "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": "'change' | 'save'" + "raw": "boolean | 'implicit' | 'explicit'" }, "editor": { "type": "oneOf", "options": [ - "change", - "save" + false, + true, + "implicit", + "explicit" ] }, - "from": "@epam/uui-core:FormProps", + "from": "@epam/uui-core:BaseDataSourceConfig", "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": [ + }, { - "uid": "columns", - "name": "columns", + "uid": "selectAll", + "name": "selectAll", "comment": { "raw": [ - "Columns configuration, can be omitted if used without tables" - ] + "Enables/disables selectAll functionality. If disabled explicitly, `selectAll`, returned from a view is null.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { - "raw": "DataColumnProps[]" + "raw": "boolean" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "filters", - "name": "filters", + "uid": "showSelectedOnly", + "name": "showSelectedOnly", "comment": { "raw": [ - "Filters configuration, can be omitted if you don't need filters" + "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": "TableFiltersConfig[]" + "raw": "boolean" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "editor": { + "type": "bool" + }, + "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, { - "uid": "initialPresets", - "name": "initialPresets", + "uid": "isDeleted", + "name": "isDeleted", "comment": { "raw": [ - "Initial presets array" + "To enable deleting of the items, it is required to specify getter for deleted state." ] }, "typeValue": { - "raw": "ITablePreset[]" + "raw": "(item: TItem) => boolean" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "editor": { + "type": "func" + }, + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "onPresetCreate", - "name": "onPresetCreate", + "uid": "getNewItemPosition", + "name": "getNewItemPosition", "comment": { "raw": [ - "Called when preset was created. Should return the ID of new preset" + "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": "(preset: ITablePreset) => Promise" + "raw": "(item: TItem) => symbol" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "onPresetUpdate", - "name": "onPresetUpdate", + "uid": "getItemTemporaryOrder", + "name": "getItemTemporaryOrder", "comment": { "raw": [ - "Called when preset was updated" + "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": "(preset: ITablePreset) => Promise" + "raw": "(item: TItem) => string" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "onPresetDelete", - "name": "onPresetDelete", + "uid": "patch", + "name": "patch", "comment": { "raw": [ - "Called when preset was deleted" + "Items, which should be added/updated/deleted from the tree." ] }, "typeValue": { - "raw": "(preset: ITablePreset) => Promise" - }, - "editor": { - "type": "func" + "raw": "IMap | IImmutableMap" }, - "from": "@epam/uui-core:UseTableStateHookBaseParams", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "isInvalid", - "name": "isInvalid", + "uid": "fixItemBetweenSortings", + "name": "fixItemBetweenSortings", "comment": { "raw": [ - "True if component contains invalid input" - ] + "If enabled, items position is fixed between sorting.", + " @default true" + ], + "tags": { + "@default": true + } }, "typeValue": { "raw": "boolean" @@ -27767,32 +31578,32 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeInvalid", + "from": "@epam/uui-core:PatchOptions", "required": false }, { - "uid": "isDisabled", - "name": "isDisabled", + "uid": "sortBy", + "name": "sortBy", "comment": { "raw": [ - "Disable editing, and visually de-emphasize value of the component" + "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:IDisableable", + "from": "@epam/uui-core:SortConfig", "required": false }, { - "uid": "isReadonly", - "name": "isReadonly", + "uid": "isFetching", + "name": "isFetching", "comment": { "raw": [ - "Disable editing. Unlike isDisabled, keep component's value readable." + "Are tree records loading silently." ] }, "typeValue": { @@ -27801,15 +31612,15 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeReadonly", + "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "isRequired", - "name": "isRequired", + "uid": "isLoading", + "name": "isLoading", "comment": { "raw": [ - "Marks that component's value is required and shouldn't be empty" + "Are tree records loading loadly (show loading placeholders, etc)." ] }, "typeValue": { @@ -27818,38 +31629,64 @@ "editor": { "type": "bool" }, - "from": "@epam/uui-core:ICanBeRequired", + "from": "@epam/uui-core:ITreeLoadingState", "required": false }, { - "uid": "value", - "name": "value", + "uid": "reload", + "name": "reload", "comment": { "raw": [ - "The current value of component" + "Tree reloading handler." ] }, "typeValue": { - "raw": "DataTableState" + "raw": "() => void" }, - "from": "@epam/uui-core:IControlled", + "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": "onValueChange", - "name": "onValueChange", + "uid": "getItemStatus", + "name": "getItemStatus", "comment": { "raw": [ - "Called when value needs to be changed (usually due to user interaction)" + "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": "(newValue: DataTableState) => void" + "raw": "(id: TId) => RecordStatus" }, "editor": { "type": "func" }, - "from": "@epam/uui-core:IControlled", + "from": "@epam/uui-core:GetItemStatus", "required": false } ], @@ -29152,6 +32989,60 @@ "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", @@ -29185,6 +33076,103 @@ "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", @@ -29218,6 +33206,28 @@ "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", @@ -29442,11 +33452,15 @@ "raw": "AdaptiveItemProps", "print": [ "type AdaptiveItemProps = T & {", - " /** Render callback of the item. It renders items inside the panel and measures their width.", + " /**", + " * Render callback of the item. It renders items inside the panel and measures their width.", " * Pay attention that we can't measure margins. If you need to have margins, please make a wrapper and add margins inside", " * */", " render: (item: AdaptiveItemProps, hiddenItems?: AdaptiveItemProps[], displayedItems?: AdaptiveItemProps[]) => any;", - " /** Item collapsed priority. An item with lower priority will be hidden first, and so on. If several items have the same priority, all of them will be hidden; */", + " /**", + " * 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. */", @@ -29479,7 +33493,8 @@ "name": "priority", "comment": { "raw": [ - "Item collapsed priority. An item with lower priority will be hidden first, and so on. If several items have the same priority, all of them will be hidden;" + "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": { @@ -41697,7 +45712,7 @@ "details": { "kind": 265, "typeValue": { - "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; 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 & 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 & 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 & 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": "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; }", "print": [ "type PickerInputBaseProps = PickerBaseProps & ICanFocus & IHasPlaceholder & IDisableable & ICanBeReadonly & IHasIcon & {", " /** dropdown (default) - show selection in dropdown; modal - opens modal window to select items */", @@ -42178,6 +46193,23 @@ "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", @@ -42816,7 +46848,7 @@ "details": { "kind": 265, "typeValue": { - "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; }", + "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; }", "print": [ "type PickerListBaseProps = Exclude, 'cascadeSelection'> & {", " /**", @@ -43253,6 +47285,23 @@ "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", @@ -44068,7 +48117,7 @@ " cancelIcon?: Icon;", " dropdownIcon?: Icon;", " autoFocus?: boolean;", - " renderItem?(props: DataRowProps): React.ReactNode;", + " renderItem?(props: PickerTogglerRenderItemParams): React.ReactNode;", " getName?: (item: TItem) => string;", " entityName?: string;", " maxItems?: number;", @@ -44125,7 +48174,7 @@ "uid": "renderItem", "name": "renderItem", "typeValue": { - "raw": "(props: DataRowProps) => React.ReactNode" + "raw": "(props: PickerTogglerRenderItemParams) => React.ReactNode" }, "editor": { "type": "component" @@ -44663,6 +48712,131 @@ "propsFromUnion": false } }, + "@epam/uui-components:PickerTogglerRenderItemParams": { + "summary": { + "module": "@epam/uui-components", + "typeName": { + "name": "PickerTogglerRenderItemParams", + "nameFull": "PickerTogglerRenderItemParams" + }, + "src": "uui-components/src/pickers/PickerToggler.tsx", + "exported": true + }, + "details": { + "kind": 264, + "typeValue": { + "raw": "PickerTogglerRenderItemParams", + "print": [ + "interface PickerTogglerRenderItemParams extends IHasCaption, IDisableable {", + " /** Key for the component */", + " key: string;", + " /** DataRowProps object of the rendered item */", + " rowProps?: DataRowProps;", + " /** Indicates that tag is collapsed rest selected items, like '+N items selected' */", + " isCollapsed?: boolean;", + " /** Call to clear a value */", + " onClear?(e?: any): void;", + "}" + ] + }, + "props": [ + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "Key for the component" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "required": true + }, + { + "uid": "rowProps", + "name": "rowProps", + "comment": { + "raw": [ + "DataRowProps object of the rendered item" + ] + }, + "typeValue": { + "raw": "DataRowProps" + }, + "required": false + }, + { + "uid": "isCollapsed", + "name": "isCollapsed", + "comment": { + "raw": [ + "Indicates that tag is collapsed rest selected items, like '+N items selected'" + ] + }, + "typeValue": { + "raw": "boolean" + }, + "editor": { + "type": "bool" + }, + "required": false + }, + { + "uid": "onClear", + "name": "onClear", + "comment": { + "raw": [ + "Call to clear a value" + ] + }, + "typeValue": { + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" + }, + "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": "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 + } + ], + "propsFromUnion": false + } + }, "@epam/uui-components:PortalProps": { "summary": { "module": "@epam/uui-components", @@ -53968,11 +58142,19 @@ "typeValue": { "raw": "TreeProps", "print": [ - "interface TreeProps extends IHasCX, IHasChildren, IEditable {", + "interface TreeProps extends IHasCX, IHasChildren {", " items: TreeListItem[];", " renderRow(row: DataRowProps): void;", " getSearchFields?(item: TItem): string[];", " search?: string;", + " /**", + " * DataSource state.", + " */", + " value: DataSourceState;", + " /**", + " * DataSource state update handler.", + " */", + " onValueChange: SetDataSourceState;", "}" ] }, @@ -54018,6 +58200,36 @@ }, "required": false }, + { + "uid": "value", + "name": "value", + "comment": { + "raw": [ + "DataSource state." + ] + }, + "typeValue": { + "raw": "DataSourceState" + }, + "required": true + }, + { + "uid": "onValueChange", + "name": "onValueChange", + "comment": { + "raw": [ + "DataSource state update handler." + ] + }, + "typeValue": { + "raw": "SetDataSourceState" + }, + "typeValueRef": "@epam/uui-core:SetDataSourceState", + "editor": { + "type": "func" + }, + "required": true + }, { "uid": "cx", "name": "cx", @@ -54047,105 +58259,6 @@ "typeValueRef": "@types/react:ReactNode", "from": "@epam/uui-core:IHasChildren", "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": "DataSourceState, any>" - }, - "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: DataSourceState, any>) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui-core:IControlled", - "required": true } ], "propsFromUnion": false @@ -54164,7 +58277,7 @@ "details": { "kind": 265, "typeValue": { - "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; 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 & 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 & 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 & 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 & 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; }", "print": [ "type UsePickerInputProps = PickerInputBaseProps & TProps & {", " toggleModalOpening?(opened: boolean): void;", @@ -54585,6 +58698,23 @@ "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", @@ -55265,7 +59395,7 @@ "details": { "kind": 265, "typeValue": { - "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", + "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", "print": [ "type UsePickerListProps = PickerListBaseProps & TProps & {};" ] @@ -55683,6 +59813,23 @@ "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", @@ -61957,7 +66104,9 @@ "print": [ "interface DataTableProps extends IEditable, DataSourceListProps, DataTableColumnsConfigOptions, Pick {", " /** Callback to get rows that will be rendered in table */", - " getRows(): DataRowProps[];", + " getRows?(): DataRowProps[];", + " /** Rows that should be rendered in table */", + " rows?: DataRowProps[];", " /** Array of all possible columns for the table */", " columns: DataColumnProps[];", " /** Render callback for the table row.", @@ -62008,7 +66157,20 @@ "editor": { "type": "func" }, - "required": true + "required": false + }, + { + "uid": "rows", + "name": "rows", + "comment": { + "raw": [ + "Rows that should be rendered in table" + ] + }, + "typeValue": { + "raw": "DataRowProps[]" + }, + "required": false }, { "uid": "columns", @@ -72057,14 +76219,14 @@ "details": { "kind": 265, "typeValue": { - "raw": "SizeMod & 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; 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: PickerTogglerTagProps) => JSX.Element) | undefined; } | SizeMod & 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; 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: PickerTogglerTagProps) => JSX.Element) | undefined; } | SizeMod & 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; 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: PickerTogglerTagProps) => JSX.Element) | undefined; } | SizeMod & 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; 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: PickerTogglerTagProps) => JSX.Element) | undefined; }", + "raw": "SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; }", "print": [ "type PickerInputProps = SizeMod & IHasEditMode & PickerInputBaseProps & {", " /**", " * Render callback for picker toggler selection tag", " * If omitted, default `PickerTogglerTag` component will be rendered", " */", - " renderTag?: (props: PickerTogglerTagProps) => JSX.Element;", + " renderTag?: (props: PickerTogglerRenderItemParams) => JSX.Element;", "};" ] }, @@ -72530,6 +76692,23 @@ "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", @@ -73008,7 +77187,7 @@ ] }, "typeValue": { - "raw": "(props: PickerTogglerTagProps) => JSX.Element" + "raw": "(props: PickerTogglerRenderItemParams) => JSX.Element" }, "editor": { "type": "func" @@ -74878,7 +79057,7 @@ "details": { "kind": 265, "typeValue": { - "raw": "SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; }", + "raw": "SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; } | SizeMod & 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; }", "print": [ "type PickerListProps = SizeMod & IHasPlaceholder & PickerModalOptions & {", " renderModalToggler?(props: IClickable & IHasCaption & IDisableable, selection: DataRowProps[]): React.ReactNode;", @@ -75428,6 +79607,23 @@ "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", @@ -76452,13 +80648,9 @@ "typeValue": { "raw": "PickerTogglerTagProps", "print": [ - "interface PickerTogglerTagProps extends TagProps {", + "interface PickerTogglerTagProps extends PickerTogglerRenderItemParams, TagProps {", " /** Defines component size */", " size?: types.ControlSize;", - " /** If this is true, then the PickerTogglerTag will be an additional tag with the number of collapsed elements in the caption. */", - " isCollapsed?: boolean;", - " /** Defines row props (see more: uui-components/src/pickers/PickerToggler.tsx PickerTogglerProps) */", - " rowProps?: DataRowProps;", "}" ] }, @@ -76486,12 +80678,43 @@ }, "required": false }, + { + "uid": "key", + "name": "key", + "comment": { + "raw": [ + "Key for the component" + ] + }, + "typeValue": { + "raw": "string" + }, + "editor": { + "type": "string" + }, + "from": "@epam/uui-components:PickerTogglerRenderItemParams", + "required": true + }, + { + "uid": "rowProps", + "name": "rowProps", + "comment": { + "raw": [ + "DataRowProps object of the rendered item" + ] + }, + "typeValue": { + "raw": "DataRowProps" + }, + "from": "@epam/uui-components:PickerTogglerRenderItemParams", + "required": false + }, { "uid": "isCollapsed", "name": "isCollapsed", "comment": { "raw": [ - "If this is true, then the PickerTogglerTag will be an additional tag with the number of collapsed elements in the caption." + "Indicates that tag is collapsed rest selected items, like '+N items selected'" ] }, "typeValue": { @@ -76500,19 +80723,56 @@ "editor": { "type": "bool" }, + "from": "@epam/uui-components:PickerTogglerRenderItemParams", "required": false }, { - "uid": "rowProps", - "name": "rowProps", + "uid": "onClear", + "name": "onClear", "comment": { "raw": [ - "Defines row props (see more: uui-components/src/pickers/PickerToggler.tsx PickerTogglerProps)" + "Call to clear a value" ] }, "typeValue": { - "raw": "DataRowProps" + "raw": "(e?: any) => void" + }, + "editor": { + "type": "func" + }, + "from": "@epam/uui-components:PickerTogglerRenderItemParams", + "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": "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 }, { @@ -76564,23 +80824,6 @@ "from": "@epam/uui-core:IHasTabIndex", "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": "cx", "name": "cx", @@ -76767,21 +81010,6 @@ "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": "fill", "name": "fill", @@ -76807,23 +81035,6 @@ "from": "@epam/uui:TagCoreProps", "required": false }, - { - "uid": "onClear", - "name": "onClear", - "comment": { - "raw": [ - "Call to clear toggler value" - ] - }, - "typeValue": { - "raw": "(e?: any) => void" - }, - "editor": { - "type": "func" - }, - "from": "@epam/uui:TagCoreProps", - "required": false - }, { "uid": "clearIcon", "name": "clearIcon", @@ -100965,6 +105176,17 @@ "exported": false } }, + "@types/react:Dispatch": { + "summary": { + "module": "@types/react", + "typeName": { + "name": "Dispatch", + "nameFull": "Dispatch" + }, + "src": "node_modules/@types/react/index.d.ts", + "exported": false + } + }, "@types/react:DOMAttributes": { "summary": { "module": "@types/react", diff --git a/uui-docs/src/dataSources/DataSourceViewer.tsx b/uui-docs/src/dataSources/DataSourceViewer.tsx index 99b4bcb6c5..afa44f226e 100644 --- a/uui-docs/src/dataSources/DataSourceViewer.tsx +++ b/uui-docs/src/dataSources/DataSourceViewer.tsx @@ -7,13 +7,15 @@ import css from './DataSourceViewer.module.scss'; interface Props extends IEditable { exampleTitle?: string; selectAll?: boolean; + showSelectedOnly?: boolean; getName?: (item: TItem) => string; dataSource: IDataSource; onValueChange: React.Dispatch>>; + onShowSelectedOnlyChange?: () => void; } export function DataSourceViewer(props: Props) { - const { value, onValueChange, dataSource, exampleTitle, selectAll: showSelectAll } = props; + const { value, onValueChange, dataSource, exampleTitle, selectAll: showSelectAll, showSelectedOnly, onShowSelectedOnlyChange } = props; const view = dataSource.useView(value, onValueChange); const renderItem = (item: TItem, rowProps: DataRowProps) => { @@ -75,6 +77,13 @@ export function DataSourceViewer(props: Props) { onClick={ hasSelection ? clearAll : selectAll } /> )} + {onShowSelectedOnlyChange && ( + + )} { value.checked?.length > 0 && ( From 7d2415dffd815f330711875d1b4ff8015a7949fb Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 13:08:05 +0300 Subject: [PATCH 2/8] [Docs]: changed properties order. --- public/docs/docsGenOutput/docsGenOutput.json | 370 +++++++++---------- uui-core/src/types/dataSources.ts | 11 +- 2 files changed, 192 insertions(+), 189 deletions(-) diff --git a/public/docs/docsGenOutput/docsGenOutput.json b/public/docs/docsGenOutput/docsGenOutput.json index c02836e194..e9ed39a1a5 100644 --- a/public/docs/docsGenOutput/docsGenOutput.json +++ b/public/docs/docsGenOutput/docsGenOutput.json @@ -919,6 +919,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -977,20 +991,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -1352,6 +1352,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -1410,20 +1424,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -2004,6 +2004,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -2062,20 +2076,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -2423,6 +2423,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -2481,20 +2495,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -2842,6 +2842,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -2900,20 +2914,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -3304,6 +3304,20 @@ }, "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -3362,20 +3376,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -4065,6 +4065,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -4123,20 +4137,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -22630,6 +22630,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -22688,20 +22702,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -23093,6 +23093,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -23151,20 +23165,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -24597,6 +24597,10 @@ " */", "interface PatchOptions extends SortConfig {", " /**", + " * Items, which should be added/updated/deleted from the tree.", + " */", + " patch?: IMap | IImmutableMap;", + " /**", " * To enable deleting of the items, it is required to specify getter for deleted state.", " */", " isDeleted?(item: TItem): boolean;", @@ -24617,10 +24621,6 @@ " */", " getItemTemporaryOrder?: (item: TItem) => string;", " /**", - " * Items, which should be added/updated/deleted from the tree.", - " */", - " patch?: IMap | IImmutableMap;", - " /**", " * If enabled, items position is fixed between sorting.", " * @default true", " */", @@ -24629,6 +24629,19 @@ ] }, "props": [ + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -24684,19 +24697,6 @@ }, "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -29656,6 +29656,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -29714,20 +29728,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -30687,6 +30687,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -30745,20 +30759,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", @@ -31488,6 +31488,20 @@ "from": "@epam/uui-core:BaseDataSourceConfig", "required": false }, + { + "uid": "patch", + "name": "patch", + "comment": { + "raw": [ + "Items, which should be added/updated/deleted from the tree." + ] + }, + "typeValue": { + "raw": "IMap | IImmutableMap" + }, + "from": "@epam/uui-core:PatchOptions", + "required": false + }, { "uid": "isDeleted", "name": "isDeleted", @@ -31546,20 +31560,6 @@ "from": "@epam/uui-core:PatchOptions", "required": false }, - { - "uid": "patch", - "name": "patch", - "comment": { - "raw": [ - "Items, which should be added/updated/deleted from the tree." - ] - }, - "typeValue": { - "raw": "IMap | IImmutableMap" - }, - "from": "@epam/uui-core:PatchOptions", - "required": false - }, { "uid": "fixItemBetweenSortings", "name": "fixItemBetweenSortings", diff --git a/uui-core/src/types/dataSources.ts b/uui-core/src/types/dataSources.ts index f8850a5b17..ff85e2123a 100644 --- a/uui-core/src/types/dataSources.ts +++ b/uui-core/src/types/dataSources.ts @@ -124,10 +124,16 @@ export interface IDataSource { * Patch tree configuration. */ export interface PatchOptions extends SortConfig { + /** + * Items, which should be added/updated/deleted from the tree. + */ + patch?: IMap | IImmutableMap; + /** * To enable deleting of the items, it is required to specify getter for deleted state. */ isDeleted?(item: TItem): boolean; + /** * Provides information about the relative position of the new item. * @param item - new item, position should be got for. @@ -135,6 +141,7 @@ export interface PatchOptions extends SortConfig { * @default PatchOrdering.TOP */ getNewItemPosition?: (item: TItem) => PatchOrderingType; + /** * * Provides information about the temporary order of the new item. @@ -144,10 +151,6 @@ export interface PatchOptions extends SortConfig { * @experimental The API of this feature can be changed in the future releases. */ getItemTemporaryOrder?: (item: TItem) => string; - /** - * Items, which should be added/updated/deleted from the tree. - */ - patch?: IMap | IImmutableMap; /** * If enabled, items position is fixed between sorting. From 3c59c99419ea8b7cdf040a56a89f8fa13b1ce761 Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 13:56:34 +0300 Subject: [PATCH 3/8] [Docs]: added docs for patch. --- .../DataSourcePropsPatch.example.tsx | 66 +++++++++++++++++++ .../dataSources/BaseDataSourceProps.doc.tsx | 2 + ...ples-dataSources-DataSourcePropsPatch.json | 23 +++++++ 3 files changed, 91 insertions(+) create mode 100644 app/src/docs/_examples/dataSources/DataSourcePropsPatch.example.tsx create mode 100644 public/docs/content/examples-dataSources-DataSourcePropsPatch.json diff --git a/app/src/docs/_examples/dataSources/DataSourcePropsPatch.example.tsx b/app/src/docs/_examples/dataSources/DataSourcePropsPatch.example.tsx new file mode 100644 index 0000000000..e55fea2b69 --- /dev/null +++ b/app/src/docs/_examples/dataSources/DataSourcePropsPatch.example.tsx @@ -0,0 +1,66 @@ +import React, { useMemo, useState } from 'react'; +import { DataSourceViewer } from '@epam/uui-docs'; +import { DataSourceState, ItemsMap, ItemsMapParams, useArrayDataSource } from '@epam/uui-core'; + +interface Item { + id: string; + name: string; + parentId?: string; +} + +const items: Item[] = [ + { id: '1', name: 'Parent 1' }, + { id: '1.1', name: 'Child 1.1', parentId: '1' }, + { id: '1.2', name: 'Child 1.2', parentId: '1' }, + + { id: '2', name: 'Parent 2' }, + { id: '2.1', name: 'Child 2.1', parentId: '2' }, + { id: '2.2', name: 'Child 2.2', parentId: '2' }, + + { id: '3', name: 'Parent 3' }, + { id: '3.2', name: 'Child 3.2', parentId: '3' }, + { id: '3.1', name: 'Child 3.1', parentId: '3' }, +]; + +const params: ItemsMapParams = { getId: (item) => item.id }; + +export default function DataSourcePropsPatchExample() { + const patch1 = useMemo(() => ItemsMap.fromObject( + { 4: { id: '4', name: 'Parent 4' } }, + params, + ), []); + + const patch2 = useMemo(() => ItemsMap.fromObject( + { 1: { id: '1', name: 'Parent 1 with new name' } }, + params, + ), []); + + const [value1, onValueChange1] = useState({}); + const dataSource1 = useArrayDataSource({ + items, + patch: patch1, + }, []); + + const [value2, onValueChange2] = useState({}); + const dataSource2 = useArrayDataSource({ + items, + patch: patch2, + }, []); + + return ( + <> + + + + ); +} diff --git a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx index e8d2a60051..64339bac95 100644 --- a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx +++ b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx @@ -17,6 +17,8 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { + + ); } diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatch.json b/public/docs/content/examples-dataSources-DataSourcePropsPatch.json new file mode 100644 index 0000000000..6c43504bbf --- /dev/null +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatch.json @@ -0,0 +1,23 @@ +[ + { + "type": "paragraph", + "children": [ + { + "text": "Enables creating/deleting/updating/moving items on the view, without modification of the original data. It makes it possible to use patching along with UUI Forms, keeping only differences between original data and modified ones.\nExamples of real-life usage can be seen " + }, + { + "type": "link", + "url": "/documents?id=editableTables&mode=doc&isSkin=null&category=tables&theme=loveship#editable_table", + "target": "_blank", + "children": [ + { + "text": "here" + } + ] + }, + { + "text": "." + } + ] + } +] \ No newline at end of file From 3e847d448666b4601024e7ba624b16d91102903a Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 14:05:41 +0300 Subject: [PATCH 4/8] [Docs]: added docs for isDeleted. --- .../DataSourcePropsPatchIsDeleted.example.tsx | 49 +++++++++++++++++++ .../dataSources/BaseDataSourceProps.doc.tsx | 1 + ...Sources-DataSourcePropsPatchIsDeleted.json | 10 ++++ 3 files changed, 60 insertions(+) create mode 100644 app/src/docs/_examples/dataSources/DataSourcePropsPatchIsDeleted.example.tsx create mode 100644 public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json diff --git a/app/src/docs/_examples/dataSources/DataSourcePropsPatchIsDeleted.example.tsx b/app/src/docs/_examples/dataSources/DataSourcePropsPatchIsDeleted.example.tsx new file mode 100644 index 0000000000..d7687f1cc5 --- /dev/null +++ b/app/src/docs/_examples/dataSources/DataSourcePropsPatchIsDeleted.example.tsx @@ -0,0 +1,49 @@ +import React, { useMemo, useState } from 'react'; +import { DataSourceViewer } from '@epam/uui-docs'; +import { DataSourceState, ItemsMap, ItemsMapParams, useArrayDataSource } from '@epam/uui-core'; + +interface Item { + id: string; + name: string; + parentId?: string; + isDeleted?: boolean; +} + +const items: Item[] = [ + { id: '1', name: 'Parent 1' }, + { id: '1.1', name: 'Child 1.1', parentId: '1' }, + { id: '1.2', name: 'Child 1.2', parentId: '1' }, + + { id: '2', name: 'Parent 2' }, + { id: '2.1', name: 'Child 2.1', parentId: '2' }, + { id: '2.2', name: 'Child 2.2', parentId: '2' }, + + { id: '3', name: 'Parent 3' }, + { id: '3.2', name: 'Child 3.2', parentId: '3' }, + { id: '3.1', name: 'Child 3.1', parentId: '3' }, +]; + +const params: ItemsMapParams = { getId: (item) => item.id }; + +export default function DataSourcePropsPatchIsDeletedExample() { + const patch = useMemo(() => ItemsMap.fromObject( + { 1: { id: '1', name: 'Parent 1', isDeleted: true } }, + params, + ), []); + + const [value, onValueChange] = useState({}); + const dataSource = useArrayDataSource({ + items, + patch, + isDeleted: (item) => item.isDeleted ?? false, + }, []); + + return ( + + ); +} diff --git a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx index 64339bac95..4f825f57a8 100644 --- a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx +++ b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx @@ -18,6 +18,7 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { + ); diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json b/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json new file mode 100644 index 0000000000..cbafb24dec --- /dev/null +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json @@ -0,0 +1,10 @@ +[ + { + "type": "paragraph", + "children": [ + { + "text": " To enable the deleting of the items, it is required to specify the getter for the deleted state and paste the updated item to the patch." + } + ] + } +] \ No newline at end of file From 7d58d6bd115aa759fe847649b7439c371cf9fe1c Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 14:15:43 +0300 Subject: [PATCH 5/8] [Docs]: added docs to the getNewItemPosition. --- ...cePropsPatchGetNewItemPosition.example.tsx | 78 +++++++++++++++++++ .../dataSources/BaseDataSourceProps.doc.tsx | 1 + ...ataSourcePropsPatchGetNewItemPosition.json | 10 +++ 3 files changed, 89 insertions(+) create mode 100644 app/src/docs/_examples/dataSources/DataSourcePropsPatchGetNewItemPosition.example.tsx create mode 100644 public/docs/content/examples-dataSources-DataSourcePropsPatchGetNewItemPosition.json diff --git a/app/src/docs/_examples/dataSources/DataSourcePropsPatchGetNewItemPosition.example.tsx b/app/src/docs/_examples/dataSources/DataSourcePropsPatchGetNewItemPosition.example.tsx new file mode 100644 index 0000000000..52d8eae7bf --- /dev/null +++ b/app/src/docs/_examples/dataSources/DataSourcePropsPatchGetNewItemPosition.example.tsx @@ -0,0 +1,78 @@ +import React, { useMemo, useState } from 'react'; +import { DataSourceViewer } from '@epam/uui-docs'; +import { DataSourceState, ItemsMap, ItemsMapParams, PatchOrdering, useArrayDataSource } from '@epam/uui-core'; + +interface Item { + id: string; + name: string; + parentId?: string; +} + +const items: Item[] = [ + { id: '1', name: 'Parent 1' }, + { id: '1.1', name: 'Child 1.1', parentId: '1' }, + { id: '1.2', name: 'Child 1.2', parentId: '1' }, + + { id: '2', name: 'Parent 2' }, + { id: '2.1', name: 'Child 2.1', parentId: '2' }, + { id: '2.2', name: 'Child 2.2', parentId: '2' }, + + { id: '3', name: 'Parent 3' }, + { id: '3.2', name: 'Child 3.2', parentId: '3' }, + { id: '3.1', name: 'Child 3.1', parentId: '3' }, +]; + +const params: ItemsMapParams = { getId: (item) => item.id }; + +export default function DataSourcePropsPatchGetNewItemPositionExample() { + const patch = useMemo(() => ItemsMap.fromObject( + { + 1: { id: '1', name: 'Parent 1 with new name' }, + 4: { id: '4', name: 'Parent 4' }, + }, + params, + ), []); + + const [value1, onValueChange1] = useState({}); + const dataSource1 = useArrayDataSource({ + items, + patch, + }, []); + + const [value2, onValueChange2] = useState({}); + const dataSource2 = useArrayDataSource({ + items, + patch, + getNewItemPosition: () => PatchOrdering.TOP, + }, []); + + const [value3, onValueChange3] = useState({}); + const dataSource3 = useArrayDataSource({ + items, + patch, + getNewItemPosition: () => PatchOrdering.BOTTOM, + }, []); + + return ( + <> + + + + + ); +} diff --git a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx index 4f825f57a8..f568de0677 100644 --- a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx +++ b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx @@ -19,6 +19,7 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { + ); diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatchGetNewItemPosition.json b/public/docs/content/examples-dataSources-DataSourcePropsPatchGetNewItemPosition.json new file mode 100644 index 0000000000..3584b15092 --- /dev/null +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatchGetNewItemPosition.json @@ -0,0 +1,10 @@ +[ + { + "children": [ + { + "text": "Specifies, where to put a new item. By default, all new items are placed at the top of the list." + } + ], + "type": "paragraph" + } +] \ No newline at end of file From 5caa2f8eb68f9bdfac742d2347a0ce7691244ebf Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 15:12:11 +0300 Subject: [PATCH 6/8] [Docs]: added docs for fixItemBetweenSortings. --- ...opsPatchFixItemBetweenSortings.example.tsx | 103 ++++++++++++++++++ .../dataSources/BaseDataSourceProps.doc.tsx | 4 +- ...es-dataSources-ArrayDataSourceSorting.json | 68 ++++-------- ...ourcePropsPatchFixItemBetweenSortings.json | 32 ++++++ uui-docs/src/dataSources/columns.tsx | 18 +++ 5 files changed, 175 insertions(+), 50 deletions(-) create mode 100644 app/src/docs/_examples/dataSources/DataSourcePropsPatchFixItemBetweenSortings.example.tsx create mode 100644 public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json diff --git a/app/src/docs/_examples/dataSources/DataSourcePropsPatchFixItemBetweenSortings.example.tsx b/app/src/docs/_examples/dataSources/DataSourcePropsPatchFixItemBetweenSortings.example.tsx new file mode 100644 index 0000000000..3efa997d2f --- /dev/null +++ b/app/src/docs/_examples/dataSources/DataSourcePropsPatchFixItemBetweenSortings.example.tsx @@ -0,0 +1,103 @@ +import React, { useState } from 'react'; +import { DataSourceState, IImmutableMap, ItemsMap, SortingOption, useArrayDataSource, useForm } from '@epam/uui-core'; +import { DataSourceTableViewer, sortableDataSourceColumns } from '@epam/uui-docs'; + +interface Item { + id: string; + name: string; + parentId?: string; +} + +interface FormState { + items: IImmutableMap; +} + +const items: Record = { + 1: { id: '1', name: 'Parent 1' }, + 1.1: { id: '1.1', name: 'Child 1.1', parentId: '1' }, + 1.2: { id: '1.2', name: 'Child 1.2', parentId: '1' }, + + 2: { id: '2', name: 'Parent 2' }, + 2.1: { id: '2.1', name: 'Child 2.1', parentId: '2' }, + 2.2: { id: '2.2', name: 'Child 2.2', parentId: '2' }, + + 3: { id: '3', name: 'Parent 3' }, + 3.2: { id: '3.2', name: 'Child 3.2', parentId: '3' }, + 3.1: { id: '3.1', name: 'Child 3.1', parentId: '3' }, +}; + +const itemsMap = ItemsMap.fromObject(items, { getId: ({ id }) => id }); + +const defaultSorting: SortingOption[] = [{ field: 'name', direction: 'asc' }]; + +export default function DataSourcePropsPatchFixItemBetweenSortingsExample() { + const { lens: lens1, value: formValue1 } = useForm({ + value: { items: itemsMap }, + onSave: () => Promise.resolve(), + }); + + const { lens: lens2, value: formValue2 } = useForm({ + value: { items: itemsMap }, + onSave: () => Promise.resolve(), + }); + + const { lens: lens3, value: formValue3 } = useForm({ + value: { items: itemsMap }, + onSave: () => Promise.resolve(), + }); + + const [value1, onValueChange1] = useState>({ sorting: defaultSorting }); + const dataSource1 = useArrayDataSource({ + items: Object.values(items), + patch: formValue1.items, + getRowOptions: (item) => ({ + ...lens1.prop('items').key(item.id).toProps(), + }), + }, []); + + const [value2, onValueChange2] = useState>({ sorting: defaultSorting }); + const dataSource2 = useArrayDataSource({ + items: Object.values(items), + patch: formValue2.items, + getRowOptions: (item) => ({ + ...lens2.prop('items').key(item.id).toProps(), + }), + fixItemBetweenSortings: true, + }, []); + + const [value3, onValueChange3] = useState>({ sorting: defaultSorting }); + const dataSource3 = useArrayDataSource({ + items: Object.values(items), + patch: formValue3.items, + getRowOptions: (item) => ({ + ...lens3.prop('items').key(item.id).toProps(), + }), + fixItemBetweenSortings: false, + }, []); + + return ( + <> + + + + + ); +} diff --git a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx index f568de0677..6de3383052 100644 --- a/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx +++ b/app/src/docs/dataSources/BaseDataSourceProps.doc.tsx @@ -10,7 +10,7 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { - + @@ -20,7 +20,7 @@ export class DataSourcesBaseDataSourcePropsDoc extends BaseDocsBlock { - + ); } diff --git a/public/docs/content/examples-dataSources-ArrayDataSourceSorting.json b/public/docs/content/examples-dataSources-ArrayDataSourceSorting.json index 4fdd4e7abf..b0b198724e 100644 --- a/public/docs/content/examples-dataSources-ArrayDataSourceSorting.json +++ b/public/docs/content/examples-dataSources-ArrayDataSourceSorting.json @@ -1,53 +1,25 @@ -{ - "object": "value", - "document": { - "object": "document", +[ + { "data": {}, - "nodes": [ + "type": "paragraph", + "children": [ { - "object": "block", - "type": "paragraph", - "data": {}, - "nodes": [ - { - "object": "text", - "text": "To enable a sorting functionality, it is enough to pass a ", - "marks": [] - }, - { - "object": "text", - "text": "sorting", - "marks": [ - { - "object": "mark", - "type": "uui-richTextEditor-code", - "data": {} - } - ] - }, - { - "object": "text", - "text": " object to the ", - "marks": [] - }, - { - "object": "text", - "text": "DataSource", - "marks": [ - { - "object": "mark", - "type": "uui-richTextEditor-code", - "data": {} - } - ] - }, - { - "object": "text", - "text": " state.", - "marks": [] - } - ] + "text": "To enable a sorting functionality, it is enough to pass a " + }, + { + "text": "sorting", + "uui-richTextEditor-code": true + }, + { + "text": " object to the " + }, + { + "text": "DataSource", + "uui-richTextEditor-code": true + }, + { + "text": " state." } ] } -} \ No newline at end of file +] \ No newline at end of file diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json b/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json new file mode 100644 index 0000000000..2c63e152e1 --- /dev/null +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json @@ -0,0 +1,32 @@ +[ + { + "children": [ + { + "text": "To make the patch usable, it was required to add a feature to keep the position of the editable rows during editing until sorting is changed. For this purpose " + }, + { + "text": "fixItemBetweenSortings", + "uui-richTextEditor-code": true + }, + { + "text": " was added." + } + ], + "type": "paragraph" + }, + { + "type": "paragraph", + "children": [ + { + "text": "The only case, when sorting should be enabled during editing is the usage of orderBetween approach, where sorting is not changing. So, in such a case " + }, + { + "text": "fixItemBetweenSortings", + "uui-richTextEditor-code": true + }, + { + "text": " should be turned off." + } + ] + } +] \ No newline at end of file diff --git a/uui-docs/src/dataSources/columns.tsx b/uui-docs/src/dataSources/columns.tsx index 02caed4f26..ced2c61210 100644 --- a/uui-docs/src/dataSources/columns.tsx +++ b/uui-docs/src/dataSources/columns.tsx @@ -19,6 +19,24 @@ export const dataSourceColumns: DataColumnProps<{ name: string }, number, any>[] }, ]; +export const sortableDataSourceColumns: DataColumnProps<{ name: string }, number, any>[] = [ + { + key: 'name', + caption: 'Name', + width: 290, + fix: 'left', + isSortable: true, + renderCell: (props) => ( + } + padding="12" + { ...props } + /> + ), + }, +]; + export const dataSourceTextColumns: DataColumnProps<{ name: string }, number, any>[] = [ { key: 'name', From 5eeed3df786efb2ff30373cbd1248495cc90b570 Mon Sep 17 00:00:00 2001 From: Yakov Zhmurov Date: Thu, 4 Apr 2024 18:26:17 +0300 Subject: [PATCH 7/8] Improvements for patch docs --- ...ples-dataSources-DataSourcePropsPatch.json | 90 ++++++++++++++++++- ...ourcePropsPatchFixItemBetweenSortings.json | 36 ++++++-- ...Sources-DataSourcePropsPatchIsDeleted.json | 2 +- 3 files changed, 119 insertions(+), 9 deletions(-) diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatch.json b/public/docs/content/examples-dataSources-DataSourcePropsPatch.json index 6c43504bbf..3d1b07eb1d 100644 --- a/public/docs/content/examples-dataSources-DataSourcePropsPatch.json +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatch.json @@ -3,7 +3,95 @@ "type": "paragraph", "children": [ { - "text": "Enables creating/deleting/updating/moving items on the view, without modification of the original data. It makes it possible to use patching along with UUI Forms, keeping only differences between original data and modified ones.\nExamples of real-life usage can be seen " + "text": "Contains a list of items, which overrides values of corresponding items in DataSource. Comparison is made by item's id (configured with " + }, + { + "text": "getId", + "uui-richTextEditor-code": true + }, + { + "text": " prop). If a patch contains an item with id=1, this item will override the existing item with the same id=1." + } + ] + }, + { + "type": "paragraph", + "children": [ + { + "text": "Patch prop, as well as complimentary settings, enables updating, adding, deleting, and moving items on the view, without modifying the original data. " + } + ] + }, + { + "type": "paragraph", + "children": [ + { + "text": "Patch prop, as well as complimentary props, enables to:" + } + ] + }, + { + "type": "unordered-list", + "children": [ + { + "type": "list-item", + "children": [ + { + "type": "list-item-child", + "children": [ + { + "text": "edit data, which is managed by LazyDataSource, can be huge, and can't be loaded completely" + } + ] + } + ] + }, + { + "type": "list-item", + "children": [ + { + "type": "list-item-child", + "children": [ + { + "text": "simplify a form initialization - the patch can start as an empty array, and the data to edit can be loaded and managed by Async or Lazy DataSource" + } + ] + } + ] + }, + { + "type": "list-item", + "children": [ + { + "type": "list-item-child", + "children": [ + { + "text": "simplify saving data to server - patch contains only changed data, so you can send a patch as is to server to save it" + } + ] + } + ] + }, + { + "type": "list-item", + "children": [ + { + "type": "list-item-child", + "children": [ + { + "text": "refresh data in DataSources, w/o loosing changes. E.g. you can change sorting in LazyDataSource, causing re-loading data, and the patch will be re-applied to the new data." + } + ] + } + ] + } + ] + }, + { + "type": "paragraph", + "children": [ + { + "text": "Examples of real-life usage can be seen " }, { "type": "link", diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json b/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json index 2c63e152e1..cdcff53eab 100644 --- a/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatchFixItemBetweenSortings.json @@ -2,30 +2,52 @@ { "children": [ { - "text": "To make the patch usable, it was required to add a feature to keep the position of the editable rows during editing until sorting is changed. For this purpose " + "text": "While a row being edited, changes in its values can affect its position. For example, if we have \"Parent1\", \"Parent 2\", and \"Parent 3\", sorted by name, and the user changes \"Parent 3\" to be \"A\" - it should jump to the first position, as \"A\" should be the first item according to sorting. To avoid such jumps, the position of each item is 'fixed' - no item will change its position, until sorting is changed. " + } + ], + "type": "paragraph" + }, + { + "type": "paragraph", + "children": [ + { + "text": "This behavior is controlled with the " }, { "text": "fixItemBetweenSortings", "uui-richTextEditor-code": true }, { - "text": " was added." + "text": " prop, and is enabled by default." } - ], - "type": "paragraph" + ] }, { "type": "paragraph", "children": [ { - "text": "The only case, when sorting should be enabled during editing is the usage of orderBetween approach, where sorting is not changing. So, in such a case " + "text": "There are cases, when you need rows to move instantly, reflecting changes in their value. For example, if you use " }, { - "text": "fixItemBetweenSortings", + "text": "item.order", + "uui-richTextEditor-code": true + }, + { + "text": " and " + }, + { + "text": "getOrderBetween", + "uui-richTextEditor-code": true + }, + { + "text": " helper to control rows order. In this case, you want to disable this 'fixing' behavior by passing " + }, + { + "text": "fixItemBetweenSortings: false", "uui-richTextEditor-code": true }, { - "text": " should be turned off." + "text": "." } ] } diff --git a/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json b/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json index cbafb24dec..29cfdb8bcd 100644 --- a/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json +++ b/public/docs/content/examples-dataSources-DataSourcePropsPatchIsDeleted.json @@ -3,7 +3,7 @@ "type": "paragraph", "children": [ { - "text": " To enable the deleting of the items, it is required to specify the getter for the deleted state and paste the updated item to the patch." + "text": "To enable deleting of items, it is required to specify the getter for the deleted state. Items for which isDeleted(item) == true - will be removed from list." } ] } From 06556a6a8e7107aaa400f7061665907066ad5305 Mon Sep 17 00:00:00 2001 From: Yaroslav Kuznietsov Date: Thu, 4 Apr 2024 18:44:28 +0300 Subject: [PATCH 8/8] [Docs]: changed docs for selectedOnly. --- uui-docs/src/dataSources/DataSourceViewer.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/uui-docs/src/dataSources/DataSourceViewer.tsx b/uui-docs/src/dataSources/DataSourceViewer.tsx index afa44f226e..8a3f57494a 100644 --- a/uui-docs/src/dataSources/DataSourceViewer.tsx +++ b/uui-docs/src/dataSources/DataSourceViewer.tsx @@ -1,6 +1,6 @@ import React, { useCallback } from 'react'; import { DataPickerRow, VirtualList, Text, Panel, LinkButton } from '@epam/promo'; -import { FlexRow, PickerItem } from '@epam/uui'; +import { FlexRow, PickerItem, Switch } from '@epam/uui'; import { DataRowProps, DataSourceState, IDataSource, IEditable } from '@epam/uui-core'; import css from './DataSourceViewer.module.scss'; @@ -78,11 +78,7 @@ export function DataSourceViewer(props: Props) { /> )} {onShowSelectedOnlyChange && ( - + )} { value.checked?.length > 0 && (