@webiny/admin-ui 6.4.11 → 6.4.12-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/DataTable/DataTable.d.ts +16 -6
  2. package/DataTable/DataTable.js +14 -6
  3. package/DataTable/DataTable.js.map +1 -1
  4. package/DataTable/components/ColumnsVisibility.d.ts +5 -4
  5. package/DataTable/components/ColumnsVisibility.js +6 -3
  6. package/DataTable/components/ColumnsVisibility.js.map +1 -1
  7. package/IconPicker/domains/IconPickerIcon.js +1 -1
  8. package/IconPicker/domains/IconPickerIcon.js.map +1 -1
  9. package/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js +1 -1
  10. package/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js.map +1 -1
  11. package/MultiAutoComplete/primitives/useMultiAutoComplete.js +3 -2
  12. package/MultiAutoComplete/primitives/useMultiAutoComplete.js.map +1 -1
  13. package/Toast/useToast.stories.js.map +1 -1
  14. package/package.json +28 -28
package/DataTable/DataTable.d.ts CHANGED
@@ -1,5 +1,15 @@
1
1
  import React from "react";
2
- import type { ColumnSort, OnChangeFn, Row, SortingState, VisibilityState } from "@tanstack/react-table";
2
+ import type { ColumnSort, ColumnVisibilityState, OnChangeFn, Row, RowData, SortingState } from "@tanstack/react-table";
3
+ declare const features: {
4
+ columnResizingFeature: import("@tanstack/table-core").TableFeature;
5
+ columnSizingFeature: import("@tanstack/table-core").TableFeature;
6
+ columnVisibilityFeature: import("@tanstack/table-core").TableFeature;
7
+ rowSelectionFeature: import("@tanstack/table-core").TableFeature;
8
+ rowSortingFeature: import("@tanstack/table-core").TableFeature;
9
+ sortedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
10
+ coreRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
11
+ };
12
+ type Features = typeof features;
3
13
  interface DataTableColumn<T> {
4
14
  header?: string | number | React.JSX.Element;
5
15
  cell?: (row: T) => string | number | React.JSX.Element | null;
@@ -18,13 +28,13 @@ type DataTableDefaultData = {
18
28
  id: string;
19
29
  $selectable?: boolean;
20
30
  };
21
- type DataTableRow<T> = Row<DataTableDefaultData & T>;
31
+ type DataTableRow<T extends RowData> = Row<Features, DataTableDefaultData & T>;
22
32
  type DataTableSorting = SortingState;
23
33
  type DataTableColumnSort = ColumnSort;
24
34
  type OnDataTableSortingChange = OnChangeFn<DataTableSorting>;
25
- type DataTableColumnVisibility = VisibilityState;
35
+ type DataTableColumnVisibility = ColumnVisibilityState;
26
36
  type OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;
27
- interface DataTableProps<TEntry> {
37
+ interface DataTableProps<TEntry extends RowData> {
28
38
  /**
29
39
  * Show or hide borders.
30
40
  */
@@ -52,7 +62,7 @@ interface DataTableProps<TEntry> {
52
62
  /**
53
63
  * Callback that is called to determine if the row is selectable.
54
64
  */
55
- isRowSelectable?: (row: Row<TEntry>) => boolean;
65
+ isRowSelectable?: (row: Row<Features, TEntry>) => boolean;
56
66
  /**
57
67
  * Render the skeleton state while data are loading.
58
68
  */
@@ -105,4 +115,4 @@ declare const DataTable: (<T extends Record<string, any> & DataTableDefaultData>
105
115
  displayName: string;
106
116
  }>) => (props: unknown) => React.JSX.Element;
107
117
  };
108
- export { DataTable, type DataTableProps, type DataTableColumn, type DataTableColumns, type DataTableDefaultData, type DataTableRow, type DataTableSorting, type DataTableColumnSort, type OnDataTableSortingChange, type DataTableColumnVisibility, type OnDataTableColumnVisibilityChange };
118
+ export { DataTable, type Features, type DataTableProps, type DataTableColumn, type DataTableColumns, type DataTableDefaultData, type DataTableRow, type DataTableSorting, type DataTableColumnSort, type OnDataTableSortingChange, type DataTableColumnVisibility, type OnDataTableColumnVisibilityChange };
package/DataTable/DataTable.js CHANGED
@@ -1,10 +1,19 @@
1
1
  import react, { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
2
- import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
2
+ import { columnResizingFeature, columnSizingFeature, columnVisibilityFeature, createCoreRowModel, createSortedRowModel, flexRender, rowSelectionFeature, rowSortingFeature, tableFeatures, useTable } from "@tanstack/react-table";
3
3
  import { CheckboxPrimitive } from "../Checkbox/index.js";
4
4
  import { Skeleton } from "../Skeleton/index.js";
5
5
  import { Table } from "../Table/index.js";
6
6
  import { ColumnSorter, ColumnsVisibility } from "./components/index.js";
7
7
  import { cn, makeDecoratable } from "../utils.js";
8
+ const features = tableFeatures({
9
+ columnResizingFeature: columnResizingFeature,
10
+ columnSizingFeature: columnSizingFeature,
11
+ columnVisibilityFeature: columnVisibilityFeature,
12
+ rowSelectionFeature: rowSelectionFeature,
13
+ rowSortingFeature: rowSortingFeature,
14
+ sortedRowModel: createSortedRowModel(),
15
+ coreRowModel: createCoreRowModel()
16
+ });
8
17
  const defineColumns = (columns, options)=>{
9
18
  const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;
10
19
  return useMemo(()=>{
@@ -20,7 +29,7 @@ const defineColumns = (columns, options)=>{
20
29
  header: ()=>header,
21
30
  cell: (props)=>{
22
31
  if (cell && "function" == typeof cell) return cell(props.row.original);
23
- return props.getValue() ? String(props.getValue()) : null;
32
+ else return props.getValue() ? String(props.getValue()) : null;
24
33
  },
25
34
  enableSorting,
26
35
  meta: {
@@ -141,7 +150,7 @@ const DecoratableDataTable = ({ bordered, canSelectAllRows = true, columnVisibil
141
150
  ...Object.keys(newSelection).filter((x)=>!(x in rowSelection))
142
151
  ];
143
152
  if (1 === toggledRows.length && "function" == typeof onToggleRow) return void onToggleRow(data[parseInt(toggledRows[0])]);
144
- if ("function" == typeof onSelectRow) {
153
+ else if ("function" == typeof onSelectRow) {
145
154
  const selection = Object.keys(newSelection).map((key)=>data[parseInt(key)]);
146
155
  onSelectRow(selection);
147
156
  }
@@ -158,7 +167,8 @@ const DecoratableDataTable = ({ bordered, canSelectAllRows = true, columnVisibil
158
167
  onToggleRow,
159
168
  loading
160
169
  });
161
- const table = useReactTable({
170
+ const table = useTable({
171
+ features: features,
162
172
  columnResizeMode: "onChange",
163
173
  columns,
164
174
  data,
@@ -167,8 +177,6 @@ const DecoratableDataTable = ({ bordered, canSelectAllRows = true, columnVisibil
167
177
  enableRowSelection: isRowSelectable,
168
178
  enableSorting: !!onSortingChange,
169
179
  enableSortingRemoval: false,
170
- getCoreRowModel: getCoreRowModel(),
171
- getSortedRowModel: getSortedRowModel(),
172
180
  manualSorting: true,
173
181
  onColumnVisibilityChange,
174
182
  onRowSelectionChange,
package/DataTable/DataTable.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataTable/DataTable.js","sources":["../../src/DataTable/DataTable.tsx"],"sourcesContent":["import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type {\n Cell,\n Column,\n ColumnDef,\n ColumnSort,\n OnChangeFn,\n Row,\n RowSelectionState,\n SortingState,\n VisibilityState\n} from \"@tanstack/react-table\";\nimport {\n flexRender,\n getCoreRowModel,\n getSortedRowModel,\n useReactTable\n} from \"@tanstack/react-table\";\nimport { CheckboxPrimitive } from \"~/Checkbox/index.js\";\nimport { Skeleton } from \"~/Skeleton/index.js\";\nimport { Table } from \"~/Table/index.js\";\nimport { ColumnSorter, ColumnsVisibility } from \"./components/index.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ninterface DataTableColumn<T> {\n /*\n * Column header component.\n */\n header?: string | number | React.JSX.Element;\n /*\n * Cell renderer, receives the full row and returns the value to render inside the cell.\n */\n cell?: (row: T) => string | number | React.JSX.Element | null;\n /*\n * Column size.\n */\n size?: number;\n /*\n * Should truncate?\n */\n truncate?: boolean;\n /*\n * Column class names.\n */\n className?: string;\n /*\n * Enable column sorting.\n */\n enableSorting?: boolean;\n /*\n * Enable column resizing.\n */\n enableResizing?: boolean;\n /*\n * Enable column visibility toggling.\n */\n enableHiding?: boolean;\n /*\n * Accessor key for the column data path.\n */\n accessorKey?: string;\n}\n\ntype DataTableColumns<T> = {\n [P in keyof T]?: DataTableColumn<T>;\n};\n\ntype DataTableDefaultData = {\n id: string;\n /*\n * Define if a specific row can be selected.\n */\n $selectable?: boolean;\n};\n\ntype DataTableRow<T> = Row<DataTableDefaultData & T>;\n\ntype DataTableSorting = SortingState;\n\ntype DataTableColumnSort = ColumnSort;\n\ntype OnDataTableSortingChange = OnChangeFn<DataTableSorting>;\n\ntype DataTableColumnVisibility = VisibilityState;\n\ntype OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;\n\ninterface DataTableProps<TEntry> {\n /**\n * Show or hide borders.\n */\n bordered?: boolean;\n /**\n * Controls whether \"select all\" action is allowed.\n */\n canSelectAllRows?: boolean;\n /**\n * Columns definition.\n */\n columns: DataTableColumns<TEntry>;\n /**\n * The column visibility state.\n */\n columnVisibility?: DataTableColumnVisibility;\n /**\n * Callback that receives current column visibility state.\n */\n onColumnVisibilityChange?: OnDataTableColumnVisibilityChange;\n /**\n * Data to display into DataTable body.\n */\n data: TEntry[];\n /**\n * Callback that is called to determine if the row is selectable.\n */\n isRowSelectable?: (row: Row<TEntry>) => boolean;\n /**\n * Render the skeleton state while data are loading.\n */\n loading?: boolean;\n /**\n * Callback that receives the selected rows.\n */\n onSelectRow?: (rows: TEntry[]) => void;\n /**\n * Callback that receives the toggled row.\n */\n onToggleRow?: (row: TEntry) => void;\n /**\n * Callback that receives current sorting state.\n */\n onSortingChange?: OnDataTableSortingChange;\n /**\n * Selected rows.\n */\n selectedRows?: TEntry[];\n /**\n * Sorting state.\n */\n sorting?: DataTableSorting;\n /**\n * Initial sorting state.\n */\n initialSorting?: DataTableSorting;\n /**\n * Enable sticky header.\n */\n stickyHeader?: boolean;\n}\n\ninterface DefineColumnsOptions<TEntry> {\n canSelectAllRows: boolean;\n onSelectRow?: DataTableProps<TEntry>[\"onSelectRow\"];\n onToggleRow: DataTableProps<TEntry>[\"onToggleRow\"];\n loading: DataTableProps<TEntry>[\"loading\"];\n}\n\nconst defineColumns = <T,>(\n columns: DataTableProps<T>[\"columns\"],\n options: DefineColumnsOptions<T>\n): ColumnDef<T>[] => {\n const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;\n\n return useMemo(() => {\n const columnsList = Object.keys(columns).map(key => ({\n id: key,\n ...columns[key as keyof typeof columns]\n }));\n\n const defaults: ColumnDef<T>[] = columnsList.map(column => {\n const {\n accessorKey,\n cell,\n className,\n enableHiding = true,\n enableResizing = true,\n enableSorting = false,\n header,\n truncate = true,\n id,\n size = 100\n } = column;\n\n return {\n id,\n accessorKey: accessorKey || id,\n header: () => header,\n cell: props => {\n if (cell && typeof cell === \"function\") {\n return cell(props.row.original);\n } else {\n // Automatically convert any cell value to a string for rendering,\n // ensuring the table displays values correctly. This aligns with React's\n // rendering, which expects JSX, strings or null.\n // https://github.com/TanStack/table/issues/1042\n return props.getValue() ? String(props.getValue()) : null;\n }\n },\n enableSorting,\n meta: {\n className,\n truncate\n },\n enableResizing,\n size,\n enableHiding\n };\n });\n\n let columnsDefs = defaults;\n const firstColumn = defaults[0];\n const isSelectable = onToggleRow || onSelectRow;\n\n if (isSelectable && firstColumn) {\n columnsDefs = [\n {\n ...firstColumn,\n accessorKey: firstColumn.id as string,\n header: props => {\n if (!props) {\n return null;\n }\n\n return (\n <div className={\"flex items-center gap-xl\"}>\n <CheckboxPrimitive\n indeterminate={props.table.getIsSomeRowsSelected()}\n checked={props.table.getIsAllRowsSelected()}\n onChange={props.table.toggleAllPageRowsSelected}\n aria-label=\"Select all\"\n disabled={!canSelectAllRows}\n onClick={e => e.stopPropagation()}\n />\n {firstColumn.header\n ? React.createElement(firstColumn.header, props)\n : null}\n </div>\n );\n },\n cell: props => {\n if (!props) {\n return null;\n }\n return (\n <div className={\"flex items-center gap-xl\"}>\n <CheckboxPrimitive\n checked={props.row.getIsSelected()}\n onChange={value => props.row.toggleSelected(!!value)}\n disabled={!props.row.getCanSelect()}\n aria-label=\"Select row\"\n className={cn(!props.row.getCanSelect() ? \"invisible\" : \"\")}\n />\n {firstColumn.cell\n ? React.createElement(firstColumn.cell, props)\n : null}\n </div>\n );\n }\n },\n ...defaults.slice(1)\n ];\n }\n\n return columnsDefs.map(column => {\n if (loading) {\n return {\n ...column,\n cell: () => <Skeleton type={\"text\"} size={\"md\"} />\n };\n }\n\n return column;\n });\n }, [columns, onSelectRow, onToggleRow, loading]);\n};\n\nconst typedMemo: <T>(component: T) => T = memo;\n\ninterface TableCellProps<T> {\n cell: Cell<T, unknown>;\n getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableCell = <T,>({ cell, getColumnWidth }: TableCellProps<T>) => {\n const width = getColumnWidth(cell.column);\n\n return (\n <Table.Cell {...cell.column.columnDef.meta} style={{ width, maxWidth: width }}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </Table.Cell>\n );\n};\n\nconst MemoTableCell = typedMemo(TableCell);\n\ninterface TableRowProps<T> {\n selected: boolean;\n cells: Cell<T, unknown>[];\n getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableRow = <T,>({ selected, cells, getColumnWidth }: TableRowProps<T>) => {\n return (\n <Table.Row selected={selected}>\n {cells.map(cell => (\n <MemoTableCell<T> key={cell.id} cell={cell} getColumnWidth={getColumnWidth} />\n ))}\n </Table.Row>\n );\n};\n\nconst MemoTableRow = typedMemo(TableRow);\n\n/**\n * Empty array must be defined outside the React component so it does not force rerendering of the DataTable\n */\nconst emptyArray = Array(10).fill({});\n\nconst DecoratableDataTable = <T extends Record<string, any> & DataTableDefaultData>({\n bordered,\n canSelectAllRows = true,\n columnVisibility,\n columns: initialColumns,\n data: initialData,\n initialSorting,\n isRowSelectable,\n loading,\n onColumnVisibilityChange,\n onSelectRow,\n onSortingChange,\n onToggleRow,\n selectedRows = [],\n sorting,\n stickyHeader\n}: DataTableProps<T>) => {\n const tableRef = useRef<HTMLDivElement>(null);\n const [tableWidth, setTableWidth] = useState(1);\n\n const data = loading ? emptyArray : initialData;\n\n useEffect(() => {\n const updateElementWidth = () => {\n if (tableRef.current) {\n const width = tableRef.current.clientWidth;\n setTableWidth(width);\n }\n };\n\n updateElementWidth();\n\n window.addEventListener(\"resize\", updateElementWidth);\n\n return () => {\n window.removeEventListener(\"resize\", updateElementWidth);\n };\n }, [tableRef.current]);\n\n const rowSelection = useMemo(() => {\n return selectedRows.reduce<RowSelectionState>((acc, item) => {\n const recordIndex = data.findIndex(rec => rec.id === item.id);\n return { ...acc, [recordIndex]: true };\n }, {});\n }, [selectedRows, data]);\n\n const onRowSelectionChange: OnChangeFn<RowSelectionState> = updater => {\n const newSelection = typeof updater === \"function\" ? updater(rowSelection) : updater;\n\n /**\n * `@tanstack/react-table` isn't telling us what row was selected or deselected. It simply gives us\n * the new selection state (an object with row indexes that are currently selected).\n *\n * To figure out what row was toggled, we need to calculate the difference between the old selection\n * and the new selection. What we're doing here is:\n * - find all items that were present in the previous selection, but are no longer present in the new selection\n * - find all items that are present in the new selection, but were not present in the previous selection\n */\n const toggledRows = [\n ...Object.keys(rowSelection).filter(x => !(x in newSelection)),\n ...Object.keys(newSelection).filter(x => !(x in rowSelection))\n ];\n\n // If the difference is only 1 item, and `onToggleRow` is available, execute that.\n if (toggledRows.length === 1 && typeof onToggleRow === \"function\") {\n onToggleRow(data[parseInt(toggledRows[0])]);\n return;\n } else if (typeof onSelectRow === \"function\") {\n const selection = Object.keys(newSelection).map(key => data[parseInt(key)]);\n onSelectRow(selection);\n }\n };\n\n const tableSorting = useMemo(() => {\n if (!Array.isArray(sorting) || !sorting.length) {\n return initialSorting;\n }\n return sorting;\n }, [sorting]);\n\n const columns = defineColumns(initialColumns, {\n canSelectAllRows,\n onSelectRow,\n onToggleRow,\n loading\n });\n\n const table = useReactTable<T>({\n columnResizeMode: \"onChange\",\n columns,\n data,\n enableColumnResizing: true,\n enableHiding: !!onColumnVisibilityChange,\n enableRowSelection: isRowSelectable,\n enableSorting: !!onSortingChange,\n enableSortingRemoval: false,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n manualSorting: true,\n onColumnVisibilityChange,\n onRowSelectionChange,\n onSortingChange,\n state: {\n columnVisibility,\n rowSelection,\n sorting: tableSorting\n }\n });\n\n const getColumnWidth = useCallback(\n (column: Column<T>): number => {\n // Non-resizable columns (e.g. row-selection, actions) keep their fixed size.\n if (!column.getCanResize()) {\n return column.getSize();\n }\n\n /**\n * Resizable columns share the space left after the fixed columns, proportionally to\n * their own size. This makes the table always fill the full container width — even when\n * columns are hidden — so trailing content (e.g. the columns-visibility cog) stays\n * flush right instead of drifting left as columns are removed.\n */\n const visibleColumns = table.getVisibleLeafColumns();\n const fixedTotal = visibleColumns\n .filter(col => !col.getCanResize())\n .reduce((total, col) => total + col.getSize(), 0);\n const resizableTotal = visibleColumns\n .filter(col => col.getCanResize())\n .reduce((total, col) => total + col.getSize(), 0);\n\n if (resizableTotal === 0) {\n return column.getSize();\n }\n\n const available = Math.max(tableWidth - fixedTotal, 0);\n\n return Math.ceil((column.getSize() * available) / resizableTotal);\n },\n [table, tableWidth]\n );\n\n /**\n * Had to memoize the rows to avoid browser freeze.\n */\n const tableRows = useMemo(() => {\n return table.getRowModel().rows;\n }, [table, data, columns]);\n\n return (\n <div ref={tableRef}>\n <Table bordered={bordered} sticky={stickyHeader}>\n <Table.Header sticky={stickyHeader}>\n {table.getHeaderGroups().map(headerGroup => (\n <Table.Row key={headerGroup.id}>\n {headerGroup.headers.map((header, index) => {\n const isLastCell = index === headerGroup.headers.length - 1;\n const width = getColumnWidth(header.column);\n\n return (\n <Table.Head\n key={header.id}\n {...header.column.columnDef.meta}\n colSpan={header.colSpan}\n style={{ width, maxWidth: width }}\n >\n {header.isPlaceholder ? null : (\n <ColumnSorter\n onClick={header.column.getToggleSortingHandler()}\n sortable={header.column.getCanSort()}\n >\n <div\n className={cn({\n \"w-full overflow-hidden whitespace-nowrap\": true,\n truncate: !isLastCell\n })}\n >\n {flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </div>\n <Table.Direction\n direction={header.column.getIsSorted() || null}\n />\n {isLastCell && (\n <div className={\"h-md\"}>\n <ColumnsVisibility\n columns={table.getAllColumns()}\n />\n </div>\n )}\n </ColumnSorter>\n )}\n {header.column.getCanResize() && (\n <Table.Resizer\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n isResizing={header.column.getIsResizing()}\n />\n )}\n </Table.Head>\n );\n })}\n </Table.Row>\n ))}\n </Table.Header>\n <Table.Body>\n {tableRows.map(row => {\n const id = row.original.id || row.id;\n return (\n <MemoTableRow<T>\n key={id}\n cells={row.getVisibleCells()}\n selected={row.getIsSelected()}\n getColumnWidth={getColumnWidth}\n />\n );\n })}\n </Table.Body>\n </Table>\n </div>\n );\n};\n\nconst DataTable = makeDecoratable(\"DataTable\", DecoratableDataTable);\n\nexport {\n DataTable,\n type DataTableProps,\n type DataTableColumn,\n type DataTableColumns,\n type DataTableDefaultData,\n type DataTableRow,\n type DataTableSorting,\n type DataTableColumnSort,\n type OnDataTableSortingChange,\n type DataTableColumnVisibility,\n type OnDataTableColumnVisibilityChange\n};\n"],"names":["defineColumns","columns","options","canSelectAllRows","onSelectRow","onToggleRow","loading","useMemo","columnsList","Object","key","defaults","column","accessorKey","cell","className","enableHiding","enableResizing","enableSorting","header","truncate","id","size","props","String","columnsDefs","firstColumn","isSelectable","CheckboxPrimitive","e","React","value","cn","Skeleton","typedMemo","memo","TableCell","getColumnWidth","width","Table","flexRender","MemoTableCell","TableRow","selected","cells","MemoTableRow","emptyArray","Array","DecoratableDataTable","bordered","columnVisibility","initialColumns","initialData","initialSorting","isRowSelectable","onColumnVisibilityChange","onSortingChange","selectedRows","sorting","stickyHeader","tableRef","useRef","tableWidth","setTableWidth","useState","data","useEffect","updateElementWidth","window","rowSelection","acc","item","recordIndex","rec","onRowSelectionChange","updater","newSelection","toggledRows","x","parseInt","selection","tableSorting","table","useReactTable","getCoreRowModel","getSortedRowModel","useCallback","visibleColumns","fixedTotal","col","total","resizableTotal","available","Math","tableRows","headerGroup","index","isLastCell","ColumnSorter","ColumnsVisibility","row","DataTable","makeDecoratable"],"mappings":"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"}
1
+ {"version":3,"file":"DataTable/DataTable.js","sources":["../../src/DataTable/DataTable.tsx"],"sourcesContent":["import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type {\n Cell,\n Column,\n ColumnDef,\n ColumnSort,\n ColumnVisibilityState,\n OnChangeFn,\n Row,\n RowData,\n RowSelectionState,\n SortingState\n} from \"@tanstack/react-table\";\nimport {\n columnResizingFeature,\n columnSizingFeature,\n columnVisibilityFeature,\n createCoreRowModel,\n createSortedRowModel,\n flexRender,\n rowSelectionFeature,\n rowSortingFeature,\n tableFeatures,\n useTable\n} from \"@tanstack/react-table\";\nimport { CheckboxPrimitive } from \"~/Checkbox/index.js\";\nimport { Skeleton } from \"~/Skeleton/index.js\";\nimport { Table } from \"~/Table/index.js\";\nimport { ColumnSorter, ColumnsVisibility } from \"./components/index.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\nconst features = tableFeatures({\n columnResizingFeature,\n columnSizingFeature,\n columnVisibilityFeature,\n rowSelectionFeature,\n rowSortingFeature,\n sortedRowModel: createSortedRowModel(),\n coreRowModel: createCoreRowModel()\n});\n\ntype Features = typeof features;\n\ninterface DataTableColumn<T> {\n /*\n * Column header component.\n */\n header?: string | number | React.JSX.Element;\n /*\n * Cell renderer, receives the full row and returns the value to render inside the cell.\n */\n cell?: (row: T) => string | number | React.JSX.Element | null;\n /*\n * Column size.\n */\n size?: number;\n /*\n * Should truncate?\n */\n truncate?: boolean;\n /*\n * Column class names.\n */\n className?: string;\n /*\n * Enable column sorting.\n */\n enableSorting?: boolean;\n /*\n * Enable column resizing.\n */\n enableResizing?: boolean;\n /*\n * Enable column visibility toggling.\n */\n enableHiding?: boolean;\n /*\n * Accessor key for the column data path.\n */\n accessorKey?: string;\n}\n\ntype DataTableColumns<T> = {\n [P in keyof T]?: DataTableColumn<T>;\n};\n\ntype DataTableDefaultData = {\n id: string;\n /*\n * Define if a specific row can be selected.\n */\n $selectable?: boolean;\n};\n\ntype DataTableRow<T extends RowData> = Row<Features, DataTableDefaultData & T>;\n\ntype DataTableSorting = SortingState;\n\ntype DataTableColumnSort = ColumnSort;\n\ntype OnDataTableSortingChange = OnChangeFn<DataTableSorting>;\n\ntype DataTableColumnVisibility = ColumnVisibilityState;\n\ntype OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;\n\ninterface DataTableProps<TEntry extends RowData> {\n /**\n * Show or hide borders.\n */\n bordered?: boolean;\n /**\n * Controls whether \"select all\" action is allowed.\n */\n canSelectAllRows?: boolean;\n /**\n * Columns definition.\n */\n columns: DataTableColumns<TEntry>;\n /**\n * The column visibility state.\n */\n columnVisibility?: DataTableColumnVisibility;\n /**\n * Callback that receives current column visibility state.\n */\n onColumnVisibilityChange?: OnDataTableColumnVisibilityChange;\n /**\n * Data to display into DataTable body.\n */\n data: TEntry[];\n /**\n * Callback that is called to determine if the row is selectable.\n */\n isRowSelectable?: (row: Row<Features, TEntry>) => boolean;\n /**\n * Render the skeleton state while data are loading.\n */\n loading?: boolean;\n /**\n * Callback that receives the selected rows.\n */\n onSelectRow?: (rows: TEntry[]) => void;\n /**\n * Callback that receives the toggled row.\n */\n onToggleRow?: (row: TEntry) => void;\n /**\n * Callback that receives current sorting state.\n */\n onSortingChange?: OnDataTableSortingChange;\n /**\n * Selected rows.\n */\n selectedRows?: TEntry[];\n /**\n * Sorting state.\n */\n sorting?: DataTableSorting;\n /**\n * Initial sorting state.\n */\n initialSorting?: DataTableSorting;\n /**\n * Enable sticky header.\n */\n stickyHeader?: boolean;\n}\n\ninterface DefineColumnsOptions<TEntry extends RowData> {\n canSelectAllRows: boolean;\n onSelectRow?: DataTableProps<TEntry>[\"onSelectRow\"];\n onToggleRow: DataTableProps<TEntry>[\"onToggleRow\"];\n loading: DataTableProps<TEntry>[\"loading\"];\n}\n\nconst defineColumns = <T extends RowData>(\n columns: DataTableProps<T>[\"columns\"],\n options: DefineColumnsOptions<T>\n): ColumnDef<Features, T>[] => {\n const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;\n\n return useMemo(() => {\n const columnsList = Object.keys(columns).map(key => ({\n id: key,\n ...columns[key as keyof typeof columns]\n }));\n\n const defaults: ColumnDef<Features, T>[] = columnsList.map(column => {\n const {\n accessorKey,\n cell,\n className,\n enableHiding = true,\n enableResizing = true,\n enableSorting = false,\n header,\n truncate = true,\n id,\n size = 100\n } = column;\n\n return {\n id,\n accessorKey: accessorKey || id,\n header: () => header,\n cell: props => {\n if (cell && typeof cell === \"function\") {\n return cell(props.row.original);\n } else {\n // Automatically convert any cell value to a string for rendering,\n // ensuring the table displays values correctly. This aligns with React's\n // rendering, which expects JSX, strings or null.\n // https://github.com/TanStack/table/issues/1042\n return props.getValue() ? String(props.getValue()) : null;\n }\n },\n enableSorting,\n meta: {\n className,\n truncate\n },\n enableResizing,\n size,\n enableHiding\n };\n });\n\n let columnsDefs = defaults;\n const firstColumn = defaults[0];\n const isSelectable = onToggleRow || onSelectRow;\n\n if (isSelectable && firstColumn) {\n columnsDefs = [\n {\n ...firstColumn,\n accessorKey: firstColumn.id as string,\n header: props => {\n if (!props) {\n return null;\n }\n\n return (\n <div className={\"flex items-center gap-xl\"}>\n <CheckboxPrimitive\n indeterminate={props.table.getIsSomeRowsSelected()}\n checked={props.table.getIsAllRowsSelected()}\n onChange={props.table.toggleAllPageRowsSelected}\n aria-label=\"Select all\"\n disabled={!canSelectAllRows}\n onClick={e => e.stopPropagation()}\n />\n {firstColumn.header\n ? React.createElement(firstColumn.header, props)\n : null}\n </div>\n );\n },\n cell: props => {\n if (!props) {\n return null;\n }\n return (\n <div className={\"flex items-center gap-xl\"}>\n <CheckboxPrimitive\n checked={props.row.getIsSelected()}\n onChange={value => props.row.toggleSelected(!!value)}\n disabled={!props.row.getCanSelect()}\n aria-label=\"Select row\"\n className={cn(!props.row.getCanSelect() ? \"invisible\" : \"\")}\n />\n {firstColumn.cell\n ? React.createElement(firstColumn.cell, props)\n : null}\n </div>\n );\n }\n },\n ...defaults.slice(1)\n ];\n }\n\n return columnsDefs.map(column => {\n if (loading) {\n return {\n ...column,\n cell: () => <Skeleton type={\"text\"} size={\"md\"} />\n };\n }\n\n return column;\n });\n }, [columns, onSelectRow, onToggleRow, loading]);\n};\n\nconst typedMemo: <T>(component: T) => T = memo;\n\ninterface TableCellProps<T extends RowData> {\n cell: Cell<Features, T, unknown>;\n getColumnWidth: (column: Column<Features, T>) => number;\n}\n\nconst TableCell = <T extends RowData>({ cell, getColumnWidth }: TableCellProps<T>) => {\n const width = getColumnWidth(cell.column);\n\n return (\n <Table.Cell {...cell.column.columnDef.meta} style={{ width, maxWidth: width }}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </Table.Cell>\n );\n};\n\nconst MemoTableCell = typedMemo(TableCell);\n\ninterface TableRowProps<T extends RowData> {\n selected: boolean;\n cells: Cell<Features, T, unknown>[];\n getColumnWidth: (column: Column<Features, T>) => number;\n}\n\nconst TableRow = <T extends RowData>({ selected, cells, getColumnWidth }: TableRowProps<T>) => {\n return (\n <Table.Row selected={selected}>\n {cells.map(cell => (\n <MemoTableCell<T> key={cell.id} cell={cell} getColumnWidth={getColumnWidth} />\n ))}\n </Table.Row>\n );\n};\n\nconst MemoTableRow = typedMemo(TableRow);\n\n/**\n * Empty array must be defined outside the React component so it does not force rerendering of the DataTable\n */\nconst emptyArray = Array(10).fill({});\n\nconst DecoratableDataTable = <T extends Record<string, any> & DataTableDefaultData>({\n bordered,\n canSelectAllRows = true,\n columnVisibility,\n columns: initialColumns,\n data: initialData,\n initialSorting,\n isRowSelectable,\n loading,\n onColumnVisibilityChange,\n onSelectRow,\n onSortingChange,\n onToggleRow,\n selectedRows = [],\n sorting,\n stickyHeader\n}: DataTableProps<T>) => {\n const tableRef = useRef<HTMLDivElement>(null);\n const [tableWidth, setTableWidth] = useState(1);\n\n const data = loading ? emptyArray : initialData;\n\n useEffect(() => {\n const updateElementWidth = () => {\n if (tableRef.current) {\n const width = tableRef.current.clientWidth;\n setTableWidth(width);\n }\n };\n\n updateElementWidth();\n\n window.addEventListener(\"resize\", updateElementWidth);\n\n return () => {\n window.removeEventListener(\"resize\", updateElementWidth);\n };\n }, [tableRef.current]);\n\n const rowSelection = useMemo(() => {\n return selectedRows.reduce<RowSelectionState>((acc, item) => {\n const recordIndex = data.findIndex(rec => rec.id === item.id);\n return { ...acc, [recordIndex]: true };\n }, {});\n }, [selectedRows, data]);\n\n const onRowSelectionChange: OnChangeFn<RowSelectionState> = updater => {\n const newSelection = typeof updater === \"function\" ? updater(rowSelection) : updater;\n\n /**\n * `@tanstack/react-table` isn't telling us what row was selected or deselected. It simply gives us\n * the new selection state (an object with row indexes that are currently selected).\n *\n * To figure out what row was toggled, we need to calculate the difference between the old selection\n * and the new selection. What we're doing here is:\n * - find all items that were present in the previous selection, but are no longer present in the new selection\n * - find all items that are present in the new selection, but were not present in the previous selection\n */\n const toggledRows = [\n ...Object.keys(rowSelection).filter(x => !(x in newSelection)),\n ...Object.keys(newSelection).filter(x => !(x in rowSelection))\n ];\n\n // If the difference is only 1 item, and `onToggleRow` is available, execute that.\n if (toggledRows.length === 1 && typeof onToggleRow === \"function\") {\n onToggleRow(data[parseInt(toggledRows[0])]);\n return;\n } else if (typeof onSelectRow === \"function\") {\n const selection = Object.keys(newSelection).map(key => data[parseInt(key)]);\n onSelectRow(selection);\n }\n };\n\n const tableSorting = useMemo(() => {\n if (!Array.isArray(sorting) || !sorting.length) {\n return initialSorting;\n }\n return sorting;\n }, [sorting]);\n\n const columns = defineColumns(initialColumns, {\n canSelectAllRows,\n onSelectRow,\n onToggleRow,\n loading\n });\n\n const table = useTable<typeof features, T>({\n features,\n columnResizeMode: \"onChange\",\n columns,\n data,\n enableColumnResizing: true,\n enableHiding: !!onColumnVisibilityChange,\n enableRowSelection: isRowSelectable,\n enableSorting: !!onSortingChange,\n enableSortingRemoval: false,\n manualSorting: true,\n onColumnVisibilityChange,\n onRowSelectionChange,\n onSortingChange,\n state: {\n columnVisibility,\n rowSelection,\n sorting: tableSorting\n }\n });\n\n const getColumnWidth = useCallback(\n (column: Column<Features, T>): number => {\n // Non-resizable columns (e.g. row-selection, actions) keep their fixed size.\n if (!column.getCanResize()) {\n return column.getSize();\n }\n\n /**\n * Resizable columns share the space left after the fixed columns, proportionally to\n * their own size. This makes the table always fill the full container width — even when\n * columns are hidden — so trailing content (e.g. the columns-visibility cog) stays\n * flush right instead of drifting left as columns are removed.\n */\n const visibleColumns = table.getVisibleLeafColumns();\n const fixedTotal = visibleColumns\n .filter(col => !col.getCanResize())\n .reduce((total, col) => total + col.getSize(), 0);\n const resizableTotal = visibleColumns\n .filter(col => col.getCanResize())\n .reduce((total, col) => total + col.getSize(), 0);\n\n if (resizableTotal === 0) {\n return column.getSize();\n }\n\n const available = Math.max(tableWidth - fixedTotal, 0);\n\n return Math.ceil((column.getSize() * available) / resizableTotal);\n },\n [table, tableWidth]\n );\n\n /**\n * Had to memoize the rows to avoid browser freeze.\n */\n const tableRows = useMemo(() => {\n return table.getRowModel().rows;\n }, [table, data, columns]);\n\n return (\n <div ref={tableRef}>\n <Table bordered={bordered} sticky={stickyHeader}>\n <Table.Header sticky={stickyHeader}>\n {table.getHeaderGroups().map(headerGroup => (\n <Table.Row key={headerGroup.id}>\n {headerGroup.headers.map((header, index) => {\n const isLastCell = index === headerGroup.headers.length - 1;\n const width = getColumnWidth(header.column);\n\n return (\n <Table.Head\n key={header.id}\n {...header.column.columnDef.meta}\n colSpan={header.colSpan}\n style={{ width, maxWidth: width }}\n >\n {header.isPlaceholder ? null : (\n <ColumnSorter\n onClick={header.column.getToggleSortingHandler()}\n sortable={header.column.getCanSort()}\n >\n <div\n className={cn({\n \"w-full overflow-hidden whitespace-nowrap\": true,\n truncate: !isLastCell\n })}\n >\n {flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </div>\n <Table.Direction\n direction={header.column.getIsSorted() || null}\n />\n {isLastCell && (\n <div className={\"h-md\"}>\n <ColumnsVisibility\n columns={table.getAllColumns()}\n />\n </div>\n )}\n </ColumnSorter>\n )}\n {header.column.getCanResize() && (\n <Table.Resizer\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n isResizing={header.column.getIsResizing()}\n />\n )}\n </Table.Head>\n );\n })}\n </Table.Row>\n ))}\n </Table.Header>\n <Table.Body>\n {tableRows.map(row => {\n const id = row.original.id || row.id;\n return (\n <MemoTableRow<T>\n key={id}\n cells={row.getVisibleCells()}\n selected={row.getIsSelected()}\n getColumnWidth={getColumnWidth}\n />\n );\n })}\n </Table.Body>\n </Table>\n </div>\n );\n};\n\nconst DataTable = makeDecoratable(\"DataTable\", DecoratableDataTable);\n\nexport {\n DataTable,\n type Features,\n type DataTableProps,\n type DataTableColumn,\n type DataTableColumns,\n type DataTableDefaultData,\n type DataTableRow,\n type DataTableSorting,\n type DataTableColumnSort,\n type OnDataTableSortingChange,\n type DataTableColumnVisibility,\n type OnDataTableColumnVisibilityChange\n};\n"],"names":["features","tableFeatures","columnResizingFeature","columnSizingFeature","columnVisibilityFeature","rowSelectionFeature","rowSortingFeature","createSortedRowModel","createCoreRowModel","defineColumns","columns","options","canSelectAllRows","onSelectRow","onToggleRow","loading","useMemo","columnsList","Object","key","defaults","column","accessorKey","cell","className","enableHiding","enableResizing","enableSorting","header","truncate","id","size","props","String","columnsDefs","firstColumn","isSelectable","CheckboxPrimitive","e","React","value","cn","Skeleton","typedMemo","memo","TableCell","getColumnWidth","width","Table","flexRender","MemoTableCell","TableRow","selected","cells","MemoTableRow","emptyArray","Array","DecoratableDataTable","bordered","columnVisibility","initialColumns","initialData","initialSorting","isRowSelectable","onColumnVisibilityChange","onSortingChange","selectedRows","sorting","stickyHeader","tableRef","useRef","tableWidth","setTableWidth","useState","data","useEffect","updateElementWidth","window","rowSelection","acc","item","recordIndex","rec","onRowSelectionChange","updater","newSelection","toggledRows","x","parseInt","selection","tableSorting","table","useTable","useCallback","visibleColumns","fixedTotal","col","total","resizableTotal","available","Math","tableRows","headerGroup","index","isLastCell","ColumnSorter","ColumnsVisibility","row","DataTable","makeDecoratable"],"mappings":"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"}
package/DataTable/components/ColumnsVisibility.d.ts CHANGED
@@ -1,7 +1,8 @@
1
1
  import React from "react";
2
- import type { Column } from "@tanstack/react-table";
3
- interface ColumnsVisibilityProps<T> {
4
- columns: Column<T>[];
2
+ import type { Column, RowData } from "@tanstack/react-table";
3
+ import type { Features } from "../DataTable.js";
4
+ interface ColumnsVisibilityProps<T extends RowData> {
5
+ columns: Column<Features, T>[];
5
6
  }
6
- export declare const ColumnsVisibility: <T>(props: ColumnsVisibilityProps<T>) => React.JSX.Element | null;
7
+ export declare const ColumnsVisibility: <T extends RowData>(props: ColumnsVisibilityProps<T>) => React.JSX.Element | null;
7
8
  export {};
package/DataTable/components/ColumnsVisibility.js CHANGED
@@ -7,14 +7,17 @@ const ColumnsVisibility = (props)=>{
7
7
  const getHeaderName = useCallback((column)=>{
8
8
  const { header } = column.columnDef;
9
9
  if ("string" == typeof header) return header;
10
- if ("function" == typeof header) return header();
10
+ if ("function" == typeof header) {
11
+ const flatHeader = column.table.getFlatHeaders().find((h)=>h.column.id === column.id);
12
+ if (flatHeader) return header(flatHeader.getContext());
13
+ }
11
14
  return column.id;
12
15
  }, []);
13
16
  const options = useMemo(()=>props.columns.filter((column)=>column.getCanHide()).map((column)=>({
14
17
  id: column.id,
15
18
  header: getHeaderName(column),
16
- onChange: column.toggleVisibility,
17
- getValue: column.getIsVisible
19
+ onChange: (value)=>column.toggleVisibility(value),
20
+ getValue: ()=>column.getIsVisible()
18
21
  })), [
19
22
  props.columns
20
23
  ]);
package/DataTable/components/ColumnsVisibility.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataTable/components/ColumnsVisibility.js","sources":["../../../src/DataTable/components/ColumnsVisibility.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { Checkbox } from \"~/Checkbox/index.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\n\ninterface ColumnsVisibilityProps<T> {\n columns: Column<T>[];\n}\n\ninterface Option {\n id: string;\n header: string;\n onChange: (value?: boolean | undefined) => void;\n getValue: () => boolean;\n}\n\nexport const ColumnsVisibility = <T,>(props: ColumnsVisibilityProps<T>) => {\n /**\n * `@tanstack/react-table` does not have a simple method to return the header component.\n * The only possible way is to use `flexRenderer`, but this is not working with the current implementation\n * since we don't have access to the header context.\n */\n const getHeaderName = useCallback((column: Column<T>) => {\n const { header } = column.columnDef;\n\n if (typeof header === \"string\") {\n return header;\n }\n\n if (typeof header === \"function\") {\n // @ts-expect-error\n return header();\n }\n\n return column.id;\n }, []);\n\n const options: Option[] = useMemo(() => {\n return props.columns\n .filter(column => column.getCanHide())\n .map(column => {\n return {\n id: column.id,\n header: getHeaderName(column),\n onChange: column.toggleVisibility,\n getValue: column.getIsVisible\n };\n });\n }, [props.columns]);\n\n if (options.length === 0) {\n return null;\n }\n\n return (\n <DropdownMenu\n trigger={<IconButton icon={<SettingsIcon />} variant={\"ghost\"} size={\"xs\"} />}\n >\n <DropdownMenu.Label text={\"Display columns\"} />\n {options.map(option => {\n return (\n <DropdownMenu.Item\n key={option.id}\n preventClose\n text={\n <Checkbox\n label={option.header}\n onChange={option.onChange}\n checked={option.getValue()}\n />\n }\n />\n );\n })}\n </DropdownMenu>\n );\n};\n"],"names":["ColumnsVisibility","props","getHeaderName","useCallback","column","header","options","useMemo","DropdownMenu","IconButton","SettingsIcon","option","Checkbox"],"mappings":";;;;;AAkBO,MAAMA,oBAAoB,CAAKC;IAMlC,MAAMC,gBAAgBC,YAAY,CAACC;QAC/B,MAAM,EAAEC,MAAM,EAAE,GAAGD,OAAO,SAAS;QAEnC,IAAI,AAAkB,YAAlB,OAAOC,QACP,OAAOA;QAGX,IAAI,AAAkB,cAAlB,OAAOA,QAEP,OAAOA;QAGX,OAAOD,OAAO,EAAE;IACpB,GAAG,EAAE;IAEL,MAAME,UAAoBC,QAAQ,IACvBN,MAAM,OAAO,CACf,MAAM,CAACG,CAAAA,SAAUA,OAAO,UAAU,IAClC,GAAG,CAACA,CAAAA,SACM;gBACH,IAAIA,OAAO,EAAE;gBACb,QAAQF,cAAcE;gBACtB,UAAUA,OAAO,gBAAgB;gBACjC,UAAUA,OAAO,YAAY;YACjC,KAET;QAACH,MAAM,OAAO;KAAC;IAElB,IAAIK,AAAmB,MAAnBA,QAAQ,MAAM,EACd,OAAO;IAGX,OAAO,WAAP,GACI,oBAACE,cAAYA;QACT,uBAAS,oBAACC,YAAUA;YAAC,oBAAM,oBAACC,gBAAYA;YAAK,SAAS;YAAS,MAAM;;qBAErE,oBAACF,aAAa,KAAK;QAAC,MAAM;QACzBF,QAAQ,GAAG,CAACK,CAAAA,SACF,WAAP,GACI,oBAACH,aAAa,IAAI;YACd,KAAKG,OAAO,EAAE;YACd;YACA,oBACI,oBAACC,UAAQA;gBACL,OAAOD,OAAO,MAAM;gBACpB,UAAUA,OAAO,QAAQ;gBACzB,SAASA,OAAO,QAAQ;;;AAQxD"}
1
+ {"version":3,"file":"DataTable/components/ColumnsVisibility.js","sources":["../../../src/DataTable/components/ColumnsVisibility.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Column, RowData } from \"@tanstack/react-table\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { Checkbox } from \"~/Checkbox/index.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\nimport type { Features } from \"../DataTable.js\";\n\ninterface ColumnsVisibilityProps<T extends RowData> {\n columns: Column<Features, T>[];\n}\n\ninterface Option {\n id: string;\n header: string;\n onChange: (value?: boolean | undefined) => void;\n getValue: () => boolean;\n}\n\nexport const ColumnsVisibility = <T extends RowData>(props: ColumnsVisibilityProps<T>) => {\n /**\n * `@tanstack/react-table` does not have a simple method to return the header component.\n * The only possible way is to use `flexRenderer`, but this is not working with the current implementation\n * since we don't have access to the header context.\n */\n const getHeaderName = useCallback((column: Column<Features, T>) => {\n const { header } = column.columnDef;\n\n if (typeof header === \"string\") {\n return header;\n }\n\n if (typeof header === \"function\") {\n const flatHeader = column.table.getFlatHeaders().find(h => h.column.id === column.id);\n\n if (flatHeader) {\n return header(flatHeader.getContext());\n }\n }\n\n return column.id;\n }, []);\n\n const options: Option[] = useMemo(() => {\n return props.columns\n .filter(column => column.getCanHide())\n .map(column => {\n return {\n id: column.id,\n header: getHeaderName(column),\n /**\n * `@tanstack/react-table` v9 puts these on the column prototype, so they\n * read their column off `this`. They must stay attached to the column.\n */\n onChange: value => column.toggleVisibility(value),\n getValue: () => column.getIsVisible()\n };\n });\n }, [props.columns]);\n\n if (options.length === 0) {\n return null;\n }\n\n return (\n <DropdownMenu\n trigger={<IconButton icon={<SettingsIcon />} variant={\"ghost\"} size={\"xs\"} />}\n >\n <DropdownMenu.Label text={\"Display columns\"} />\n {options.map(option => {\n return (\n <DropdownMenu.Item\n key={option.id}\n preventClose\n text={\n <Checkbox\n label={option.header}\n onChange={option.onChange}\n checked={option.getValue()}\n />\n }\n />\n );\n })}\n </DropdownMenu>\n );\n};\n"],"names":["ColumnsVisibility","props","getHeaderName","useCallback","column","header","flatHeader","h","options","useMemo","value","DropdownMenu","IconButton","SettingsIcon","option","Checkbox"],"mappings":";;;;;AAmBO,MAAMA,oBAAoB,CAAoBC;IAMjD,MAAMC,gBAAgBC,YAAY,CAACC;QAC/B,MAAM,EAAEC,MAAM,EAAE,GAAGD,OAAO,SAAS;QAEnC,IAAI,AAAkB,YAAlB,OAAOC,QACP,OAAOA;QAGX,IAAI,AAAkB,cAAlB,OAAOA,QAAuB;YAC9B,MAAMC,aAAaF,OAAO,KAAK,CAAC,cAAc,GAAG,IAAI,CAACG,CAAAA,IAAKA,EAAE,MAAM,CAAC,EAAE,KAAKH,OAAO,EAAE;YAEpF,IAAIE,YACA,OAAOD,OAAOC,WAAW,UAAU;QAE3C;QAEA,OAAOF,OAAO,EAAE;IACpB,GAAG,EAAE;IAEL,MAAMI,UAAoBC,QAAQ,IACvBR,MAAM,OAAO,CACf,MAAM,CAACG,CAAAA,SAAUA,OAAO,UAAU,IAClC,GAAG,CAACA,CAAAA,SACM;gBACH,IAAIA,OAAO,EAAE;gBACb,QAAQF,cAAcE;gBAKtB,UAAUM,CAAAA,QAASN,OAAO,gBAAgB,CAACM;gBAC3C,UAAU,IAAMN,OAAO,YAAY;YACvC,KAET;QAACH,MAAM,OAAO;KAAC;IAElB,IAAIO,AAAmB,MAAnBA,QAAQ,MAAM,EACd,OAAO;IAGX,OAAO,WAAP,GACI,oBAACG,cAAYA;QACT,uBAAS,oBAACC,YAAUA;YAAC,oBAAM,oBAACC,gBAAYA;YAAK,SAAS;YAAS,MAAM;;qBAErE,oBAACF,aAAa,KAAK;QAAC,MAAM;QACzBH,QAAQ,GAAG,CAACM,CAAAA,SACF,WAAP,GACI,oBAACH,aAAa,IAAI;YACd,KAAKG,OAAO,EAAE;YACd;YACA,oBACI,oBAACC,UAAQA;gBACL,OAAOD,OAAO,MAAM;gBACpB,UAAUA,OAAO,QAAQ;gBACzB,SAASA,OAAO,QAAQ;;;AAQxD"}
package/IconPicker/domains/IconPickerIcon.js CHANGED
@@ -14,7 +14,7 @@ class IconPickerIcon {
14
14
  prefix: "fas",
15
15
  name: "star"
16
16
  });
17
- {
17
+ else {
18
18
  const values = value.split("/");
19
19
  return new IconPickerIcon({
20
20
  prefix: values[0],
package/IconPicker/domains/IconPickerIcon.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconPicker/domains/IconPickerIcon.js","sources":["../../../src/IconPicker/domains/IconPickerIcon.tsx"],"sourcesContent":["import type { IconPickerIconDto } from \"./IconPickerIconDto.js\";\n\nexport class IconPickerIcon {\n private readonly _prefix: string;\n private readonly _name: string;\n\n protected constructor(data: { prefix: string; name: string }) {\n this._prefix = data.prefix;\n this._name = data.name;\n }\n\n static create(data: IconPickerIconDto) {\n return new IconPickerIcon({\n prefix: data.prefix,\n name: data.name\n });\n }\n\n static createFromString(value?: string) {\n if (typeof value === \"string\" && value.includes(\"/\")) {\n const values = value.split(\"/\");\n return new IconPickerIcon({\n prefix: values[0],\n name: values[1]\n });\n } else {\n return new IconPickerIcon({\n prefix: \"fas\",\n name: \"star\"\n });\n }\n }\n\n get prefix() {\n return this._prefix;\n }\n\n get name() {\n return this._name;\n }\n}\n"],"names":["IconPickerIcon","data","value","values"],"mappings":"AAEO,MAAMA;IAIT,YAAsBC,IAAsC,CAAE;QAC1D,IAAI,CAAC,OAAO,GAAGA,KAAK,MAAM;QAC1B,IAAI,CAAC,KAAK,GAAGA,KAAK,IAAI;IAC1B;IAEA,OAAO,OAAOA,IAAuB,EAAE;QACnC,OAAO,IAAID,eAAe;YACtB,QAAQC,KAAK,MAAM;YACnB,MAAMA,KAAK,IAAI;QACnB;IACJ;IAEA,OAAO,iBAAiBC,KAAc,EAAE;QACpC,KAAI,CAAiB,YAAjB,OAAOA,SAAsBA,MAAM,QAAQ,CAAC,IAAG,GAO/C,OAAO,IAAIF,eAAe;YACtB,QAAQ;YACR,MAAM;QACV;QAVkD;YAClD,MAAMG,SAASD,MAAM,KAAK,CAAC;YAC3B,OAAO,IAAIF,eAAe;gBACtB,QAAQG,MAAM,CAAC,EAAE;gBACjB,MAAMA,MAAM,CAAC,EAAE;YACnB;QACJ;IAMJ;IAEA,IAAI,SAAS;QACT,OAAO,IAAI,CAAC,OAAO;IACvB;IAEA,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,KAAK;IACrB;AACJ"}
1
+ {"version":3,"file":"IconPicker/domains/IconPickerIcon.js","sources":["../../../src/IconPicker/domains/IconPickerIcon.tsx"],"sourcesContent":["import type { IconPickerIconDto } from \"./IconPickerIconDto.js\";\n\nexport class IconPickerIcon {\n private readonly _prefix: string;\n private readonly _name: string;\n\n protected constructor(data: { prefix: string; name: string }) {\n this._prefix = data.prefix;\n this._name = data.name;\n }\n\n static create(data: IconPickerIconDto) {\n return new IconPickerIcon({\n prefix: data.prefix,\n name: data.name\n });\n }\n\n static createFromString(value?: string) {\n if (typeof value === \"string\" && value.includes(\"/\")) {\n const values = value.split(\"/\");\n return new IconPickerIcon({\n prefix: values[0],\n name: values[1]\n });\n } else {\n return new IconPickerIcon({\n prefix: \"fas\",\n name: \"star\"\n });\n }\n }\n\n get prefix() {\n return this._prefix;\n }\n\n get name() {\n return this._name;\n }\n}\n"],"names":["IconPickerIcon","data","value","values"],"mappings":"AAEO,MAAMA;IAIT,YAAsBC,IAAsC,CAAE;QAC1D,IAAI,CAAC,OAAO,GAAGA,KAAK,MAAM;QAC1B,IAAI,CAAC,KAAK,GAAGA,KAAK,IAAI;IAC1B;IAEA,OAAO,OAAOA,IAAuB,EAAE;QACnC,OAAO,IAAID,eAAe;YACtB,QAAQC,KAAK,MAAM;YACnB,MAAMA,KAAK,IAAI;QACnB;IACJ;IAEA,OAAO,iBAAiBC,KAAc,EAAE;QACpC,KAAI,CAAiB,YAAjB,OAAOA,SAAsBA,MAAM,QAAQ,CAAC,IAAG,GAO/C,OAAO,IAAIF,eAAe;YACtB,QAAQ;YACR,MAAM;QACV;aAVkD;YAClD,MAAMG,SAASD,MAAM,KAAK,CAAC;YAC3B,OAAO,IAAIF,eAAe;gBACtB,QAAQG,MAAM,CAAC,EAAE;gBACjB,MAAMA,MAAM,CAAC,EAAE;YACnB;QACJ;IAMJ;IAEA,IAAI,SAAS;QACT,OAAO,IAAI,CAAC,OAAO;IACvB;IAEA,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,KAAK;IACrB;AACJ"}
package/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js CHANGED
@@ -372,7 +372,7 @@ describe("MultiAutoCompletePresenter", ()=>{
372
372
  ]);
373
373
  presenter.removeSelectedOption("option-2");
374
374
  expect(onValuesChange).toHaveBeenCalledWith([
375
- "option-2"
375
+ "option-1"
376
376
  ]);
377
377
  expect(presenter.vm.optionsListVm.options).toEqual([
378
378
  {
package/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js","sources":["../../../../src/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.ts"],"sourcesContent":["import type { IMultiAutoCompletePresenter } from \"./MultiAutoCompletePresenter.js\";\nimport { MultiAutoCompletePresenter } from \"./MultiAutoCompletePresenter.js\";\nimport { MultiAutoCompleteInputPresenter } from \"./MultiAutoCompleteInputPresenter.js\";\nimport { MultiAutoCompleteSelectedOptionPresenter } from \"./MultiAutoCompleteSelectedOptionsPresenter.js\";\nimport { MultiAutoCompleteListOptionsPresenter } from \"./MultiAutoCompleteListOptionsPresenter.js\";\nimport { beforeEach, describe, expect, it, vi } from \"vitest\";\n\ndescribe(\"MultiAutoCompletePresenter\", () => {\n let presenter: IMultiAutoCompletePresenter;\n const onValuesChange = vi.fn();\n const onOpenChange = vi.fn();\n const onValuesReset = vi.fn();\n\n beforeEach(() => {\n const inputPresenter = new MultiAutoCompleteInputPresenter();\n const selectedOptionsPresenter = new MultiAutoCompleteSelectedOptionPresenter();\n const optionsListPresenter = new MultiAutoCompleteListOptionsPresenter();\n\n presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListPresenter\n );\n });\n\n it(\"should return the compatible `vm.inputVm` based on params\", () => {\n // `placeholder`\n {\n presenter.init({ placeholder: \"Custom placeholder\", onValuesChange });\n expect(presenter.vm.inputVm.placeholder).toEqual(\"Custom placeholder\");\n }\n\n {\n // default: no params\n presenter.init({ onValuesChange });\n expect(presenter.vm.inputVm.placeholder).toEqual(\"Start typing or select\");\n expect(presenter.vm.inputVm.displayResetAction).toEqual(true);\n }\n });\n\n it(\"should return the compatible `vm.selectedOptionsVm` based on params\", () => {\n presenter.init({\n options: [\"Option 1\", \"Option 2\", \"Option 3\"],\n values: [\"Option 1\", \"Option 2\"],\n onValuesChange\n });\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should return the compatible `vm.selectedOptionsVm` with no params\", () => {\n presenter.init({ options: [\"Option 1\", \"Option 2\"], onValuesChange });\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should return the compatible `vm.optionsListVm` based on params\", () => {\n // with `options` as string\n {\n presenter.init({ options: [\"Option 1\", \"Option 2\"], onValuesChange });\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n // with `options` as formatted options\n {\n presenter.init({\n onValuesChange,\n options: [\n {\n value: \"option-1\",\n label: \"Option 1\"\n },\n {\n value: \"option-2\",\n label: \"Option 2\"\n },\n {\n value: \"option-3\",\n label: \"Option 3\",\n disabled: true\n },\n {\n value: \"option-4\",\n label: \"Option 4\",\n separator: true\n },\n {\n value: \"option-5\",\n label: \"Option 5\",\n item: {\n anyKey1: \"custom-value\",\n anyKey2: 2\n }\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"option-1\",\n label: \"Option 1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"option-2\",\n label: \"Option 2\",\n disabled: false,\n selected: false, // `selected` is overwritten by the presenter\n separator: false,\n item: null\n },\n {\n value: \"option-3\",\n label: \"Option 3\",\n disabled: true,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"option-4\",\n label: \"Option 4\",\n disabled: false,\n selected: false,\n separator: true,\n item: null\n },\n {\n value: \"option-5\",\n label: \"Option 5\",\n disabled: false,\n selected: false,\n separator: false,\n item: {\n anyKey1: \"custom-value\",\n anyKey2: 2\n }\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n // with `options` and `value`\n {\n presenter.init({\n onValuesChange,\n options: [\"Option 1\", \"Option 2\"],\n values: [\"Option 1\"]\n });\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n {\n // default: no params\n presenter.init({ onValuesChange });\n expect(presenter.vm.optionsListVm.options).toEqual([]);\n expect(presenter.vm.optionsListVm.emptyMessage).toEqual(\n \"Start typing to find an option.\"\n );\n expect(presenter.vm.optionsListVm.loadingMessage).toEqual(\"Loading...\");\n expect(presenter.vm.optionsListVm.open).toEqual(false);\n expect(presenter.vm.optionsListVm.empty).toEqual(true);\n }\n });\n\n it(\"should change the `optionsListVm` and `selectedOptionsVm` when `setSelectedOption` is called\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-1\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\", \"option-1\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should change the `optionsListVm` and `selectedOptionsVm` when `removeSelectedOption` is called\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ],\n values: [\"option-2\", \"option-1\"]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.removeSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.removeSelectedOption(\"option-1\");\n expect(onValuesChange).toHaveBeenCalledWith([]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should set the internal `inputValue` when `setInputValue` is called\", () => {\n presenter.init({ onValuesChange });\n\n presenter.searchOption(\"value\");\n expect(presenter.vm.inputVm.value).toEqual(\"value\");\n });\n\n it(\"should set the option as `selected` when the presenter is initialized with a value\", () => {\n presenter.init({\n onValuesChange,\n values: [\"option-1\"],\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should change the `optionListVm` and `selectedOptionsVm` when `resetSelectedOptions` is called\", () => {\n presenter.init({\n onValuesChange,\n onValuesReset,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-1\");\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.resetSelectedOptions();\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.inputVm.value).toEqual(\"\");\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n\n expect(onValuesChange).toHaveBeenCalledWith([]);\n expect(onValuesReset).toHaveBeenCalled();\n });\n\n it(\"should change `listVm` and call `onOpenChange` when `setListOpenState` is called\", () => {\n // let's open it\n presenter.init({ onValuesChange, onOpenChange });\n presenter.setListOpenState(true);\n expect(presenter.vm.optionsListVm.open).toBe(true);\n expect(onOpenChange).toHaveBeenCalledWith(true);\n\n // let's close it\n presenter.setListOpenState(false);\n expect(presenter.vm.optionsListVm.open).toBe(false);\n expect(onOpenChange).toHaveBeenCalledWith(false);\n });\n\n it(\"should be able to create new options if `allowFreeInput` is set to true\", () => {\n // This feature is disabled by default\n presenter.init({ onValuesChange });\n presenter.searchOption(\"New Option 1\");\n presenter.createOption(\"New Option 1\");\n expect(presenter.vm.selectedOptionsVm.empty).toEqual(true);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should not display the reset action if `displayResetAction` is set to `false` and option is selected\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ],\n displayResetAction: false\n });\n\n presenter.setSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\"]);\n // `displayResetAction` is set to `false` and option is selected\n expect(presenter.vm.inputVm.displayResetAction).toEqual(false);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n});\n"],"names":["describe","presenter","onValuesChange","vi","onOpenChange","onValuesReset","beforeEach","inputPresenter","MultiAutoCompleteInputPresenter","selectedOptionsPresenter","MultiAutoCompleteSelectedOptionPresenter","optionsListPresenter","MultiAutoCompleteListOptionsPresenter","MultiAutoCompletePresenter","it","expect"],"mappings":"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"}
1
+ {"version":3,"file":"MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.js","sources":["../../../../src/MultiAutoComplete/primitives/presenters/MultiAutoCompletePresenter.test.ts"],"sourcesContent":["import type { IMultiAutoCompletePresenter } from \"./MultiAutoCompletePresenter.js\";\nimport { MultiAutoCompletePresenter } from \"./MultiAutoCompletePresenter.js\";\nimport { MultiAutoCompleteInputPresenter } from \"./MultiAutoCompleteInputPresenter.js\";\nimport { MultiAutoCompleteSelectedOptionPresenter } from \"./MultiAutoCompleteSelectedOptionsPresenter.js\";\nimport { MultiAutoCompleteListOptionsPresenter } from \"./MultiAutoCompleteListOptionsPresenter.js\";\nimport { beforeEach, describe, expect, it, vi } from \"vitest\";\n\ndescribe(\"MultiAutoCompletePresenter\", () => {\n let presenter: IMultiAutoCompletePresenter;\n const onValuesChange = vi.fn();\n const onOpenChange = vi.fn();\n const onValuesReset = vi.fn();\n\n beforeEach(() => {\n const inputPresenter = new MultiAutoCompleteInputPresenter();\n const selectedOptionsPresenter = new MultiAutoCompleteSelectedOptionPresenter();\n const optionsListPresenter = new MultiAutoCompleteListOptionsPresenter();\n\n presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListPresenter\n );\n });\n\n it(\"should return the compatible `vm.inputVm` based on params\", () => {\n // `placeholder`\n {\n presenter.init({ placeholder: \"Custom placeholder\", onValuesChange });\n expect(presenter.vm.inputVm.placeholder).toEqual(\"Custom placeholder\");\n }\n\n {\n // default: no params\n presenter.init({ onValuesChange });\n expect(presenter.vm.inputVm.placeholder).toEqual(\"Start typing or select\");\n expect(presenter.vm.inputVm.displayResetAction).toEqual(true);\n }\n });\n\n it(\"should return the compatible `vm.selectedOptionsVm` based on params\", () => {\n presenter.init({\n options: [\"Option 1\", \"Option 2\", \"Option 3\"],\n values: [\"Option 1\", \"Option 2\"],\n onValuesChange\n });\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should return the compatible `vm.selectedOptionsVm` with no params\", () => {\n presenter.init({ options: [\"Option 1\", \"Option 2\"], onValuesChange });\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should return the compatible `vm.optionsListVm` based on params\", () => {\n // with `options` as string\n {\n presenter.init({ options: [\"Option 1\", \"Option 2\"], onValuesChange });\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n // with `options` as formatted options\n {\n presenter.init({\n onValuesChange,\n options: [\n {\n value: \"option-1\",\n label: \"Option 1\"\n },\n {\n value: \"option-2\",\n label: \"Option 2\"\n },\n {\n value: \"option-3\",\n label: \"Option 3\",\n disabled: true\n },\n {\n value: \"option-4\",\n label: \"Option 4\",\n separator: true\n },\n {\n value: \"option-5\",\n label: \"Option 5\",\n item: {\n anyKey1: \"custom-value\",\n anyKey2: 2\n }\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"option-1\",\n label: \"Option 1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"option-2\",\n label: \"Option 2\",\n disabled: false,\n selected: false, // `selected` is overwritten by the presenter\n separator: false,\n item: null\n },\n {\n value: \"option-3\",\n label: \"Option 3\",\n disabled: true,\n selected: false,\n separator: false,\n item: null\n },\n {\n value: \"option-4\",\n label: \"Option 4\",\n disabled: false,\n selected: false,\n separator: true,\n item: null\n },\n {\n value: \"option-5\",\n label: \"Option 5\",\n disabled: false,\n selected: false,\n separator: false,\n item: {\n anyKey1: \"custom-value\",\n anyKey2: 2\n }\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n // with `options` and `value`\n {\n presenter.init({\n onValuesChange,\n options: [\"Option 1\", \"Option 2\"],\n values: [\"Option 1\"]\n });\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n value: \"Option 1\",\n label: \"Option 1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n value: \"Option 2\",\n label: \"Option 2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.optionsListVm.empty).toEqual(false);\n }\n\n {\n // default: no params\n presenter.init({ onValuesChange });\n expect(presenter.vm.optionsListVm.options).toEqual([]);\n expect(presenter.vm.optionsListVm.emptyMessage).toEqual(\n \"Start typing to find an option.\"\n );\n expect(presenter.vm.optionsListVm.loadingMessage).toEqual(\"Loading...\");\n expect(presenter.vm.optionsListVm.open).toEqual(false);\n expect(presenter.vm.optionsListVm.empty).toEqual(true);\n }\n });\n\n it(\"should change the `optionsListVm` and `selectedOptionsVm` when `setSelectedOption` is called\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-1\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\", \"option-1\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should change the `optionsListVm` and `selectedOptionsVm` when `removeSelectedOption` is called\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ],\n values: [\"option-2\", \"option-1\"]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.removeSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-1\"]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.removeSelectedOption(\"option-1\");\n expect(onValuesChange).toHaveBeenCalledWith([]);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should set the internal `inputValue` when `setInputValue` is called\", () => {\n presenter.init({ onValuesChange });\n\n presenter.searchOption(\"value\");\n expect(presenter.vm.inputVm.value).toEqual(\"value\");\n });\n\n it(\"should set the option as `selected` when the presenter is initialized with a value\", () => {\n presenter.init({\n onValuesChange,\n values: [\"option-1\"],\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n\n it(\"should change the `optionListVm` and `selectedOptionsVm` when `resetSelectedOptions` is called\", () => {\n presenter.init({\n onValuesChange,\n onValuesReset,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ]\n });\n\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n\n presenter.setSelectedOption(\"option-1\");\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n\n presenter.resetSelectedOptions();\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.inputVm.value).toEqual(\"\");\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n\n expect(onValuesChange).toHaveBeenCalledWith([]);\n expect(onValuesReset).toHaveBeenCalled();\n });\n\n it(\"should change `listVm` and call `onOpenChange` when `setListOpenState` is called\", () => {\n // let's open it\n presenter.init({ onValuesChange, onOpenChange });\n presenter.setListOpenState(true);\n expect(presenter.vm.optionsListVm.open).toBe(true);\n expect(onOpenChange).toHaveBeenCalledWith(true);\n\n // let's close it\n presenter.setListOpenState(false);\n expect(presenter.vm.optionsListVm.open).toBe(false);\n expect(onOpenChange).toHaveBeenCalledWith(false);\n });\n\n it(\"should be able to create new options if `allowFreeInput` is set to true\", () => {\n // This feature is disabled by default\n presenter.init({ onValuesChange });\n presenter.searchOption(\"New Option 1\");\n presenter.createOption(\"New Option 1\");\n expect(presenter.vm.selectedOptionsVm.empty).toEqual(true);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([]);\n });\n\n it(\"should not display the reset action if `displayResetAction` is set to `false` and option is selected\", () => {\n presenter.init({\n onValuesChange,\n options: [\n {\n label: \"Option 1\",\n value: \"option-1\"\n },\n {\n label: \"Option 2\",\n value: \"option-2\"\n }\n ],\n displayResetAction: false\n });\n\n presenter.setSelectedOption(\"option-2\");\n expect(onValuesChange).toHaveBeenCalledWith([\"option-2\"]);\n // `displayResetAction` is set to `false` and option is selected\n expect(presenter.vm.inputVm.displayResetAction).toEqual(false);\n expect(presenter.vm.optionsListVm.options).toEqual([\n {\n label: \"Option 1\",\n value: \"option-1\",\n disabled: false,\n selected: false,\n separator: false,\n item: null\n },\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n expect(presenter.vm.selectedOptionsVm.options).toEqual([\n {\n label: \"Option 2\",\n value: \"option-2\",\n disabled: false,\n selected: true,\n separator: false,\n item: null\n }\n ]);\n });\n});\n"],"names":["describe","presenter","onValuesChange","vi","onOpenChange","onValuesReset","beforeEach","inputPresenter","MultiAutoCompleteInputPresenter","selectedOptionsPresenter","MultiAutoCompleteSelectedOptionPresenter","optionsListPresenter","MultiAutoCompleteListOptionsPresenter","MultiAutoCompletePresenter","it","expect"],"mappings":"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"}
package/MultiAutoComplete/primitives/useMultiAutoComplete.js CHANGED
@@ -40,9 +40,10 @@ const useMultiAutoComplete = (props)=>{
40
40
  const withFreeInputPresenter = new MultiAutoCompletePresenterWithFreeInput(temporaryOptionsPresenter, presenter);
41
41
  withFreeInputPresenter.init(params);
42
42
  return withFreeInputPresenter;
43
+ } else {
44
+ presenter.init(params);
45
+ return presenter;
43
46
  }
44
- presenter.init(params);
45
- return presenter;
46
47
  }, [
47
48
  props.allowFreeInput,
48
49
  props.uniqueValues
package/MultiAutoComplete/primitives/useMultiAutoComplete.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MultiAutoComplete/primitives/useMultiAutoComplete.js","sources":["../../../src/MultiAutoComplete/primitives/useMultiAutoComplete.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { MultiAutoCompletePrimitiveProps } from \"./MultiAutoCompletePrimitive.js\";\nimport type { MultiAutoCompletePresenterParams } from \"./presenters/index.js\";\nimport {\n MultiAutoCompleteInputPresenter,\n MultiAutoCompleteListOptionsPresenter,\n MultiAutoCompleteListOptionsPresenterWithUniqueValues,\n MultiAutoCompletePresenter,\n MultiAutoCompletePresenterWithFreeInput,\n MultiAutoCompleteSelectedOptionPresenter\n} from \"./presenters/index.js\";\nimport { MultiAutoCompleteTemporaryOptionPresenter } from \"~/MultiAutoComplete/primitives/presenters/MultiAutoCompleteTemporaryOptionPresenter.js\";\n\nexport const useMultiAutoComplete = (props: MultiAutoCompletePrimitiveProps) => {\n const params: MultiAutoCompletePresenterParams = useMemo(\n () => ({\n displayResetAction: props.displayResetAction,\n emptyMessage: props.emptyMessage,\n loadingMessage: props.loadingMessage,\n initialMessage: props.initialMessage,\n onOpenChange: props.onOpenChange,\n onValueSearch: props.onValueSearch,\n onValuesChange: props.onValuesChange,\n onValuesReset: props.onValuesReset,\n options: props.options,\n placeholder: props.placeholder,\n values: props.values\n }),\n [\n props.displayResetAction,\n props.emptyMessage,\n props.loadingMessage,\n props.initialMessage,\n props.onOpenChange,\n props.onValueSearch,\n props.onValuesChange,\n props.onValuesReset,\n props.options,\n props.placeholder,\n props.values\n ]\n );\n\n const presenter = useMemo(() => {\n const optionsListPresenter = new MultiAutoCompleteListOptionsPresenter();\n const optionsListWithUniqueValues =\n new MultiAutoCompleteListOptionsPresenterWithUniqueValues(optionsListPresenter);\n\n const inputPresenter = new MultiAutoCompleteInputPresenter();\n const selectedOptionsPresenter = new MultiAutoCompleteSelectedOptionPresenter();\n\n let presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListPresenter\n );\n\n if (props?.uniqueValues) {\n presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListWithUniqueValues\n );\n }\n\n if (props?.allowFreeInput) {\n const temporaryOptionsPresenter = new MultiAutoCompleteTemporaryOptionPresenter();\n const withFreeInputPresenter = new MultiAutoCompletePresenterWithFreeInput(\n temporaryOptionsPresenter,\n presenter\n );\n withFreeInputPresenter.init(params);\n return withFreeInputPresenter;\n } else {\n presenter.init(params);\n return presenter;\n }\n }, [props.allowFreeInput, props.uniqueValues]);\n\n const [vm, setVm] = useState(presenter.vm);\n\n useEffect(() => {\n presenter.init(params);\n }, [params, presenter]);\n\n useEffect(() => {\n return autorun(() => {\n setVm(presenter.vm);\n });\n }, [presenter]);\n\n return {\n vm,\n setSelectedOption: presenter.setSelectedOption,\n removeSelectedOption: presenter.removeSelectedOption,\n searchOption: presenter.searchOption,\n resetSelectedOptions: presenter.resetSelectedOptions,\n setListOpenState: presenter.setListOpenState,\n createOption: presenter.createOption\n };\n};\n"],"names":["useMultiAutoComplete","props","params","useMemo","presenter","optionsListPresenter","MultiAutoCompleteListOptionsPresenter","optionsListWithUniqueValues","MultiAutoCompleteListOptionsPresenterWithUniqueValues","inputPresenter","MultiAutoCompleteInputPresenter","selectedOptionsPresenter","MultiAutoCompleteSelectedOptionPresenter","MultiAutoCompletePresenter","temporaryOptionsPresenter","MultiAutoCompleteTemporaryOptionPresenter","withFreeInputPresenter","MultiAutoCompletePresenterWithFreeInput","vm","setVm","useState","useEffect","autorun"],"mappings":";;;;AAcO,MAAMA,uBAAuB,CAACC;IACjC,MAAMC,SAA2CC,QAC7C,IAAO;YACH,oBAAoBF,MAAM,kBAAkB;YAC5C,cAAcA,MAAM,YAAY;YAChC,gBAAgBA,MAAM,cAAc;YACpC,gBAAgBA,MAAM,cAAc;YACpC,cAAcA,MAAM,YAAY;YAChC,eAAeA,MAAM,aAAa;YAClC,gBAAgBA,MAAM,cAAc;YACpC,eAAeA,MAAM,aAAa;YAClC,SAASA,MAAM,OAAO;YACtB,aAAaA,MAAM,WAAW;YAC9B,QAAQA,MAAM,MAAM;QACxB,IACA;QACIA,MAAM,kBAAkB;QACxBA,MAAM,YAAY;QAClBA,MAAM,cAAc;QACpBA,MAAM,cAAc;QACpBA,MAAM,YAAY;QAClBA,MAAM,aAAa;QACnBA,MAAM,cAAc;QACpBA,MAAM,aAAa;QACnBA,MAAM,OAAO;QACbA,MAAM,WAAW;QACjBA,MAAM,MAAM;KACf;IAGL,MAAMG,YAAYD,QAAQ;QACtB,MAAME,uBAAuB,IAAIC;QACjC,MAAMC,8BACF,IAAIC,sDAAsDH;QAE9D,MAAMI,iBAAiB,IAAIC;QAC3B,MAAMC,2BAA2B,IAAIC;QAErC,IAAIR,YAAY,IAAIS,2BAChBJ,gBACAE,0BACAN;QAGJ,IAAIJ,OAAO,cACPG,YAAY,IAAIS,2BACZJ,gBACAE,0BACAJ;QAIR,IAAIN,OAAO,gBAAgB;YACvB,MAAMa,4BAA4B,IAAIC;YACtC,MAAMC,yBAAyB,IAAIC,wCAC/BH,2BACAV;YAEJY,uBAAuB,IAAI,CAACd;YAC5B,OAAOc;QACX;QACIZ,UAAU,IAAI,CAACF;QACf,OAAOE;IAEf,GAAG;QAACH,MAAM,cAAc;QAAEA,MAAM,YAAY;KAAC;IAE7C,MAAM,CAACiB,IAAIC,MAAM,GAAGC,SAAShB,UAAU,EAAE;IAEzCiB,UAAU;QACNjB,UAAU,IAAI,CAACF;IACnB,GAAG;QAACA;QAAQE;KAAU;IAEtBiB,UAAU,IACCC,QAAQ;YACXH,MAAMf,UAAU,EAAE;QACtB,IACD;QAACA;KAAU;IAEd,OAAO;QACHc;QACA,mBAAmBd,UAAU,iBAAiB;QAC9C,sBAAsBA,UAAU,oBAAoB;QACpD,cAAcA,UAAU,YAAY;QACpC,sBAAsBA,UAAU,oBAAoB;QACpD,kBAAkBA,UAAU,gBAAgB;QAC5C,cAAcA,UAAU,YAAY;IACxC;AACJ"}
1
+ {"version":3,"file":"MultiAutoComplete/primitives/useMultiAutoComplete.js","sources":["../../../src/MultiAutoComplete/primitives/useMultiAutoComplete.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { MultiAutoCompletePrimitiveProps } from \"./MultiAutoCompletePrimitive.js\";\nimport type { MultiAutoCompletePresenterParams } from \"./presenters/index.js\";\nimport {\n MultiAutoCompleteInputPresenter,\n MultiAutoCompleteListOptionsPresenter,\n MultiAutoCompleteListOptionsPresenterWithUniqueValues,\n MultiAutoCompletePresenter,\n MultiAutoCompletePresenterWithFreeInput,\n MultiAutoCompleteSelectedOptionPresenter\n} from \"./presenters/index.js\";\nimport { MultiAutoCompleteTemporaryOptionPresenter } from \"~/MultiAutoComplete/primitives/presenters/MultiAutoCompleteTemporaryOptionPresenter.js\";\n\nexport const useMultiAutoComplete = (props: MultiAutoCompletePrimitiveProps) => {\n const params: MultiAutoCompletePresenterParams = useMemo(\n () => ({\n displayResetAction: props.displayResetAction,\n emptyMessage: props.emptyMessage,\n loadingMessage: props.loadingMessage,\n initialMessage: props.initialMessage,\n onOpenChange: props.onOpenChange,\n onValueSearch: props.onValueSearch,\n onValuesChange: props.onValuesChange,\n onValuesReset: props.onValuesReset,\n options: props.options,\n placeholder: props.placeholder,\n values: props.values\n }),\n [\n props.displayResetAction,\n props.emptyMessage,\n props.loadingMessage,\n props.initialMessage,\n props.onOpenChange,\n props.onValueSearch,\n props.onValuesChange,\n props.onValuesReset,\n props.options,\n props.placeholder,\n props.values\n ]\n );\n\n const presenter = useMemo(() => {\n const optionsListPresenter = new MultiAutoCompleteListOptionsPresenter();\n const optionsListWithUniqueValues =\n new MultiAutoCompleteListOptionsPresenterWithUniqueValues(optionsListPresenter);\n\n const inputPresenter = new MultiAutoCompleteInputPresenter();\n const selectedOptionsPresenter = new MultiAutoCompleteSelectedOptionPresenter();\n\n let presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListPresenter\n );\n\n if (props?.uniqueValues) {\n presenter = new MultiAutoCompletePresenter(\n inputPresenter,\n selectedOptionsPresenter,\n optionsListWithUniqueValues\n );\n }\n\n if (props?.allowFreeInput) {\n const temporaryOptionsPresenter = new MultiAutoCompleteTemporaryOptionPresenter();\n const withFreeInputPresenter = new MultiAutoCompletePresenterWithFreeInput(\n temporaryOptionsPresenter,\n presenter\n );\n withFreeInputPresenter.init(params);\n return withFreeInputPresenter;\n } else {\n presenter.init(params);\n return presenter;\n }\n }, [props.allowFreeInput, props.uniqueValues]);\n\n const [vm, setVm] = useState(presenter.vm);\n\n useEffect(() => {\n presenter.init(params);\n }, [params, presenter]);\n\n useEffect(() => {\n return autorun(() => {\n setVm(presenter.vm);\n });\n }, [presenter]);\n\n return {\n vm,\n setSelectedOption: presenter.setSelectedOption,\n removeSelectedOption: presenter.removeSelectedOption,\n searchOption: presenter.searchOption,\n resetSelectedOptions: presenter.resetSelectedOptions,\n setListOpenState: presenter.setListOpenState,\n createOption: presenter.createOption\n };\n};\n"],"names":["useMultiAutoComplete","props","params","useMemo","presenter","optionsListPresenter","MultiAutoCompleteListOptionsPresenter","optionsListWithUniqueValues","MultiAutoCompleteListOptionsPresenterWithUniqueValues","inputPresenter","MultiAutoCompleteInputPresenter","selectedOptionsPresenter","MultiAutoCompleteSelectedOptionPresenter","MultiAutoCompletePresenter","temporaryOptionsPresenter","MultiAutoCompleteTemporaryOptionPresenter","withFreeInputPresenter","MultiAutoCompletePresenterWithFreeInput","vm","setVm","useState","useEffect","autorun"],"mappings":";;;;AAcO,MAAMA,uBAAuB,CAACC;IACjC,MAAMC,SAA2CC,QAC7C,IAAO;YACH,oBAAoBF,MAAM,kBAAkB;YAC5C,cAAcA,MAAM,YAAY;YAChC,gBAAgBA,MAAM,cAAc;YACpC,gBAAgBA,MAAM,cAAc;YACpC,cAAcA,MAAM,YAAY;YAChC,eAAeA,MAAM,aAAa;YAClC,gBAAgBA,MAAM,cAAc;YACpC,eAAeA,MAAM,aAAa;YAClC,SAASA,MAAM,OAAO;YACtB,aAAaA,MAAM,WAAW;YAC9B,QAAQA,MAAM,MAAM;QACxB,IACA;QACIA,MAAM,kBAAkB;QACxBA,MAAM,YAAY;QAClBA,MAAM,cAAc;QACpBA,MAAM,cAAc;QACpBA,MAAM,YAAY;QAClBA,MAAM,aAAa;QACnBA,MAAM,cAAc;QACpBA,MAAM,aAAa;QACnBA,MAAM,OAAO;QACbA,MAAM,WAAW;QACjBA,MAAM,MAAM;KACf;IAGL,MAAMG,YAAYD,QAAQ;QACtB,MAAME,uBAAuB,IAAIC;QACjC,MAAMC,8BACF,IAAIC,sDAAsDH;QAE9D,MAAMI,iBAAiB,IAAIC;QAC3B,MAAMC,2BAA2B,IAAIC;QAErC,IAAIR,YAAY,IAAIS,2BAChBJ,gBACAE,0BACAN;QAGJ,IAAIJ,OAAO,cACPG,YAAY,IAAIS,2BACZJ,gBACAE,0BACAJ;QAIR,IAAIN,OAAO,gBAAgB;YACvB,MAAMa,4BAA4B,IAAIC;YACtC,MAAMC,yBAAyB,IAAIC,wCAC/BH,2BACAV;YAEJY,uBAAuB,IAAI,CAACd;YAC5B,OAAOc;QACX,OAAO;YACHZ,UAAU,IAAI,CAACF;YACf,OAAOE;QACX;IACJ,GAAG;QAACH,MAAM,cAAc;QAAEA,MAAM,YAAY;KAAC;IAE7C,MAAM,CAACiB,IAAIC,MAAM,GAAGC,SAAShB,UAAU,EAAE;IAEzCiB,UAAU;QACNjB,UAAU,IAAI,CAACF;IACnB,GAAG;QAACA;QAAQE;KAAU;IAEtBiB,UAAU,IACCC,QAAQ;YACXH,MAAMf,UAAU,EAAE;QACtB,IACD;QAACA;KAAU;IAEd,OAAO;QACHc;QACA,mBAAmBd,UAAU,iBAAiB;QAC9C,sBAAsBA,UAAU,oBAAoB;QACpD,cAAcA,UAAU,YAAY;QACpC,sBAAsBA,UAAU,oBAAoB;QACpD,kBAAkBA,UAAU,gBAAgB;QAC5C,cAAcA,UAAU,YAAY;IACxC;AACJ"}
package/Toast/useToast.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n const [lastToast, setLastToast] = useState<string | number>(\"\");\n const { showToast, hideToast, hideAllToasts } = useToast();\n return (\n <>\n <Button\n text={\"Show Toast\"}\n onClick={() => {\n const toast = showToast(props);\n setLastToast(toast);\n }}\n />\n <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n </>\n );\n};\n\nconst meta: Meta<ShowToastParams> = {\n title: \"Components/Toast\",\n component: ToastComponent,\n parameters: {\n layout: \"fullscreen\"\n },\n argTypes: {\n variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n },\n decorators: [\n Story => (\n <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n <Story />\n <Toast.Provider />\n </div>\n )\n ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n args: {\n title: \"New entry created\"\n }\n};\n\nexport const SubtleVariant: Story = {\n args: {\n ...Default.args,\n variant: \"subtle\"\n }\n};\n\nexport const WithTitleComponent: Story = {\n args: {\n title: <Toast.Title text={\"New entry created\"} />\n }\n};\n\nexport const WithDescription: Story = {\n args: {\n ...Default.args,\n description: 'Entry \"Article One\" has been successfully created'\n }\n};\n\nexport const WithDescriptionComponent: Story = {\n args: {\n ...Default.args,\n description: (\n <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n )\n }\n};\n\nexport const WithActions: Story = {\n args: {\n ...Default.args,\n actions: (\n <Toast.Actions>\n <Button\n key={\"action-1\"}\n text={\"Do the action\"}\n onClick={() => console.log(\"doTheAction\")}\n />\n <Button\n key={\"action-2\"}\n text={\"Dismiss\"}\n onClick={() => console.log(\"dismiss\")}\n variant={\"secondary\"}\n />\n </Toast.Actions>\n )\n }\n};\n\nexport const WithDescriptionAndActions: Story = {\n args: {\n ...Default.args,\n description: (\n <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n ),\n actions: (\n <Toast.Actions>\n <Button\n key={\"action-1\"}\n text={\"Do the action\"}\n onClick={() => console.log(\"doTheAction\")}\n />\n <Button\n key={\"action-2\"}\n text={\"Dismiss\"}\n onClick={() => console.log(\"dismiss\")}\n variant={\"secondary\"}\n />\n </Toast.Actions>\n )\n }\n};\n\nexport const WithCustomIcon: Story = {\n args: {\n ...Default.args,\n icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n }\n};\n\nexport const WithInfiniteDuration: Story = {\n args: {\n ...Default.args,\n duration: Infinity\n }\n};\n\nexport const NotDismissible: Story = {\n args: {\n ...Default.args,\n dismissible: false\n }\n};\n\nexport const withCustomPosition: Story = {\n args: {\n ...Default.args,\n position: \"bottom-right\"\n }\n};\n\nexport const Documentation: Story = {\n args: {\n title: \"New entry created\",\n description: \"Entry has been successfully created\",\n variant: \"default\",\n position: \"top-right\",\n duration: 6000,\n dismissible: true,\n actions: undefined,\n icon: undefined\n },\n argTypes: {\n title: {\n description: \"Please refer to the 'With Title Component' example below for details.\"\n },\n description: {\n description:\n \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n },\n variant: {\n description: \"Variant of the toast.\"\n },\n actions: {\n description: \"Please refer to the 'With Actions' example below for details.\"\n },\n icon: {\n description: \"Please refer to the 'With Custom Icon' example below for details.\"\n },\n duration: {\n description:\n \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n control: \"number\"\n },\n dismissible: {\n description: \"Please refer to the 'Not Dismissible' example below for details.\"\n },\n position: {\n description: \"Please refer to the 'With Custom Position' example below for details.\",\n control: \"select\",\n options: [\n \"top-left\",\n \"top-right\",\n \"bottom-left\",\n \"bottom-right\",\n \"top-center\",\n \"bottom-center\"\n ]\n }\n }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":"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"}
1
+ {"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n const [lastToast, setLastToast] = useState<string | number>(\"\");\n const { showToast, hideToast, hideAllToasts } = useToast();\n return (\n <>\n <Button\n text={\"Show Toast\"}\n onClick={() => {\n const toast = showToast(props);\n setLastToast(toast);\n }}\n />\n <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n </>\n );\n};\n\nconst meta: Meta<ShowToastParams> = {\n title: \"Components/Toast\",\n component: ToastComponent,\n parameters: {\n layout: \"fullscreen\"\n },\n argTypes: {\n variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n },\n decorators: [\n Story => (\n <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n <Story />\n <Toast.Provider />\n </div>\n )\n ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n args: {\n title: \"New entry created\"\n }\n};\n\nexport const SubtleVariant: Story = {\n args: {\n ...Default.args,\n variant: \"subtle\"\n }\n};\n\nexport const WithTitleComponent: Story = {\n args: {\n title: <Toast.Title text={\"New entry created\"} />\n }\n};\n\nexport const WithDescription: Story = {\n args: {\n ...Default.args,\n description: 'Entry \"Article One\" has been successfully created'\n }\n};\n\nexport const WithDescriptionComponent: Story = {\n args: {\n ...Default.args,\n description: (\n <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n )\n }\n};\n\nexport const WithActions: Story = {\n args: {\n ...Default.args,\n actions: (\n <Toast.Actions>\n <Button\n key={\"action-1\"}\n text={\"Do the action\"}\n onClick={() => console.log(\"doTheAction\")}\n />\n <Button\n key={\"action-2\"}\n text={\"Dismiss\"}\n onClick={() => console.log(\"dismiss\")}\n variant={\"secondary\"}\n />\n </Toast.Actions>\n )\n }\n};\n\nexport const WithDescriptionAndActions: Story = {\n args: {\n ...Default.args,\n description: (\n <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n ),\n actions: (\n <Toast.Actions>\n <Button\n key={\"action-1\"}\n text={\"Do the action\"}\n onClick={() => console.log(\"doTheAction\")}\n />\n <Button\n key={\"action-2\"}\n text={\"Dismiss\"}\n onClick={() => console.log(\"dismiss\")}\n variant={\"secondary\"}\n />\n </Toast.Actions>\n )\n }\n};\n\nexport const WithCustomIcon: Story = {\n args: {\n ...Default.args,\n icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n }\n};\n\nexport const WithInfiniteDuration: Story = {\n args: {\n ...Default.args,\n duration: Infinity\n }\n};\n\nexport const NotDismissible: Story = {\n args: {\n ...Default.args,\n dismissible: false\n }\n};\n\nexport const withCustomPosition: Story = {\n args: {\n ...Default.args,\n position: \"bottom-right\"\n }\n};\n\nexport const Documentation: Story = {\n args: {\n title: \"New entry created\",\n description: \"Entry has been successfully created\",\n variant: \"default\",\n position: \"top-right\",\n duration: 6000,\n dismissible: true,\n actions: undefined,\n icon: undefined\n },\n argTypes: {\n title: {\n description: \"Please refer to the 'With Title Component' example below for details.\"\n },\n description: {\n description:\n \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n },\n variant: {\n description: \"Variant of the toast.\"\n },\n actions: {\n description: \"Please refer to the 'With Actions' example below for details.\"\n },\n icon: {\n description: \"Please refer to the 'With Custom Icon' example below for details.\"\n },\n duration: {\n description:\n \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n control: \"number\"\n },\n dismissible: {\n description: \"Please refer to the 'Not Dismissible' example below for details.\"\n },\n position: {\n description: \"Please refer to the 'With Custom Position' example below for details.\",\n control: \"select\",\n options: [\n \"top-left\",\n \"top-right\",\n \"bottom-left\",\n \"bottom-right\",\n \"top-center\",\n \"bottom-center\"\n ]\n }\n }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":";;;;;;AAQA,MAAMA,iBAAiB,CAACC;IACpB,MAAM,CAACC,WAAWC,aAAa,GAAGC,SAA0B;IAC5D,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAEC,aAAa,EAAE,GAAGC;IAChD,OAAO,WAAP,GACI,wDACI,oBAACC,QAAMA;QACH,MAAM;QACN,SAAS;YACL,MAAMC,QAAQL,UAAUJ;YACxBE,aAAaO;QACjB;sBAEJ,oBAACD,QAAMA;QAAC,MAAM;QAAqB,SAAS,IAAMH,UAAUJ;sBAC5D,oBAACO,QAAMA;QAAC,MAAM;QAAmB,SAAS,IAAMF;;AAG5D;AAEA,MAAMI,OAA8B;IAChC,OAAO;IACP,WAAWX;IACX,YAAY;QACR,QAAQ;IACZ;IACA,UAAU;QACN,SAAS;YAAE,SAAS;YAAU,SAAS;gBAAC;gBAAW;aAAS;QAAC;IACjE;IACA,YAAY;QACRY,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA,OAAAA,WAAAA,GACD,oBAACC,MAAM,QAAQ;KAG1B;AACL;AAEA,yBAAeF;AAIR,MAAMG,UAAiB;IAC1B,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,gBAAuB;IAChC,MAAM;QACF,GAAGD,QAAQ,IAAI;QACf,SAAS;IACb;AACJ;AAEO,MAAME,qBAA4B;IACrC,MAAM;QACF,OAAO,WAAP,GAAO,oBAACH,MAAM,KAAK;YAAC,MAAM;;IAC9B;AACJ;AAEO,MAAMI,kBAAyB;IAClC,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMI,2BAAkC;IAC3C,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,aAAa,WAAb,GACI,oBAACD,MAAM,WAAW;YAAC,MAAM;;IAEjC;AACJ;AAEO,MAAMM,cAAqB;IAC9B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,SAAS,WAAT,GACI,oBAACD,MAAM,OAAO,sBACV,oBAACJ,QAAMA;YACH,KAAK;YACL,MAAM;YACN,SAAS,IAAMW,QAAQ,GAAG,CAAC;0BAE/B,oBAACX,QAAMA;YACH,KAAK;YACL,MAAM;YACN,SAAS,IAAMW,QAAQ,GAAG,CAAC;YAC3B,SAAS;;IAIzB;AACJ;AAEO,MAAMC,4BAAmC;IAC5C,MAAM;QACF,GAAGP,QAAQ,IAAI;QACf,aAAa,WAAb,GACI,oBAACD,MAAM,WAAW;YAAC,MAAM;;QAE7B,SAAS,WAAT,GACI,oBAACA,MAAM,OAAO,sBACV,oBAACJ,QAAMA;YACH,KAAK;YACL,MAAM;YACN,SAAS,IAAMW,QAAQ,GAAG,CAAC;0BAE/B,oBAACX,QAAMA;YACH,KAAK;YACL,MAAM;YACN,SAAS,IAAMW,QAAQ,GAAG,CAAC;YAC3B,SAAS;;IAIzB;AACJ;AAEO,MAAME,iBAAwB;IACjC,MAAM;QACF,GAAGR,QAAQ,IAAI;QACf,MAAM,WAAN,GAAM,oBAACS,MAAIA;YAAC,oBAAM,oBAACC,gBAAYA;YAAK,OAAO;;IAC/C;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,GAAGX,QAAQ,IAAI;QACf,UAAUY,KAAQ;IACtB;AACJ;AAEO,MAAMC,iBAAwB;IACjC,MAAM;QACF,GAAGb,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMc,qBAA4B;IACrC,MAAM;QACF,GAAGd,QAAQ,IAAI;QACf,UAAU;IACd;AACJ;AAEO,MAAMe,gBAAuB;IAChC,MAAM;QACF,OAAO;QACP,aAAa;QACb,SAAS;QACT,UAAU;QACV,UAAU;QACV,aAAa;QACb,SAASC;QACT,MAAMA;IACV;IACA,UAAU;QACN,OAAO;YACH,aAAa;QACjB;QACA,aAAa;YACT,aACI;QACR;QACA,SAAS;YACL,aAAa;QACjB;QACA,SAAS;YACL,aAAa;QACjB;QACA,MAAM;YACF,aAAa;QACjB;QACA,UAAU;YACN,aACI;YACJ,SAAS;QACb;QACA,aAAa;YACT,aAAa;QACjB;QACA,UAAU;YACN,aAAa;YACb,SAAS;YACT,SAAS;gBACL;gBACA;gBACA;gBACA;gBACA;gBACA;aACH;QACL;IACJ;AACJ"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/admin-ui",
3
- "version": "6.4.11",
3
+ "version": "6.4.12-beta.1",
4
4
  "type": "module",
5
5
  "exports": {
6
6
  ".": "./index.js",
@@ -13,59 +13,59 @@
13
13
  "description": "The UI component library for Webiny's Admin app.",
14
14
  "license": "MIT",
15
15
  "dependencies": {
16
- "@fortawesome/fontawesome-svg-core": "7.3.0",
17
- "@fortawesome/react-fontawesome": "3.4.0",
16
+ "@fortawesome/fontawesome-svg-core": "7.3.1",
17
+ "@fortawesome/react-fontawesome": "3.5.0",
18
18
  "@minoru/react-dnd-treeview": "3.5.4",
19
19
  "@monaco-editor/react": "4.7.0",
20
- "@radix-ui/react-scroll-area": "1.2.14",
21
- "@tanstack/react-table": "8.21.3",
22
- "@webiny/icons": "6.4.11",
23
- "@webiny/react-composition": "6.4.11",
24
- "@webiny/utils": "6.4.11",
20
+ "@radix-ui/react-scroll-area": "1.2.18",
21
+ "@tanstack/react-table": "9.2.4",
22
+ "@webiny/icons": "6.4.12-beta.1",
23
+ "@webiny/react-composition": "6.4.12-beta.1",
24
+ "@webiny/utils": "6.4.12-beta.1",
25
25
  "bytes": "3.1.2",
26
26
  "class-variance-authority": "0.7.1",
27
27
  "clsx": "2.1.1",
28
28
  "cmdk": "1.1.1",
29
29
  "date-fns": "4.4.0",
30
30
  "lodash": "4.18.1",
31
- "minimatch": "10.2.5",
32
- "mobx": "6.16.1",
31
+ "minimatch": "10.2.6",
32
+ "mobx": "7.0.3",
33
33
  "monaco-editor": "0.53.0",
34
- "radix-ui": "1.6.2",
34
+ "radix-ui": "1.6.7",
35
35
  "react": "18.3.1",
36
36
  "react-color": "2.19.3",
37
37
  "react-custom-scrollbars": "4.2.1",
38
38
  "react-day-picker": "10.0.1",
39
39
  "react-dnd": "16.0.1",
40
40
  "react-virtualized": "9.22.6",
41
- "sonner": "2.0.7",
41
+ "sonner": "2.0.8",
42
42
  "tailwind-merge": "2.6.1",
43
- "tailwindcss": "4.3.2",
43
+ "tailwindcss": "4.3.3",
44
44
  "tw-animate-css": "1.4.0",
45
- "type-fest": "5.8.0"
45
+ "type-fest": "5.10.0"
46
46
  },
47
47
  "devDependencies": {
48
- "@fortawesome/free-solid-svg-icons": "7.3.0",
49
- "@rsbuild/core": "2.1.5",
48
+ "@fortawesome/free-solid-svg-icons": "7.3.1",
49
+ "@rsbuild/core": "2.2.8",
50
50
  "@rsbuild/plugin-svgr": "2.0.5",
51
- "@storybook/addon-a11y": "10.4.6",
52
- "@storybook/addon-docs": "10.4.6",
53
- "@storybook/react": "10.4.6",
54
- "@tailwindcss/postcss": "4.3.2",
51
+ "@storybook/addon-a11y": "10.6.0",
52
+ "@storybook/addon-docs": "10.6.0",
53
+ "@storybook/react": "10.6.0",
54
+ "@tailwindcss/postcss": "4.3.3",
55
55
  "@types/react": "18.3.31",
56
56
  "@types/react-color": "3.0.13",
57
57
  "@types/react-custom-scrollbars": "4.0.13",
58
58
  "@types/react-virtualized": "9.22.3",
59
- "@webiny/build-tools": "6.4.11",
60
- "@webiny/project": "6.4.11",
61
- "chalk": "5.6.2",
62
- "oxfmt": "0.58.0",
59
+ "@webiny/build-tools": "6.4.12-beta.1",
60
+ "@webiny/project": "6.4.12-beta.1",
61
+ "chalk": "6.0.0",
62
+ "oxfmt": "0.68.0",
63
63
  "rimraf": "6.1.3",
64
- "sass": "1.101.0",
65
- "storybook": "10.4.6",
66
- "storybook-react-rsbuild": "3.3.4",
64
+ "sass": "1.104.1",
65
+ "storybook": "10.6.0",
66
+ "storybook-react-rsbuild": "3.4.2",
67
67
  "typescript": "6.0.3",
68
- "vitest": "4.1.10"
68
+ "vitest": "5.0.1"
69
69
  },
70
70
  "publishConfig": {
71
71
  "access": "public"