@economic/taco 1.14.2 → 1.15.0
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.
- package/dist/components/AlertDialog/components/Content.d.ts +1 -1
- package/dist/components/Button/Button.stories.d.ts +3 -0
- package/dist/components/Calendar/Calendar.d.ts +1 -1
- package/dist/components/Calendar/Calendar.stories.d.ts +1 -1
- package/dist/components/Datepicker/Datepicker.d.ts +1 -1
- package/dist/components/Datepicker/Datepicker.stories.d.ts +1 -1
- package/dist/components/Dialog/components/Content.d.ts +1 -1
- package/dist/components/Dialog/components/Drawer.d.ts +1 -1
- package/dist/components/IconButton/IconButton.d.ts +2 -2
- package/dist/components/IconButton/IconButton.stories.d.ts +4 -1
- package/dist/components/Listbox/Listbox.d.ts +2 -2
- package/dist/components/Listbox/Listbox.stories.d.ts +1 -1
- package/dist/components/Listbox/ScrollableList.d.ts +1 -1
- package/dist/components/Menu/components/Checkbox.d.ts +1 -1
- package/dist/components/Menu/components/Content.d.ts +1 -1
- package/dist/components/Menu/components/Item.d.ts +1 -1
- package/dist/components/Menu/components/Link.d.ts +1 -1
- package/dist/components/Menu/components/Trigger.d.ts +1 -1
- package/dist/components/Popover/Popover.d.ts +6 -0
- package/dist/components/Popover/Popover.stories.d.ts +17 -2
- package/dist/components/SearchInput/SearchInput.d.ts +1 -1
- package/dist/components/SearchInput/SearchInput.stories.d.ts +1 -1
- package/dist/components/Select/Select.d.ts +1 -1
- package/dist/components/Select/Select.stories.d.ts +1 -1
- package/dist/components/Select2/components/Option.d.ts +1 -1
- package/dist/components/Select2/components/Trigger.d.ts +1 -1
- package/dist/components/Tag/Tag.d.ts +1 -1
- package/dist/esm/packages/taco/src/components/Card/Card.js +1 -1
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js +2 -2
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js +2 -2
- package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js +2 -2
- package/dist/esm/packages/taco/src/components/Dialog/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Input/Input.js +2 -2
- package/dist/esm/packages/taco/src/components/Input/Input.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Listbox/ScrollableList.js +2 -2
- package/dist/esm/packages/taco/src/components/Listbox/ScrollableList.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Listbox/useListbox.js +2 -2
- package/dist/esm/packages/taco/src/components/Listbox/useListbox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Listbox/useMultiListbox.js +2 -2
- package/dist/esm/packages/taco/src/components/Listbox/useMultiListbox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Menu/components/Content.js +2 -2
- package/dist/esm/packages/taco/src/components/Menu/components/Content.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js +2 -2
- package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Navigation/Navigation.js +2 -2
- package/dist/esm/packages/taco/src/components/Navigation/Navigation.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Popover/Popover.js +7 -1
- package/dist/esm/packages/taco/src/components/Popover/Popover.js.map +1 -1
- package/dist/esm/packages/taco/src/components/SearchInput/SearchInput.js +1 -1
- package/dist/esm/packages/taco/src/components/Select/useSelect.js +2 -2
- package/dist/esm/packages/taco/src/components/Select/useSelect.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/Select2.js +1 -1
- package/dist/esm/packages/taco/src/components/Table/components/BaseTable.js +2 -2
- package/dist/esm/packages/taco/src/components/Table/components/BaseTable.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table/components/Table.js +2 -2
- package/dist/esm/packages/taco/src/components/Table/components/Table.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table/components/WindowedTable.js +2 -2
- package/dist/esm/packages/taco/src/components/Table/components/WindowedTable.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table/hooks/useTable.js +1 -2
- package/dist/esm/packages/taco/src/components/Table/hooks/useTable.js.map +1 -1
- package/dist/esm/packages/taco/src/index.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js +39 -50
- package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js.map +1 -1
- package/dist/primitives/Collection/components/Root.d.ts +2 -2
- package/dist/taco.cjs.development.js +65 -85
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/dist/utils/storyutils.d.ts +2 -1
- package/package.json +23 -24
- package/types.json +2 -2
- package/dist/esm/packages/taco/src/utils/hooks/useProxiedRef.js +0 -18
- package/dist/esm/packages/taco/src/utils/hooks/useProxiedRef.js.map +0 -1
- package/dist/utils/hooks/useProxiedRef.d.ts +0 -2
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"WindowedTable.js","sources":["../../../../../../../../src/components/Table/components/WindowedTable.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { PluginHook } from 'react-table';\nimport { areEqual, VariableSizeList } from 'react-window';\nimport InfiniteLoader from 'react-window-infinite-loader';\nimport { TableProps, ForwardedGenericTableWithStatics, TableRef } from '../types';\nimport { useTable } from '../hooks/useTable';\nimport { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { Row } from '../util/renderRow';\nimport { DefaultEmptyState, BaseTable } from './BaseTable';\nimport { useLocalization } from '../../Provider/Provider';\n\nconst ROW_HEIGHT = 40;\n\nconst VariableRow = React.memo(({ data, index, style: { height: _, ...style } }: any) => {\n const { texts } = useLocalization();\n const { rows, setRowHeight, rowProps, tableProps, instance, prepareRow, rowHeights } = data;\n const row = rows[index];\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n if (ref?.current) {\n setRowHeight(index, ref.current.getBoundingClientRect().height);\n }\n }, [rowHeights[index]]);\n\n if (row) {\n prepareRow(row, index);\n\n return (\n <Row\n {...rowProps}\n style={style}\n key={index}\n index={index}\n row={row}\n instance={instance}\n headerGroups={tableProps.headerGroups}\n setRowHeight={setRowHeight}\n ref={ref}\n />\n );\n }\n\n return (\n <div className=\"yt-table__row\" role=\"row\" style={style}>\n <div className=\"yt-table__cell text-grey-dark\">{texts.table.loading}</div>\n </div>\n );\n}, areEqual);\n\nconst getAverageRowHeight = (rowHeights = {}) => {\n const keys = Object.keys(rowHeights);\n const estimatedHeight = keys.reduce((p, i) => p + rowHeights[i], 0);\n return estimatedHeight / keys.length;\n};\n\nexport const WindowedTable = React.forwardRef(function WindowedTable<T>(\n props: TableProps<T> & { plugins: PluginHook<{}>[] },\n ref: React.Ref<TableRef>\n) {\n const tableRef: any = useProxiedRef<HTMLDivElement>(ref);\n const { emptyStateRenderer = DefaultEmptyState, length, loadMore, ...otherProps } = props;\n const { rowProps, tableProps, rows, prepareRow, instance, state } = useTable<T>({ ...otherProps, windowed: true }, tableRef);\n\n // determine heights for windowing calculations\n const headerRef = React.useRef<HTMLDivElement>(null);\n const [rowsRef, setRowsRef] = React.useState<any>(null);\n const tableDimensions = useBoundingClientRectListener(tableRef);\n const headerDimensions = useBoundingClientRectListener(headerRef);\n const height = tableDimensions && headerDimensions ? tableDimensions.height - headerDimensions.height : null;\n\n // variable row height calculations\n const estimatedRowHeight = rowProps.rowHeight || ROW_HEIGHT;\n const rowHeights = React.useRef<Record<string, number>>({});\n const setRowHeight = React.useCallback((index: number, size: number) => {\n if (rowHeights.current[index] !== size) {\n rowHeights.current = {\n ...rowHeights.current,\n [index]: size,\n };\n\n if (rowsRef) {\n rowsRef.resetAfterIndex(0);\n }\n }\n }, []);\n const getRowHeight = React.useCallback(index => rowHeights.current[index] || estimatedRowHeight, []);\n\n React.useEffect(() => {\n if (rowsRef && rowProps.activeIndex !== undefined) {\n rowsRef.scrollToItem(rowProps.activeIndex, 'start');\n }\n }, [rowsRef, rowProps.activeIndex]);\n\n // trigger recalculation of variable row heights if the data changes\n React.useEffect(() => {\n rowHeights.current = {};\n\n if (rowsRef) {\n rowsRef.resetAfterIndex(0);\n }\n }, [rows.length]);\n\n const contentHeight = estimatedRowHeight * props.data.length || 0;\n const isScrollbarVisible = height !== null ? contentHeight > height : false;\n\n const className = cn(tableProps.className, 'yt-table--windowed', { 'table-with-scrollbar': isScrollbarVisible });\n\n let list;\n\n const itemData = {\n rows,\n setRowHeight,\n rowProps,\n tableProps,\n instance,\n prepareRow,\n state,\n rowHeights: rowHeights.current,\n };\n\n if (height && rows.length) {\n const listProps = {\n height,\n itemData,\n estimatedItemSize: getAverageRowHeight(rowHeights.current),\n itemSize: getRowHeight,\n width: '100%',\n };\n\n if (loadMore && length) {\n const isLoaded = (index: number) => !!rows[index];\n\n list = (\n <InfiniteLoader isItemLoaded={isLoaded} itemCount={length} loadMoreItems={loadMore as any}>\n {({ onItemsRendered, ref }: any) => (\n <VariableSizeList\n {...listProps}\n itemCount={length}\n onItemsRendered={onItemsRendered}\n ref={list => {\n ref(list);\n setRowsRef(list);\n }}>\n {VariableRow}\n </VariableSizeList>\n )}\n </InfiniteLoader>\n );\n } else {\n list = (\n <VariableSizeList\n {...listProps}\n itemCount={rows.length}\n ref={ref => {\n setRowsRef(ref);\n }}>\n {VariableRow}\n </VariableSizeList>\n );\n }\n }\n\n return (\n <BaseTable {...tableProps} className={className} headerRef={headerRef} ref={tableRef}>\n {list ? list : emptyStateRenderer()}\n </BaseTable>\n );\n}) as ForwardedGenericTableWithStatics;\n\nWindowedTable.Column = () => null;\nWindowedTable.Group = () => null;\n"],"names":["ROW_HEIGHT","VariableRow","React","memo","data","index","style","height","_","texts","useLocalization","rows","setRowHeight","rowProps","tableProps","instance","prepareRow","rowHeights","row","ref","useRef","useEffect","current","getBoundingClientRect","Row","key","headerGroups","className","role","table","loading","areEqual","getAverageRowHeight","keys","Object","estimatedHeight","reduce","p","i","length","WindowedTable","forwardRef","props","tableRef","useProxiedRef","emptyStateRenderer","DefaultEmptyState","loadMore","otherProps","state","useTable","windowed","headerRef","rowsRef","setRowsRef","useState","tableDimensions","useBoundingClientRectListener","headerDimensions","estimatedRowHeight","rowHeight","useCallback","size","resetAfterIndex","getRowHeight","activeIndex","undefined","scrollToItem","contentHeight","isScrollbarVisible","cn","list","itemData","listProps","estimatedItemSize","itemSize","width","isLoaded","InfiniteLoader","isItemLoaded","itemCount","loadMoreItems","onItemsRendered","VariableSizeList","BaseTable","Column","Group"],"mappings":";;;;;;;;;;;AAaA,MAAMA,UAAU,GAAG,EAAE;AAErB,MAAMC,WAAW,gBAAGC,cAAK,CAACC,IAAI,CAAC,CAAC;EAAEC,IAAI;EAAEC,KAAK;EAAEC,KAAK,EAAE;IAAEC,MAAM,EAAEC,CAAC;IAAE,GAAGF;;CAAc;EAChF,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM;IAAEC,IAAI;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,UAAU;IAAEC,QAAQ;IAAEC,UAAU;IAAEC;GAAY,GAAGb,IAAI;EAC3F,MAAMc,GAAG,GAAGP,IAAI,CAACN,KAAK,CAAC;EACvB,MAAMc,GAAG,GAAGjB,cAAK,CAACkB,MAAM,CAAiB,IAAI,CAAC;EAE9ClB,cAAK,CAACmB,SAAS,CAAC;IACZ,IAAIF,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEG,OAAO,EAAE;MACdV,YAAY,CAACP,KAAK,EAAEc,GAAG,CAACG,OAAO,CAACC,qBAAqB,EAAE,CAAChB,MAAM,CAAC;;GAEtE,EAAE,CAACU,UAAU,CAACZ,KAAK,CAAC,CAAC,CAAC;EAEvB,IAAIa,GAAG,EAAE;IACLF,UAAU,CAACE,GAAG,EAAEb,KAAK,CAAC;IAEtB,oBACIH,6BAACsB,GAAG,oBACIX,QAAQ;MACZP,KAAK,EAAEA,KAAK;MACZmB,GAAG,EAAEpB,KAAK;MACVA,KAAK,EAAEA,KAAK;MACZa,GAAG,EAAEA,GAAG;MACRH,QAAQ,EAAEA,QAAQ;MAClBW,YAAY,EAAEZ,UAAU,CAACY,YAAY;MACrCd,YAAY,EAAEA,YAAY;MAC1BO,GAAG,EAAEA;OACP;;EAIV,oBACIjB;IAAKyB,SAAS,EAAC,eAAe;IAACC,IAAI,EAAC,KAAK;IAACtB,KAAK,EAAEA;kBAC7CJ;IAAKyB,SAAS,EAAC;KAAiClB,KAAK,CAACoB,KAAK,CAACC,OAAO,CAAO,CACxE;AAEd,CAAC,EAAEC,QAAQ,CAAC;AAEZ,MAAMC,mBAAmB,GAAG,CAACf,UAAU,GAAG,EAAE;EACxC,MAAMgB,IAAI,GAAGC,MAAM,CAACD,IAAI,CAAChB,UAAU,CAAC;EACpC,MAAMkB,eAAe,GAAGF,IAAI,CAACG,MAAM,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKD,CAAC,GAAGpB,UAAU,CAACqB,CAAC,CAAC,EAAE,CAAC,CAAC;EACnE,OAAOH,eAAe,GAAGF,IAAI,CAACM,MAAM;AACxC,CAAC;MAEYC,aAAa,gBAAGtC,cAAK,CAACuC,UAAU,CAAC,SAASD,aAAa,CAChEE,KAAoD,EACpDvB,GAAwB;EAExB,MAAMwB,QAAQ,GAAQC,aAAa,CAAiBzB,GAAG,CAAC;EACxD,MAAM;IAAE0B,kBAAkB,GAAGC,iBAAiB;IAAEP,MAAM;IAAEQ,QAAQ;IAAE,GAAGC;GAAY,GAAGN,KAAK;EACzF,MAAM;IAAE7B,QAAQ;IAAEC,UAAU;IAAEH,IAAI;IAAEK,UAAU;IAAED,QAAQ;IAAEkC;GAAO,GAAGC,QAAQ,CAAI;IAAE,GAAGF,UAAU;IAAEG,QAAQ,EAAE;GAAM,EAAER,QAAQ,CAAC;;EAG5H,MAAMS,SAAS,GAAGlD,cAAK,CAACkB,MAAM,CAAiB,IAAI,CAAC;EACpD,MAAM,CAACiC,OAAO,EAAEC,UAAU,CAAC,GAAGpD,cAAK,CAACqD,QAAQ,CAAM,IAAI,CAAC;EACvD,MAAMC,eAAe,GAAGC,6BAA6B,CAACd,QAAQ,CAAC;EAC/D,MAAMe,gBAAgB,GAAGD,6BAA6B,CAACL,SAAS,CAAC;EACjE,MAAM7C,MAAM,GAAGiD,eAAe,IAAIE,gBAAgB,GAAGF,eAAe,CAACjD,MAAM,GAAGmD,gBAAgB,CAACnD,MAAM,GAAG,IAAI;;EAG5G,MAAMoD,kBAAkB,GAAG9C,QAAQ,CAAC+C,SAAS,IAAI5D,UAAU;EAC3D,MAAMiB,UAAU,GAAGf,cAAK,CAACkB,MAAM,CAAyB,EAAE,CAAC;EAC3D,MAAMR,YAAY,GAAGV,cAAK,CAAC2D,WAAW,CAAC,CAACxD,KAAa,EAAEyD,IAAY;IAC/D,IAAI7C,UAAU,CAACK,OAAO,CAACjB,KAAK,CAAC,KAAKyD,IAAI,EAAE;MACpC7C,UAAU,CAACK,OAAO,GAAG;QACjB,GAAGL,UAAU,CAACK,OAAO;QACrB,CAACjB,KAAK,GAAGyD;OACZ;MAED,IAAIT,OAAO,EAAE;QACTA,OAAO,CAACU,eAAe,CAAC,CAAC,CAAC;;;GAGrC,EAAE,EAAE,CAAC;EACN,MAAMC,YAAY,GAAG9D,cAAK,CAAC2D,WAAW,CAACxD,KAAK,IAAIY,UAAU,CAACK,OAAO,CAACjB,KAAK,CAAC,IAAIsD,kBAAkB,EAAE,EAAE,CAAC;EAEpGzD,cAAK,CAACmB,SAAS,CAAC;IACZ,IAAIgC,OAAO,IAAIxC,QAAQ,CAACoD,WAAW,KAAKC,SAAS,EAAE;MAC/Cb,OAAO,CAACc,YAAY,CAACtD,QAAQ,CAACoD,WAAW,EAAE,OAAO,CAAC;;GAE1D,EAAE,CAACZ,OAAO,EAAExC,QAAQ,CAACoD,WAAW,CAAC,CAAC;;EAGnC/D,cAAK,CAACmB,SAAS,CAAC;IACZJ,UAAU,CAACK,OAAO,GAAG,EAAE;IAEvB,IAAI+B,OAAO,EAAE;MACTA,OAAO,CAACU,eAAe,CAAC,CAAC,CAAC;;GAEjC,EAAE,CAACpD,IAAI,CAAC4B,MAAM,CAAC,CAAC;EAEjB,MAAM6B,aAAa,GAAGT,kBAAkB,GAAGjB,KAAK,CAACtC,IAAI,CAACmC,MAAM,IAAI,CAAC;EACjE,MAAM8B,kBAAkB,GAAG9D,MAAM,KAAK,IAAI,GAAG6D,aAAa,GAAG7D,MAAM,GAAG,KAAK;EAE3E,MAAMoB,SAAS,GAAG2C,EAAE,CAACxD,UAAU,CAACa,SAAS,EAAE,oBAAoB,EAAE;IAAE,sBAAsB,EAAE0C;GAAoB,CAAC;EAEhH,IAAIE,IAAI;EAER,MAAMC,QAAQ,GAAG;IACb7D,IAAI;IACJC,YAAY;IACZC,QAAQ;IACRC,UAAU;IACVC,QAAQ;IACRC,UAAU;IACViC,KAAK;IACLhC,UAAU,EAAEA,UAAU,CAACK;GAC1B;EAED,IAAIf,MAAM,IAAII,IAAI,CAAC4B,MAAM,EAAE;IACvB,MAAMkC,SAAS,GAAG;MACdlE,MAAM;MACNiE,QAAQ;MACRE,iBAAiB,EAAE1C,mBAAmB,CAACf,UAAU,CAACK,OAAO,CAAC;MAC1DqD,QAAQ,EAAEX,YAAY;MACtBY,KAAK,EAAE;KACV;IAED,IAAI7B,QAAQ,IAAIR,MAAM,EAAE;MACpB,MAAMsC,QAAQ,GAAIxE,KAAa,IAAK,CAAC,CAACM,IAAI,CAACN,KAAK,CAAC;MAEjDkE,IAAI,gBACArE,6BAAC4E,cAAc;QAACC,YAAY,EAAEF,QAAQ;QAAEG,SAAS,EAAEzC,MAAM;QAAE0C,aAAa,EAAElC;SACrE,CAAC;QAAEmC,eAAe;QAAE/D;OAAU,kBAC3BjB,6BAACiF,gBAAgB,oBACTV,SAAS;QACbO,SAAS,EAAEzC,MAAM;QACjB2C,eAAe,EAAEA,eAAe;QAChC/D,GAAG,EAAEoD,IAAI;UACLpD,GAAG,CAACoD,IAAI,CAAC;UACTjB,UAAU,CAACiB,IAAI,CAAC;;UAEnBtE,WAAW,CAEnB,CAER;KACJ,MAAM;MACHsE,IAAI,gBACArE,6BAACiF,gBAAgB,oBACTV,SAAS;QACbO,SAAS,EAAErE,IAAI,CAAC4B,MAAM;QACtBpB,GAAG,EAAEA,GAAG;UACJmC,UAAU,CAACnC,GAAG,CAAC;;UAElBlB,WAAW,CAEnB;;;EAIT,oBACIC,6BAACkF,SAAS,oBAAKtE,UAAU;IAAEa,SAAS,EAAEA,SAAS;IAAEyB,SAAS,EAAEA,SAAS;IAAEjC,GAAG,EAAEwB;MACvE4B,IAAI,GAAGA,IAAI,GAAG1B,kBAAkB,EAAE,CAC3B;AAEpB,CAAC;AAEDL,aAAa,CAAC6C,MAAM,GAAG,MAAM,IAAI;AACjC7C,aAAa,CAAC8C,KAAK,GAAG,MAAM,IAAI;;;;"}
|
1
|
+
{"version":3,"file":"WindowedTable.js","sources":["../../../../../../../../src/components/Table/components/WindowedTable.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { PluginHook } from 'react-table';\nimport { areEqual, VariableSizeList } from 'react-window';\nimport InfiniteLoader from 'react-window-infinite-loader';\nimport { TableProps, ForwardedGenericTableWithStatics, TableRef } from '../types';\nimport { useTable } from '../hooks/useTable';\nimport { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { Row } from '../util/renderRow';\nimport { DefaultEmptyState, BaseTable } from './BaseTable';\nimport { useLocalization } from '../../Provider/Provider';\n\nconst ROW_HEIGHT = 40;\n\nconst VariableRow = React.memo(({ data, index, style: { height: _, ...style } }: any) => {\n const { texts } = useLocalization();\n const { rows, setRowHeight, rowProps, tableProps, instance, prepareRow, rowHeights } = data;\n const row = rows[index];\n const ref = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n if (ref?.current) {\n setRowHeight(index, ref.current.getBoundingClientRect().height);\n }\n }, [rowHeights[index]]);\n\n if (row) {\n prepareRow(row, index);\n\n return (\n <Row\n {...rowProps}\n style={style}\n key={index}\n index={index}\n row={row}\n instance={instance}\n headerGroups={tableProps.headerGroups}\n setRowHeight={setRowHeight}\n ref={ref}\n />\n );\n }\n\n return (\n <div className=\"yt-table__row\" role=\"row\" style={style}>\n <div className=\"yt-table__cell text-grey-dark\">{texts.table.loading}</div>\n </div>\n );\n}, areEqual);\n\nconst getAverageRowHeight = (rowHeights = {}) => {\n const keys = Object.keys(rowHeights);\n const estimatedHeight = keys.reduce((p, i) => p + rowHeights[i], 0);\n return estimatedHeight / keys.length;\n};\n\nexport const WindowedTable = React.forwardRef(function WindowedTable<T>(\n props: TableProps<T> & { plugins: PluginHook<{}>[] },\n ref: React.Ref<TableRef>\n) {\n const tableRef: any = useMergedRef<HTMLDivElement>(ref);\n const { emptyStateRenderer = DefaultEmptyState, length, loadMore, ...otherProps } = props;\n const { rowProps, tableProps, rows, prepareRow, instance, state } = useTable<T>({ ...otherProps, windowed: true }, tableRef);\n\n // determine heights for windowing calculations\n const headerRef = React.useRef<HTMLDivElement>(null);\n const [rowsRef, setRowsRef] = React.useState<any>(null);\n const tableDimensions = useBoundingClientRectListener(tableRef);\n const headerDimensions = useBoundingClientRectListener(headerRef);\n const height = tableDimensions && headerDimensions ? tableDimensions.height - headerDimensions.height : null;\n\n // variable row height calculations\n const estimatedRowHeight = rowProps.rowHeight || ROW_HEIGHT;\n const rowHeights = React.useRef<Record<string, number>>({});\n const setRowHeight = React.useCallback((index: number, size: number) => {\n if (rowHeights.current[index] !== size) {\n rowHeights.current = {\n ...rowHeights.current,\n [index]: size,\n };\n\n if (rowsRef) {\n rowsRef.resetAfterIndex(0);\n }\n }\n }, []);\n const getRowHeight = React.useCallback(index => rowHeights.current[index] || estimatedRowHeight, []);\n\n React.useEffect(() => {\n if (rowsRef && rowProps.activeIndex !== undefined) {\n rowsRef.scrollToItem(rowProps.activeIndex, 'start');\n }\n }, [rowsRef, rowProps.activeIndex]);\n\n // trigger recalculation of variable row heights if the data changes\n React.useEffect(() => {\n rowHeights.current = {};\n\n if (rowsRef) {\n rowsRef.resetAfterIndex(0);\n }\n }, [rows.length]);\n\n const contentHeight = estimatedRowHeight * props.data.length || 0;\n const isScrollbarVisible = height !== null ? contentHeight > height : false;\n\n const className = cn(tableProps.className, 'yt-table--windowed', { 'table-with-scrollbar': isScrollbarVisible });\n\n let list;\n\n const itemData = {\n rows,\n setRowHeight,\n rowProps,\n tableProps,\n instance,\n prepareRow,\n state,\n rowHeights: rowHeights.current,\n };\n\n if (height && rows.length) {\n const listProps = {\n height,\n itemData,\n estimatedItemSize: getAverageRowHeight(rowHeights.current),\n itemSize: getRowHeight,\n width: '100%',\n };\n\n if (loadMore && length) {\n const isLoaded = (index: number) => !!rows[index];\n\n list = (\n <InfiniteLoader isItemLoaded={isLoaded} itemCount={length} loadMoreItems={loadMore as any}>\n {({ onItemsRendered, ref }: any) => (\n <VariableSizeList\n {...listProps}\n itemCount={length}\n onItemsRendered={onItemsRendered}\n ref={list => {\n ref(list);\n setRowsRef(list);\n }}>\n {VariableRow}\n </VariableSizeList>\n )}\n </InfiniteLoader>\n );\n } else {\n list = (\n <VariableSizeList\n {...listProps}\n itemCount={rows.length}\n ref={ref => {\n setRowsRef(ref);\n }}>\n {VariableRow}\n </VariableSizeList>\n );\n }\n }\n\n return (\n <BaseTable {...tableProps} className={className} headerRef={headerRef} ref={tableRef}>\n {list ? list : emptyStateRenderer()}\n </BaseTable>\n );\n}) as ForwardedGenericTableWithStatics;\n\nWindowedTable.Column = () => null;\nWindowedTable.Group = () => null;\n"],"names":["ROW_HEIGHT","VariableRow","React","memo","data","index","style","height","_","texts","useLocalization","rows","setRowHeight","rowProps","tableProps","instance","prepareRow","rowHeights","row","ref","useRef","useEffect","current","getBoundingClientRect","Row","key","headerGroups","className","role","table","loading","areEqual","getAverageRowHeight","keys","Object","estimatedHeight","reduce","p","i","length","WindowedTable","forwardRef","props","tableRef","useMergedRef","emptyStateRenderer","DefaultEmptyState","loadMore","otherProps","state","useTable","windowed","headerRef","rowsRef","setRowsRef","useState","tableDimensions","useBoundingClientRectListener","headerDimensions","estimatedRowHeight","rowHeight","useCallback","size","resetAfterIndex","getRowHeight","activeIndex","undefined","scrollToItem","contentHeight","isScrollbarVisible","cn","list","itemData","listProps","estimatedItemSize","itemSize","width","isLoaded","InfiniteLoader","isItemLoaded","itemCount","loadMoreItems","onItemsRendered","VariableSizeList","BaseTable","Column","Group"],"mappings":"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"}
|
@@ -132,8 +132,7 @@ const useTable = (props, ref) => {
|
|
132
132
|
columns,
|
133
133
|
data,
|
134
134
|
initialState: {
|
135
|
-
//
|
136
|
-
// @ts-ignore: not sure how to type this correctly right now
|
135
|
+
// @ts-expect-error: not sure how to type this correctly right now
|
137
136
|
sortBy: getInternalSortRules(sortRules) || defaultSortRules,
|
138
137
|
pageSize: !disablePagination ? pageSize : undefined,
|
139
138
|
pageIndex: !disablePagination ? pageIndex : undefined
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useTable.js","sources":["../../../../../../../../src/components/Table/hooks/useTable.tsx"],"sourcesContent":["import React from 'react';\nimport { useTable as useReactTable, useExpanded, useSortBy, usePagination, useRowState } from 'react-table';\nimport { getColumnsFromChildren, getInternalSortRules } from '../util';\nimport { sortTypes } from '../util/sortTypes';\nimport { useRowEditing } from './plugins/useRowEditing';\nimport { useRowActions } from './plugins/useRowActions';\nimport { useRowSelect } from './plugins/useRowSelect';\nimport {\n InternalTable,\n InternalTableRow,\n PaginationHandler,\n RowActiveHandler,\n SortHandler,\n TableProps,\n TableRef,\n} from '../types';\nimport { useTableKeyboardNavigation } from './useTableKeyboardNavigation';\nimport { useLocalization } from '../../Provider/Provider';\nimport { useRowDraggable } from './plugins/useRowDraggable';\nimport { sanitizeRowProps } from '../util';\n\nconst useTableRowActive = (\n activeIndex: number | undefined,\n rows: InternalTableRow[],\n rowExpansionRenderer: TableProps<any>['rowExpansionRenderer'],\n handleonRowActive: RowActiveHandler<any> | undefined\n) => {\n React.useEffect(() => {\n if (activeIndex !== undefined && rows.length && handleonRowActive) {\n const focusedRow = rows[activeIndex];\n if (focusedRow) {\n const sanitizedFocusedRow = sanitizeRowProps(focusedRow, rowExpansionRenderer);\n handleonRowActive(sanitizedFocusedRow);\n }\n }\n }, [activeIndex, rows]);\n};\n\nconst useTableInstance = (instance: any, ref: React.RefObject<TableRef>): object => {\n const sanitizedInstance = React.useMemo(\n () => ({\n toggleAllRowsExpanded: instance.toggleAllRowsExpanded,\n toggleHideAllColumns: instance.toggleHideAllColumns,\n toggleHideColumn: instance.toggleHideColumn,\n toggleEditing: instance.toggleEditing,\n toggleRowEditing: instance.toggleRowEditing,\n resetRowEditing: instance.resetRowEditing,\n toggleRowExpanded: instance.toggleRowExpanded,\n toggleSortBy: instance.toggleSortBy,\n }),\n []\n );\n\n React.useEffect(() => {\n if (ref?.current) {\n ref.current.instance = sanitizedInstance;\n }\n }, [ref]);\n\n return sanitizedInstance;\n};\n\nconst useTablePaginationListener = (disablePagination: boolean, onPaginate: PaginationHandler | undefined, state: any): void => {\n React.useEffect(() => {\n if (!disablePagination && onPaginate) {\n onPaginate(state.pageIndex, state.pageSize);\n }\n }, [state.pageIndex, state.pageSize]);\n};\n\nconst useTableSortingListener = (\n data: any[],\n sortedRows: any[],\n onSort: SortHandler<any> | undefined,\n manualSorting: boolean,\n state: any\n): void => {\n React.useEffect(() => {\n if (onSort) {\n const sortRules = state.sortBy.map((rule: any) => ({ accessor: rule.id, desc: rule.desc }));\n\n if (manualSorting) {\n onSort(sortRules);\n } else {\n let sortedData;\n\n if (sortRules.length && sortedRows?.length) {\n sortedData = sortedRows.map((row: any) => row.original);\n }\n\n onSort(sortRules, sortedData || data);\n }\n }\n }, [onSort && JSON.stringify(state.sortBy), manualSorting]);\n};\n\nconst DEFAULT_PAGE_SIZE = 10;\n\nexport const useTable = <T extends {}>(\n props: TableProps<T> & { windowed?: boolean },\n ref: React.RefObject<TableRef>\n): InternalTable => {\n const {\n children,\n data,\n dangerouslyHijackGlobalKeyboardNavigation: _,\n onRowClick,\n onRowDrag,\n onSelectedRows,\n rowClassName,\n rowExpansionRenderer,\n rowHeight,\n selectedRows,\n\n // sorting\n disableSorting,\n manualSorting,\n onSort,\n sortRules,\n\n //index\n activeIndex: _1,\n defaultActiveIndex: _2,\n onChangeActiveIndex: _3,\n\n // pagination\n disablePagination = true,\n length,\n onPaginate,\n pageSize = DEFAULT_PAGE_SIZE,\n pageIndex = 0,\n\n // row editing\n inlineEditingUniqueId = undefined,\n onRowCreate,\n\n // actions\n actions,\n onRowEdit,\n onRowCopy,\n onRowDelete,\n onRowActive,\n\n windowed = false,\n\n ...otherProps\n } = props;\n\n if ((onSelectedRows && !selectedRows) || (!onSelectedRows && selectedRows)) {\n throw new Error(\n 'Selected rows in a Table component are fully controlled - you must pass both the `onSelectedRows` and `selectedRows` props when using row selection'\n );\n }\n\n const { texts, locale } = useLocalization();\n const { columns, sortRules: defaultSortRules } = React.useMemo(\n () => getColumnsFromChildren(children, rowExpansionRenderer),\n [children, rowExpansionRenderer]\n );\n\n const manualPagination = !disablePagination && !!onPaginate && !!length;\n\n const {\n headerGroups,\n rows,\n sortedRows,\n prepareRow: prepareBaseRow,\n state,\n // pagination\n page,\n gotoPage,\n setPageSize,\n ...instance\n }: any = useReactTable(\n {\n columns,\n data,\n initialState: {\n // eslint-disable-next-line\n // @ts-ignore: not sure how to type this correctly right now\n sortBy: getInternalSortRules(sortRules) || defaultSortRules,\n pageSize: !disablePagination ? pageSize : undefined,\n pageIndex: !disablePagination ? pageIndex : undefined,\n },\n manualPagination,\n pageCount: manualPagination && length ? Math.ceil(length / pageSize) : -1,\n manualSortBy: manualSorting,\n disableSortBy: disableSorting,\n // most of these resets preventions are needed for editing mode\n autoResetExpanded: false,\n autoResetSelectedRows: false,\n autoResetSortBy: false,\n autoResetPage: false,\n sortTypes: React.useMemo(() => sortTypes(locale), []),\n useControlledState: currentState => {\n return React.useMemo(\n () => ({\n ...currentState,\n selectedRowIds: selectedRows || [],\n }),\n [currentState, selectedRows]\n );\n },\n },\n useRowState,\n useSortBy,\n useExpanded,\n usePagination,\n useRowSelect(onSelectedRows),\n useRowDraggable(onRowDrag),\n useRowEditing(inlineEditingUniqueId),\n useRowActions(\n inlineEditingUniqueId,\n { onRowCreate, onRowEdit, onRowCopy, onRowDelete },\n actions,\n rowExpansionRenderer,\n texts,\n windowed\n )\n );\n\n useTablePaginationListener(disablePagination, onPaginate, state);\n useTableSortingListener(data, sortedRows, onSort, !!manualSorting, state);\n\n const sanitizedInstance = useTableInstance(instance, ref);\n\n const visibleRows = !disablePagination && !manualPagination ? page : rows;\n\n const [activeIndex, setActiveIndex, handleKeyDown, handleFocus] = useTableKeyboardNavigation<T>(\n props,\n visibleRows,\n { onRowClick, onRowCreate, onRowEdit, onRowCopy, onRowDelete, rowExpansionRenderer },\n ref\n );\n\n useTableRowActive(activeIndex, rows, rowExpansionRenderer, onRowActive);\n\n const prepareRow = React.useCallback(\n (row: any, index: number) => {\n prepareBaseRow(row);\n row.setActive = () => setActiveIndex(index);\n },\n [prepareBaseRow, setActiveIndex]\n );\n\n return {\n rowProps: {\n activeIndex,\n setActiveIndex,\n onRowClick,\n rowClassName,\n rowExpansionRenderer,\n rowHeight,\n inlineEditingUniqueId,\n },\n tableProps: {\n ...otherProps,\n headerGroups,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n tabIndex: otherProps.tabIndex ?? 0,\n },\n state,\n pagination: !disablePagination\n ? {\n length: manualPagination && length ? length : data.length,\n pageIndex: state.pageIndex,\n pageSize: state.pageSize,\n setPageIndex: gotoPage,\n setPageSize: setPageSize,\n }\n : null,\n rows: visibleRows,\n prepareRow,\n instance: sanitizedInstance,\n };\n};\n"],"names":["useTableRowActive","activeIndex","rows","rowExpansionRenderer","handleonRowActive","React","useEffect","undefined","length","focusedRow","sanitizedFocusedRow","sanitizeRowProps","useTableInstance","instance","ref","sanitizedInstance","useMemo","toggleAllRowsExpanded","toggleHideAllColumns","toggleHideColumn","toggleEditing","toggleRowEditing","resetRowEditing","toggleRowExpanded","toggleSortBy","current","useTablePaginationListener","disablePagination","onPaginate","state","pageIndex","pageSize","useTableSortingListener","data","sortedRows","onSort","manualSorting","sortRules","sortBy","map","rule","accessor","id","desc","sortedData","row","original","JSON","stringify","DEFAULT_PAGE_SIZE","useTable","props","children","dangerouslyHijackGlobalKeyboardNavigation","_","onRowClick","onRowDrag","onSelectedRows","rowClassName","rowHeight","selectedRows","disableSorting","_1","defaultActiveIndex","_2","onChangeActiveIndex","_3","inlineEditingUniqueId","onRowCreate","actions","onRowEdit","onRowCopy","onRowDelete","onRowActive","windowed","otherProps","Error","texts","locale","useLocalization","columns","defaultSortRules","getColumnsFromChildren","manualPagination","headerGroups","prepareRow","prepareBaseRow","page","gotoPage","setPageSize","useReactTable","initialState","getInternalSortRules","pageCount","Math","ceil","manualSortBy","disableSortBy","autoResetExpanded","autoResetSelectedRows","autoResetSortBy","autoResetPage","sortTypes","useControlledState","currentState","selectedRowIds","useRowState","useSortBy","useExpanded","usePagination","useRowSelect","useRowDraggable","useRowEditing","useRowActions","visibleRows","setActiveIndex","handleKeyDown","handleFocus","useTableKeyboardNavigation","useCallback","index","setActive","rowProps","tableProps","onFocus","onKeyDown","tabIndex","pagination","setPageIndex"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"useTable.js","sources":["../../../../../../../../src/components/Table/hooks/useTable.tsx"],"sourcesContent":["import React from 'react';\nimport { useTable as useReactTable, useExpanded, useSortBy, usePagination, useRowState } from 'react-table';\nimport { getColumnsFromChildren, getInternalSortRules } from '../util';\nimport { sortTypes } from '../util/sortTypes';\nimport { useRowEditing } from './plugins/useRowEditing';\nimport { useRowActions } from './plugins/useRowActions';\nimport { useRowSelect } from './plugins/useRowSelect';\nimport {\n InternalTable,\n InternalTableRow,\n PaginationHandler,\n RowActiveHandler,\n SortHandler,\n TableProps,\n TableRef,\n} from '../types';\nimport { useTableKeyboardNavigation } from './useTableKeyboardNavigation';\nimport { useLocalization } from '../../Provider/Provider';\nimport { useRowDraggable } from './plugins/useRowDraggable';\nimport { sanitizeRowProps } from '../util';\n\nconst useTableRowActive = (\n activeIndex: number | undefined,\n rows: InternalTableRow[],\n rowExpansionRenderer: TableProps<any>['rowExpansionRenderer'],\n handleonRowActive: RowActiveHandler<any> | undefined\n) => {\n React.useEffect(() => {\n if (activeIndex !== undefined && rows.length && handleonRowActive) {\n const focusedRow = rows[activeIndex];\n if (focusedRow) {\n const sanitizedFocusedRow = sanitizeRowProps(focusedRow, rowExpansionRenderer);\n handleonRowActive(sanitizedFocusedRow);\n }\n }\n }, [activeIndex, rows]);\n};\n\nconst useTableInstance = (instance: any, ref: React.RefObject<TableRef>): object => {\n const sanitizedInstance = React.useMemo(\n () => ({\n toggleAllRowsExpanded: instance.toggleAllRowsExpanded,\n toggleHideAllColumns: instance.toggleHideAllColumns,\n toggleHideColumn: instance.toggleHideColumn,\n toggleEditing: instance.toggleEditing,\n toggleRowEditing: instance.toggleRowEditing,\n resetRowEditing: instance.resetRowEditing,\n toggleRowExpanded: instance.toggleRowExpanded,\n toggleSortBy: instance.toggleSortBy,\n }),\n []\n );\n\n React.useEffect(() => {\n if (ref?.current) {\n ref.current.instance = sanitizedInstance;\n }\n }, [ref]);\n\n return sanitizedInstance;\n};\n\nconst useTablePaginationListener = (disablePagination: boolean, onPaginate: PaginationHandler | undefined, state: any): void => {\n React.useEffect(() => {\n if (!disablePagination && onPaginate) {\n onPaginate(state.pageIndex, state.pageSize);\n }\n }, [state.pageIndex, state.pageSize]);\n};\n\nconst useTableSortingListener = (\n data: any[],\n sortedRows: any[],\n onSort: SortHandler<any> | undefined,\n manualSorting: boolean,\n state: any\n): void => {\n React.useEffect(() => {\n if (onSort) {\n const sortRules = state.sortBy.map((rule: any) => ({ accessor: rule.id, desc: rule.desc }));\n\n if (manualSorting) {\n onSort(sortRules);\n } else {\n let sortedData;\n\n if (sortRules.length && sortedRows?.length) {\n sortedData = sortedRows.map((row: any) => row.original);\n }\n\n onSort(sortRules, sortedData || data);\n }\n }\n }, [onSort && JSON.stringify(state.sortBy), manualSorting]);\n};\n\nconst DEFAULT_PAGE_SIZE = 10;\n\nexport const useTable = <T extends {}>(\n props: TableProps<T> & { windowed?: boolean },\n ref: React.RefObject<TableRef>\n): InternalTable => {\n const {\n children,\n data,\n dangerouslyHijackGlobalKeyboardNavigation: _,\n onRowClick,\n onRowDrag,\n onSelectedRows,\n rowClassName,\n rowExpansionRenderer,\n rowHeight,\n selectedRows,\n\n // sorting\n disableSorting,\n manualSorting,\n onSort,\n sortRules,\n\n //index\n activeIndex: _1,\n defaultActiveIndex: _2,\n onChangeActiveIndex: _3,\n\n // pagination\n disablePagination = true,\n length,\n onPaginate,\n pageSize = DEFAULT_PAGE_SIZE,\n pageIndex = 0,\n\n // row editing\n inlineEditingUniqueId = undefined,\n onRowCreate,\n\n // actions\n actions,\n onRowEdit,\n onRowCopy,\n onRowDelete,\n onRowActive,\n\n windowed = false,\n\n ...otherProps\n } = props;\n\n if ((onSelectedRows && !selectedRows) || (!onSelectedRows && selectedRows)) {\n throw new Error(\n 'Selected rows in a Table component are fully controlled - you must pass both the `onSelectedRows` and `selectedRows` props when using row selection'\n );\n }\n\n const { texts, locale } = useLocalization();\n const { columns, sortRules: defaultSortRules } = React.useMemo(\n () => getColumnsFromChildren(children, rowExpansionRenderer),\n [children, rowExpansionRenderer]\n );\n\n const manualPagination = !disablePagination && !!onPaginate && !!length;\n\n const {\n headerGroups,\n rows,\n sortedRows,\n prepareRow: prepareBaseRow,\n state,\n // pagination\n page,\n gotoPage,\n setPageSize,\n ...instance\n }: any = useReactTable(\n {\n columns,\n data,\n initialState: {\n // @ts-expect-error: not sure how to type this correctly right now\n sortBy: getInternalSortRules(sortRules) || defaultSortRules,\n pageSize: !disablePagination ? pageSize : undefined,\n pageIndex: !disablePagination ? pageIndex : undefined,\n },\n manualPagination,\n pageCount: manualPagination && length ? Math.ceil(length / pageSize) : -1,\n manualSortBy: manualSorting,\n disableSortBy: disableSorting,\n // most of these resets preventions are needed for editing mode\n autoResetExpanded: false,\n autoResetSelectedRows: false,\n autoResetSortBy: false,\n autoResetPage: false,\n sortTypes: React.useMemo(() => sortTypes(locale), []),\n useControlledState: currentState => {\n return React.useMemo(\n () => ({\n ...currentState,\n selectedRowIds: selectedRows || [],\n }),\n [currentState, selectedRows]\n );\n },\n },\n useRowState,\n useSortBy,\n useExpanded,\n usePagination,\n useRowSelect(onSelectedRows),\n useRowDraggable(onRowDrag),\n useRowEditing(inlineEditingUniqueId),\n useRowActions(\n inlineEditingUniqueId,\n { onRowCreate, onRowEdit, onRowCopy, onRowDelete },\n actions,\n rowExpansionRenderer,\n texts,\n windowed\n )\n );\n\n useTablePaginationListener(disablePagination, onPaginate, state);\n useTableSortingListener(data, sortedRows, onSort, !!manualSorting, state);\n\n const sanitizedInstance = useTableInstance(instance, ref);\n\n const visibleRows = !disablePagination && !manualPagination ? page : rows;\n\n const [activeIndex, setActiveIndex, handleKeyDown, handleFocus] = useTableKeyboardNavigation<T>(\n props,\n visibleRows,\n { onRowClick, onRowCreate, onRowEdit, onRowCopy, onRowDelete, rowExpansionRenderer },\n ref\n );\n\n useTableRowActive(activeIndex, rows, rowExpansionRenderer, onRowActive);\n\n const prepareRow = React.useCallback(\n (row: any, index: number) => {\n prepareBaseRow(row);\n row.setActive = () => setActiveIndex(index);\n },\n [prepareBaseRow, setActiveIndex]\n );\n\n return {\n rowProps: {\n activeIndex,\n setActiveIndex,\n onRowClick,\n rowClassName,\n rowExpansionRenderer,\n rowHeight,\n inlineEditingUniqueId,\n },\n tableProps: {\n ...otherProps,\n headerGroups,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n tabIndex: otherProps.tabIndex ?? 0,\n },\n state,\n pagination: !disablePagination\n ? {\n length: manualPagination && length ? length : data.length,\n pageIndex: state.pageIndex,\n pageSize: state.pageSize,\n setPageIndex: gotoPage,\n setPageSize: setPageSize,\n }\n : null,\n rows: visibleRows,\n prepareRow,\n instance: sanitizedInstance,\n };\n};\n"],"names":["useTableRowActive","activeIndex","rows","rowExpansionRenderer","handleonRowActive","React","useEffect","undefined","length","focusedRow","sanitizedFocusedRow","sanitizeRowProps","useTableInstance","instance","ref","sanitizedInstance","useMemo","toggleAllRowsExpanded","toggleHideAllColumns","toggleHideColumn","toggleEditing","toggleRowEditing","resetRowEditing","toggleRowExpanded","toggleSortBy","current","useTablePaginationListener","disablePagination","onPaginate","state","pageIndex","pageSize","useTableSortingListener","data","sortedRows","onSort","manualSorting","sortRules","sortBy","map","rule","accessor","id","desc","sortedData","row","original","JSON","stringify","DEFAULT_PAGE_SIZE","useTable","props","children","dangerouslyHijackGlobalKeyboardNavigation","_","onRowClick","onRowDrag","onSelectedRows","rowClassName","rowHeight","selectedRows","disableSorting","_1","defaultActiveIndex","_2","onChangeActiveIndex","_3","inlineEditingUniqueId","onRowCreate","actions","onRowEdit","onRowCopy","onRowDelete","onRowActive","windowed","otherProps","Error","texts","locale","useLocalization","columns","defaultSortRules","getColumnsFromChildren","manualPagination","headerGroups","prepareRow","prepareBaseRow","page","gotoPage","setPageSize","useReactTable","initialState","getInternalSortRules","pageCount","Math","ceil","manualSortBy","disableSortBy","autoResetExpanded","autoResetSelectedRows","autoResetSortBy","autoResetPage","sortTypes","useControlledState","currentState","selectedRowIds","useRowState","useSortBy","useExpanded","usePagination","useRowSelect","useRowDraggable","useRowEditing","useRowActions","visibleRows","setActiveIndex","handleKeyDown","handleFocus","useTableKeyboardNavigation","useCallback","index","setActive","rowProps","tableProps","onFocus","onKeyDown","tabIndex","pagination","setPageIndex"],"mappings":"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"}
|
@@ -16,6 +16,7 @@ export { Provider, defaultLocalisationTexts, useLocalization, useTaco } from './
|
|
16
16
|
export { Calendar } from './components/Calendar/Calendar.js';
|
17
17
|
export { Card } from './components/Card/Card.js';
|
18
18
|
export { Checkbox } from './components/Checkbox/Checkbox.js';
|
19
|
+
export { useMergedRef } from './hooks/useMergedRef.js';
|
19
20
|
export { Input } from './components/Input/Input.js';
|
20
21
|
export { getNextIndexFromKey, useListKeyboardNavigation } from './utils/hooks/useListKeyboardNavigation.js';
|
21
22
|
export { useListScrollTo } from './utils/hooks/useListScrollTo.js';
|
@@ -41,7 +42,6 @@ export { Select } from './components/Select/Select.js';
|
|
41
42
|
export { usePagination } from './components/Pagination/usePagination.js';
|
42
43
|
export { Pagination } from './components/Pagination/Pagination.js';
|
43
44
|
export { Progress } from './components/Progress/Progress.js';
|
44
|
-
export { useMergedRef } from './hooks/useMergedRef.js';
|
45
45
|
export { Tag } from './components/Tag/Tag.js';
|
46
46
|
export { Select2 } from './components/Select2/Select2.js';
|
47
47
|
export { Table } from './components/Table/components/Table.js';
|
@@ -1,100 +1,89 @@
|
|
1
1
|
import React__default from 'react';
|
2
|
-
import { createCustomKeyboardEvent } from '../../../utils/input.js';
|
3
2
|
import { useMergedRef } from '../../../hooks/useMergedRef.js';
|
3
|
+
import { createCustomKeyboardEvent } from '../../../utils/input.js';
|
4
4
|
import { isAriaDirectionKey } from '../../../utils/aria.js';
|
5
5
|
|
6
|
-
const
|
6
|
+
const getOptionsFromCollection = (collection, selector) => collection.querySelectorAll(selector);
|
7
7
|
// we use javascript to set attributes (rather than cloning children and adding them)
|
8
8
|
// so that we can support nesting (e.g. groups) - child elements that aren't options.
|
9
9
|
// without doing this we would have to unwrap and flatten all groups
|
10
10
|
const Root = /*#__PURE__*/React__default.forwardRef(function CollectionRoot(props, ref) {
|
11
11
|
const {
|
12
|
-
|
12
|
+
querySelector,
|
13
13
|
tabIndex = 0,
|
14
14
|
...otherProps
|
15
15
|
} = props;
|
16
16
|
const internalRef = useMergedRef(ref);
|
17
17
|
const [activeIndex, setActiveIndex] = React__default.useState();
|
18
|
-
const
|
18
|
+
const lastLengthRef = React__default.useRef(0);
|
19
|
+
const setActiveOption = (index, collection, option) => {
|
19
20
|
var _collection$querySele;
|
20
21
|
(_collection$querySele = collection.querySelector(`[aria-current]`)) === null || _collection$querySele === void 0 ? void 0 : _collection$querySele.removeAttribute('aria-current');
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
option.scrollIntoView({
|
27
|
-
block: 'nearest'
|
28
|
-
});
|
29
|
-
}
|
30
|
-
}
|
22
|
+
option.setAttribute('aria-current', 'true');
|
23
|
+
option.scrollIntoView({
|
24
|
+
block: 'nearest'
|
25
|
+
});
|
26
|
+
setActiveIndex(index);
|
31
27
|
};
|
32
28
|
const setActiveIndexByElement = React__default.useCallback(option => {
|
33
29
|
if (internalRef.current) {
|
34
|
-
if (option.matches(
|
35
|
-
const options =
|
30
|
+
if (option.matches(querySelector)) {
|
31
|
+
const options = getOptionsFromCollection(internalRef.current, querySelector);
|
36
32
|
const nextActiveIndex = Array.from(options).indexOf(option);
|
37
33
|
if (nextActiveIndex > -1) {
|
38
|
-
|
34
|
+
setActiveOption(nextActiveIndex, internalRef.current, option);
|
39
35
|
}
|
40
36
|
}
|
41
37
|
}
|
42
|
-
}, [internalRef.current]);
|
38
|
+
}, [internalRef.current, querySelector]);
|
43
39
|
React__default.useEffect(() => {
|
44
40
|
if (internalRef.current) {
|
45
41
|
internalRef.current.setActiveIndex = setActiveIndexByElement;
|
46
42
|
}
|
47
43
|
}, [internalRef.current]);
|
48
|
-
// set/remove appropriate aria-current attributes
|
49
|
-
// we do this in a hook because we expose setActiveIndex on the ref
|
50
|
-
React__default.useEffect(() => {
|
51
|
-
if (internalRef.current) {
|
52
|
-
toggleCurrent(internalRef.current);
|
53
|
-
}
|
54
|
-
}, [activeIndex]);
|
55
|
-
// set the initial active index on mount
|
56
44
|
React__default.useEffect(() => {
|
57
45
|
if (internalRef.current) {
|
58
|
-
const
|
59
|
-
if (
|
60
|
-
const
|
61
|
-
if (
|
62
|
-
|
63
|
-
|
64
|
-
|
46
|
+
const options = getOptionsFromCollection(internalRef.current, querySelector);
|
47
|
+
if (options.length && options.length !== lastLengthRef.current) {
|
48
|
+
const selected = internalRef.current.querySelectorAll(`[aria-selected]`);
|
49
|
+
if (selected.length === 1) {
|
50
|
+
if (options) {
|
51
|
+
const firstSelected = selected.item(0);
|
52
|
+
const selectedIndex = Array.from(options).indexOf(firstSelected);
|
53
|
+
if (selectedIndex > -1) {
|
54
|
+
setActiveOption(selectedIndex, internalRef.current, firstSelected);
|
55
|
+
}
|
65
56
|
}
|
57
|
+
} else {
|
58
|
+
// multiple selected or none selected should go to 0
|
59
|
+
setActiveOption(0, internalRef.current, options.item(0));
|
66
60
|
}
|
67
|
-
} else {
|
68
|
-
// multiple selected or none selected should go to 0
|
69
|
-
setActiveIndex(0);
|
70
|
-
}
|
71
|
-
}
|
72
|
-
}, []);
|
73
|
-
// if children length changes, make sure we still have a valid active index (e.g. searching/filtering or adding a new item)
|
74
|
-
React__default.useEffect(() => {
|
75
|
-
if (internalRef.current) {
|
76
|
-
// make sure index and dom are synced
|
77
|
-
toggleCurrent(internalRef.current);
|
78
|
-
if (activeIndex !== undefined && activeIndex > React__default.Children.count(props.children)) {
|
79
|
-
setActiveIndex(0);
|
80
61
|
}
|
62
|
+
lastLengthRef.current = options.length;
|
81
63
|
}
|
82
64
|
}, [props.children]);
|
83
65
|
const handleClick = event => {
|
84
|
-
|
66
|
+
const option = event.target;
|
67
|
+
if (option.matches(querySelector)) {
|
68
|
+
const options = getOptionsFromCollection(event.currentTarget, querySelector);
|
69
|
+
const nextActiveIndex = Array.from(options).indexOf(option);
|
70
|
+
if (nextActiveIndex > -1) {
|
71
|
+
setActiveOption(nextActiveIndex, event.currentTarget, option);
|
72
|
+
}
|
73
|
+
}
|
85
74
|
};
|
86
75
|
const handleKeyDown = event => {
|
87
76
|
// this stops the event dispatched to the option rebounding back and starting an infinite loop
|
88
77
|
if (event.target !== event.currentTarget) {
|
89
78
|
return;
|
90
79
|
}
|
91
|
-
const options =
|
80
|
+
const options = getOptionsFromCollection(event.currentTarget, querySelector);
|
92
81
|
if (options) {
|
93
82
|
if (isAriaDirectionKey(event)) {
|
94
83
|
const nextActiveIndex = getNextEnabledItem(event, options, activeIndex);
|
95
84
|
if (nextActiveIndex !== undefined && nextActiveIndex !== activeIndex) {
|
96
85
|
event.preventDefault();
|
97
|
-
|
86
|
+
setActiveOption(nextActiveIndex, event.currentTarget, options.item(nextActiveIndex));
|
98
87
|
}
|
99
88
|
} else if (activeIndex !== undefined) {
|
100
89
|
// forward events onto the underlying option - this lets consumers place onKeyDown handlers on their own components
|
@@ -106,7 +95,7 @@ const Root = /*#__PURE__*/React__default.forwardRef(function CollectionRoot(prop
|
|
106
95
|
onClick: handleClick,
|
107
96
|
onKeyDown: handleKeyDown,
|
108
97
|
ref: internalRef,
|
109
|
-
tabIndex: tabIndex
|
98
|
+
tabIndex: tabIndex
|
110
99
|
}));
|
111
100
|
});
|
112
101
|
const getNextIndexFromKeycode = (event, length, activeIndex) => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Collection/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { isAriaDirectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\n\n/* This component provides a keyboard navigable collection primitive for use in lists\n * It is unlikely you need to edit this component\n */\n\nexport type CollectionProps = React.HTMLAttributes<HTMLDivElement> & {\n selector: string;\n};\n\nexport type CollectionRef = HTMLDivElement & {\n setActiveIndex: (option: HTMLDivElement) => void;\n};\n\nconst getOptions = (collection: HTMLDivElement, selector: string): NodeListOf<Element> => collection.querySelectorAll(selector);\n\n// we use javascript to set attributes (rather than cloning children and adding them)\n// so that we can support nesting (e.g. groups) - child elements that aren't options.\n// without doing this we would have to unwrap and flatten all groups\nexport const Root = React.forwardRef<CollectionRef, CollectionProps>(function CollectionRoot(props, ref) {\n const { selector, tabIndex = 0, ...otherProps } = props;\n const internalRef = useMergedRef<CollectionRef>(ref);\n const [activeIndex, setActiveIndex] = React.useState<undefined | number>();\n\n const toggleCurrent = (collection: HTMLDivElement) => {\n collection.querySelector(`[aria-current]`)?.removeAttribute('aria-current');\n\n if (activeIndex !== undefined) {\n const option = getOptions(collection, selector)?.item(activeIndex);\n\n if (option) {\n option.setAttribute('aria-current', 'true');\n option.scrollIntoView({ block: 'nearest' });\n }\n }\n };\n\n const setActiveIndexByElement = React.useCallback(\n (option: HTMLDivElement) => {\n if (internalRef.current) {\n if (option.matches(selector)) {\n const options = getOptions(internalRef.current, selector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveIndex(nextActiveIndex);\n }\n }\n }\n },\n [internalRef.current]\n );\n\n React.useEffect(() => {\n if (internalRef.current) {\n internalRef.current.setActiveIndex = setActiveIndexByElement;\n }\n }, [internalRef.current]);\n\n // set/remove appropriate aria-current attributes\n // we do this in a hook because we expose setActiveIndex on the ref\n React.useEffect(() => {\n if (internalRef.current) {\n toggleCurrent(internalRef.current);\n }\n }, [activeIndex]);\n\n // set the initial active index on mount\n React.useEffect(() => {\n if (internalRef.current) {\n const selected = internalRef.current.querySelectorAll(`[aria-selected]`);\n\n if (selected.length === 1) {\n const options = getOptions(internalRef.current, selector);\n\n if (options) {\n const selectedIndex = Array.from(options).indexOf(selected.item(0));\n\n if (selectedIndex > -1) {\n setActiveIndex(selectedIndex);\n }\n }\n } else {\n // multiple selected or none selected should go to 0\n setActiveIndex(0);\n }\n }\n }, []);\n\n // if children length changes, make sure we still have a valid active index (e.g. searching/filtering or adding a new item)\n React.useEffect(() => {\n if (internalRef.current) {\n // make sure index and dom are synced\n toggleCurrent(internalRef.current);\n\n if (activeIndex !== undefined && activeIndex > React.Children.count(props.children)) {\n setActiveIndex(0);\n }\n }\n }, [props.children]);\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n setActiveIndexByElement(event.target as HTMLDivElement);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // this stops the event dispatched to the option rebounding back and starting an infinite loop\n if (event.target !== event.currentTarget) {\n return;\n }\n\n const options = getOptions(event.currentTarget, selector);\n\n if (options) {\n if (isAriaDirectionKey(event)) {\n const nextActiveIndex = getNextEnabledItem(event, options, activeIndex);\n\n if (nextActiveIndex !== undefined && nextActiveIndex !== activeIndex) {\n event.preventDefault();\n setActiveIndex(nextActiveIndex);\n }\n } else if (activeIndex !== undefined) {\n // forward events onto the underlying option - this lets consumers place onKeyDown handlers on their own components\n options\n .item(activeIndex)\n .dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n }\n }\n };\n\n return <div {...otherProps} onClick={handleClick} onKeyDown={handleKeyDown} ref={internalRef} tabIndex={tabIndex ?? 0} />;\n});\n\nexport const getNextIndexFromKeycode = (\n event: React.KeyboardEvent,\n length: number,\n activeIndex: number | undefined\n): number | undefined => {\n switch (event.key) {\n case 'ArrowUp':\n return activeIndex === undefined ? length - 1 : activeIndex > 0 ? activeIndex - 1 : activeIndex;\n\n case 'ArrowDown':\n return activeIndex === undefined ? 0 : activeIndex < length - 1 ? activeIndex + 1 : activeIndex;\n\n case 'Home':\n return 0;\n\n case 'End':\n return length - 1;\n\n default:\n return;\n }\n};\n\nexport const getNextEnabledItem = (\n event: React.KeyboardEvent<HTMLElement>,\n options: NodeListOf<Element>,\n activeIndex: number | undefined,\n recurse = true\n): number | undefined => {\n const nextIndex = getNextIndexFromKeycode(event, options.length, activeIndex);\n\n if (nextIndex !== undefined) {\n if (nextIndex === activeIndex) {\n return activeIndex;\n } else if (options.item(nextIndex) && isSkippableItem(options.item(nextIndex))) {\n // check in the other direction if the first or last item is disabled,\n // but prevent infinite loops if all elements are disabled by disabling recursion\n if (recurse) {\n if (nextIndex === 0) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowDown' }) as any,\n options,\n nextIndex,\n false\n );\n } else if (nextIndex === options.length - 1) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowUp' }) as any,\n options,\n nextIndex,\n false\n );\n }\n }\n\n return getNextEnabledItem(event, options, nextIndex, recurse);\n }\n }\n\n return nextIndex;\n};\n\nconst isSkippableItem = (element: Element) => {\n return (\n element.getAttribute('role') === 'presentation' ||\n !!element.hasAttribute('disabled') ||\n !!element.getAttribute('aria-disabled') ||\n !!element.getAttribute('aria-hidden')\n );\n};\n"],"names":["getOptions","collection","selector","querySelectorAll","Root","React","forwardRef","CollectionRoot","props","ref","tabIndex","otherProps","internalRef","useMergedRef","activeIndex","setActiveIndex","useState","toggleCurrent","querySelector","removeAttribute","undefined","option","item","setAttribute","scrollIntoView","block","setActiveIndexByElement","useCallback","current","matches","options","nextActiveIndex","Array","from","indexOf","useEffect","selected","length","selectedIndex","Children","count","children","handleClick","event","target","handleKeyDown","currentTarget","isAriaDirectionKey","getNextEnabledItem","preventDefault","dispatchEvent","createCustomKeyboardEvent","onClick","onKeyDown","getNextIndexFromKeycode","key","recurse","nextIndex","isSkippableItem","KeyboardEvent","type","element","getAttribute","hasAttribute"],"mappings":";;;;;AAiBA,MAAMA,UAAU,GAAG,CAACC,UAA0B,EAAEC,QAAgB,KAA0BD,UAAU,CAACE,gBAAgB,CAACD,QAAQ,CAAC;AAE/H;AACA;AACA;MACaE,IAAI,gBAAGC,cAAK,CAACC,UAAU,CAAiC,SAASC,cAAc,CAACC,KAAK,EAAEC,GAAG;EACnG,MAAM;IAAEP,QAAQ;IAAEQ,QAAQ,GAAG,CAAC;IAAE,GAAGC;GAAY,GAAGH,KAAK;EACvD,MAAMI,WAAW,GAAGC,YAAY,CAAgBJ,GAAG,CAAC;EACpD,MAAM,CAACK,WAAW,EAAEC,cAAc,CAAC,GAAGV,cAAK,CAACW,QAAQ,EAAsB;EAE1E,MAAMC,aAAa,GAAIhB,UAA0B;;IAC7C,yBAAAA,UAAU,CAACiB,aAAa,iBAAiB,CAAC,0DAA1C,sBAA4CC,eAAe,CAAC,cAAc,CAAC;IAE3E,IAAIL,WAAW,KAAKM,SAAS,EAAE;MAAA;MAC3B,MAAMC,MAAM,kBAAGrB,UAAU,CAACC,UAAU,EAAEC,QAAQ,CAAC,gDAAhC,YAAkCoB,IAAI,CAACR,WAAW,CAAC;MAElE,IAAIO,MAAM,EAAE;QACRA,MAAM,CAACE,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC;QAC3CF,MAAM,CAACG,cAAc,CAAC;UAAEC,KAAK,EAAE;SAAW,CAAC;;;GAGtD;EAED,MAAMC,uBAAuB,GAAGrB,cAAK,CAACsB,WAAW,CAC5CN,MAAsB;IACnB,IAAIT,WAAW,CAACgB,OAAO,EAAE;MACrB,IAAIP,MAAM,CAACQ,OAAO,CAAC3B,QAAQ,CAAC,EAAE;QAC1B,MAAM4B,OAAO,GAAG9B,UAAU,CAACY,WAAW,CAACgB,OAAO,EAAE1B,QAAQ,CAAC;QACzD,MAAM6B,eAAe,GAAGC,KAAK,CAACC,IAAI,CAACH,OAAO,CAAC,CAACI,OAAO,CAACb,MAAM,CAAC;QAE3D,IAAIU,eAAe,GAAG,CAAC,CAAC,EAAE;UACtBhB,cAAc,CAACgB,eAAe,CAAC;;;;GAI9C,EACD,CAACnB,WAAW,CAACgB,OAAO,CAAC,CACxB;EAEDvB,cAAK,CAAC8B,SAAS,CAAC;IACZ,IAAIvB,WAAW,CAACgB,OAAO,EAAE;MACrBhB,WAAW,CAACgB,OAAO,CAACb,cAAc,GAAGW,uBAAuB;;GAEnE,EAAE,CAACd,WAAW,CAACgB,OAAO,CAAC,CAAC;;;EAIzBvB,cAAK,CAAC8B,SAAS,CAAC;IACZ,IAAIvB,WAAW,CAACgB,OAAO,EAAE;MACrBX,aAAa,CAACL,WAAW,CAACgB,OAAO,CAAC;;GAEzC,EAAE,CAACd,WAAW,CAAC,CAAC;;EAGjBT,cAAK,CAAC8B,SAAS,CAAC;IACZ,IAAIvB,WAAW,CAACgB,OAAO,EAAE;MACrB,MAAMQ,QAAQ,GAAGxB,WAAW,CAACgB,OAAO,CAACzB,gBAAgB,kBAAkB,CAAC;MAExE,IAAIiC,QAAQ,CAACC,MAAM,KAAK,CAAC,EAAE;QACvB,MAAMP,OAAO,GAAG9B,UAAU,CAACY,WAAW,CAACgB,OAAO,EAAE1B,QAAQ,CAAC;QAEzD,IAAI4B,OAAO,EAAE;UACT,MAAMQ,aAAa,GAAGN,KAAK,CAACC,IAAI,CAACH,OAAO,CAAC,CAACI,OAAO,CAACE,QAAQ,CAACd,IAAI,CAAC,CAAC,CAAC,CAAC;UAEnE,IAAIgB,aAAa,GAAG,CAAC,CAAC,EAAE;YACpBvB,cAAc,CAACuB,aAAa,CAAC;;;OAGxC,MAAM;;QAEHvB,cAAc,CAAC,CAAC,CAAC;;;GAG5B,EAAE,EAAE,CAAC;;EAGNV,cAAK,CAAC8B,SAAS,CAAC;IACZ,IAAIvB,WAAW,CAACgB,OAAO,EAAE;;MAErBX,aAAa,CAACL,WAAW,CAACgB,OAAO,CAAC;MAElC,IAAId,WAAW,KAAKM,SAAS,IAAIN,WAAW,GAAGT,cAAK,CAACkC,QAAQ,CAACC,KAAK,CAAChC,KAAK,CAACiC,QAAQ,CAAC,EAAE;QACjF1B,cAAc,CAAC,CAAC,CAAC;;;GAG5B,EAAE,CAACP,KAAK,CAACiC,QAAQ,CAAC,CAAC;EAEpB,MAAMC,WAAW,GAAIC,KAAuC;IACxDjB,uBAAuB,CAACiB,KAAK,CAACC,MAAwB,CAAC;GAC1D;EAED,MAAMC,aAAa,GAAIF,KAA0C;;IAE7D,IAAIA,KAAK,CAACC,MAAM,KAAKD,KAAK,CAACG,aAAa,EAAE;MACtC;;IAGJ,MAAMhB,OAAO,GAAG9B,UAAU,CAAC2C,KAAK,CAACG,aAAa,EAAE5C,QAAQ,CAAC;IAEzD,IAAI4B,OAAO,EAAE;MACT,IAAIiB,kBAAkB,CAACJ,KAAK,CAAC,EAAE;QAC3B,MAAMZ,eAAe,GAAGiB,kBAAkB,CAACL,KAAK,EAAEb,OAAO,EAAEhB,WAAW,CAAC;QAEvE,IAAIiB,eAAe,KAAKX,SAAS,IAAIW,eAAe,KAAKjB,WAAW,EAAE;UAClE6B,KAAK,CAACM,cAAc,EAAE;UACtBlC,cAAc,CAACgB,eAAe,CAAC;;OAEtC,MAAM,IAAIjB,WAAW,KAAKM,SAAS,EAAE;;QAElCU,OAAO,CACFR,IAAI,CAACR,WAAW,CAAC,CACjBoC,aAAa,CAACC,yBAAyB,CAACR,KAA8C,CAAC,CAAC;;;GAGxG;EAED,oBAAOtC,sDAASM,UAAU;IAAEyC,OAAO,EAAEV,WAAW;IAAEW,SAAS,EAAER,aAAa;IAAEpC,GAAG,EAAEG,WAAW;IAAEF,QAAQ,EAAEA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAI;KAAK;AAC7H,CAAC;MAEY4C,uBAAuB,GAAG,CACnCX,KAA0B,EAC1BN,MAAc,EACdvB,WAA+B;EAE/B,QAAQ6B,KAAK,CAACY,GAAG;IACb,KAAK,SAAS;MACV,OAAOzC,WAAW,KAAKM,SAAS,GAAGiB,MAAM,GAAG,CAAC,GAAGvB,WAAW,GAAG,CAAC,GAAGA,WAAW,GAAG,CAAC,GAAGA,WAAW;IAEnG,KAAK,WAAW;MACZ,OAAOA,WAAW,KAAKM,SAAS,GAAG,CAAC,GAAGN,WAAW,GAAGuB,MAAM,GAAG,CAAC,GAAGvB,WAAW,GAAG,CAAC,GAAGA,WAAW;IAEnG,KAAK,MAAM;MACP,OAAO,CAAC;IAEZ,KAAK,KAAK;MACN,OAAOuB,MAAM,GAAG,CAAC;IAErB;MACI;;AAEZ;MAEaW,kBAAkB,GAAG,CAC9BL,KAAuC,EACvCb,OAA4B,EAC5BhB,WAA+B,EAC/B0C,OAAO,GAAG,IAAI;EAEd,MAAMC,SAAS,GAAGH,uBAAuB,CAACX,KAAK,EAAEb,OAAO,CAACO,MAAM,EAAEvB,WAAW,CAAC;EAE7E,IAAI2C,SAAS,KAAKrC,SAAS,EAAE;IACzB,IAAIqC,SAAS,KAAK3C,WAAW,EAAE;MAC3B,OAAOA,WAAW;KACrB,MAAM,IAAIgB,OAAO,CAACR,IAAI,CAACmC,SAAS,CAAC,IAAIC,eAAe,CAAC5B,OAAO,CAACR,IAAI,CAACmC,SAAS,CAAC,CAAC,EAAE;;;MAG5E,IAAID,OAAO,EAAE;QACT,IAAIC,SAAS,KAAK,CAAC,EAAE;UACjB,OAAOT,kBAAkB,CACrB,IAAIW,aAAa,CAAChB,KAAK,CAACiB,IAAI,EAAE;YAAE,GAAIjB,KAAa;YAAEY,GAAG,EAAE;WAAa,CAAQ,EAC7EzB,OAAO,EACP2B,SAAS,EACT,KAAK,CACR;SACJ,MAAM,IAAIA,SAAS,KAAK3B,OAAO,CAACO,MAAM,GAAG,CAAC,EAAE;UACzC,OAAOW,kBAAkB,CACrB,IAAIW,aAAa,CAAChB,KAAK,CAACiB,IAAI,EAAE;YAAE,GAAIjB,KAAa;YAAEY,GAAG,EAAE;WAAW,CAAQ,EAC3EzB,OAAO,EACP2B,SAAS,EACT,KAAK,CACR;;;MAIT,OAAOT,kBAAkB,CAACL,KAAK,EAAEb,OAAO,EAAE2B,SAAS,EAAED,OAAO,CAAC;;;EAIrE,OAAOC,SAAS;AACpB;AAEA,MAAMC,eAAe,GAAIG,OAAgB;EACrC,OACIA,OAAO,CAACC,YAAY,CAAC,MAAM,CAAC,KAAK,cAAc,IAC/C,CAAC,CAACD,OAAO,CAACE,YAAY,CAAC,UAAU,CAAC,IAClC,CAAC,CAACF,OAAO,CAACC,YAAY,CAAC,eAAe,CAAC,IACvC,CAAC,CAACD,OAAO,CAACC,YAAY,CAAC,aAAa,CAAC;AAE7C,CAAC;;;;"}
|
1
|
+
{"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Collection/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { isAriaDirectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\n\n/* This component provides a keyboard navigable collection primitive for use in lists\n * It is unlikely you need to edit this component\n */\n\nexport type CollectionProps = React.HTMLAttributes<HTMLDivElement> & {\n querySelector: string;\n};\n\nexport type CollectionRef = HTMLDivElement & {\n setActiveIndex: (option: HTMLDivElement) => void;\n};\n\nconst getOptionsFromCollection = (collection: HTMLDivElement, selector: string): NodeListOf<Element> =>\n collection.querySelectorAll(selector);\n\n// we use javascript to set attributes (rather than cloning children and adding them)\n// so that we can support nesting (e.g. groups) - child elements that aren't options.\n// without doing this we would have to unwrap and flatten all groups\nexport const Root = React.forwardRef<CollectionRef, CollectionProps>(function CollectionRoot(props, ref) {\n const { querySelector, tabIndex = 0, ...otherProps } = props;\n const internalRef = useMergedRef<CollectionRef>(ref);\n const [activeIndex, setActiveIndex] = React.useState<number | undefined>();\n const lastLengthRef = React.useRef(0);\n\n const setActiveOption = (index: number, collection: HTMLDivElement, option: Element) => {\n collection.querySelector(`[aria-current]`)?.removeAttribute('aria-current');\n option.setAttribute('aria-current', 'true');\n option.scrollIntoView({ block: 'nearest' });\n setActiveIndex(index);\n };\n\n const setActiveIndexByElement = React.useCallback(\n (option: HTMLDivElement) => {\n if (internalRef.current) {\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, internalRef.current, option);\n }\n }\n }\n },\n [internalRef.current, querySelector]\n );\n\n React.useEffect(() => {\n if (internalRef.current) {\n internalRef.current.setActiveIndex = setActiveIndexByElement;\n }\n }, [internalRef.current]);\n\n React.useEffect(() => {\n if (internalRef.current) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n\n if (options.length && options.length !== lastLengthRef.current) {\n const selected = internalRef.current.querySelectorAll(`[aria-selected]`);\n\n if (selected.length === 1) {\n if (options) {\n const firstSelected = selected.item(0);\n const selectedIndex = Array.from(options).indexOf(firstSelected);\n\n if (selectedIndex > -1) {\n setActiveOption(selectedIndex, internalRef.current, firstSelected);\n }\n }\n } else {\n // multiple selected or none selected should go to 0\n setActiveOption(0, internalRef.current, options.item(0));\n }\n }\n\n lastLengthRef.current = options.length;\n }\n }, [props.children]);\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n const option = event.target as HTMLElement;\n\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, event.currentTarget, option);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // this stops the event dispatched to the option rebounding back and starting an infinite loop\n if (event.target !== event.currentTarget) {\n return;\n }\n\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n\n if (options) {\n if (isAriaDirectionKey(event)) {\n const nextActiveIndex = getNextEnabledItem(event, options, activeIndex);\n\n if (nextActiveIndex !== undefined && nextActiveIndex !== activeIndex) {\n event.preventDefault();\n setActiveOption(nextActiveIndex, event.currentTarget, options.item(nextActiveIndex));\n }\n } else if (activeIndex !== undefined) {\n // forward events onto the underlying option - this lets consumers place onKeyDown handlers on their own components\n options\n .item(activeIndex)\n .dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n }\n }\n };\n\n return <div {...otherProps} onClick={handleClick} onKeyDown={handleKeyDown} ref={internalRef} tabIndex={tabIndex} />;\n});\n\nexport const getNextIndexFromKeycode = (\n event: React.KeyboardEvent,\n length: number,\n activeIndex: number | undefined\n): number | undefined => {\n switch (event.key) {\n case 'ArrowUp':\n return activeIndex === undefined ? length - 1 : activeIndex > 0 ? activeIndex - 1 : activeIndex;\n\n case 'ArrowDown':\n return activeIndex === undefined ? 0 : activeIndex < length - 1 ? activeIndex + 1 : activeIndex;\n\n case 'Home':\n return 0;\n\n case 'End':\n return length - 1;\n\n default:\n return;\n }\n};\n\nexport const getNextEnabledItem = (\n event: React.KeyboardEvent<HTMLElement>,\n options: NodeListOf<Element>,\n activeIndex: number | undefined,\n recurse = true\n): number | undefined => {\n const nextIndex = getNextIndexFromKeycode(event, options.length, activeIndex);\n\n if (nextIndex !== undefined) {\n if (nextIndex === activeIndex) {\n return activeIndex;\n } else if (options.item(nextIndex) && isSkippableItem(options.item(nextIndex))) {\n // check in the other direction if the first or last item is disabled,\n // but prevent infinite loops if all elements are disabled by disabling recursion\n if (recurse) {\n if (nextIndex === 0) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowDown' }) as any,\n options,\n nextIndex,\n false\n );\n } else if (nextIndex === options.length - 1) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowUp' }) as any,\n options,\n nextIndex,\n false\n );\n }\n }\n\n return getNextEnabledItem(event, options, nextIndex, recurse);\n }\n }\n\n return nextIndex;\n};\n\nconst isSkippableItem = (element: Element) => {\n return (\n element.getAttribute('role') === 'presentation' ||\n !!element.hasAttribute('disabled') ||\n !!element.getAttribute('aria-disabled') ||\n !!element.getAttribute('aria-hidden')\n );\n};\n"],"names":["getOptionsFromCollection","collection","selector","querySelectorAll","Root","React","forwardRef","CollectionRoot","props","ref","querySelector","tabIndex","otherProps","internalRef","useMergedRef","activeIndex","setActiveIndex","useState","lastLengthRef","useRef","setActiveOption","index","option","removeAttribute","setAttribute","scrollIntoView","block","setActiveIndexByElement","useCallback","current","matches","options","nextActiveIndex","Array","from","indexOf","useEffect","length","selected","firstSelected","item","selectedIndex","children","handleClick","event","target","currentTarget","handleKeyDown","isAriaDirectionKey","getNextEnabledItem","undefined","preventDefault","dispatchEvent","createCustomKeyboardEvent","onClick","onKeyDown","getNextIndexFromKeycode","key","recurse","nextIndex","isSkippableItem","KeyboardEvent","type","element","getAttribute","hasAttribute"],"mappings":"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"}
|
@@ -33,7 +33,7 @@ const Root = /*#__PURE__*/React__default.forwardRef(function Listbox2(props, ref
|
|
33
33
|
id: id,
|
34
34
|
ref: ref,
|
35
35
|
role: "listbox",
|
36
|
-
|
36
|
+
querySelector: customSelector ? `${DEFAULT_SELECTOR}, ${customSelector}` : DEFAULT_SELECTOR
|
37
37
|
}), children)));
|
38
38
|
});
|
39
39
|
const createListboxValueSetter = (multiple, setValue) => nextValue => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport * as CollectionPrimitive from '../../Collection/Collection';\nimport { Listbox2Value } from '../types';\nimport { Listbox2Context } from './Context';\n\nexport type Listbox2Props = React.HTMLAttributes<HTMLDivElement> & {\n customSelector?: string;\n disabled?: boolean;\n multiple?: boolean;\n readOnly?: boolean;\n setValue: (value: Listbox2Value) => void;\n value?: Listbox2Value;\n};\n\nconst DEFAULT_SELECTOR = '[role=\"option\"]';\n\nexport const Root = React.forwardRef<CollectionPrimitive.CollectionRef, Listbox2Props>(function Listbox2(props, ref) {\n const {\n children,\n customSelector,\n disabled = false,\n id: nativeId,\n multiple,\n readOnly = false,\n setValue,\n title,\n value,\n ...otherProps\n } = props;\n const id = useId(nativeId);\n\n const context = React.useMemo(\n () => ({\n disabled,\n readOnly,\n setValue,\n value,\n }),\n [disabled, readOnly, value]\n );\n\n return (\n <Listbox2Context.Provider value={context}>\n <div data-taco=\"listbox2\">\n <CollectionPrimitive.Root\n {...otherProps}\n aria-multiselectable={multiple ? true : undefined}\n id={id}\n ref={ref}\n role=\"listbox\"\n
|
1
|
+
{"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport * as CollectionPrimitive from '../../Collection/Collection';\nimport { Listbox2Value } from '../types';\nimport { Listbox2Context } from './Context';\n\nexport type Listbox2Props = React.HTMLAttributes<HTMLDivElement> & {\n customSelector?: string;\n disabled?: boolean;\n multiple?: boolean;\n readOnly?: boolean;\n setValue: (value: Listbox2Value) => void;\n value?: Listbox2Value;\n};\n\nconst DEFAULT_SELECTOR = '[role=\"option\"]';\n\nexport const Root = React.forwardRef<CollectionPrimitive.CollectionRef, Listbox2Props>(function Listbox2(props, ref) {\n const {\n children,\n customSelector,\n disabled = false,\n id: nativeId,\n multiple,\n readOnly = false,\n setValue,\n title,\n value,\n ...otherProps\n } = props;\n const id = useId(nativeId);\n\n const context = React.useMemo(\n () => ({\n disabled,\n readOnly,\n setValue,\n value,\n }),\n [disabled, readOnly, value]\n );\n\n return (\n <Listbox2Context.Provider value={context}>\n <div data-taco=\"listbox2\">\n <CollectionPrimitive.Root\n {...otherProps}\n aria-multiselectable={multiple ? true : undefined}\n id={id}\n ref={ref}\n role=\"listbox\"\n querySelector={customSelector ? `${DEFAULT_SELECTOR}, ${customSelector}` : DEFAULT_SELECTOR}>\n {children}\n </CollectionPrimitive.Root>\n </div>\n </Listbox2Context.Provider>\n );\n});\n\nexport const createListboxValueSetter =\n (multiple: boolean, setValue: React.Dispatch<React.SetStateAction<Listbox2Value | undefined>>) =>\n (nextValue: Listbox2Value) => {\n setValue(value => {\n if (Array.isArray(nextValue)) {\n return nextValue;\n }\n\n if (multiple) {\n if (value === undefined) {\n return [nextValue];\n } else if (Array.isArray(value)) {\n if (value.includes(nextValue)) {\n return value.filter(v => v !== nextValue);\n }\n\n return [...value, nextValue];\n } else if (value === nextValue) {\n return [];\n }\n\n return [value, nextValue];\n }\n\n return nextValue;\n });\n };\n"],"names":["DEFAULT_SELECTOR","Root","React","forwardRef","Listbox2","props","ref","children","customSelector","disabled","id","nativeId","multiple","readOnly","setValue","title","value","otherProps","useId","context","useMemo","Listbox2Context","Provider","CollectionPrimitive","undefined","role","querySelector","createListboxValueSetter","nextValue","Array","isArray","includes","filter","v"],"mappings":";;;;;AAeA,MAAMA,gBAAgB,GAAG,iBAAiB;MAE7BC,IAAI,gBAAGC,cAAK,CAACC,UAAU,CAAmD,SAASC,QAAQ,CAACC,KAAK,EAAEC,GAAG;EAC/G,MAAM;IACFC,QAAQ;IACRC,cAAc;IACdC,QAAQ,GAAG,KAAK;IAChBC,EAAE,EAAEC,QAAQ;IACZC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,QAAQ;IACRC,KAAK;IACLC,KAAK;IACL,GAAGC;GACN,GAAGZ,KAAK;EACT,MAAMK,EAAE,GAAGQ,KAAK,CAACP,QAAQ,CAAC;EAE1B,MAAMQ,OAAO,GAAGjB,cAAK,CAACkB,OAAO,CACzB,OAAO;IACHX,QAAQ;IACRI,QAAQ;IACRC,QAAQ;IACRE;GACH,CAAC,EACF,CAACP,QAAQ,EAAEI,QAAQ,EAAEG,KAAK,CAAC,CAC9B;EAED,oBACId,6BAACmB,eAAe,CAACC,QAAQ;IAACN,KAAK,EAAEG;kBAC7BjB;iBAAe;kBACXA,6BAACqB,MAAwB,oBACjBN,UAAU;4BACQL,QAAQ,GAAG,IAAI,GAAGY,SAAS;IACjDd,EAAE,EAAEA,EAAE;IACNJ,GAAG,EAAEA,GAAG;IACRmB,IAAI,EAAC,SAAS;IACdC,aAAa,EAAElB,cAAc,MAAMR,qBAAqBQ,gBAAgB,GAAGR;MAC1EO,QAAQ,CACc,CACzB,CACiB;AAEnC,CAAC;MAEYoB,wBAAwB,GACjC,CAACf,QAAiB,EAAEE,QAAyE,KAC5Fc,SAAwB;EACrBd,QAAQ,CAACE,KAAK;IACV,IAAIa,KAAK,CAACC,OAAO,CAACF,SAAS,CAAC,EAAE;MAC1B,OAAOA,SAAS;;IAGpB,IAAIhB,QAAQ,EAAE;MACV,IAAII,KAAK,KAAKQ,SAAS,EAAE;QACrB,OAAO,CAACI,SAAS,CAAC;OACrB,MAAM,IAAIC,KAAK,CAACC,OAAO,CAACd,KAAK,CAAC,EAAE;QAC7B,IAAIA,KAAK,CAACe,QAAQ,CAACH,SAAS,CAAC,EAAE;UAC3B,OAAOZ,KAAK,CAACgB,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAKL,SAAS,CAAC;;QAG7C,OAAO,CAAC,GAAGZ,KAAK,EAAEY,SAAS,CAAC;OAC/B,MAAM,IAAIZ,KAAK,KAAKY,SAAS,EAAE;QAC5B,OAAO,EAAE;;MAGb,OAAO,CAACZ,KAAK,EAAEY,SAAS,CAAC;;IAG7B,OAAOA,SAAS;GACnB,CAAC;AACN;;;;"}
|
@@ -1,12 +1,12 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
export declare type CollectionProps = React.HTMLAttributes<HTMLDivElement> & {
|
3
|
-
|
3
|
+
querySelector: string;
|
4
4
|
};
|
5
5
|
export declare type CollectionRef = HTMLDivElement & {
|
6
6
|
setActiveIndex: (option: HTMLDivElement) => void;
|
7
7
|
};
|
8
8
|
export declare const Root: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
|
9
|
-
|
9
|
+
querySelector: string;
|
10
10
|
} & React.RefAttributes<CollectionRef>>;
|
11
11
|
export declare const getNextIndexFromKeycode: (event: React.KeyboardEvent, length: number, activeIndex: number | undefined) => number | undefined;
|
12
12
|
export declare const getNextEnabledItem: (event: React.KeyboardEvent<HTMLElement>, options: NodeListOf<Element>, activeIndex: number | undefined, recurse?: boolean) => number | undefined;
|