@vibe/core 4.5.28-alpha-871ee.0 → 4.5.28
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/combobox/dist/Combobox/Combobox.js +2 -0
- package/dist/components/combobox/dist/Combobox/Combobox.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/Combobox.module.scss.js +2 -0
- package/dist/components/combobox/dist/Combobox/ComboboxHelpers/ComboboxHelpers.js +2 -0
- package/dist/components/combobox/dist/Combobox/ComboboxHelpers/ComboboxHelpers.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js +2 -0
- package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/ComboboxService.js +1 -1
- package/dist/components/combobox/dist/Combobox/ComboboxService.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxCategory/ComboboxCategory.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxConstants.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxConstants.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxItems/ComboboxItems.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxItems/ComboboxItems.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxOption/ComboboxOption.js +2 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxOption/ComboboxOption.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js +2 -0
- package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.js +1 -1
- package/dist/components/combobox/dist/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.js.map +1 -0
- package/dist/components/combobox/dist/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js +2 -0
- package/dist/components/combobox/dist/Combobox/helpers.js +2 -0
- package/dist/components/combobox/dist/Combobox/helpers.js.map +1 -0
- package/dist/components/combobox/dist/_virtual/_tslib.js +2 -0
- package/dist/components/combobox/dist/_virtual/_tslib.js.map +1 -0
- package/dist/components/date-picker/dist/DatePicker/DatePicker.js +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/menu/dist/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.js +1 -1
- package/dist/components/menu/dist/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.js.map +1 -1
- package/dist/components/table/dist/Table/Table/Table.js +2 -0
- package/dist/components/table/dist/Table/Table/Table.js.map +1 -0
- package/dist/components/table/dist/Table/Table/Table.module.scss.js +2 -0
- package/dist/components/table/dist/Table/Table/TableConsts.js +2 -0
- package/dist/components/table/dist/Table/Table/TableConsts.js.map +1 -0
- package/dist/components/table/dist/Table/Table/tableHelpers.js +2 -0
- package/dist/components/table/dist/Table/Table/tableHelpers.js.map +1 -0
- package/dist/components/table/dist/Table/TableBody/TableBody.js +2 -0
- package/dist/components/table/dist/Table/TableBody/TableBody.js.map +1 -0
- package/dist/components/table/dist/Table/TableBody/TableBody.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableCell/TableCell.js +2 -0
- package/dist/components/table/dist/Table/TableCell/TableCell.js.map +1 -0
- package/dist/components/table/dist/Table/TableCell/TableCell.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableCellSkeleton/TableCellSkeleton.js +2 -0
- package/dist/components/table/dist/Table/TableCellSkeleton/TableCellSkeleton.js.map +1 -0
- package/dist/components/table/dist/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableContainer/TableContainer.js +2 -0
- package/dist/components/table/dist/Table/TableContainer/TableContainer.js.map +1 -0
- package/dist/components/table/dist/Table/TableContainer/TableContainer.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableHeader/TableHeader.js +2 -0
- package/dist/components/table/dist/Table/TableHeader/TableHeader.js.map +1 -0
- package/dist/components/table/dist/Table/TableHeader/TableHeader.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableHeaderCell/TableHeaderCell.js +2 -0
- package/dist/components/table/dist/Table/TableHeaderCell/TableHeaderCell.js.map +1 -0
- package/dist/components/table/dist/Table/TableHeaderCell/TableHeaderCell.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableRow/TableRow.js +2 -0
- package/dist/components/table/dist/Table/TableRow/TableRow.js.map +1 -0
- package/dist/components/table/dist/Table/TableRow/TableRow.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableRowMenu/TableRowMenu.js +2 -0
- package/dist/components/table/dist/Table/TableRowMenu/TableRowMenu.js.map +1 -0
- package/dist/components/table/dist/Table/TableRowMenu/TableRowMenu.module.scss.js +2 -0
- package/dist/components/table/dist/Table/TableVirtualizedBody/TableVirtualizedBody.js +2 -0
- package/dist/components/table/dist/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +1 -0
- package/dist/components/table/dist/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js +2 -0
- package/dist/components/table/dist/Table/context/TableContainerContext/TableContainerContext.js +2 -0
- package/dist/components/table/dist/Table/context/TableContainerContext/TableContainerContext.js.map +1 -0
- package/dist/components/table/dist/Table/context/TableContext/TableContext.js +2 -0
- package/dist/components/table/dist/Table/context/TableContext/TableContext.js.map +1 -0
- package/dist/components/table/dist/Table/context/TableRowMenuContext/TableRowMenuContext.js +2 -0
- package/dist/components/table/dist/Table/context/TableRowMenuContext/TableRowMenuContext.js.map +1 -0
- package/dist/components/table/dist/_virtual/_tslib.js +2 -0
- package/dist/components/table/dist/_virtual/_tslib.js.map +1 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/index.js +2 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/index.js.map +1 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js +2 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js.map +1 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js +2 -0
- package/dist/hooks/dist/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js.map +1 -0
- package/dist/hooks/dist/useListenFocusTriggers/index.js.map +1 -0
- package/dist/hooks/index.d.ts +1 -1
- package/dist/metadata/components.json +10 -18
- package/dist/metadata.json +10 -18
- package/dist/mocked_classnames/components/index.d.ts +2 -2
- package/dist/mocked_classnames/hooks/index.d.ts +1 -1
- package/dist/mocked_classnames/src/components/ListItem/ListItem.js +1 -1
- package/dist/mocked_classnames/src/components/ListItem/ListItem.js.map +1 -1
- package/dist/mocked_classnames/src/index.js +1 -1
- package/dist/src/components/ListItem/ListItem.js +1 -1
- package/dist/src/components/ListItem/ListItem.js.map +1 -1
- package/dist/src/index.js +1 -1
- package/package.json +44 -42
- package/dist/components/Combobox/Combobox.d.ts +0 -163
- package/dist/components/Combobox/Combobox.types.d.ts +0 -3
- package/dist/components/Combobox/ComboboxHelpers/ComboboxHelpers.d.ts +0 -62
- package/dist/components/Combobox/ComboboxService.d.ts +0 -7
- package/dist/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +0 -14
- package/dist/components/Combobox/components/ComboboxConstants.d.ts +0 -239
- package/dist/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +0 -65
- package/dist/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +0 -46
- package/dist/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.d.ts +0 -6
- package/dist/components/Combobox/helpers.d.ts +0 -1
- package/dist/components/Combobox/index.d.ts +0 -2
- package/dist/components/Table/Table/Table.d.ts +0 -76
- package/dist/components/Table/Table/Table.types.d.ts +0 -1
- package/dist/components/Table/Table/TableConsts.d.ts +0 -14
- package/dist/components/Table/Table/tableHelpers.d.ts +0 -12
- package/dist/components/Table/TableBody/TableBody.d.ts +0 -12
- package/dist/components/Table/TableCell/TableCell.d.ts +0 -14
- package/dist/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +0 -15
- package/dist/components/Table/TableContainer/TableContainer.d.ts +0 -4
- package/dist/components/Table/TableContainer/TableContainer.types.d.ts +0 -12
- package/dist/components/Table/TableHeader/TableHeader.d.ts +0 -11
- package/dist/components/Table/TableHeaderCell/TableHeaderCell.d.ts +0 -35
- package/dist/components/Table/TableRow/TableRow.d.ts +0 -19
- package/dist/components/Table/TableRowMenu/TableRowMenu.d.ts +0 -4
- package/dist/components/Table/TableRowMenu/TableRowMenu.types.d.ts +0 -12
- package/dist/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +0 -35
- package/dist/components/Table/context/TableContainerContext/TableContainerContext.d.ts +0 -4
- package/dist/components/Table/context/TableContainerContext/TableContainerContext.types.d.ts +0 -9
- package/dist/components/Table/context/TableContext/TableContext.d.ts +0 -4
- package/dist/components/Table/context/TableContext/TableContext.types.d.ts +0 -27
- package/dist/components/Table/context/TableRowMenuContext/TableRowMenuContext.d.ts +0 -4
- package/dist/components/Table/context/TableRowMenuContext/TableRowMenuContext.types.d.ts +0 -23
- package/dist/components/Table/index.d.ts +0 -12
- package/dist/hooks/useActiveDescendantListFocus/index.d.ts +0 -35
- package/dist/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.d.ts +0 -8
- package/dist/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.d.ts +0 -44
- package/dist/hooks/useListenFocusTriggers/index.d.ts +0 -6
- package/dist/mocked_classnames/components/Combobox/Combobox.d.ts +0 -163
- package/dist/mocked_classnames/components/Combobox/Combobox.types.d.ts +0 -3
- package/dist/mocked_classnames/components/Combobox/ComboboxHelpers/ComboboxHelpers.d.ts +0 -62
- package/dist/mocked_classnames/components/Combobox/ComboboxService.d.ts +0 -7
- package/dist/mocked_classnames/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +0 -14
- package/dist/mocked_classnames/components/Combobox/components/ComboboxConstants.d.ts +0 -239
- package/dist/mocked_classnames/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +0 -65
- package/dist/mocked_classnames/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +0 -46
- package/dist/mocked_classnames/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.d.ts +0 -6
- package/dist/mocked_classnames/components/Combobox/helpers.d.ts +0 -1
- package/dist/mocked_classnames/components/Combobox/index.d.ts +0 -2
- package/dist/mocked_classnames/components/Table/Table/Table.d.ts +0 -76
- package/dist/mocked_classnames/components/Table/Table/Table.types.d.ts +0 -1
- package/dist/mocked_classnames/components/Table/Table/TableConsts.d.ts +0 -14
- package/dist/mocked_classnames/components/Table/Table/tableHelpers.d.ts +0 -12
- package/dist/mocked_classnames/components/Table/TableBody/TableBody.d.ts +0 -12
- package/dist/mocked_classnames/components/Table/TableCell/TableCell.d.ts +0 -14
- package/dist/mocked_classnames/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +0 -15
- package/dist/mocked_classnames/components/Table/TableContainer/TableContainer.d.ts +0 -4
- package/dist/mocked_classnames/components/Table/TableContainer/TableContainer.types.d.ts +0 -12
- package/dist/mocked_classnames/components/Table/TableHeader/TableHeader.d.ts +0 -11
- package/dist/mocked_classnames/components/Table/TableHeaderCell/TableHeaderCell.d.ts +0 -35
- package/dist/mocked_classnames/components/Table/TableRow/TableRow.d.ts +0 -19
- package/dist/mocked_classnames/components/Table/TableRowMenu/TableRowMenu.d.ts +0 -4
- package/dist/mocked_classnames/components/Table/TableRowMenu/TableRowMenu.types.d.ts +0 -12
- package/dist/mocked_classnames/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +0 -35
- package/dist/mocked_classnames/components/Table/context/TableContainerContext/TableContainerContext.d.ts +0 -4
- package/dist/mocked_classnames/components/Table/context/TableContainerContext/TableContainerContext.types.d.ts +0 -9
- package/dist/mocked_classnames/components/Table/context/TableContext/TableContext.d.ts +0 -4
- package/dist/mocked_classnames/components/Table/context/TableContext/TableContext.types.d.ts +0 -27
- package/dist/mocked_classnames/components/Table/context/TableRowMenuContext/TableRowMenuContext.d.ts +0 -4
- package/dist/mocked_classnames/components/Table/context/TableRowMenuContext/TableRowMenuContext.types.d.ts +0 -23
- package/dist/mocked_classnames/components/Table/index.d.ts +0 -12
- package/dist/mocked_classnames/hooks/useActiveDescendantListFocus/index.d.ts +0 -35
- package/dist/mocked_classnames/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.d.ts +0 -8
- package/dist/mocked_classnames/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.d.ts +0 -44
- package/dist/mocked_classnames/hooks/useListenFocusTriggers/index.d.ts +0 -6
- package/dist/mocked_classnames/src/components/Combobox/Combobox.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/Combobox.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/Combobox.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/ComboboxService.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxConstants.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxConstants.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.js.map +0 -1
- package/dist/mocked_classnames/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/helpers.js +0 -2
- package/dist/mocked_classnames/src/components/Combobox/helpers.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/Table/Table.js +0 -2
- package/dist/mocked_classnames/src/components/Table/Table/Table.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/Table/Table.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/Table/TableConsts.js +0 -2
- package/dist/mocked_classnames/src/components/Table/Table/TableConsts.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/Table/tableHelpers.js +0 -2
- package/dist/mocked_classnames/src/components/Table/Table/tableHelpers.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableContainer/TableContainer.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableContainer/TableContainer.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableContainer/TableContainer.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableRowMenu/TableRowMenu.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableRowMenu/TableRowMenu.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableRowMenu/TableRowMenu.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js +0 -2
- package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js +0 -2
- package/dist/mocked_classnames/src/components/Table/context/TableContainerContext/TableContainerContext.js +0 -2
- package/dist/mocked_classnames/src/components/Table/context/TableContainerContext/TableContainerContext.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/context/TableContext/TableContext.js +0 -2
- package/dist/mocked_classnames/src/components/Table/context/TableContext/TableContext.js.map +0 -1
- package/dist/mocked_classnames/src/components/Table/context/TableRowMenuContext/TableRowMenuContext.js +0 -2
- package/dist/mocked_classnames/src/components/Table/context/TableRowMenuContext/TableRowMenuContext.js.map +0 -1
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/index.js +0 -2
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/index.js.map +0 -1
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js +0 -2
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js.map +0 -1
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js +0 -2
- package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js.map +0 -1
- package/dist/mocked_classnames/src/hooks/useListenFocusTriggers/index.js +0 -2
- package/dist/mocked_classnames/src/hooks/useListenFocusTriggers/index.js.map +0 -1
- package/dist/src/components/Combobox/Combobox.js +0 -2
- package/dist/src/components/Combobox/Combobox.js.map +0 -1
- package/dist/src/components/Combobox/Combobox.module.scss.js +0 -2
- package/dist/src/components/Combobox/Combobox.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js +0 -2
- package/dist/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js.map +0 -1
- package/dist/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js +0 -2
- package/dist/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/ComboboxService.js +0 -2
- package/dist/src/components/Combobox/ComboboxService.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxConstants.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxConstants.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +0 -1
- package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js +0 -2
- package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.js +0 -2
- package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.js.map +0 -1
- package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js +0 -2
- package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js.map +0 -1
- package/dist/src/components/Combobox/helpers.js +0 -2
- package/dist/src/components/Combobox/helpers.js.map +0 -1
- package/dist/src/components/Table/Table/Table.js +0 -2
- package/dist/src/components/Table/Table/Table.js.map +0 -1
- package/dist/src/components/Table/Table/Table.module.scss.js +0 -2
- package/dist/src/components/Table/Table/Table.module.scss.js.map +0 -1
- package/dist/src/components/Table/Table/TableConsts.js +0 -2
- package/dist/src/components/Table/Table/TableConsts.js.map +0 -1
- package/dist/src/components/Table/Table/tableHelpers.js +0 -2
- package/dist/src/components/Table/Table/tableHelpers.js.map +0 -1
- package/dist/src/components/Table/TableBody/TableBody.js +0 -2
- package/dist/src/components/Table/TableBody/TableBody.js.map +0 -1
- package/dist/src/components/Table/TableBody/TableBody.module.scss.js +0 -2
- package/dist/src/components/Table/TableBody/TableBody.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableCell/TableCell.js +0 -2
- package/dist/src/components/Table/TableCell/TableCell.js.map +0 -1
- package/dist/src/components/Table/TableCell/TableCell.module.scss.js +0 -2
- package/dist/src/components/Table/TableCell/TableCell.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.js +0 -2
- package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +0 -1
- package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js +0 -2
- package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableContainer/TableContainer.js +0 -2
- package/dist/src/components/Table/TableContainer/TableContainer.js.map +0 -1
- package/dist/src/components/Table/TableContainer/TableContainer.module.scss.js +0 -2
- package/dist/src/components/Table/TableContainer/TableContainer.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableHeader/TableHeader.js +0 -2
- package/dist/src/components/Table/TableHeader/TableHeader.js.map +0 -1
- package/dist/src/components/Table/TableHeader/TableHeader.module.scss.js +0 -2
- package/dist/src/components/Table/TableHeader/TableHeader.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.js +0 -2
- package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +0 -1
- package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js +0 -2
- package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableRow/TableRow.js +0 -2
- package/dist/src/components/Table/TableRow/TableRow.js.map +0 -1
- package/dist/src/components/Table/TableRow/TableRow.module.scss.js +0 -2
- package/dist/src/components/Table/TableRow/TableRow.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableRowMenu/TableRowMenu.js +0 -2
- package/dist/src/components/Table/TableRowMenu/TableRowMenu.js.map +0 -1
- package/dist/src/components/Table/TableRowMenu/TableRowMenu.module.scss.js +0 -2
- package/dist/src/components/Table/TableRowMenu/TableRowMenu.module.scss.js.map +0 -1
- package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js +0 -2
- package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +0 -1
- package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js +0 -2
- package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js.map +0 -1
- package/dist/src/components/Table/context/TableContainerContext/TableContainerContext.js +0 -2
- package/dist/src/components/Table/context/TableContainerContext/TableContainerContext.js.map +0 -1
- package/dist/src/components/Table/context/TableContext/TableContext.js +0 -2
- package/dist/src/components/Table/context/TableContext/TableContext.js.map +0 -1
- package/dist/src/components/Table/context/TableRowMenuContext/TableRowMenuContext.js +0 -2
- package/dist/src/components/Table/context/TableRowMenuContext/TableRowMenuContext.js.map +0 -1
- package/dist/src/hooks/useActiveDescendantListFocus/index.js +0 -2
- package/dist/src/hooks/useActiveDescendantListFocus/index.js.map +0 -1
- package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js +0 -2
- package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHelpers.js.map +0 -1
- package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js +0 -2
- package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js.map +0 -1
- package/dist/src/hooks/useListenFocusTriggers/index.js.map +0 -1
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/Combobox.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/combobox/dist}/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/Table/Table.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableBody/TableBody.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableCell/TableCell.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableContainer/TableContainer.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableHeader/TableHeader.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableHeaderCell/TableHeaderCell.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableRow/TableRow.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableRowMenu/TableRowMenu.module.scss.js.map +0 -0
- /package/dist/{mocked_classnames/src/components → components/table/dist}/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js.map +0 -0
- /package/dist/{src/hooks → hooks/dist}/useListenFocusTriggers/index.js +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.js","sources":["../../../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useRef, useState, forwardRef, useMemo, useCallback } from \"react\";\nimport { isFunction } from \"es-toolkit\";\nimport { noop as NOOP, camelCase } from \"es-toolkit\";\nimport { getStyle, useMergeRef, useWarnDeprecated } from \"@vibe/shared\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\n\nimport { Search } from \"@vibe/search\";\nimport { Button } from \"@vibe/button\";\nimport { Text } from \"@vibe/typography\";\n\nimport { defaultFilter } from \"./ComboboxService\";\nimport { ComboboxItems } from \"./components/ComboboxItems/ComboboxItems\";\nimport { StickyCategoryHeader } from \"./components/StickyCategoryHeader/StickyCategoryHeader\";\nimport { useItemsData, useKeyboardNavigation } from \"./ComboboxHelpers/ComboboxHelpers\";\nimport { getOptionId } from \"./helpers\";\nimport { type ElementContent, type VibeComponentProps } from \"../../types\";\nimport {\n type IComboboxCategoryMap,\n type IComboboxItem,\n type IComboboxOption,\n COMBOBOX_LISTBOX_ID,\n type IComboboxCategory\n} from \"./components/ComboboxConstants\";\nimport styles from \"./Combobox.module.scss\";\nimport { type ComboboxSizes } from \"./Combobox.types\";\nimport type { IconButton } from \"@vibe/icon-button\";\nimport { type MenuButton } from \"@vibe/menu-button\";\nimport { ComponentVibeId } from \"../../tests/constants\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nexport interface ComboboxProps extends VibeComponentProps {\n /**\n * Class name applied to each option item.\n */\n optionClassName?: string;\n /**\n * Class name applied to the search wrapper.\n */\n searchWrapperClassName?: string;\n /**\n * Class name applied to the sticky category header.\n */\n stickyCategoryClassName?: string;\n /**\n * Placeholder text displayed in the search input.\n */\n placeholder?: string;\n /**\n * Message displayed when no results are found.\n */\n noResultsMessage?: string;\n /**\n * If true, the combobox is disabled.\n */\n disabled?: boolean;\n /**\n * The list of available options.\n */\n options?: IComboboxOption[];\n /**\n * The list of available categories.\n */\n categories?: IComboboxCategoryMap;\n /**\n * If true, displays a divider between category sections.\n */\n withCategoriesDivider?: boolean;\n /**\n * The size of the combobox.\n */\n size?: ComboboxSizes;\n /**\n * The height of each option item.\n */\n optionLineHeight?: number;\n /**\n * The height of the options list.\n */\n optionsListHeight?: number;\n /**\n * If true, the search input is focused when the component mounts.\n */\n autoFocus?: boolean;\n /**\n * Callback fired when the \"Add new\" button is clicked.\n */\n onAddNew?: (value: string) => void;\n /**\n * Label displayed for the \"Add new\" button.\n */\n addNewLabel?: ((label: string) => ElementContent) | string;\n /**\n * Custom filter function for searching options.\n */\n filter?: (filterValue: string, options: IComboboxOption[]) => IComboboxOption[];\n /**\n * The default search input\n */\n defaultFilter?: string;\n /**\n * If true, disables filtering.\n */\n disableFilter?: boolean;\n /**\n * Controlled search input value.\n */\n filterValue?: string;\n /**\n * Callback fired when the search input value changes.\n */\n onFilterChanged?: (value: string) => void;\n /**\n * If true, displays a loading state.\n */\n loading?: boolean;\n /**\n * Callback fired when an option is hovered.\n */\n onOptionHover?: (event: React.MouseEvent, index: number, option: IComboboxOption) => void;\n /**\n * Callback fired when the mouse leaves an option.\n */\n onOptionLeave?: () => void;\n /**\n * If true, automatically scrolls to the selected option.\n */\n shouldScrollToSelectedItem?: boolean;\n /**\n * Custom renderer for when no results are found.\n */\n noResultsRenderer?: () => JSX.Element;\n /**\n * If true, keeps categories visible when scrolling.\n */\n stickyCategories?: boolean;\n /**\n * If true, visually focuses the first item by default.\n */\n defaultVisualFocusFirstIndex?: boolean;\n /**\n * If true, clears the search input when an option is selected.\n */\n clearFilterOnSelection?: boolean;\n /**\n * Custom renderer for options.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n /**\n * Maximum number of options displayed before scrolling.\n */\n maxOptionsWithoutScroll?: number;\n /**\n * If true, renders only visible options for performance optimization.\n */\n renderOnlyVisibleOptions?: boolean;\n /**\n * Callback fired when an option is clicked.\n */\n onClick?: (optionData: IComboboxOption) => void;\n /**\n * Custom search icon.\n */\n searchIcon?: SubIcon;\n /**\n * ARIA label for the search input.\n */\n searchInputAriaLabel?: string;\n /**\n * The debounce rate for filtering.\n */\n debounceRate?: number;\n /**\n * Ref for the search input element.\n */\n searchInputRef?: React.RefObject<HTMLInputElement>;\n /**\n * Additional action button inside the search input.\n */\n renderAction?: React.ReactElement<typeof IconButton | typeof MenuButton>;\n /**\n * If true, hides the additional action when the user types in the search input.\n */\n hideRenderActionOnInput?: boolean;\n}\n\nconst Combobox = forwardRef(\n (\n {\n className = \"\",\n optionClassName = \"\",\n searchWrapperClassName,\n stickyCategoryClassName,\n searchIcon,\n id = \"\",\n placeholder = \"\",\n size = \"medium\",\n defaultVisualFocusFirstIndex,\n optionLineHeight = 32,\n optionsListHeight,\n autoFocus = false,\n disabled = false,\n options = [],\n categories,\n withCategoriesDivider = false,\n noResultsMessage = \"No results found\",\n onAddNew,\n addNewLabel = \"Add new\",\n onClick = (_optionData: IComboboxOption) => {},\n filter = defaultFilter,\n disableFilter = false,\n filterValue: filterValueProp,\n onFilterChanged,\n loading = false,\n onOptionHover = NOOP,\n onOptionLeave = NOOP,\n shouldScrollToSelectedItem = true,\n noResultsRenderer,\n stickyCategories = false,\n optionRenderer = null,\n renderOnlyVisibleOptions = false,\n clearFilterOnSelection = false,\n maxOptionsWithoutScroll,\n defaultFilter: defaultFilterValue = \"\",\n searchInputAriaLabel = \"Search for content\",\n \"data-testid\": dataTestId,\n debounceRate,\n searchInputRef,\n renderAction: RenderAction,\n hideRenderActionOnInput\n }: ComboboxProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n useWarnDeprecated({\n component: \"Combobox\",\n message:\n \"This component is deprecated and will be removed in the next major version. Please use Dropdown box mode from @vibe/core instead.\"\n });\n\n const componentRef = useRef(null);\n const inputRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const mergedInputRef = useMergeRef(inputRef, searchInputRef);\n\n const [filterValue, setFilterValue] = useState(filterValueProp || defaultFilterValue);\n\n if (filterValueProp !== undefined && filterValueProp !== filterValue) {\n setFilterValue(filterValueProp);\n }\n\n const onChangeCallback = useCallback(\n (value: string) => {\n setActiveOptionIndex(-1);\n if (onFilterChanged) {\n onFilterChanged(value);\n }\n setFilterValue(value);\n },\n [setFilterValue, onFilterChanged]\n );\n\n const onOptionHoverCB = useCallback(\n (event: React.MouseEvent, index: number, option: IComboboxOption) => {\n onOptionHover(event, index, option);\n },\n [onOptionHover]\n );\n\n const filteredOptions: IComboboxOption[] = useMemo(() => {\n if (disableFilter) {\n return options;\n }\n return filter(filterValue, options);\n }, [options, filterValue, filter, disableFilter]);\n\n const [activeOptionIndex, setActiveOptionIndex] = useState(-1);\n\n const isChildSelectable = useCallback(\n (index: number) => {\n return index !== undefined && filteredOptions[index] && !filteredOptions[index].disabled;\n },\n [filteredOptions]\n );\n\n const onAddNewCallback = useCallback(() => {\n onAddNew && onAddNew(filterValue);\n // clear filter after adding\n setFilterValue(\"\");\n }, [onAddNew, filterValue, setFilterValue]);\n\n const hasResults = filteredOptions.length > 0;\n const hasFilter = filterValue.length > 0;\n\n function getAddNewLabel() {\n if (isFunction(addNewLabel)) {\n return addNewLabel(filterValue);\n }\n return addNewLabel;\n }\n\n function renderNoResults() {\n if (noResultsRenderer) {\n return noResultsRenderer();\n }\n\n return (\n <div className={styles.comboboxNoResults}>\n <div className={styles.comboboxMessageWrapper}>\n <span className={styles.comboboxMessage}>{noResultsMessage}</span>\n </div>\n {onAddNew && !disabled && (\n <Button className={styles.addNewButton} size={size} kind=\"tertiary\" onClick={onAddNewCallback}>\n <span className={styles.buttonLabel}>{getAddNewLabel()}</span>\n </Button>\n )}\n </div>\n );\n }\n\n const [activeCategory, setActiveCategory] = useState<IComboboxCategory>();\n\n const onActiveCategoryChanged = useCallback(\n (categoryData: IComboboxItem) => {\n if (categoryData?.category?.label !== activeCategory?.label) {\n setActiveCategory(categoryData?.category);\n }\n },\n [activeCategory]\n );\n\n const { items, itemsMap, selectableItems } = useItemsData({\n categories,\n options: filteredOptions,\n filterValue,\n withCategoriesDivider,\n optionLineHeight\n });\n\n const overrideOnClick = useCallback(\n (_event: React.MouseEvent | React.KeyboardEvent, itemIndex: number) => {\n onClick(selectableItems[itemIndex]);\n if (isChildSelectable(itemIndex)) {\n setActiveOptionIndex(itemIndex);\n }\n if (clearFilterOnSelection) {\n // clear filter after adding\n onChangeCallback(\"\");\n }\n },\n [onClick, selectableItems, isChildSelectable, clearFilterOnSelection, onChangeCallback]\n );\n\n const {\n visualFocusItemIndex,\n visualFocusItemId,\n onOptionClick: overrideOnOptionClick\n } = useKeyboardNavigation({\n getOptionId,\n defaultVisualFocusFirstIndex,\n onClick: overrideOnClick,\n isChildSelectable,\n options: selectableItems,\n inputRef: mergedInputRef\n });\n\n return (\n <Text\n type=\"text2\"\n ref={mergedRef}\n className={cx(styles.combobox, className, getStyle(styles, camelCase(\"size-\" + size)), {\n [styles.empty]: !hasResults,\n [styles.stickyCategory]: stickyCategories\n })}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.COMBOBOX, id)}\n ellipsis={false}\n data-vibe={ComponentVibeId.COMBOBOX}\n >\n <div className={styles.comboboxList} style={{ maxHeight: optionsListHeight }}>\n <Search\n ref={mergedInputRef}\n value={filterValue}\n className={cx(styles.comboboxSearchWrapper, searchWrapperClassName)}\n inputAriaLabel={searchInputAriaLabel}\n currentAriaResultId={visualFocusItemId}\n id=\"combobox-search\"\n placeholder={placeholder}\n size={size}\n disabled={disabled}\n onChange={onChangeCallback}\n autoFocus={autoFocus}\n loading={loading}\n searchIconName={searchIcon}\n aria-expanded={hasFilter || hasResults}\n aria-haspopup=\"listbox\"\n searchResultsContainerId={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n debounceRate={debounceRate}\n renderAction={RenderAction}\n hideRenderActionOnInput={hideRenderActionOnInput}\n />\n {stickyCategories && (\n <StickyCategoryHeader\n label={activeCategory?.label}\n color={activeCategory?.color}\n className={stickyCategoryClassName}\n />\n )}\n {hasResults && (\n <ComboboxItems\n stickyCategories={stickyCategories}\n categories={categories}\n options={items}\n itemsMap={itemsMap}\n optionClassName={optionClassName}\n optionRenderer={optionRenderer}\n activeItemIndex={activeOptionIndex}\n onActiveCategoryChanged={onActiveCategoryChanged}\n onOptionClick={overrideOnOptionClick}\n onOptionEnter={onOptionHoverCB}\n onOptionLeave={onOptionLeave}\n optionLineHeight={optionLineHeight}\n shouldScrollToSelectedItem={shouldScrollToSelectedItem}\n renderOnlyVisibleOptions={renderOnlyVisibleOptions}\n maxOptionsWithoutScroll={maxOptionsWithoutScroll}\n visualFocusItemIndex={visualFocusItemIndex}\n id={id ? `${id}-listbox` : COMBOBOX_LISTBOX_ID}\n />\n )}\n </div>\n {hasFilter && !hasResults && !loading && renderNoResults()}\n </Text>\n );\n }\n);\n\n// Locate loading next to search icon\n// color it with --secondary-text-color\n// size it like the icon - we think it's 16px - make sure it's not fat\n\nexport default Combobox;\n"],"names":["Combobox","forwardRef","_ref","ref","_ref$className","className","_ref$optionClassName","optionClassName","searchWrapperClassName","stickyCategoryClassName","searchIcon","_ref$id","id","_ref$placeholder","placeholder","_ref$size","size","defaultVisualFocusFirstIndex","_ref$optionLineHeight","optionLineHeight","optionsListHeight","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$options","options","categories","_ref$withCategoriesDi","withCategoriesDivider","_ref$noResultsMessage","noResultsMessage","onAddNew","_ref$addNewLabel","addNewLabel","_ref$onClick","onClick","_optionData","_ref$filter","filter","defaultFilter","_ref$disableFilter","disableFilter","filterValueProp","filterValue","onFilterChanged","_ref$loading","loading","_ref$onOptionHover","onOptionHover","NOOP","_ref$onOptionLeave","onOptionLeave","_ref$shouldScrollToSe","shouldScrollToSelectedItem","noResultsRenderer","_ref$stickyCategories","stickyCategories","_ref$optionRenderer","optionRenderer","_ref$renderOnlyVisibl","renderOnlyVisibleOptions","_ref$clearFilterOnSel","clearFilterOnSelection","maxOptionsWithoutScroll","_ref$defaultFilter","defaultFilterValue","_ref$searchInputAriaL","searchInputAriaLabel","dataTestId","debounceRate","searchInputRef","RenderAction","renderAction","hideRenderActionOnInput","useWarnDeprecated","component","message","componentRef","useRef","inputRef","mergedRef","useMergeRef","mergedInputRef","_useState","useState","_useState2","_slicedToArray","setFilterValue","undefined","onChangeCallback","useCallback","value","setActiveOptionIndex","onOptionHoverCB","event","index","option","filteredOptions","useMemo","_useState3","_useState4","activeOptionIndex","isChildSelectable","onAddNewCallback","hasResults","length","hasFilter","_useState5","_useState6","activeCategory","setActiveCategory","onActiveCategoryChanged","categoryData","category","_a","label","_useItemsData","useItemsData","items","itemsMap","selectableItems","overrideOnClick","_event","itemIndex","_useKeyboardNavigatio","useKeyboardNavigation","getOptionId","visualFocusItemIndex","visualFocusItemId","overrideOnOptionClick","onOptionClick","React","createElement","Text","type","cx","styles","combobox","getStyle","camelCase","_defineProperty","empty","stickyCategory","getTestId","ComponentDefaultTestId","COMBOBOX","ellipsis","ComponentVibeId","comboboxList","style","maxHeight","Search","comboboxSearchWrapper","inputAriaLabel","currentAriaResultId","onChange","searchIconName","searchResultsContainerId","concat","COMBOBOX_LISTBOX_ID","StickyCategoryHeader","color","ComboboxItems","activeItemIndex","onOptionEnter","comboboxNoResults","comboboxMessageWrapper","comboboxMessage","Button","addNewButton","kind","buttonLabel","isFunction"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var o={combobox:"combobox",stickyCategory:"stickyCategory",comboboxCategory:"comboboxCategory",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",empty:"empty",comboboxSearchWrapper:"comboboxSearchWrapper",comboboxNoResults:"comboboxNoResults",comboboxMessageWrapper:"comboboxMessageWrapper",comboboxMessage:"comboboxMessage",addNewButton:"addNewButton",buttonLabel:"buttonLabel",comboboxList:"comboboxList"};!function(o){const e="s_id-5bf292a5a8b0_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.combobox {\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n height: 100%;\n display: flex;\n flex-direction: column;\n position: relative;\n margin-bottom: var(--space-8);\n}\n.combobox.stickyCategory .comboboxCategory {\n z-index: 10;\n background-color: var(--secondary-background-color);\n}\n/* Relative to Search height */\n.combobox.stickyCategory.sizeSmall .comboboxCategory {\n top: 32px;\n}\n.combobox.stickyCategory.sizeMedium .comboboxCategory {\n top: 40px;\n}\n.combobox.stickyCategory.sizeLarge .comboboxCategory {\n top: 48px;\n}\n.combobox.empty {\n max-height: 200px;\n margin-bottom: 0;\n}\n.comboboxSearchWrapper {\n position: sticky;\n top: 0;\n z-index: 12;\n}\n.comboboxNoResults {\n margin-top: var(--space-8);\n flex: 1 1 auto;\n height: calc(100% - 20px);\n overflow: hidden;\n position: relative;\n padding: 0 16px;\n display: flex;\n flex-direction: column;\n}\n.comboboxNoResults .comboboxMessageWrapper {\n flex: 1 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.comboboxNoResults .comboboxMessageWrapper .comboboxMessage {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.comboboxNoResults .addNewButton {\n flex: 0 0 auto;\n width: 100% !important;\n margin-bottom: 8px;\n}\n.comboboxNoResults .addNewButton .buttonLabel {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.comboboxList {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n padding: 0 4px;\n overflow: hidden;\n}");export{o as default};
|
|
2
|
-
//# sourceMappingURL=Combobox.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as t}from"../../../../_virtual/_tslib.js";import o,{useMemo as i}from"react";import n from"classnames";import r from"../components/ComboboxOption/ComboboxOption.js";import s from"../components/ComboboxCategory/ComboboxCategory.js";import{Divider as a}from"@vibe/divider/mockedClassNames";import{COMBOBOX_DIVIDER_ITEM as c,COMBOBOX_CATEGORY_ITEM as l,COMBOBOX_OPTION_ITEM as m}from"../components/ComboboxConstants.js";import d from"../../../hooks/useActiveDescendantListFocus/index.js";import{getOptionsByCategories as u}from"../ComboboxService.js";import p from"../components/ComboboxItems/ComboboxItems.module.scss.js";import g from"./ComboboxHelpers.module.scss.js";var h=17,v=32;function f(t){var o=t.categories,r=t.options,s=t.filterValue,a=t.withCategoriesDivider,c=t.optionLineHeight;return i((function(){var t=[],i=[],l=new Map;if(o){var m=u(r,o,s),d=0;Object.keys(m).forEach((function(r,s){var u=a&&0!==s;u&&t.push(I({categoryId:r}));var g=m[r].length>0,h=0===s,v=b({categoryId:r,categoryData:o[r],withDivider:u,className:n(e(e(e({},p.categoryWithOptions,g),p.categoryWithoutOptions,!g),p.firstCategory,h))});t.push(v),l.set(r,v),m[r].forEach((function(e){var o=C({height:c,option:e,index:d,categoryId:v.id});l.set(o.id,o),t.push(o),i.push(e),d++}))}))}else i=r,t=r.map((function(e,t){return C({height:c,option:e,index:t})}));return{items:t,itemsMap:l,selectableItems:i}}),[o,r,s,a,c])}function y(e){var t=e.defaultVisualFocusFirstIndex,o=e.inputRef,n=e.onClick,r=e.isChildSelectable,s=e.options,a=e.getOptionId,c=i((function(){return s.map((function(e,t){return a(null==e?void 0:e.id,t)}))}),[a,s]),l=d({defaultVisualFocusFirstIndex:t,focusedElementRef:o,focusedElementRole:d.roles.COMBOBOX,itemsIds:c,onItemClick:n,isItemSelectable:r,isIgnoreSpaceAsItemSelection:!0});return{visualFocusItemIndex:l.visualFocusItemIndex,visualFocusItemId:l.visualFocusItemId,onOptionClick:n}}function I(e){return{type:c,height:h,id:"".concat(e.categoryId,"-divider")}}function b(e){return{height:v,type:l,category:e.categoryData,id:e.categoryId,withDivider:e.withDivider,className:e.className}}function C(e){var t=e.option,o=e.index;return{type:m,height:e.height,belongToCategory:!0,index:o,option:t,id:t.id||""+o,optionRenderer:e.optionRenderer,isActive:e.isActive,optionLineHeight:e.optionLineHeight,shouldScrollToSelectedItem:e.shouldScrollToSelectedItem,categoryId:e.categoryId}}function x(e){var i,r,s=e.item,a=e.style,d=e.optionEvents,u=e.optionRenderData,p=e.isVirtualized,h=e.stickyCategories,v=s.type,f=t(s,["type"]);switch(v){case c:r=O({id:f.id,height:f.height});break;case l:r=k({id:f.id,category:f.category,className:f.className}),h&&!p&&(i=g.sticky);break;case m:r=j(Object.assign(Object.assign(Object.assign({},f),d),u))}return o.createElement("div",{key:f.id,className:n(g.comboboxItemContainer,i),style:a},r)}function O(e){return o.createElement("div",{className:g.dividerContainer,style:{height:e.height}},o.createElement(a,{className:g.divider,key:e.id}))}function k(e){return o.createElement(s,{key:e.id,category:e.category,className:e.className})}function j(e){var t=e.index,i=e.onOptionEnter;return o.createElement(r,{className:e.className,index:t,key:e.id,option:e.option,optionRenderer:e.optionRenderer,scrollRef:e.scrollRef,isActive:e.activeItemIndex===t,visualFocus:t===e.visualFocusItemIndex,onOptionClick:e.onOptionClick,onOptionHover:i,onOptionLeave:e.onOptionLeave,onOptionEnter:i,optionLineHeight:e.optionLineHeight,shouldScrollWhenActive:e.shouldScrollToSelectedItem})}export{k as categoryItemRenderer,x as comboboxItemRenderer,b as createCategoryItemObject,I as createDividerItemObject,C as createOptionItemObject,O as dividerItemRenderer,j as optionItemRenderer,f as useItemsData,y as useKeyboardNavigation};
|
|
2
|
-
//# sourceMappingURL=ComboboxHelpers.js.map
|
package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxHelpers.js","sources":["../../../../../../src/components/Combobox/ComboboxHelpers/ComboboxHelpers.tsx"],"sourcesContent":["import React, { type CSSProperties, type MutableRefObject, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport ComboboxOption from \"../components/ComboboxOption/ComboboxOption\";\nimport ComboboxCategory from \"../components/ComboboxCategory/ComboboxCategory\";\nimport { Divider } from \"@vibe/divider\";\nimport {\n COMBOBOX_DIVIDER_ITEM,\n COMBOBOX_CATEGORY_ITEM,\n COMBOBOX_OPTION_ITEM,\n type IComboboxCategory,\n type IComboboxOption,\n type IComboboxCategoryMap,\n type IComboboxItem,\n type IOptionItemRendererArgs,\n type IComboboxOptionEvents\n} from \"../components/ComboboxConstants\";\nimport useActiveDescendantListFocus from \"../../../hooks/useActiveDescendantListFocus\";\nimport { getOptionsByCategories } from \"../ComboboxService\";\nimport comboboxItemsStyles from \"../components/ComboboxItems/ComboboxItems.module.scss\";\nimport styles from \"./ComboboxHelpers.module.scss\";\n\nconst DIVIDER_HEIGHT = 17;\nconst CATEGORY_HEIGHT = 32;\n\nexport function useItemsData({\n categories,\n options,\n filterValue,\n withCategoriesDivider,\n optionLineHeight\n}: {\n categories: IComboboxCategoryMap;\n options: IComboboxOption[];\n filterValue: string;\n withCategoriesDivider: boolean;\n optionLineHeight: number;\n}) {\n return useMemo(() => {\n let items: IComboboxItem[] = [];\n let selectableItems: IComboboxOption[] = [];\n const itemsMap = new Map();\n\n if (categories) {\n const optionsByCategories = getOptionsByCategories(options, categories, filterValue);\n let optionIndex = 0;\n Object.keys(optionsByCategories).forEach((categoryId, categoryIndex) => {\n const withDivider = withCategoriesDivider && categoryIndex !== 0;\n if (withDivider) {\n items.push(createDividerItemObject({ categoryId }));\n }\n\n const isCategoryWithOptions = optionsByCategories[categoryId].length > 0;\n const isFirstCategory = categoryIndex === 0;\n\n const categoryObject = createCategoryItemObject({\n categoryId,\n categoryData: categories[categoryId],\n withDivider,\n className: cx({\n [comboboxItemsStyles.categoryWithOptions]: isCategoryWithOptions,\n [comboboxItemsStyles.categoryWithoutOptions]: !isCategoryWithOptions,\n [comboboxItemsStyles.firstCategory]: isFirstCategory\n })\n });\n\n // save category object in both items array and categories map\n items.push(categoryObject);\n itemsMap.set(categoryId, categoryObject);\n\n optionsByCategories[categoryId].forEach((option: IComboboxOption) => {\n const itemObject = createOptionItemObject({\n height: optionLineHeight,\n option,\n index: optionIndex,\n categoryId: categoryObject.id\n });\n\n itemsMap.set(itemObject.id, itemObject);\n items.push(itemObject);\n selectableItems.push(option);\n optionIndex++;\n });\n });\n } else {\n selectableItems = options;\n items = options.map((option, index) => {\n return createOptionItemObject({\n height: optionLineHeight,\n option,\n index\n });\n });\n }\n return { items, itemsMap, selectableItems };\n }, [categories, options, filterValue, withCategoriesDivider, optionLineHeight]);\n}\n\nexport function useKeyboardNavigation({\n defaultVisualFocusFirstIndex,\n inputRef,\n onClick,\n isChildSelectable,\n options,\n getOptionId\n}: {\n defaultVisualFocusFirstIndex?: boolean;\n inputRef: MutableRefObject<HTMLElement>;\n onClick: (event: React.KeyboardEvent | React.MouseEvent, index: number) => void;\n isChildSelectable: (index: number) => boolean;\n options: IComboboxOption[];\n getOptionId: (optionId: string, index: number) => string;\n}) {\n const filteredOptionsIds = useMemo(\n () => options.map((option: IComboboxOption, index: number) => getOptionId(option?.id, index)),\n [getOptionId, options]\n );\n\n const { visualFocusItemIndex, visualFocusItemId } = useActiveDescendantListFocus({\n defaultVisualFocusFirstIndex,\n focusedElementRef: inputRef,\n focusedElementRole: useActiveDescendantListFocus.roles.COMBOBOX,\n itemsIds: filteredOptionsIds,\n onItemClick: onClick,\n isItemSelectable: isChildSelectable,\n isIgnoreSpaceAsItemSelection: true\n });\n\n return { visualFocusItemIndex, visualFocusItemId, onOptionClick: onClick };\n}\nexport function createDividerItemObject({ categoryId }: { categoryId: string }): IComboboxItem {\n return { type: COMBOBOX_DIVIDER_ITEM, height: DIVIDER_HEIGHT, id: `${categoryId}-divider` };\n}\n\nexport function createCategoryItemObject({\n withDivider,\n categoryId,\n categoryData,\n className\n}: {\n withDivider: boolean;\n categoryId: string;\n categoryData: IComboboxCategory;\n className: string;\n}): IComboboxItem {\n return {\n height: CATEGORY_HEIGHT,\n type: COMBOBOX_CATEGORY_ITEM,\n category: categoryData,\n id: categoryId,\n withDivider,\n className\n };\n}\n\nexport function createOptionItemObject({\n option,\n height,\n index,\n optionRenderer,\n isActive,\n optionLineHeight,\n shouldScrollToSelectedItem,\n categoryId\n}: {\n option?: IComboboxOption;\n height?: number;\n index?: number;\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n isActive?: boolean;\n optionLineHeight?: number;\n shouldScrollToSelectedItem?: boolean;\n categoryId?: string;\n}): IComboboxItem {\n return {\n type: COMBOBOX_OPTION_ITEM,\n height,\n belongToCategory: true,\n index,\n option,\n id: option.id || index.toString(),\n optionRenderer,\n isActive,\n optionLineHeight,\n shouldScrollToSelectedItem,\n categoryId\n };\n}\n\nexport function comboboxItemRenderer({\n item,\n style,\n optionEvents,\n optionRenderData,\n isVirtualized,\n stickyCategories\n}: {\n item: IComboboxItem;\n style: CSSProperties;\n optionEvents: IComboboxOptionEvents;\n optionRenderData: any;\n isVirtualized: boolean;\n stickyCategories?: boolean;\n}) {\n const { type, ...otherArgs } = item;\n let customClassNames;\n let innerElement;\n switch (type) {\n case COMBOBOX_DIVIDER_ITEM: {\n innerElement = dividerItemRenderer({ id: otherArgs.id, height: otherArgs.height });\n break;\n }\n case COMBOBOX_CATEGORY_ITEM: {\n innerElement = categoryItemRenderer({\n id: otherArgs.id,\n category: otherArgs.category,\n className: otherArgs.className\n });\n if (stickyCategories && !isVirtualized) {\n customClassNames = styles.sticky;\n }\n break;\n }\n case COMBOBOX_OPTION_ITEM: {\n innerElement = optionItemRenderer({\n ...otherArgs,\n ...optionEvents,\n ...optionRenderData\n });\n break;\n }\n }\n\n return (\n <div key={otherArgs.id} className={cx(styles.comboboxItemContainer, customClassNames)} style={style}>\n {innerElement}\n </div>\n );\n}\n\nexport function dividerItemRenderer({ id, height }: { id: string; height: number }) {\n return (\n <div className={styles.dividerContainer} style={{ height: height }}>\n <Divider className={styles.divider} key={id} />\n </div>\n );\n}\n\nexport function categoryItemRenderer({\n id,\n category,\n className\n}: {\n id: string;\n category: IComboboxCategory;\n className: string;\n}) {\n return <ComboboxCategory key={id} category={category} className={className} />;\n}\n\nexport function optionItemRenderer({\n id,\n index,\n option,\n className,\n onOptionClick,\n onOptionEnter,\n onOptionLeave,\n optionLineHeight,\n optionRenderer,\n scrollRef,\n shouldScrollToSelectedItem,\n activeItemIndex,\n visualFocusItemIndex\n}: IOptionItemRendererArgs) {\n return (\n <ComboboxOption\n className={className}\n index={index}\n key={id}\n option={option}\n optionRenderer={optionRenderer}\n scrollRef={scrollRef}\n isActive={activeItemIndex === index}\n visualFocus={index === visualFocusItemIndex}\n onOptionClick={onOptionClick}\n onOptionHover={onOptionEnter}\n onOptionLeave={onOptionLeave}\n onOptionEnter={onOptionEnter}\n optionLineHeight={optionLineHeight}\n shouldScrollWhenActive={shouldScrollToSelectedItem}\n />\n );\n}\n"],"names":["DIVIDER_HEIGHT","CATEGORY_HEIGHT","useItemsData","_ref","categories","options","filterValue","withCategoriesDivider","optionLineHeight","useMemo","items","selectableItems","itemsMap","Map","optionsByCategories","getOptionsByCategories","optionIndex","Object","keys","forEach","categoryId","categoryIndex","withDivider","push","createDividerItemObject","isCategoryWithOptions","length","isFirstCategory","categoryObject","createCategoryItemObject","categoryData","className","cx","_defineProperty","comboboxItemsStyles","categoryWithOptions","categoryWithoutOptions","firstCategory","set","option","itemObject","createOptionItemObject","height","index","id","map","useKeyboardNavigation","_ref2","defaultVisualFocusFirstIndex","inputRef","onClick","isChildSelectable","getOptionId","filteredOptionsIds","_useActiveDescendantL","useActiveDescendantListFocus","focusedElementRef","focusedElementRole","roles","COMBOBOX","itemsIds","onItemClick","isItemSelectable","isIgnoreSpaceAsItemSelection","visualFocusItemIndex","visualFocusItemId","onOptionClick","_ref3","type","COMBOBOX_DIVIDER_ITEM","concat","_ref4","COMBOBOX_CATEGORY_ITEM","category","_ref5","COMBOBOX_OPTION_ITEM","belongToCategory","optionRenderer","isActive","shouldScrollToSelectedItem","comboboxItemRenderer","_ref6","customClassNames","innerElement","item","style","optionEvents","optionRenderData","isVirtualized","stickyCategories","otherArgs","__rest","dividerItemRenderer","categoryItemRenderer","styles","sticky","optionItemRenderer","assign","React","createElement","key","comboboxItemContainer","_ref7","dividerContainer","Divider","divider","_ref8","ComboboxCategory","_ref9","onOptionEnter","ComboboxOption","scrollRef","activeItemIndex","visualFocus","onOptionHover","onOptionLeave","shouldScrollWhenActive"],"mappings":"6vBAqBA,IAAMA,EAAiB,GACjBC,EAAkB,GAER,SAAAC,EAAYC,GAY3B,IAXCC,EAAUD,EAAVC,WACAC,EAAOF,EAAPE,QACAC,EAAWH,EAAXG,YACAC,EAAqBJ,EAArBI,sBACAC,EAAgBL,EAAhBK,iBAQA,OAAOC,GAAQ,WACb,IAAIC,EAAyB,GACzBC,EAAqC,GACnCC,EAAW,IAAIC,IAErB,GAAIT,EAAY,CACd,IAAMU,EAAsBC,EAAuBV,EAASD,EAAYE,GACpEU,EAAc,EAClBC,OAAOC,KAAKJ,GAAqBK,SAAQ,SAACC,EAAYC,GACpD,IAAMC,EAAcf,GAA2C,IAAlBc,EACzCC,GACFZ,EAAMa,KAAKC,EAAwB,CAAEJ,WAAAA,KAGvC,IAAMK,EAAwBX,EAAoBM,GAAYM,OAAS,EACjEC,EAAoC,IAAlBN,EAElBO,EAAiBC,EAAyB,CAC9CT,WAAAA,EACAU,aAAc1B,EAAWgB,GACzBE,YAAAA,EACAS,UAAWC,EAAEC,EAAAA,EAAAA,EAAA,CAAA,EACVC,EAAoBC,oBAAsBV,GAC1CS,EAAoBE,wBAA0BX,GAC9CS,EAAoBG,cAAgBV,MAKzCjB,EAAMa,KAAKK,GACXhB,EAAS0B,IAAIlB,EAAYQ,GAEzBd,EAAoBM,GAAYD,SAAQ,SAACoB,GACvC,IAAMC,EAAaC,EAAuB,CACxCC,OAAQlC,EACR+B,OAAAA,EACAI,MAAO3B,EACPI,WAAYQ,EAAegB,KAG7BhC,EAAS0B,IAAIE,EAAWI,GAAIJ,GAC5B9B,EAAMa,KAAKiB,GACX7B,EAAgBY,KAAKgB,GACrBvB,GACF,GACF,GACF,MACEL,EAAkBN,EAClBK,EAAQL,EAAQwC,KAAI,SAACN,EAAQI,GAC3B,OAAOF,EAAuB,CAC5BC,OAAQlC,EACR+B,OAAAA,EACAI,MAAAA,GAEJ,IAEF,MAAO,CAAEjC,MAAAA,EAAOE,SAAAA,EAAUD,gBAAAA,EAC5B,GAAG,CAACP,EAAYC,EAASC,EAAaC,EAAuBC,GAC/D,CAEgB,SAAAsC,EAAqBC,GAcpC,IAbCC,EAA4BD,EAA5BC,6BACAC,EAAQF,EAARE,SACAC,EAAOH,EAAPG,QACAC,EAAiBJ,EAAjBI,kBACA9C,EAAO0C,EAAP1C,QACA+C,EAAWL,EAAXK,YASMC,EAAqB5C,GACzB,WAAA,OAAMJ,EAAQwC,KAAI,SAACN,EAAyBI,GAAa,OAAKS,EAAYb,aAAM,EAANA,EAAQK,GAAID,KAAO,GAC7F,CAACS,EAAa/C,IAGhBiD,EAAoDC,EAA6B,CAC/EP,6BAAAA,EACAQ,kBAAmBP,EACnBQ,mBAAoBF,EAA6BG,MAAMC,SACvDC,SAAUP,EACVQ,YAAaX,EACbY,iBAAkBX,EAClBY,8BAA8B,IAGhC,MAAO,CAAEC,qBAVmBV,EAApBU,qBAUuBC,kBAVgBX,EAAjBW,kBAUoBC,cAAehB,EACnE,CACgB,SAAA1B,EAAuB2C,GACrC,MAAO,CAAEC,KAAMC,EAAuB3B,OAAQ1C,EAAgB4C,GAAE,GAAA0B,OADdH,EAAV/C,WACuC,YACjF,CAEM,SAAUS,EAAwB0C,GAWtC,MAAO,CACL7B,OAAQzC,EACRmE,KAAMI,EACNC,SAXUF,EAAZzC,aAYEc,GAbQ2B,EAAVnD,WAcEE,YAfSiD,EAAXjD,YAgBES,UAbOwC,EAATxC,UAeF,UAEgBU,EAAsBiC,GAkBrC,IAjBCnC,EAAMmC,EAANnC,OAEAI,EAAK+B,EAAL/B,MAgBA,MAAO,CACLyB,KAAMO,EACNjC,OAnBIgC,EAANhC,OAoBEkC,kBAAkB,EAClBjC,MAAAA,EACAJ,OAAAA,EACAK,GAAIL,EAAOK,IAAMD,KACjBkC,eAtBYH,EAAdG,eAuBEC,SAtBMJ,EAARI,SAuBEtE,iBAtBckE,EAAhBlE,iBAuBEuE,2BAtBwBL,EAA1BK,2BAuBE3D,WAtBQsD,EAAVtD,WAwBF,CAEgB,SAAA4D,EAAoBC,GAcnC,IAEKC,EACAC,EAhBJC,EAAIH,EAAJG,KACAC,EAAKJ,EAALI,MACAC,EAAYL,EAAZK,aACAC,EAAgBN,EAAhBM,iBACAC,EAAaP,EAAbO,cACAC,EAAgBR,EAAhBQ,iBASQrB,EAAuBgB,EAAvBhB,KAASsB,EAASC,EAAKP,EAAzB,CAAsB,SAG5B,OAAQhB,GACN,KAAKC,EACHc,EAAeS,EAAoB,CAAEhD,GAAI8C,EAAU9C,GAAIF,OAAQgD,EAAUhD,SACzE,MAEF,KAAK8B,EACHW,EAAeU,EAAqB,CAClCjD,GAAI8C,EAAU9C,GACd6B,SAAUiB,EAAUjB,SACpB1C,UAAW2D,EAAU3D,YAEnB0D,IAAqBD,IACvBN,EAAmBY,EAAOC,QAE5B,MAEF,KAAKpB,EACHQ,EAAea,EACV/E,OAAAgF,OAAAhF,OAAAgF,OAAAhF,OAAAgF,OAAA,CAAA,EAAAP,GACAJ,GACAC,IAMT,OACEW,EAAKC,cAAA,MAAA,CAAAC,IAAKV,EAAU9C,GAAIb,UAAWC,EAAG8D,EAAOO,sBAAuBnB,GAAmBG,MAAOA,GAC3FF,EAGP,UAEgBS,EAAmBU,GACjC,OACEJ,EAAAC,cAAA,MAAA,CAAKpE,UAAW+D,EAAOS,iBAAkBlB,MAAO,CAAE3C,OAFN4D,EAAN5D,SAGpCwD,EAAAC,cAACK,EAAO,CAACzE,UAAW+D,EAAOW,QAASL,IAHFE,EAAF1D,KAMtC,CAEM,SAAUiD,EAAoBa,GASlC,OAAOR,EAACC,cAAAQ,EAAiB,CAAAP,IARvBM,EAAF9D,GAQkC6B,SAP1BiC,EAARjC,SAOsD1C,UAN7C2E,EAAT3E,WAOF,CAEgB,SAAAiE,EAAkBY,GAcR,IAZxBjE,EAAKiE,EAALjE,MAIAkE,EAAaD,EAAbC,cASA,OACEX,EAAAC,cAACW,EAAc,CACb/E,UAbK6E,EAAT7E,UAcIY,MAAOA,EACPyD,IAlBFQ,EAAFhE,GAmBIL,OAjBEqE,EAANrE,OAkBIsC,eAZU+B,EAAd/B,eAaIkC,UAZKH,EAATG,UAaIjC,SAXW8B,EAAfI,kBAWkCrE,EAC9BsE,YAAatE,IAXGiE,EAApB5C,qBAYIE,cApBS0C,EAAb1C,cAqBIgD,cAAeL,EACfM,cApBSP,EAAbO,cAqBIN,cAAeA,EACfrG,iBArBYoG,EAAhBpG,iBAsBI4G,uBAnBsBR,EAA1B7B,4BAsBF"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={comboboxItemContainer:"comboboxItemContainer",dividerContainer:"dividerContainer",divider:"divider",sticky:"sticky"};!function(e){const n="s_id-cfec7f62c06c_4_5_27";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".comboboxItemContainer {\n display: flex;\n flex: auto;\n width: 100%;\n background-color: var(--secondary-background-color);\n}\n\n.dividerContainer {\n position: relative;\n width: 95%;\n}\n\n.divider {\n position: absolute;\n width: calc(100% + 16px);\n margin-inline-start: -12px;\n}\n\n.sticky {\n position: sticky;\n top: 0;\n z-index: 20;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxHelpers.module.scss.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxService.js","sources":["../../../../../src/components/Combobox/ComboboxService.ts"],"sourcesContent":["import { type IComboboxCategoryMap, type IComboboxOption } from \"./components/ComboboxConstants\";\n\ntype OptionsByCategories = {\n [key: string]: Array<IComboboxOption>;\n};\n\nexport const getOptionsByCategories = (\n options: IComboboxOption[],\n categories: IComboboxCategoryMap,\n filterValue: string\n): OptionsByCategories => {\n const optionsByCategories = options.reduce((result: OptionsByCategories, option) => {\n const categoryId = option.categoryId;\n // skipping if the option doesn't have a category\n if (!categoryId) return result;\n if (categories[categoryId]?.onlyShowOnSearch && !filterValue) return result;\n\n if (result[categoryId]) {\n result[categoryId].push(option);\n } else {\n result[categoryId] = [option];\n }\n\n return result;\n }, {});\n\n // reorder the keys according to the categories order\n return Object.keys(categories).reduce((result: OptionsByCategories, categoryId) => {\n if (optionsByCategories[categoryId]) result[categoryId] = optionsByCategories[categoryId];\n\n return result;\n }, {});\n};\n\nexport const defaultFilter = (filterValue: string, options: IComboboxOption[]) =>\n options.filter(\n ({ label }: { label: string }) => !filterValue || label.toLowerCase().includes(filterValue.toLowerCase())\n );\n"],"names":["getOptionsByCategories","options","categories","filterValue","optionsByCategories","reduce","result","option","categoryId","_a","onlyShowOnSearch","push","Object","keys","defaultFilter","filter","_ref","label","toLowerCase","includes"],"mappings":"AAMO,IAAMA,EAAyB,SACpCC,EACAC,EACAC,GAEA,IAAMC,EAAsBH,EAAQI,QAAO,SAACC,EAA6BC,SACjEC,EAAaD,EAAOC,WAE1B,OAAKA,IACuB,QAAxBC,EAAAP,EAAWM,UAAa,IAAAC,OAAA,EAAAA,EAAAC,oBAAqBP,IAE7CG,EAAOE,GACTF,EAAOE,GAAYG,KAAKJ,GAExBD,EAAOE,GAAc,CAACD,IAL6CD,GAD7CA,CAUzB,GAAE,CAAE,GAGL,OAAOM,OAAOC,KAAKX,GAAYG,QAAO,SAACC,EAA6BE,GAGlE,OAFIJ,EAAoBI,KAAaF,EAAOE,GAAcJ,EAAoBI,IAEvEF,CACR,GAAE,CAAE,EACP,EAEaQ,EAAgB,SAACX,EAAqBF,GAA0B,OAC3EA,EAAQc,QACN,SAAAC,GAAQ,OAA2Bb,GAA3Ba,EAALC,MAAqDC,cAAcC,SAAShB,EAAYe,iBAC5F"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import o from"classnames";import a from"react";import r from"./ComboboxCategory.module.scss.js";import e from"../../Combobox.module.scss.js";var l=function(l){var m=l.category,t=l.className,c=m.label,s=m.id,b=m.color;return c?a.createElement("div",{key:s,role:"row","aria-level":1,"aria-label":m["aria-label"]||c,id:"combobox-category-".concat(s),style:b&&{color:b},className:o(r.comboboxCategory,e.comboboxCategory,t)},c):null};export{l as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxCategory.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxCategory.js","sources":["../../../../../../../src/components/Combobox/components/ComboboxCategory/ComboboxCategory.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type FC } from \"react\";\nimport { type IComboboxCategory } from \"../ComboboxConstants\";\nimport styles from \"./ComboboxCategory.module.scss\";\nimport comboboxStyles from \"../../Combobox.module.scss\";\n\nexport interface ComboboxCategoryProps {\n /**\n * The category data.\n */\n category: IComboboxCategory;\n /**\n * Class name applied to the category element.\n */\n className: string;\n}\n\nconst ComboboxCategory: FC<ComboboxCategoryProps> = ({ category, className }) => {\n const { label, id, \"aria-label\": ariaLabel, color } = category;\n\n if (!label) return null;\n\n return (\n <div\n key={id}\n role=\"row\"\n aria-level={1}\n aria-label={ariaLabel || label}\n id={`combobox-category-${id}`}\n style={color && { color }}\n className={cx(styles.comboboxCategory, comboboxStyles.comboboxCategory, className)}\n >\n {label}\n </div>\n );\n};\n\nexport default ComboboxCategory;\n"],"names":["ComboboxCategory","_ref","category","className","label","id","color","React","key","role","concat","style","cx","styles","comboboxCategory","comboboxStyles"],"mappings":"6IAiBA,IAAMA,EAA8C,SAA9BC,GAA0D,IAAzBC,EAAQD,EAARC,SAAUC,EAASF,EAATE,UACvDC,EAA8CF,EAA9CE,MAAOC,EAAuCH,EAAvCG,GAA6BC,EAAUJ,EAAVI,MAE5C,OAAKF,EAGHG,uBACEC,IAAKH,EACLI,KAAK,MACO,aAAA,eARsCP,EAAnC,eASUE,EACzBC,GAAEK,qBAAAA,OAAuBL,GACzBM,MAAOL,GAAS,CAAEA,MAAAA,GAClBH,UAAWS,EAAGC,EAAOC,iBAAkBC,EAAeD,iBAAkBX,IAEvEC,GAZc,IAerB"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={comboboxCategory:"comboboxCategory"};!function(e){const t="s_id-ddc89c066e12_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.comboboxCategory {\n color: var(--placeholder-color);\n display: flex;\n align-items: center;\n padding-top: var(--space-8);\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxCategory.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var o,b="combobox-divider",e="combobox-category",r="combobox-option",c="combobox-listbox";!function(o){o.DEFAULT="default",o.RENDERER="renderer"}(o||(o={}));export{e as COMBOBOX_CATEGORY_ITEM,b as COMBOBOX_DIVIDER_ITEM,c as COMBOBOX_LISTBOX_ID,r as COMBOBOX_OPTION_ITEM,o as ComboboxOptionIconType};
|
|
2
|
-
//# sourceMappingURL=ComboboxConstants.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxConstants.js","sources":["../../../../../../src/components/Combobox/components/ComboboxConstants.ts"],"sourcesContent":["import type React from \"react\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport type { TooltipProps } from \"@vibe/tooltip\";\n\nexport const COMBOBOX_DIVIDER_ITEM = \"combobox-divider\";\nexport const COMBOBOX_CATEGORY_ITEM = \"combobox-category\";\nexport const COMBOBOX_OPTION_ITEM = \"combobox-option\";\nexport const COMBOBOX_LISTBOX_ID = \"combobox-listbox\";\n\n/**\n * @deprecated\n */\nexport enum ComboboxOptionIconType {\n DEFAULT = \"default\",\n RENDERER = \"renderer\"\n}\n\nexport interface IComboboxCategoryMap {\n /**\n * A mapping of category IDs to category details.\n */\n [key: string]: IComboboxCategory;\n}\n\nexport interface IComboboxCategory {\n /**\n * The display label of the category.\n */\n label: string;\n /**\n * The unique ID of the category.\n */\n id: string;\n /**\n * The ARIA label for accessibility.\n */\n \"aria-label\"?: string;\n /**\n * If true, the category is only shown when searching.\n */\n onlyShowOnSearch?: boolean;\n /**\n * The color associated with the category.\n */\n color?: string;\n}\n\nexport interface IComboboxOption {\n /**\n * The unique ID of the option.\n */\n id: string;\n /**\n * The ID of the category the option belongs to.\n */\n categoryId?: string;\n /**\n * The icon displayed on the left side.\n */\n leftIcon?: SubIcon | ((className: string) => JSX.Element);\n /**\n * The icon displayed on the right side.\n */\n rightIcon?: SubIcon | ((className: string) => JSX.Element);\n /**\n * The type of the left icon.\n */\n leftIconType?: ComboboxOptionIconType;\n /**\n * The type of the right icon.\n */\n rightIconType?: ComboboxOptionIconType;\n /**\n * The display label of the option.\n */\n label: string;\n /**\n * The size of the icons.\n */\n iconSize?: number;\n /**\n * If true, the option is disabled.\n */\n disabled?: boolean;\n /**\n * If true, the option is selected.\n */\n selected?: boolean;\n /**\n * The ARIA label for accessibility.\n */\n \"aria-label\"?: string;\n /**\n * If true, the option belongs to a category.\n */\n belongToCategory?: boolean;\n /**\n * The tooltip content displayed on hover.\n */\n tooltipContent?: string;\n /**\n * Props for the Tooltip component.\n * The \"Omit\" is here on purpose to avoid the content prop, in case tooltipProps would be expanded in the future.\n */\n tooltipProps?: Pick<Omit<TooltipProps, \"content\">, \"position\">;\n}\n\nexport interface IComboboxItem {\n /**\n * The height of the item.\n */\n height?: number;\n /**\n * The type of the item.\n */\n type?: string;\n /**\n * The category details if the item is a category.\n */\n category?: IComboboxCategory;\n /**\n * The ID of the category the item belongs to.\n */\n categoryId?: string;\n /**\n * The unique ID of the item.\n */\n id?: string;\n /**\n * The index of the item in the list.\n */\n index?: number;\n /**\n * If true, a divider is displayed before this item.\n */\n withDivider?: boolean;\n /**\n * Class name applied to the item.\n */\n className?: string;\n /**\n * If true, the item belongs to a category.\n */\n belongToCategory?: boolean;\n /**\n * The option details if the item is an option.\n */\n option?: IComboboxOption;\n /**\n * Custom renderer for the option.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n /**\n * If true, the item is currently active.\n */\n isActive?: boolean;\n /**\n * The height of the option item.\n */\n optionLineHeight?: number;\n /**\n * If true, the selected item is automatically scrolled into view.\n */\n shouldScrollToSelectedItem?: boolean;\n}\n\nexport interface IComboboxOptionEvents {\n /**\n * Callback fired when an option is clicked.\n */\n onOptionClick: (\n event: React.MouseEvent | React.KeyboardEvent,\n index: number,\n option: IComboboxOption,\n mouseTriggered: boolean\n ) => void;\n /**\n * Callback fired when the mouse leaves an option.\n */\n onOptionLeave: (event: React.MouseEvent, index: number, option: IComboboxOption, mouseTriggered: boolean) => void;\n /**\n * Callback fired when the mouse enters an option.\n */\n onOptionEnter: (event: React.MouseEvent, index: number, option: IComboboxOption, mouseTriggered: boolean) => void;\n /**\n * Callback fired when hovering over an option.\n */\n onOptionHover?: (event: React.MouseEvent, index: number, option: IComboboxOption, mouseTriggered: boolean) => void;\n}\n\nexport interface IOptionItemRendererArgs extends IComboboxOptionEvents {\n /**\n * The unique ID of the option item.\n */\n id?: string;\n /**\n * The index of the option item.\n */\n index?: number;\n /**\n * The option details.\n */\n option?: IComboboxOption;\n /**\n * Class name applied to the option item.\n */\n className?: string;\n /**\n * If true, the option is currently active.\n */\n isActive?: boolean;\n /**\n * If true, the option has visual focus.\n */\n visualFocus?: boolean;\n /**\n * A reference to the scroll container.\n */\n scrollRef?: React.MutableRefObject<HTMLElement>;\n /**\n * The amount of offset when scrolling to the active item.\n */\n scrollOffset?: number;\n /**\n * The height of the option item.\n */\n optionLineHeight?: number;\n /**\n * If true, the selected item is automatically scrolled into view.\n */\n shouldScrollToSelectedItem?: boolean;\n /**\n * If true, scrolls to the active option when it is selected.\n */\n shouldScrollWhenActive?: boolean;\n /**\n * If true, the option belongs to a category.\n */\n belongToCategory?: boolean;\n /**\n * The index of the item with visual focus.\n */\n visualFocusItemIndex?: number;\n /**\n * The index of the currently active item.\n */\n activeItemIndex?: number;\n /**\n * Custom renderer for the option content.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n}\n"],"names":["ComboboxOptionIconType","COMBOBOX_DIVIDER_ITEM","COMBOBOX_CATEGORY_ITEM","COMBOBOX_OPTION_ITEM","COMBOBOX_LISTBOX_ID"],"mappings":"AAIO,IAQKA,EARCC,EAAwB,mBACxBC,EAAyB,oBACzBC,EAAuB,kBACvBC,EAAsB,oBAKnC,SAAYJ,GACVA,EAAA,QAAA,UACAA,EAAA,SAAA,UACD,CAHD,CAAYA,IAAAA,EAGX,CAAA"}
|
package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import e,{forwardRef as t,useRef as o,useMemo as n,useCallback as i}from"react";import r from"classnames";import{comboboxItemRenderer as s}from"../../ComboboxHelpers/ComboboxHelpers.js";import{VirtualizedList as a}from"@vibe/virtualized-list/mockedClassNames";import{COMBOBOX_CATEGORY_ITEM as l,COMBOBOX_OPTION_ITEM as m}from"../ComboboxConstants.js";import c from"./ComboboxItems.module.scss.js";var p=t((function(t,p){var d=t.className,u=t.optionClassName,f=t.categories,v=t.options,C=t.optionRenderer,b=t.activeItemIndex,I=t.visualFocusItemIndex,g=t.onOptionClick,y=t.onOptionEnter,x=t.onOptionLeave,h=t.optionLineHeight,O=t.shouldScrollToSelectedItem,N=t.renderOnlyVisibleOptions,k=t.onActiveCategoryChanged,R=t.maxOptionsWithoutScroll,E=t.itemsMap,S=t.stickyCategories,j=t.id,H=o(),L=n((function(){if(R)return{height:h*Math.min(v.length+Object.keys(null!=f?f:{}).length,R+.5)}}),[R,h,v,f]),F=i((function(e,t,o){return s({stickyCategories:S,item:e,style:o,optionEvents:{onOptionClick:g,onOptionEnter:y,onOptionLeave:x},optionRenderData:{className:u,optionLineHeight:h,optionRenderer:C,visualFocusItemIndex:I,scrollRef:N?null:p,activeItemIndex:b,shouldScrollToSelectedItem:O},isVirtualized:N})}),[g,y,x,u,h,C,I,N,p,b,O]),w=i((function(e){var t=e.firstItemId;window.requestAnimationFrame((function(){var e=E.get(t);if(e&&(e.type===l||e.type===m)){var o=e.type===m&&e.categoryId?e.categoryId:e.id;if(o!==H.current){H.current=o;var n=E.get(H.current);k(n)}}}))}),[E,k]);return N?e.createElement(a,{ref:p,className:r(c.optionsContainer,d),items:v,itemRenderer:F,role:"listbox",scrollableClassName:c.scrollableContainer,onItemsRendered:w,style:L,id:j}):e.createElement("div",{className:r(c.scrollableContainer,c.optionsContainer,d),role:"listbox",id:j,style:L,ref:p},v.map((function(e,t){return F(e,t,void 0)})))}));export{p as ComboboxItems};
|
|
2
|
-
//# sourceMappingURL=ComboboxItems.js.map
|
package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxItems.js","sources":["../../../../../../../src/components/Combobox/components/ComboboxItems/ComboboxItems.tsx"],"sourcesContent":["import React, { type CSSProperties, forwardRef, type RefObject, useCallback, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { comboboxItemRenderer } from \"../../ComboboxHelpers/ComboboxHelpers\";\nimport { VirtualizedList } from \"@vibe/virtualized-list\";\nimport {\n COMBOBOX_CATEGORY_ITEM,\n COMBOBOX_OPTION_ITEM,\n type IComboboxCategoryMap,\n type IComboboxItem,\n type IComboboxOption,\n type IComboboxOptionEvents\n} from \"../ComboboxConstants\";\nimport styles from \"./ComboboxItems.module.scss\";\n\nexport interface ComboboxItemsProps extends IComboboxOptionEvents {\n /**\n * Class name applied to the options container.\n */\n className?: string;\n /**\n * Class name applied to individual options.\n */\n optionClassName?: string;\n /**\n * The categories available in the combobox.\n */\n categories?: IComboboxCategoryMap;\n /**\n * The list of options displayed in the combobox.\n */\n options?: IComboboxItem[];\n /**\n * Custom renderer for an option.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n /**\n * The index of the currently active item.\n */\n activeItemIndex?: number;\n /**\n * The index of the item with visual focus.\n */\n visualFocusItemIndex?: number;\n /**\n * The height of each option item.\n */\n optionLineHeight?: number;\n /**\n * If true, the list scrolls to the selected item when opened.\n */\n shouldScrollToSelectedItem?: boolean;\n /**\n * If true, only renders visible options (optimization for large lists).\n */\n renderOnlyVisibleOptions?: boolean;\n /**\n * Callback fired when the active category changes.\n */\n onActiveCategoryChanged?: (category: IComboboxItem) => void;\n /**\n * The maximum number of options displayed without scrolling.\n */\n maxOptionsWithoutScroll?: number;\n /**\n * A map of item IDs to item data.\n */\n itemsMap?: Map<string, IComboboxItem>;\n /**\n * If true, categories remain visible when scrolling.\n */\n stickyCategories?: boolean;\n /**\n * The ID of the options container.\n */\n id?: string;\n}\n\nexport const ComboboxItems: React.FC<ComboboxItemsProps> = forwardRef(\n (\n {\n className,\n optionClassName,\n categories,\n options,\n optionRenderer,\n activeItemIndex,\n visualFocusItemIndex,\n onOptionClick,\n onOptionEnter,\n onOptionLeave,\n optionLineHeight,\n shouldScrollToSelectedItem,\n renderOnlyVisibleOptions,\n onActiveCategoryChanged,\n maxOptionsWithoutScroll,\n itemsMap,\n stickyCategories,\n id\n },\n ref: RefObject<HTMLDivElement>\n ) => {\n const activeCategoryId = useRef<string>();\n const style = useMemo(() => {\n if (maxOptionsWithoutScroll) {\n // Adding 0.5 to show next option to indicate scroll is available\n const maxCount = Math.min(options.length + Object.keys(categories ?? {}).length, maxOptionsWithoutScroll + 0.5);\n return { height: optionLineHeight * maxCount };\n }\n return undefined;\n }, [maxOptionsWithoutScroll, optionLineHeight, options, categories]);\n\n const createItemElementRenderer = useCallback(\n (item: IComboboxItem, index: number, style: CSSProperties) =>\n comboboxItemRenderer({\n stickyCategories,\n item,\n style,\n optionEvents: {\n onOptionClick,\n onOptionEnter,\n onOptionLeave\n },\n optionRenderData: {\n className: optionClassName,\n optionLineHeight,\n optionRenderer,\n visualFocusItemIndex,\n scrollRef: renderOnlyVisibleOptions ? null : ref,\n activeItemIndex,\n shouldScrollToSelectedItem\n },\n isVirtualized: renderOnlyVisibleOptions\n }),\n [\n onOptionClick,\n onOptionEnter,\n onOptionLeave,\n optionClassName,\n optionLineHeight,\n optionRenderer,\n visualFocusItemIndex,\n renderOnlyVisibleOptions,\n ref,\n activeItemIndex,\n shouldScrollToSelectedItem\n ]\n );\n\n const onItemsRender = useCallback(\n ({ firstItemId }: { firstItemId?: string }) => {\n window.requestAnimationFrame(() => {\n const itemData = itemsMap.get(firstItemId);\n if (itemData && (itemData.type === COMBOBOX_CATEGORY_ITEM || itemData.type === COMBOBOX_OPTION_ITEM)) {\n const newActiveCategoryId =\n itemData.type === COMBOBOX_OPTION_ITEM && itemData.categoryId ? itemData.categoryId : itemData.id;\n\n if (newActiveCategoryId !== activeCategoryId.current) {\n activeCategoryId.current = newActiveCategoryId;\n const categoryObject = itemsMap.get(activeCategoryId.current);\n onActiveCategoryChanged(categoryObject);\n }\n }\n });\n },\n [itemsMap, onActiveCategoryChanged]\n );\n\n let itemsElements;\n\n // If we request to render only the items which visible in a given moment (optimization for very large lists)\n if (renderOnlyVisibleOptions) {\n itemsElements = (\n <VirtualizedList\n ref={ref}\n className={cx(styles.optionsContainer, className)}\n items={options}\n itemRenderer={createItemElementRenderer}\n role=\"listbox\"\n scrollableClassName={styles.scrollableContainer}\n onItemsRendered={onItemsRender}\n style={style}\n id={id}\n />\n );\n } else {\n itemsElements = (\n <div\n className={cx(styles.scrollableContainer, styles.optionsContainer, className)}\n role=\"listbox\"\n id={id}\n style={style}\n ref={ref}\n >\n {options.map((itemData, index) => createItemElementRenderer(itemData, index, undefined))}\n </div>\n );\n }\n\n return itemsElements;\n }\n);\n"],"names":["ComboboxItems","forwardRef","_ref","ref","className","optionClassName","categories","options","optionRenderer","activeItemIndex","visualFocusItemIndex","onOptionClick","onOptionEnter","onOptionLeave","optionLineHeight","shouldScrollToSelectedItem","renderOnlyVisibleOptions","onActiveCategoryChanged","maxOptionsWithoutScroll","itemsMap","stickyCategories","id","activeCategoryId","useRef","style","useMemo","height","Math","min","length","Object","keys","createItemElementRenderer","useCallback","item","index","comboboxItemRenderer","optionEvents","optionRenderData","scrollRef","isVirtualized","onItemsRender","_ref2","firstItemId","window","requestAnimationFrame","itemData","get","type","COMBOBOX_CATEGORY_ITEM","COMBOBOX_OPTION_ITEM","newActiveCategoryId","categoryId","current","categoryObject","React","createElement","VirtualizedList","cx","styles","optionsContainer","items","itemRenderer","role","scrollableClassName","scrollableContainer","onItemsRendered","map","undefined"],"mappings":"6YA6EO,IAAMA,EAA8CC,GACzD,SAAAC,EAqBEC,GACE,IApBAC,EAASF,EAATE,UACAC,EAAeH,EAAfG,gBACAC,EAAUJ,EAAVI,WACAC,EAAOL,EAAPK,QACAC,EAAcN,EAAdM,eACAC,EAAeP,EAAfO,gBACAC,EAAoBR,EAApBQ,qBACAC,EAAaT,EAAbS,cACAC,EAAaV,EAAbU,cACAC,EAAaX,EAAbW,cACAC,EAAgBZ,EAAhBY,iBACAC,EAA0Bb,EAA1Ba,2BACAC,EAAwBd,EAAxBc,yBACAC,EAAuBf,EAAvBe,wBACAC,EAAuBhB,EAAvBgB,wBACAC,EAAQjB,EAARiB,SACAC,EAAgBlB,EAAhBkB,iBACAC,EAAEnB,EAAFmB,GAIIC,EAAmBC,IACnBC,EAAQC,GAAQ,WACpB,GAAIP,EAGF,MAAO,CAAEQ,OAAQZ,EADAa,KAAKC,IAAIrB,EAAQsB,OAASC,OAAOC,KAAKzB,QAAAA,EAAc,CAAA,GAAIuB,OAAQX,EAA0B,IAI9G,GAAE,CAACA,EAAyBJ,EAAkBP,EAASD,IAElD0B,EAA4BC,GAChC,SAACC,EAAqBC,EAAeX,GAAoB,OACvDY,EAAqB,CACnBhB,iBAAAA,EACAc,KAAAA,EACAV,MAAAA,EACAa,aAAc,CACZ1B,cAAAA,EACAC,cAAAA,EACAC,cAAAA,GAEFyB,iBAAkB,CAChBlC,UAAWC,EACXS,iBAAAA,EACAN,eAAAA,EACAE,qBAAAA,EACA6B,UAAWvB,EAA2B,KAAOb,EAC7CM,gBAAAA,EACAM,2BAAAA,GAEFyB,cAAexB,GAEnB,GAAA,CACEL,EACAC,EACAC,EACAR,EACAS,EACAN,EACAE,EACAM,EACAb,EACAM,EACAM,IAIE0B,EAAgBR,GACpB,SAAAS,GAA8C,IAA3CC,EAAWD,EAAXC,YACDC,OAAOC,uBAAsB,WAC3B,IAAMC,EAAW3B,EAAS4B,IAAIJ,GAC9B,GAAIG,IAAaA,EAASE,OAASC,GAA0BH,EAASE,OAASE,GAAuB,CACpG,IAAMC,EACJL,EAASE,OAASE,GAAwBJ,EAASM,WAAaN,EAASM,WAAaN,EAASzB,GAEjG,GAAI8B,IAAwB7B,EAAiB+B,QAAS,CACpD/B,EAAiB+B,QAAUF,EAC3B,IAAMG,EAAiBnC,EAAS4B,IAAIzB,EAAiB+B,SACrDpC,EAAwBqC,EAC1B,CACF,CACF,GACF,GACA,CAACnC,EAAUF,IAkCb,OA5BID,EAEAuC,EAACC,cAAAC,GACCtD,IAAKA,EACLC,UAAWsD,EAAGC,EAAOC,iBAAkBxD,GACvCyD,MAAOtD,EACPuD,aAAc9B,EACd+B,KAAK,UACLC,oBAAqBL,EAAOM,oBAC5BC,gBAAiBzB,EACjBjB,MAAOA,EACPH,GAAIA,IAKNkC,EAAAC,cAAA,MAAA,CACEpD,UAAWsD,EAAGC,EAAOM,oBAAqBN,EAAOC,iBAAkBxD,GACnE2D,KAAK,UACL1C,GAAIA,EACJG,MAAOA,EACPrB,IAAKA,GAEJI,EAAQ4D,KAAI,SAACrB,EAAUX,GAAK,OAAKH,EAA0Bc,EAAUX,OAAOiC,EAAU,IAM/F"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var t={scrollableContainer:"scrollableContainer",optionsContainer:"optionsContainer",categoryWithOptions:"categoryWithOptions",firstCategory:"firstCategory",categoryWithoutOptions:"categoryWithoutOptions"};!function(t){const e="s_id-9dc0ac18aa3d_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(t))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=t)}("/* stylelint-disable */\n/* stylelint-enable */\n.scrollableContainer::-webkit-scrollbar {\n width: 4px;\n height: 6px;\n}\n.scrollableContainer::-webkit-scrollbar-thumb {\n background-color: var(--ui-border-color);\n border-radius: 4px;\n}\n.optionsContainer {\n overflow-x: visible;\n overflow-y: auto;\n margin-top: var(--space-8);\n}\n.categoryWithOptions.firstCategory,\n.categoryWithoutOptions.firstCategory {\n padding-top: 0;\n}\n.categoryWithOptions {\n margin-bottom: var(--space-4);\n}\n.categoryWithoutOptions {\n margin-bottom: 0;\n}");export{t as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxItems.module.scss.js.map
|
package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{defineProperty as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import t,{useRef as n,useEffect as i,useCallback as r,useMemo as l}from"react";import{Icon as s}from"@vibe/icon/mockedClassNames";import{Tooltip as a}from"@vibe/tooltip/mockedClassNames";import{useIsOverflowing as c}from"@vibe/hooks";import{keyCodes as m}from"../../../../constants/keyCodes.js";import"../../../../constants/sizes.js";import{getOptionId as p}from"../../helpers.js";import{getTestId as d,ComponentDefaultTestId as u}from"../../../../tests/testIds.js";import f from"./ComboboxOption.module.scss.js";var v=function(v){var b=v.index,h=v.option,O=v.className,y=v.isActive,g=v.visualFocus,C=v.scrollRef,k=v.scrollOffset,E=void 0===k?100:k,I=v.onOptionClick,N=v.onOptionLeave,j=v.onOptionHover,T=v.optionLineHeight,P=v.shouldScrollWhenActive,x=void 0===P||P,H=v.optionRenderer,L=void 0===H?null:H,R=h.id,S=h.leftIcon,z=h.leftIconType,A=h.rightIcon,B=h.rightIconType,F=h.label,M=h.iconSize,_=void 0===M?18:M,w=h.disabled,W=h.selected,D=h["aria-label"],K=h.belongToCategory,V=void 0!==K&&K,X=h.tooltipContent,q=n(null),G=n(),J=c({ref:G});i((function(){var e,o=q.current;g&&o&&x&&((null==C?void 0:C.current)&&o?C.current.scrollTop=o.offsetTop-E:null===(e=null==o?void 0:o.scrollIntoView)||void 0===e||e.call(o,{behaviour:"smooth"}))}),[q,g,x,C,E,V]);var Q=function(e,n,i){return"renderer"===n?e(o(f.optionIcon,i)):t.createElement(s,{className:o(f.optionIcon,i),type:"font",icon:e,size:_,ignoreFocusStyle:!0})},U=r((function(e){w||I(e,b,h,!0)}),[b,h,I,w]),Y=r((function(e){w||N(e,b,h,!0)}),[b,h,N,w]),Z=r((function(e){w||j(e,b,h,!0)}),[b,h,j,w]),$=r((function(e){e.key!==m.ENTER&&e.key!==m.SPACE||I(e,b,h,!1)}),[I,b,h]);X||(X=J?F:null);var ee=l((function(){return L&&L(h)}),[L,h]),oe=t.createElement(t.Fragment,null,S&&Q(S,z,f.left),t.createElement("div",{ref:G,className:o(f.optionLabel)},F),A&&Q(A,B,""));return t.createElement(a,Object.assign({},h.tooltipProps,{content:X,hideWhenReferenceHidden:!0}),t.createElement("div",{ref:q,key:R||F,"aria-level":V?2:1,"aria-selected":y,"aria-label":D||F,id:p(R,b),"data-testid":d(u.COMBOBOX_OPTION,b),onMouseEnter:Z,onClick:U,onKeyDown:$,onMouseLeave:Y,className:o(f.comboboxOption,O,e(e(e(e({},f.disabled,w),f.selected,W),f.active,y),f.activeOutline,g)),style:{height:T}},ee||oe))};export{v as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxOption.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxOption.js","sources":["../../../../../../../src/components/Combobox/components/ComboboxOption/ComboboxOption.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type RefObject, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { useIsOverflowing } from \"@vibe/hooks\";\nimport { keyCodes } from \"../../../../constants\";\nimport { getOptionId } from \"../../helpers\";\nimport { type IComboboxOption, type IComboboxOptionEvents } from \"../ComboboxConstants\";\nimport { type ComboboxOptionIconType } from \"../../Combobox.types\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport styles from \"./ComboboxOption.module.scss\";\n\nexport interface ComboboxOptionProps extends IComboboxOptionEvents {\n /**\n * The index of the option in the list.\n */\n index?: number;\n /**\n * The option data containing label, icons, and other properties.\n */\n option?: IComboboxOption;\n /**\n * Class name applied to the option element.\n */\n className?: string;\n /**\n * If true, the option is currently active.\n */\n isActive?: boolean;\n /**\n * If true, the option has visual focus.\n */\n visualFocus?: boolean;\n /**\n * A reference to the scroll container.\n */\n scrollRef?: RefObject<HTMLElement>;\n /**\n * The amount of offset when scrolling to the active item.\n */\n scrollOffset?: number;\n /**\n * The height of each option.\n */\n optionLineHeight?: number;\n /**\n * If true, scrolls to the active option when it is selected.\n */\n shouldScrollWhenActive?: boolean;\n /**\n * Custom renderer for the option content.\n */\n optionRenderer?: (option: IComboboxOption) => JSX.Element;\n}\n\nconst ComboboxOption = ({\n index,\n option,\n className,\n isActive,\n visualFocus,\n scrollRef,\n scrollOffset = 100,\n onOptionClick,\n onOptionLeave,\n onOptionHover,\n optionLineHeight,\n shouldScrollWhenActive = true,\n optionRenderer = null\n}: ComboboxOptionProps) => {\n const {\n id,\n leftIcon,\n leftIconType,\n rightIcon,\n rightIconType,\n label,\n iconSize = 18,\n disabled,\n selected,\n \"aria-label\": ariaLabel,\n belongToCategory = false\n } = option;\n let { tooltipContent } = option;\n\n const ref = useRef(null);\n const labelRef = useRef();\n\n const isOptionOverflowing = useIsOverflowing({ ref: labelRef });\n\n useEffect(() => {\n const element = ref.current;\n if (visualFocus && element && shouldScrollWhenActive) {\n if (scrollRef?.current && element) {\n // not supported with virtualized atm, need their scrollRef (element with overflow-y auto that has the scroll)\n scrollRef.current.scrollTop = element.offsetTop - scrollOffset;\n } else {\n element?.scrollIntoView?.({ behaviour: \"smooth\" });\n }\n }\n }, [ref, visualFocus, shouldScrollWhenActive, scrollRef, scrollOffset, belongToCategory]);\n\n const renderIcon = (\n icon: SubIcon | ((className: string) => JSX.Element),\n iconType: ComboboxOptionIconType,\n className: string\n ) => {\n if (iconType === \"renderer\") {\n return (icon as (className: string) => JSX.Element)(cx(styles.optionIcon, className));\n }\n\n return (\n <Icon\n className={cx(styles.optionIcon, className)}\n type=\"font\"\n icon={icon as SubIcon}\n size={iconSize}\n ignoreFocusStyle\n />\n );\n };\n\n const onClick = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionClick(event, index, option, true);\n },\n [index, option, onOptionClick, disabled]\n );\n\n const onMouseLeave = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionLeave(event, index, option, true);\n },\n [index, option, onOptionLeave, disabled]\n );\n\n const onMouseEnter = useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n onOptionHover(event, index, option, true);\n },\n [index, option, onOptionHover, disabled]\n );\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === keyCodes.ENTER || event.key === keyCodes.SPACE) {\n onOptionClick(event, index, option, false);\n }\n },\n [onOptionClick, index, option]\n );\n if (!tooltipContent) {\n tooltipContent = isOptionOverflowing ? label : null;\n }\n\n const optionRendererValue = useMemo(() => optionRenderer && optionRenderer(option), [optionRenderer, option]);\n\n const optionValue = (\n <>\n {leftIcon && renderIcon(leftIcon, leftIconType, styles.left)}\n <div ref={labelRef} className={cx(styles.optionLabel)}>\n {label}\n </div>\n {rightIcon && renderIcon(rightIcon, rightIconType, \"\")}\n </>\n );\n\n return (\n <Tooltip {...option.tooltipProps} content={tooltipContent} hideWhenReferenceHidden>\n <div\n ref={ref}\n key={id || label}\n aria-level={belongToCategory ? 2 : 1}\n aria-selected={isActive}\n aria-label={ariaLabel || label}\n id={getOptionId(id, index)}\n data-testid={getTestId(ComponentDefaultTestId.COMBOBOX_OPTION, index)}\n onMouseEnter={onMouseEnter}\n onClick={onClick}\n onKeyDown={onKeyDown}\n onMouseLeave={onMouseLeave}\n className={cx(styles.comboboxOption, className, {\n [styles.disabled]: disabled,\n [styles.selected]: selected,\n [styles.active]: isActive,\n [styles.activeOutline]: visualFocus\n })}\n style={{ height: optionLineHeight }}\n >\n {optionRendererValue || optionValue}\n </div>\n </Tooltip>\n );\n};\n\nexport default ComboboxOption;\n"],"names":["ComboboxOption","_ref","index","option","className","isActive","visualFocus","scrollRef","_ref$scrollOffset","scrollOffset","onOptionClick","onOptionLeave","onOptionHover","optionLineHeight","_ref$shouldScrollWhen","shouldScrollWhenActive","_ref$optionRenderer","optionRenderer","id","leftIcon","leftIconType","rightIcon","rightIconType","label","_option$iconSize","iconSize","disabled","selected","ariaLabel","_option$belongToCateg","belongToCategory","tooltipContent","ref","useRef","labelRef","isOptionOverflowing","useIsOverflowing","useEffect","element","current","scrollTop","offsetTop","_a","scrollIntoView","call","behaviour","renderIcon","icon","iconType","cx","styles","optionIcon","React","createElement","Icon","type","size","ignoreFocusStyle","onClick","useCallback","event","onMouseLeave","onMouseEnter","onKeyDown","key","keyCodes","ENTER","SPACE","optionRendererValue","useMemo","optionValue","Fragment","left","optionLabel","Tooltip","Object","assign","tooltipProps","content","hideWhenReferenceHidden","getOptionId","getTestId","ComponentDefaultTestId","COMBOBOX_OPTION","comboboxOption","_defineProperty","active","activeOutline","style","height"],"mappings":"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"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var o={comboboxOption:"comboboxOption",disabled:"disabled",selected:"selected",active:"active",activeOutline:"activeOutline",optionLabel:"optionLabel",optionIcon:"optionIcon",left:"left"};!function(o){const n="s_id-3db504899945_4_5_27";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,e.firstChild?e.insertBefore(t,e.firstChild):e.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.comboboxOption {\n padding: 8px;\n width: 100%;\n border-radius: 4px;\n display: flex;\n align-items: center;\n overflow: hidden;\n cursor: pointer;\n user-select: none;\n}\n.comboboxOption.disabled {\n cursor: not-allowed;\n border-color: var(--disabled-background-color);\n color: var(--disabled-text-color);\n cursor: not-allowed;\n}\n.comboboxOption.disabled:hover {\n background-color: transparent;\n}\n.comboboxOption.selected {\n background-color: var(--primary-selected-color);\n}\n.comboboxOption:hover:not(.disabled):not(.selected),\n.comboboxOption.active {\n color: var(--primary-text-color);\n background-color: var(--primary-background-hover-color);\n position: relative;\n}\n.comboboxOption.activeOutline {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n background-color: var(--secondary-background-color);\n}\n.comboboxOption .optionLabel {\n flex: 1 1 auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.comboboxOption .optionIcon {\n flex: 0 0 auto;\n}\n.comboboxOption .optionIcon.left {\n margin-inline-end: 4px;\n}");export{o as default};
|
|
2
|
-
//# sourceMappingURL=ComboboxOption.module.scss.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"StickyCategoryHeader.js","sources":["../../../../../../../src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./StickyCategoryHeader.module.scss\";\nimport comboboxStyles from \"../../Combobox.module.scss\";\nimport comboboxCategoryStyles from \"../ComboboxCategory/ComboboxCategory.module.scss\";\n\nexport const StickyCategoryHeader = ({\n label,\n color,\n className\n}: {\n label: string;\n color?: string;\n className?: string;\n}) => {\n return label === undefined ? null : (\n <div\n className={cx(\n styles.stickyCategoryHeader,\n comboboxStyles.comboboxCategory,\n comboboxCategoryStyles.comboboxCategory,\n className\n )}\n style={color && { color }}\n aria-hidden\n >\n {label}\n </div>\n );\n};\n"],"names":["StickyCategoryHeader","_ref","label","color","undefined","React","createElement","className","cx","styles","stickyCategoryHeader","comboboxStyles","comboboxCategory","comboboxCategoryStyles","style"],"mappings":"wNAMaA,EAAuB,SAAHC,GAQ5B,IAPHC,EAAKD,EAALC,MACAC,EAAKF,EAALE,MAOA,YAAiBC,IAAVF,EAAsB,KAC3BG,EAAAC,cAAA,MAAA,CACEC,UAAWC,EACTC,EAAOC,qBACPC,EAAeC,iBACfC,EAAuBD,iBAXpBX,EAATM,WAcIO,MAAOX,GAAS,CAAEA,MAAAA,qBAGjBD,EAGP"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={stickyCategoryHeader:"stickyCategoryHeader"};!function(e){const t="s_id-c981e92fbca0_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".stickyCategoryHeader {\n position: absolute;\n z-index: 10;\n width: calc(100% - 12px);\n background-color: var(--primary-background-color);\n padding-block: 10px var(--space-4);\n display: flex;\n align-items: center;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=StickyCategoryHeader.module.scss.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.js","sources":["../../../../../src/components/Combobox/helpers.ts"],"sourcesContent":["export function getOptionId(id: string, index: number) {\n return id !== undefined ? `combobox-item-${id}` : `combobox-item-${index}`;\n}\n"],"names":["getOptionId","id","index","concat","undefined"],"mappings":"AAAgB,SAAAA,EAAYC,EAAYC,GACtC,MAAuBC,iBAAAA,YAATC,IAAPH,EAAoCA,EAAwBC,EACrE"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import r,{forwardRef as o,useRef as a,useState as l,useCallback as s,useMemo as n}from"react";import i from"classnames";import{getTableRowLayoutStyles as m}from"./tableHelpers.js";import{getTestId as u}from"../../../tests/testIds.js";import{ComponentDefaultTestId as c,ComponentVibeId as d}from"../../../tests/constants.js";import{RowHeights as f}from"./TableConsts.js";import p from"./Table.module.scss.js";import{TableProvider as b}from"../context/TableContext/TableContext.js";import{TableRowMenuProvider as v}from"../context/TableRowMenuContext/TableRowMenuContext.js";import{useMergeRef as R}from"@vibe/shared";var T=o((function(o,T){var S=o.id,j=o.className,x=o["data-testid"],w=o.columns,y=o.errorState,z=o.emptyState,C=o.dataState,g=o.style,h=o.children,E=o.size,A=void 0===E?"medium":E,B=o.withoutBorder,H=a(null),M=R(T,H),I=l(!1),L=e(I,2),O=L[0],N=L[1],P=l(null),V=e(P,2),_=V[0],k=V[1],q=s((function(){N(!1),k(null)}),[]),D=l(!1),F=e(D,2),G=F[0],J=F[1],K=s((function(){J(!0)}),[]),Q=l(!1),U=e(Q,2),W=U[0],X=U[1],Y=s((function(e){if(q(),!G){var t=e.target.scrollLeft>0;X((function(e){return e!==t?t:e}))}}),[q,G]),Z=m(w),$=Object.assign({"--table-grid-template-columns":Z.gridTemplateColumns,"--table-row-size":"".concat(f[A],"px")},g),ee=n((function(){return{columns:w,dataState:C,emptyState:z,errorState:y,size:A,tableRootRef:H,isVirtualized:G,markTableAsVirtualized:K,isScrolled:W,setIsScrolled:function(e){return X(e)}}}),[w,C,z,y,G,K,W,A]),te=n((function(){return{tableRootRef:H,hoveredRowRef:_,isMenuOpen:O,resetHoveredRow:q,setHoveredRowRef:function(e){return k(e)},setIsMenuOpen:function(e){return N(e)}}}),[_,O,q,k]);return r.createElement(b,{value:ee},r.createElement(v,{value:te},r.createElement("div",{ref:M,id:S,className:i(p.table,t(t(t({},p.border,!B),p.virtualized,G),p.hasScroll,W),j),"data-testid":x||u(c.TABLE,S),"data-vibe":d.TABLE,role:"table",style:$,onScroll:Y},h)))}));export{T as default};
|
|
2
|
-
//# sourceMappingURL=Table.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","sources":["../../../../../../src/components/Table/Table/Table.tsx"],"sourcesContent":["import React, {\n forwardRef,\n type ReactElement,\n type UIEventHandler,\n useCallback,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport { type TableHeaderProps } from \"../TableHeader/TableHeader\";\nimport { type TableBodyProps } from \"../TableBody/TableBody\";\nimport { getTableRowLayoutStyles } from \"./tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../../tests/constants\";\nimport { RowHeights } from \"./TableConsts\";\nimport { type RowSizes } from \"./Table.types\";\nimport styles from \"./Table.module.scss\";\nimport { TableProvider } from \"../context/TableContext/TableContext\";\nimport { TableRowMenuProvider } from \"../context/TableRowMenuContext/TableRowMenuContext\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { type TableProviderValue } from \"../context/TableContext/TableContext.types\";\nimport { type TableRowMenuProviderValue } from \"../context/TableRowMenuContext/TableRowMenuContext.types\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nexport type TableLoadingStateType = \"long-text\" | \"medium-text\" | \"circle\" | \"rectangle\";\n\ntype Width = number | `${number}%` | `${number}px` | `${number}fr`;\n\nexport interface TableColumn {\n /**\n * Unique identifier for the column.\n */\n id: string;\n /**\n * Column title displayed in the header.\n */\n title: string;\n /**\n * Additional information displayed as a tooltip.\n */\n infoContent?: string;\n /**\n * Column width configuration.\n */\n width?: Width | { min: Width; max: Width };\n /**\n * Icon displayed next to the column title.\n */\n icon?: SubIcon;\n /**\n * Loading state type for the column when data is being fetched.\n */\n loadingStateType?: TableLoadingStateType;\n}\n\nexport interface TableProps extends VibeComponentProps {\n /**\n * Defines the columns of the table.\n */\n columns: TableColumn[];\n /**\n * State of the data being displayed (loading or error).\n */\n dataState?: {\n isLoading?: boolean;\n isError?: boolean;\n };\n /**\n * React element displayed when there is an error state.\n */\n errorState: ReactElement;\n /**\n * React element displayed when there is no data.\n */\n emptyState: ReactElement;\n /**\n * Custom styles for the table.\n */\n style?: React.CSSProperties;\n /**\n * The child components inside the table, such as `<TableHeader />` and `<TableBody />`.\n */\n children?:\n | ReactElement<TableHeaderProps>\n | ReactElement<TableBodyProps>\n | Array<ReactElement<TableHeaderProps> | ReactElement<TableBodyProps>>;\n /**\n * The row size of the table.\n */\n size?: RowSizes;\n /**\n * If true, removes the table's outer border.\n */\n withoutBorder?: boolean;\n}\n\nconst Table = forwardRef(\n (\n {\n id,\n className,\n \"data-testid\": dataTestId,\n columns,\n errorState,\n emptyState,\n dataState,\n style,\n children,\n size = \"medium\",\n withoutBorder\n }: TableProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const tableRootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRef(ref, tableRootRef);\n\n const [isMenuOpen, setIsMenuOpen] = useState<boolean>(false);\n const [hoveredRowRef, setHoveredRowRef] = useState<React.RefObject<HTMLDivElement>>(null);\n\n const resetHoveredRow = useCallback(() => {\n setIsMenuOpen(false);\n setHoveredRowRef(null);\n }, []);\n\n const [isVirtualized, setIsVirtualized] = useState<boolean>(false);\n const markTableAsVirtualized = useCallback(() => {\n setIsVirtualized(true);\n }, []);\n\n const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n const onScroll = useCallback<UIEventHandler<HTMLDivElement>>(\n e => {\n resetHoveredRow();\n if (!isVirtualized) {\n const newLeft = (e.target as HTMLDivElement).scrollLeft;\n const hasScroll = newLeft > 0;\n setIsScrolled(prevScroll => (prevScroll !== hasScroll ? hasScroll : prevScroll));\n }\n },\n [resetHoveredRow, isVirtualized]\n );\n\n const { gridTemplateColumns } = getTableRowLayoutStyles(columns);\n\n /**\n * The `--table-grid-template-columns` and `--table-row-size` variables will be available under each <Table /> scope\n * and will be consumed in the stylesheets of its children (<TableHeader />, <TableRow />, <TableHeaderCell />)\n */\n const calculatedStyle = {\n \"--table-grid-template-columns\": gridTemplateColumns,\n \"--table-row-size\": `${RowHeights[size]}px`,\n ...style\n } as React.CSSProperties;\n\n const tableProviderValue = useMemo<TableProviderValue>(\n () => ({\n columns,\n dataState,\n emptyState,\n errorState,\n size,\n tableRootRef,\n isVirtualized,\n markTableAsVirtualized,\n isScrolled,\n setIsScrolled: (scrollLeft: boolean) => setIsScrolled(scrollLeft)\n }),\n [columns, dataState, emptyState, errorState, isVirtualized, markTableAsVirtualized, isScrolled, size]\n );\n\n const tableRowMenuProviderValue = useMemo<TableRowMenuProviderValue>(\n () => ({\n tableRootRef,\n hoveredRowRef,\n isMenuOpen,\n resetHoveredRow,\n setHoveredRowRef: (rowRef: React.RefObject<HTMLDivElement>) => setHoveredRowRef(rowRef),\n setIsMenuOpen: (isOpen: boolean) => setIsMenuOpen(isOpen)\n }),\n [hoveredRowRef, isMenuOpen, resetHoveredRow, setHoveredRowRef]\n );\n\n return (\n <TableProvider value={tableProviderValue}>\n <TableRowMenuProvider value={tableRowMenuProviderValue}>\n <div\n ref={mergedRef}\n id={id}\n className={cx(\n styles.table,\n {\n [styles.border]: !withoutBorder,\n [styles.virtualized]: isVirtualized,\n [styles.hasScroll]: isScrolled\n },\n className\n )}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE, id)}\n data-vibe={ComponentVibeId.TABLE}\n role=\"table\"\n style={calculatedStyle}\n onScroll={onScroll}\n >\n {children}\n </div>\n </TableRowMenuProvider>\n </TableProvider>\n );\n }\n);\n\nexport default Table;\n"],"names":["Table","forwardRef","_ref","ref","id","className","dataTestId","columns","errorState","emptyState","dataState","style","children","_ref$size","size","withoutBorder","tableRootRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","isMenuOpen","setIsMenuOpen","_useState3","_useState4","hoveredRowRef","setHoveredRowRef","resetHoveredRow","useCallback","_useState5","_useState6","isVirtualized","setIsVirtualized","markTableAsVirtualized","_useState7","_useState8","isScrolled","setIsScrolled","onScroll","e","hasScroll","target","scrollLeft","prevScroll","_getTableRowLayoutSty","getTableRowLayoutStyles","calculatedStyle","Object","assign","gridTemplateColumns","concat","RowHeights","tableProviderValue","useMemo","tableRowMenuProviderValue","rowRef","isOpen","React","createElement","TableProvider","value","TableRowMenuProvider","cx","styles","table","_defineProperty","border","virtualized","getTestId","ComponentDefaultTestId","TABLE","ComponentVibeId","role"],"mappings":"8sBAkGMA,IAAAA,EAAQC,GACZ,SAAAC,EAcEC,GACE,IAbAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAOL,EAAPK,QACAC,EAAUN,EAAVM,WACAC,EAAUP,EAAVO,WACAC,EAASR,EAATQ,UACAC,EAAKT,EAALS,MACAC,EAAQV,EAARU,SAAQC,EAAAX,EACRY,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAab,EAAba,cAIIC,EAAeC,EAAuB,MACtCC,EAAYC,EAAYhB,EAAKa,GAEnCI,EAAoCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAArDI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAA0CL,EAA0C,MAAKM,EAAAJ,EAAAG,EAAA,GAAlFE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAEhCG,EAAkBC,GAAY,WAClCN,GAAc,GACdI,EAAiB,KAClB,GAAE,IAEHG,EAA0CX,GAAkB,GAAMY,EAAAV,EAAAS,EAAA,GAA3DE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAChCG,EAAyBL,GAAY,WACzCI,GAAiB,EAClB,GAAE,IAEHE,EAAoChB,GAAkB,GAAMiB,EAAAf,EAAAc,EAAA,GAArDE,EAAUD,EAAA,GAAEE,EAAaF,EAAA,GAE1BG,EAAWV,GACf,SAAAW,GAEE,GADAZ,KACKI,EAAe,CAClB,IACMS,EADWD,EAAEE,OAA0BC,WACjB,EAC5BL,GAAc,SAAAM,GAAU,OAAKA,IAAeH,EAAYA,EAAYG,CAAU,GAChF,CACF,GACA,CAAChB,EAAiBI,IAGpBa,EAAgCC,EAAwBzC,GAMlD0C,EAAkBC,OAAAC,OAAA,CACtB,gCAPyBJ,EAAnBK,oBAQN,sBAAkBC,OAAKC,EAAWxC,GAAK,OACpCH,GAGC4C,GAAqBC,GACzB,WAAA,MAAO,CACLjD,QAAAA,EACAG,UAAAA,EACAD,WAAAA,EACAD,WAAAA,EACAM,KAAAA,EACAE,aAAAA,EACAkB,cAAAA,EACAE,uBAAAA,EACAG,WAAAA,EACAC,cAAe,SAACK,GAAmB,OAAKL,EAAcK,EAAW,EAClE,GACD,CAACtC,EAASG,EAAWD,EAAYD,EAAY0B,EAAeE,EAAwBG,EAAYzB,IAG5F2C,GAA4BD,GAChC,WAAA,MAAO,CACLxC,aAAAA,EACAY,cAAAA,EACAJ,WAAAA,EACAM,gBAAAA,EACAD,iBAAkB,SAAC6B,GAAuC,OAAK7B,EAAiB6B,EAAO,EACvFjC,cAAe,SAACkC,GAAe,OAAKlC,EAAckC,EAAO,EACzD,GACF,CAAC/B,EAAeJ,EAAYM,EAAiBD,IAG/C,OACE+B,EAACC,cAAAC,EAAc,CAAAC,MAAOR,IACpBK,EAAAC,cAACG,EAAoB,CAACD,MAAON,IAC3BG,EAAAC,cAAA,MAAA,CACE1D,IAAKe,EACLd,GAAIA,EACJC,UAAW4D,EACTC,EAAOC,MAAKC,EAAAA,EAAAA,EAAA,CAAA,EAETF,EAAOG,QAAUtD,GACjBmD,EAAOI,YAAcpC,GACrBgC,EAAOvB,UAAYJ,GAEtBlC,GAEW,cAAAC,GAAciE,EAAUC,EAAuBC,MAAOrE,GAAG,YAC3DsE,EAAgBD,MAC3BE,KAAK,QACLhE,MAAOsC,EACPR,SAAUA,GAET7B,IAKX"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var r={table:"table",border:"border",virtualized:"virtualized",hasScroll:"hasScroll"};!function(r){const e="s_id-a9ed4419fbb6_4_5_27";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const l=document.createElement("style");l.id=e,o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.appendChild(document.createTextNode(r))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=r)}("/* stylelint-disable */\n/* stylelint-enable */\n.table {\n --sticky-cell-hover-background: linear-gradient(\n to right,\n var(--primary-background-hover-color),\n var(--primary-background-hover-color)\n ),\n linear-gradient(to right, var(--primary-background-color), var(--primary-background-color));\n background-color: var(--primary-background-color);\n overflow: auto;\n width: 100%;\n height: 100%;\n}\n.table::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n}\n.table::-webkit-scrollbar-thumb {\n background-color: var(--ui-border-color);\n border-radius: 4px;\n}\n.table.border {\n border: 1px solid var(--layout-border-color);\n border-radius: var(--border-radius-small);\n}\n.table [role=rowgroup] [role=row] > [role=cell] {\n border-bottom: 1px solid var(--layout-border-color);\n}\n.table [role=rowgroup] > [role=row]:last-of-type > [role=cell] {\n border-bottom: none;\n}\n.table.virtualized {\n overflow: hidden;\n}\n.table.hasScroll {\n --sticky-cell-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.1);\n}");export{r as default};
|
|
2
|
-
//# sourceMappingURL=Table.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{defineProperty as r}from"../../../../_virtual/_rollupPluginBabelHelpers.js";var e,l=5;!function(r){r.SMALL="small",r.MEDIUM="medium",r.LARGE="large"}(e||(e={}));var a=r(r(r({},e.SMALL,32),e.MEDIUM,40),e.LARGE,48);export{a as RowHeights,e as RowSizes,l as SKELETON_ROWS_AMOUNT};
|
|
2
|
-
//# sourceMappingURL=TableConsts.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableConsts.js","sources":["../../../../../../src/components/Table/Table/TableConsts.ts"],"sourcesContent":["export const SKELETON_ROWS_AMOUNT = 5;\n\n/**\n * @deprecated\n */\nexport enum RowSizes {\n SMALL = \"small\",\n MEDIUM = \"medium\",\n LARGE = \"large\"\n}\n\nexport const RowHeights = {\n [RowSizes.SMALL]: 32,\n [RowSizes.MEDIUM]: 40,\n [RowSizes.LARGE]: 48\n};\n"],"names":["RowSizes","SKELETON_ROWS_AMOUNT","RowHeights","_defineProperty","SMALL","MEDIUM","LARGE"],"mappings":"mFAAO,IAKKA,EALCC,EAAuB,GAKpC,SAAYD,GACVA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAEM,IAAME,EAAUC,EAAAA,EAAAA,EAAA,CAAA,EACpBH,EAASI,MAAQ,IACjBJ,EAASK,OAAS,IAClBL,EAASM,MAAQ"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{SortAscending as n,SortDescending as t,Sort as e}from"@vibe/icons";function c(n){return"number"==typeof n?"".concat(n,"px"):"string"==typeof n?/%|px|fr$/.test(n)?n:"".concat(n,"px"):(null==n?void 0:n.min)&&(null==n?void 0:n.max)?"minmax(".concat(c(n.min),", ").concat(c(n.max),")"):"minmax(112px, 1fr)"}function i(n){return Object.assign(Object.assign({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{display:"grid",gridTemplateColumns:n.map((function(n){return c(n.width)})).join(" ")})}function r(c){return"asc"===c?n:"desc"===c?t:e}function o(n){return"asc"===n?"desc":"desc"===n?"none":"asc"}function u(n){return"asc"===n?"ascending":"desc"===n?"descending":"none"}function a(n){return"circle"===n?"circle":"rectangle"===n?"rectangle":"text"}function s(n,t){return"long-text"===n?["long-text","medium-text"][t%2]:n}export{c as generateWidth,u as getAriaSort,s as getLoadingTypeForCell,o as getNextSortState,a as getSkeletonType,r as getSortIcon,i as getTableRowLayoutStyles};
|
|
2
|
-
//# sourceMappingURL=tableHelpers.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tableHelpers.js","sources":["../../../../../../src/components/Table/Table/tableHelpers.ts"],"sourcesContent":["import { type AriaAttributes } from \"react\";\nimport type React from \"react\";\nimport { type TableColumn, type TableLoadingStateType } from \"./Table\";\nimport { Sort } from \"@vibe/icons\";\nimport { type TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport { SortAscending, SortDescending } from \"@vibe/icons\";\nimport { type SkeletonType } from \"@vibe/skeleton\";\nexport function generateWidth(width: TableColumn[\"width\"]): string {\n if (typeof width === \"number\") {\n return `${width}px`;\n } else if (typeof width === \"string\") {\n return /%|px|fr$/.test(width) ? width : `${width}px`;\n } else if (width?.min && width?.max) {\n return `minmax(${generateWidth(width.min)}, ${generateWidth(width.max)})`;\n } else {\n return \"minmax(112px, 1fr)\";\n }\n}\n\nexport function getTableRowLayoutStyles(columns: TableColumn[], style: React.CSSProperties = {}): React.CSSProperties {\n return {\n ...style,\n display: \"grid\",\n gridTemplateColumns: columns.map(cell => generateWidth(cell.width)).join(\" \")\n };\n}\n\nexport function getSortIcon(sortState: TableHeaderCellProps[\"sortState\"]) {\n if (sortState === \"asc\") {\n return SortAscending;\n } else if (sortState === \"desc\") {\n return SortDescending;\n } else {\n return Sort;\n }\n}\n\nexport function getNextSortState(sortState: TableHeaderCellProps[\"sortState\"]): TableHeaderCellProps[\"sortState\"] {\n if (sortState === \"asc\") {\n return \"desc\";\n } else if (sortState === \"desc\") {\n return \"none\";\n } else {\n return \"asc\";\n }\n}\n\nexport function getAriaSort(sortState: TableHeaderCellProps[\"sortState\"]): AriaAttributes[\"aria-sort\"] {\n if (sortState === \"asc\") {\n return \"ascending\";\n }\n if (sortState === \"desc\") {\n return \"descending\";\n }\n return \"none\";\n}\n\nexport function getSkeletonType(loadingStateType: TableLoadingStateType): SkeletonType {\n if (loadingStateType === \"circle\") {\n return \"circle\";\n }\n if (loadingStateType === \"rectangle\") {\n return \"rectangle\";\n }\n return \"text\";\n}\n\nexport function getLoadingTypeForCell(\n loadingStateType: TableLoadingStateType,\n rowIndex: number\n): TableLoadingStateType {\n return loadingStateType === \"long-text\"\n ? ([\"long-text\", \"medium-text\"] as TableLoadingStateType[])[rowIndex % 2]\n : loadingStateType;\n}\n"],"names":["generateWidth","width","concat","test","min","max","getTableRowLayoutStyles","columns","Object","assign","display","gridTemplateColumns","map","cell","join","getSortIcon","sortState","SortAscending","SortDescending","Sort","getNextSortState","getAriaSort","getSkeletonType","loadingStateType","getLoadingTypeForCell","rowIndex"],"mappings":"0EAOM,SAAUA,EAAcC,GAC5B,MAAqB,iBAAVA,EACTC,GAAAA,OAAUD,EAAK,MACW,iBAAVA,EACT,WAAWE,KAAKF,GAASA,EAAKC,GAAAA,OAAMD,EAAS,OAC3CA,aAAA,EAAAA,EAAOG,OAAOH,aAAA,EAAAA,EAAOI,KAC9B,UAAAH,OAAiBF,EAAcC,EAAMG,KAAIF,MAAAA,OAAKF,EAAcC,EAAMI,KAAI,KAE/D,oBAEX,UAEgBC,EAAwBC,GACtC,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,yDAD2F,CAAA,GAEjF,CACRC,QAAS,OACTC,oBAAqBJ,EAAQK,KAAI,SAAAC,GAAI,OAAIb,EAAca,EAAKZ,UAAQa,KAAK,MAE7E,CAEM,SAAUC,EAAYC,GAC1B,MAAkB,QAAdA,EACKC,EACgB,SAAdD,EACFE,EAEAC,CAEX,CAEM,SAAUC,EAAiBJ,GAC/B,MAAkB,QAAdA,EACK,OACgB,SAAdA,EACF,OAEA,KAEX,CAEM,SAAUK,EAAYL,GAC1B,MAAkB,QAAdA,EACK,YAES,SAAdA,EACK,aAEF,MACT,CAEM,SAAUM,EAAgBC,GAC9B,MAAyB,WAArBA,EACK,SAEgB,cAArBA,EACK,YAEF,MACT,CAEgB,SAAAC,EACdD,EACAE,GAEA,MAA4B,cAArBF,EACF,CAAC,YAAa,eAA2CE,EAAW,GACrEF,CACN"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{toConsumableArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as r}from"react";import a from"classnames";import o from"../TableRow/TableRow.js";import s from"./TableBody.module.scss.js";import{useTable as l}from"../context/TableContext/TableContext.js";import m from"../TableCellSkeleton/TableCellSkeleton.js";import{SKELETON_ROWS_AMOUNT as n}from"../Table/TableConsts.js";import{getLoadingTypeForCell as i}from"../Table/tableHelpers.js";import{getTestId as p}from"../../../tests/testIds.js";import{ComponentDefaultTestId as c}from"../../../tests/constants.js";var d=r((function(r,d){var f=r.id,b=r.className,u=r["data-testid"],T=r.children,y=l(),j=y.emptyState,C=y.errorState,S=y.columns,g=y.dataState||{},v=g.isLoading,A=g.isError,B=e(Array(n)).map((function(e,r){return t.createElement(o,{key:r},S.map((function(e,a){var o=e.loadingStateType;return t.createElement(m,{key:"".concat(r,"-").concat(a),type:i(o,r)})})))}));return t.createElement("div",{ref:d,id:f,className:a(s.tableBody,b),"data-testid":u||p(c.TABLE_BODY,f),role:"rowgroup"},v?B:A?C:!T||Array.isArray(T)&&0===T.length?j:T)}));export{d as default};
|
|
2
|
-
//# sourceMappingURL=TableBody.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.js","sources":["../../../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React, { type ReactElement, type ComponentProps, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport TableRow, { type TableRowProps } from \"../TableRow/TableRow\";\nimport type { VirtualizedList } from \"@vibe/virtualized-list\";\nimport styles from \"./TableBody.module.scss\";\nimport { useTable } from \"../context/TableContext/TableContext\";\nimport TableCellSkeleton from \"../TableCellSkeleton/TableCellSkeleton\";\nimport { SKELETON_ROWS_AMOUNT } from \"../Table/TableConsts\";\nimport { getLoadingTypeForCell } from \"../Table/tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableBodyProps extends VibeComponentProps {\n /**\n * The child components inside the table body, such as `<TableRow />` elements.\n */\n children?:\n | ReactElement<TableRowProps>\n | ReactElement<TableRowProps>[]\n | ReactElement<ComponentProps<typeof VirtualizedList>>;\n}\n\nconst TableBody = forwardRef(\n ({ id, className, \"data-testid\": dataTestId, children }: TableBodyProps, ref: React.ForwardedRef<HTMLDivElement>) => {\n const { dataState, emptyState, errorState, columns } = useTable();\n const { isLoading, isError } = dataState || {};\n\n const skeletonRender = [...new Array(SKELETON_ROWS_AMOUNT)].map((_, rowIndex) => (\n <TableRow key={rowIndex}>\n {columns.map(({ loadingStateType }, columnIndex) => (\n <TableCellSkeleton\n key={`${rowIndex}-${columnIndex}`}\n type={getLoadingTypeForCell(loadingStateType, rowIndex)}\n />\n ))}\n </TableRow>\n ));\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableBody, className)}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_BODY, id)}\n role=\"rowgroup\"\n >\n {isLoading\n ? skeletonRender\n : isError\n ? errorState\n : !children || (Array.isArray(children) && children.length === 0)\n ? emptyState\n : children}\n </div>\n );\n }\n);\n\nexport default TableBody;\n"],"names":["TableBody","forwardRef","_ref","ref","id","className","dataTestId","children","_useTable","useTable","emptyState","errorState","columns","_ref2","dataState","isLoading","isError","skeletonRender","_toConsumableArray","Array","SKELETON_ROWS_AMOUNT","map","_","rowIndex","React","TableRow","key","_ref3","columnIndex","loadingStateType","createElement","TableCellSkeleton","concat","type","getLoadingTypeForCell","cx","styles","tableBody","getTestId","ComponentDefaultTestId","TABLE_BODY","role","isArray","length"],"mappings":"8lBAuBMA,IAAAA,EAAYC,GAChB,SAAAC,EAAyEC,GAA2C,IAAjHC,EAAEF,EAAFE,GAAIC,EAASH,EAATG,UAA0BC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SAC3CC,EAAuDC,IAApCC,EAAUF,EAAVE,WAAYC,EAAUH,EAAVG,WAAYC,EAAOJ,EAAPI,QAC3CC,EADiBL,EAATM,WACoC,CAAE,EAAtCC,EAASF,EAATE,UAAWC,EAAOH,EAAPG,QAEbC,EAAiBC,EAAQC,MAAMC,IAAuBC,KAAI,SAACC,EAAGC,GAAQ,OAC1EC,gBAACC,EAAQ,CAACC,IAAKH,GACZX,EAAQS,KAAI,SAAAM,EAAuBC,GAAW,IAA/BC,EAAgBF,EAAhBE,iBAAgB,OAC9BL,EAACM,cAAAC,EACC,CAAAL,IAAG,GAAAM,OAAKT,OAAQS,OAAIJ,GACpBK,KAAMC,EAAsBL,EAAkBN,IAEjD,IACQ,IAGb,OACEC,EACEM,cAAA,MAAA,CAAA3B,IAAKA,EACLC,GAAIA,EACJC,UAAW8B,EAAGC,EAAOC,UAAWhC,iBACnBC,GAAcgC,EAAUC,EAAuBC,WAAYpC,GACxEqC,KAAK,YAEJ1B,EACGE,EACAD,EACAL,GACCJ,GAAaY,MAAMuB,QAAQnC,IAAiC,IAApBA,EAASoC,OAClDjC,EACAH,EAGV"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableBody:"tableBody"};!function(e){const t="s_id-afed3a5f5737_4_5_27";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableBody {\n height: 100%;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableBody.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{typeof as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import r,{forwardRef as s}from"react";import{Text as a}from"@vibe/typography/mockedClassNames";import o from"./TableCell.module.scss.js";import l from"classnames";import{getTestId as i}from"../../../tests/testIds.js";import{ComponentDefaultTestId as m}from"../../../tests/constants.js";var c=s((function(s,c){var n=s.sticky,p=s.id,d=s.className,f=s["data-testid"],u=s.children,y=1===r.Children.count(u),C=e(r.Children.toArray(u)[0]),b="string"===C||"number"===C;return r.createElement("div",{ref:c,id:p,className:l(o.tableCell,t({},o.sticky,n),d),"data-testid":f||i(m.TABLE_CELL,p),role:"cell"},y&&b?r.createElement(a,{type:"text2",color:"primary"},u):u)}));export{c as default};
|
|
2
|
-
//# sourceMappingURL=TableCell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableCell.js","sources":["../../../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport { Text } from \"@vibe/typography\";\nimport styles from \"./TableCell.module.scss\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableCellProps extends VibeComponentProps {\n /**\n * The content inside the table cell.\n */\n children?: React.ReactNode;\n /**\n * If true, makes the cell sticky (typically used for frozen columns).\n */\n sticky?: boolean;\n}\n\nconst TableCell = forwardRef(\n (\n { sticky, id, className, \"data-testid\": dataTestId, children }: TableCellProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const isSingleChild = React.Children.count(children) === 1;\n const typeOfFirstChild = typeof React.Children.toArray(children)[0];\n const isFirstChildString = typeOfFirstChild === \"string\" || typeOfFirstChild === \"number\";\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableCell, { [styles.sticky]: sticky }, className)}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_CELL, id)}\n role=\"cell\"\n >\n {isSingleChild && isFirstChildString ? (\n <Text type=\"text2\" color=\"primary\">\n {children}\n </Text>\n ) : (\n children\n )}\n </div>\n );\n }\n);\n\nexport default TableCell;\n"],"names":["TableCell","forwardRef","_ref","ref","sticky","id","className","dataTestId","children","isSingleChild","React","Children","count","typeOfFirstChild","_typeof","toArray","isFirstChildString","createElement","cx","styles","tableCell","_defineProperty","getTestId","ComponentDefaultTestId","TABLE_CELL","role","Text","type","color"],"mappings":"6XAmBMA,IAAAA,EAAYC,GAChB,SAAAC,EAEEC,GACE,IAFAC,EAAMF,EAANE,OAAQC,EAAEH,EAAFG,GAAIC,EAASJ,EAATI,UAA0BC,EAAUL,EAAzB,eAA2BM,EAAQN,EAARM,SAG9CC,EAAmD,IAAnCC,EAAMC,SAASC,MAAMJ,GACrCK,EAAgBC,EAAUJ,EAAMC,SAASI,QAAQP,GAAU,IAC3DQ,EAA0C,WAArBH,GAAsD,WAArBA,EAE5D,OACEH,EAAAO,cAAA,MAAA,CACEd,IAAKA,EACLE,GAAIA,EACJC,UAAWY,EAAGC,EAAOC,UAASC,EAAKF,GAAAA,EAAOf,OAASA,GAAUE,GAChD,cAAAC,GAAce,EAAUC,EAAuBC,WAAYnB,GACxEoB,KAAK,QAEJhB,GAAiBO,EAChBN,EAAAO,cAACS,EAAK,CAAAC,KAAK,QAAQC,MAAM,WACtBpB,GAGHA,EAIR"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableCell:"tableCell",sticky:"sticky"};!function(e){const t="s_id-391f4300ac17_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableCell {\n padding: 9px 16px;\n overflow: hidden;\n display: flex;\n align-items: center;\n}\n.tableCell.sticky {\n z-index: 1;\n position: sticky;\n inset-inline-start: 0;\n box-shadow: var(--sticky-cell-box-shadow);\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableCell.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import l from"react";import t from"classnames";import r from"../TableCell/TableCell.js";import{Skeleton as o}from"@vibe/skeleton/mockedClassNames";import a from"./TableCellSkeleton.module.scss.js";import{getStyle as m}from"@vibe/shared";import{getSkeletonType as s}from"../Table/tableHelpers.js";import{camelCase as i}from"es-toolkit";var p=function(p){var n=p.type,f=void 0===n?"long-text":n,u=["long-text","medium-text"].includes(f);return l.createElement(r,null,l.createElement(o,{type:s(f),wrapperClassName:t(a.tableCellSkeletonWrapper,m(a,i(f))),className:t(a.tableCellSkeleton,e({},m(a,i(f)),!u)),fullWidth:!0}))};export{p as default};
|
|
2
|
-
//# sourceMappingURL=TableCellSkeleton.js.map
|
package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableCellSkeleton.js","sources":["../../../../../../src/components/Table/TableCellSkeleton/TableCellSkeleton.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport TableCell from \"../TableCell/TableCell\";\nimport { Skeleton } from \"@vibe/skeleton\";\nimport styles from \"./TableCellSkeleton.module.scss\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport { getStyle } from \"@vibe/shared\";\nimport { type TableLoadingStateType } from \"../Table/Table\";\nimport { getSkeletonType } from \"../Table/tableHelpers\";\nimport { camelCase } from \"es-toolkit\";\n\nexport interface TableCellSkeletonProps extends VibeComponentProps {\n /**\n * The type of loading state for the skeleton.\n */\n type?: TableLoadingStateType;\n /**\n * If true, renders a shorter skeleton for text-based loading states.\n */\n short?: boolean;\n}\n\nconst TableCellSkeleton: React.FC<TableCellSkeletonProps> = ({ type = \"long-text\" }) => {\n const isText = [\"long-text\", \"medium-text\"].includes(type);\n return (\n <TableCell>\n <Skeleton\n type={getSkeletonType(type)}\n wrapperClassName={cx(styles.tableCellSkeletonWrapper, getStyle(styles, camelCase(type)))}\n className={cx(styles.tableCellSkeleton, { [getStyle(styles, camelCase(type))]: !isText })}\n fullWidth\n />\n </TableCell>\n );\n};\n\nexport default TableCellSkeleton;\n"],"names":["TableCellSkeleton","_ref","_ref$type","type","isText","includes","React","TableCell","createElement","Skeleton","getSkeletonType","wrapperClassName","cx","styles","tableCellSkeletonWrapper","getStyle","camelCase","className","tableCellSkeleton","_defineProperty","fullWidth"],"mappings":"kaAsBA,IAAMA,EAAsD,SAArCC,GAAgE,IAAAC,EAAAD,EAAxBE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EACzEE,EAAS,CAAC,YAAa,eAAeC,SAASF,GACrD,OACEG,gBAACC,EAAS,KACRD,EAACE,cAAAC,EACC,CAAAN,KAAMO,EAAgBP,GACtBQ,iBAAkBC,EAAGC,EAAOC,yBAA0BC,EAASF,EAAQG,EAAUb,KACjFc,UAAWL,EAAGC,EAAOK,kBAAiBC,EAAA,CAAA,EAAKJ,EAASF,EAAQG,EAAUb,KAAUC,IAChFgB,WAAS,IAIjB"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableCellSkeletonWrapper:"tableCellSkeletonWrapper",longText:"longText",mediumText:"mediumText",tableCellSkeleton:"tableCellSkeleton",circle:"circle",rectangle:"rectangle"};!function(e){const l="s_id-b9f641959683_4_5_27";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+l))return;const n=document.createElement("style");n.id=l,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[l]=e)}(".tableCellSkeletonWrapper {\n height: 100%;\n}\n.tableCellSkeletonWrapper.longText {\n padding-inline-end: var(--space-24);\n}\n.tableCellSkeletonWrapper.mediumText {\n padding-inline-end: var(--space-64);\n}\n.tableCellSkeletonWrapper .tableCellSkeleton {\n height: 100%;\n}\n.tableCellSkeletonWrapper .tableCellSkeleton.circle, .tableCellSkeletonWrapper .tableCellSkeleton.rectangle {\n width: auto;\n aspect-ratio: 1/1;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableCellSkeleton.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import e,{forwardRef as t,useRef as a}from"react";import{TableContainerProvider as r}from"../context/TableContainerContext/TableContainerContext.js";import{getTestId as s}from"../../../tests/testIds.js";import{ComponentDefaultTestId as n}from"../../../tests/constants.js";import o from"classnames";import m from"./TableContainer.module.scss.js";var i=t((function(t,i){var l=t.id,c=t.className,d=t["data-testid"],f=t.style,C=t.children,u=a(null);return e.createElement(r,{value:{menuContainerRef:u}},e.createElement("div",{ref:i,id:l,className:o(m.tableContainer,c),"data-testid":d||s(n.TABLE_CONTAINER,l),style:f},e.createElement("div",{ref:u,className:m.menuContainer}),C))}));export{i as default};
|
|
2
|
-
//# sourceMappingURL=TableContainer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableContainer.js","sources":["../../../../../../src/components/Table/TableContainer/TableContainer.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport { TableContainerProvider } from \"../context/TableContainerContext/TableContainerContext\";\nimport { type TableContainerProps } from \"./TableContainer.types\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport cx from \"classnames\";\nimport styles from \"./TableContainer.module.scss\";\n\nconst TableContainer = forwardRef(\n (\n { id, className, \"data-testid\": dataTestId, style, children }: TableContainerProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const menuContainerRef = useRef<HTMLDivElement>(null);\n\n return (\n <TableContainerProvider value={{ menuContainerRef }}>\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableContainer, className)}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_CONTAINER, id)}\n style={style}\n >\n <div ref={menuContainerRef} className={styles.menuContainer} />\n {children}\n </div>\n </TableContainerProvider>\n );\n }\n);\n\nexport default TableContainer;\n"],"names":["TableContainer","forwardRef","_ref","ref","id","className","dataTestId","style","children","menuContainerRef","useRef","React","TableContainerProvider","value","createElement","cx","styles","tableContainer","getTestId","ComponentDefaultTestId","TABLE_CONTAINER","menuContainer"],"mappings":"yVAQMA,IAAAA,EAAiBC,GACrB,SAAAC,EAEEC,GACE,IAFAC,EAAEF,EAAFE,GAAIC,EAASH,EAATG,UAA0BC,EAAUJ,EAAzB,eAA2BK,EAAKL,EAALK,MAAOC,EAAQN,EAARM,SAG7CC,EAAmBC,EAAuB,MAEhD,OACEC,gBAACC,EAAsB,CAACC,MAAO,CAAEJ,iBAAAA,IAC/BE,EAAAG,cAAA,MAAA,CACEX,IAAKA,EACLC,GAAIA,EACJC,UAAWU,EAAGC,EAAOC,eAAgBZ,GACxB,cAAAC,GAAcY,EAAUC,EAAuBC,gBAAiBhB,GAC7EG,MAAOA,GAEPI,EAAKG,cAAA,MAAA,CAAAX,IAAKM,EAAkBJ,UAAWW,EAAOK,gBAC7Cb,GAIT"}
|
package/dist/mocked_classnames/src/components/Table/TableContainer/TableContainer.module.scss.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableContainer:"tableContainer",menuContainer:"menuContainer"};!function(e){const n="s_id-a0ba3cbb8774_4_5_27";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".tableContainer {\n width: 100%;\n height: 100%;\n position: relative;\n}\n.tableContainer .menuContainer {\n --cell-width: 40px;\n position: absolute;\n overflow: hidden;\n inset-inline-start: calc(1px - var(--cell-width));\n width: var(--cell-width);\n height: 100%;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableContainer.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import r,{forwardRef as t}from"react";import o from"./TableHeader.module.scss.js";import a from"classnames";import{getTestId as s}from"../../../tests/testIds.js";import{ComponentDefaultTestId as i}from"../../../tests/constants.js";import{useTable as l}from"../context/TableContext/TableContext.js";import{useMergeRef as m}from"@vibe/shared";var d=t((function(t,d){var n=t.id,f=t.className,p=t["data-testid"],c=t.children,u=l(),b=u.onHeadScroll,v=u.isVirtualized,j=m(u.headRef,d);return r.createElement("div",{ref:j,id:n,className:a(o.tableHeader,e({},o.virtualized,v),f),"data-testid":p||s(i.TABLE_HEADER,n),role:"rowgroup",onScroll:b},c)}));export{d as default};
|
|
2
|
-
//# sourceMappingURL=TableHeader.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableHeader.js","sources":["../../../../../../src/components/Table/TableHeader/TableHeader.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport styles from \"./TableHeader.module.scss\";\nimport { type TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { useTable } from \"../context/TableContext/TableContext\";\nimport { useMergeRef } from \"@vibe/shared\";\n\nexport interface TableHeaderProps extends VibeComponentProps {\n /**\n * The child elements inside the table header, typically `<TableHeaderCell />` components.\n */\n children?: React.ReactElement<TableHeaderCellProps> | React.ReactElement<TableHeaderCellProps>[];\n}\n\nconst TableHeader = forwardRef(\n (\n { id, className, \"data-testid\": dataTestId, children }: TableHeaderProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const { headRef, onHeadScroll, isVirtualized } = useTable();\n const mergedRef = useMergeRef(headRef, ref);\n\n return (\n <div\n ref={mergedRef}\n id={id}\n className={cx(styles.tableHeader, { [styles.virtualized]: isVirtualized }, className)}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_HEADER, id)}\n role=\"rowgroup\"\n onScroll={onHeadScroll}\n >\n {children}\n </div>\n );\n }\n);\n\nexport default TableHeader;\n"],"names":["TableHeader","forwardRef","_ref","ref","id","className","dataTestId","children","_useTable","useTable","onHeadScroll","isVirtualized","mergedRef","useMergeRef","headRef","React","createElement","cx","styles","tableHeader","_defineProperty","virtualized","getTestId","ComponentDefaultTestId","TABLE_HEADER","role","onScroll"],"mappings":"waAiBMA,IAAAA,EAAcC,GAClB,SAAAC,EAEEC,GACE,IAFAC,EAAEF,EAAFE,GAAIC,EAASH,EAATG,UAA0BC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SAG5CC,EAAiDC,IAAhCC,EAAYF,EAAZE,aAAcC,EAAaH,EAAbG,cACzBC,EAAYC,EADHL,EAAPM,QAC+BX,GAEvC,OACEY,EACEC,cAAA,MAAA,CAAAb,IAAKS,EACLR,GAAIA,EACJC,UAAWY,EAAGC,EAAOC,YAAWC,EAAKF,GAAAA,EAAOG,YAAcV,GAAiBN,GAAU,cACxEC,GAAcgB,EAAUC,EAAuBC,aAAcpB,GAC1EqB,KAAK,WACLC,SAAUhB,GAETH,EAGP"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableHeader:"tableHeader",virtualized:"virtualized"};!function(e){const t="s_id-8e924ee64aa4_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableHeader {\n display: grid;\n grid-template-columns: var(--table-grid-template-columns);\n position: sticky;\n top: 0;\n z-index: 2;\n background-color: var(--primary-background-color);\n min-width: 100%;\n width: fit-content;\n}\n.tableHeader > [role=columnheader] {\n background-color: inherit;\n}\n.tableHeader.virtualized {\n overflow: auto;\n width: auto;\n scrollbar-width: none;\n}\n.tableHeader.virtualized::-webkit-scrollbar {\n display: none;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableHeader.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as r,useState as a}from"react";import i from"classnames";import n from"./TableHeaderCell.module.scss.js";import{Icon as s}from"@vibe/icon/mockedClassNames";import{IconButton as l}from"@vibe/icon-button/mockedClassNames";import{Info as m}from"@vibe/icons";import{Text as c}from"@vibe/typography/mockedClassNames";import{Flex as d}from"@vibe/layout/mockedClassNames";import{getSortIcon as p,getNextSortState as f,getAriaSort as u}from"../Table/tableHelpers.js";import{Tooltip as b}from"@vibe/tooltip/mockedClassNames";import{getTestId as v}from"../../../tests/testIds.js";import{ComponentDefaultTestId as C}from"../../../tests/constants.js";import{getStyle as E}from"@vibe/shared";var N=r((function(r,N){var y=r.id,k=r.className,g=r["data-testid"],H=r.title,h=r.onSortClicked,j=r.infoContent,x=r.icon,A=r.sortState,L=void 0===A?"none":A,T=r.sortButtonAriaLabel,w=void 0===T?"Sort":T,B=r.sticky,S=a(!1),_=e(S,2),I=_[0],M=_[1],P=u(L),z="none"!==P||I;return o.createElement("div",{ref:N,id:y,className:i(n.tableHeaderCell,t(t({},n.sortActive,h&&"none"!==P),n.sticky,B),k),"data-testid":g||v(C.TABLE_HEADER_CELL,y),role:"columnheader",onMouseOver:function(){return M(!0)},onMouseLeave:function(){return M(!1)},onFocus:function(){return M(!0)},onBlur:function(){return M(!1)},"aria-sort":h?P:void 0,tabIndex:h?0:void 0},o.createElement(d,{direction:"row",align:"center",className:n.tableHeaderCellContent,gap:"xs"},x&&o.createElement(s,{icon:x,className:n.icon}),"string"==typeof H?o.createElement(c,{type:"text2",weight:"medium",color:"secondary"},H):H,j&&o.createElement(b,{content:j,referenceWrapperClassName:n.infoTooltip},o.createElement(s,{icon:m,label:j}))),h&&o.createElement(d,{direction:"row",align:"center",className:n.tableHeaderCellSort},o.createElement(l,{icon:p(L),kind:"tertiary",size:"xs","aria-label":w,"aria-hidden":!z,className:i(n.sort,E(n,L),t({},n.show,z)),onClick:function(){return h(f(L))}})))}));export{N as default};
|
|
2
|
-
//# sourceMappingURL=TableHeaderCell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableHeaderCell.js","sources":["../../../../../../src/components/Table/TableHeaderCell/TableHeaderCell.tsx"],"sourcesContent":["import React, { forwardRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport styles from \"./TableHeaderCell.module.scss\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { Info } from \"@vibe/icons\";\nimport { Text } from \"@vibe/typography\";\nimport { Flex } from \"@vibe/layout\";\nimport { getAriaSort, getNextSortState, getSortIcon } from \"../Table/tableHelpers\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getStyle } from \"@vibe/shared\";\n\nexport interface TableHeaderCellProps extends VibeComponentProps {\n /**\n * The title of the column, displayed inside the header cell.\n */\n title: string | React.ReactNode;\n /**\n * Icon displayed next to the column title.\n */\n icon?: SubIcon;\n /**\n * Tooltip content for additional information about the column.\n */\n infoContent?: string;\n /**\n * Current sorting state of the column.\n */\n sortState?: \"asc\" | \"desc\" | \"none\";\n /**\n * Callback fired when the column header is clicked to change sorting.\n */\n onSortClicked?: (direction: \"asc\" | \"desc\" | \"none\") => void;\n /**\n * ARIA label for the sort button.\n */\n sortButtonAriaLabel?: string;\n /**\n * If true, the header cell remains visible while scrolling horizontally.\n */\n sticky?: boolean;\n}\n\nconst TableHeaderCell = forwardRef(\n (\n {\n id,\n className,\n \"data-testid\": dataTestId,\n title,\n onSortClicked,\n infoContent,\n icon,\n sortState = \"none\",\n sortButtonAriaLabel = \"Sort\",\n sticky\n }: TableHeaderCellProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [isHovered, setIsHovered] = useState<boolean>(false);\n const ariaSort = getAriaSort(sortState);\n const isSortActive = onSortClicked && ariaSort !== \"none\";\n const shouldShowSortIcon = ariaSort !== \"none\" || isHovered;\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(\n styles.tableHeaderCell,\n { [styles.sortActive]: isSortActive, [styles.sticky]: sticky },\n className\n )}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_HEADER_CELL, id)}\n role=\"columnheader\"\n onMouseOver={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n onFocus={() => setIsHovered(true)}\n onBlur={() => setIsHovered(false)}\n aria-sort={onSortClicked ? ariaSort : undefined}\n tabIndex={onSortClicked ? 0 : undefined}\n >\n <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellContent} gap=\"xs\">\n {icon && <Icon icon={icon} className={styles.icon} />}\n {typeof title === \"string\" ? (\n <Text type=\"text2\" weight=\"medium\" color=\"secondary\">\n {title}\n </Text>\n ) : (\n title\n )}\n {infoContent && (\n <Tooltip content={infoContent} referenceWrapperClassName={styles.infoTooltip}>\n <Icon icon={Info} label={infoContent} />\n </Tooltip>\n )}\n </Flex>\n {onSortClicked && (\n <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellSort}>\n <IconButton\n icon={getSortIcon(sortState)}\n kind=\"tertiary\"\n size=\"xs\"\n aria-label={sortButtonAriaLabel}\n aria-hidden={!shouldShowSortIcon}\n className={cx(styles.sort, getStyle(styles, sortState), {\n [styles.show]: shouldShowSortIcon\n })}\n onClick={() => onSortClicked(getNextSortState(sortState))}\n />\n </Flex>\n )}\n </div>\n );\n }\n);\n\nexport default TableHeaderCell;\n"],"names":["TableHeaderCell","forwardRef","_ref","ref","id","className","dataTestId","title","onSortClicked","infoContent","icon","_ref$sortState","sortState","_ref$sortButtonAriaLa","sortButtonAriaLabel","sticky","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","ariaSort","getAriaSort","shouldShowSortIcon","React","createElement","cx","styles","tableHeaderCell","_defineProperty","sortActive","getTestId","ComponentDefaultTestId","TABLE_HEADER_CELL","role","onMouseOver","onMouseLeave","onFocus","onBlur","undefined","tabIndex","Flex","direction","align","tableHeaderCellContent","gap","Icon","Text","type","weight","color","Tooltip","content","referenceWrapperClassName","infoTooltip","Info","label","tableHeaderCellSort","IconButton","getSortIcon","kind","size","sort","getStyle","show","onClick","getNextSortState"],"mappings":"kyBA8CMA,IAAAA,EAAkBC,GACtB,SAAAC,EAaEC,GACE,IAZAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAKL,EAALK,MACAC,EAAaN,EAAbM,cACAC,EAAWP,EAAXO,YACAC,EAAIR,EAAJQ,KAAIC,EAAAT,EACJU,UAAAA,OAAY,IAAHD,EAAG,OAAMA,EAAAE,EAAAX,EAClBY,oBAAAA,OAAsB,IAAHD,EAAG,OAAMA,EAC5BE,EAAMb,EAANa,OAIFC,EAAkCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAAnDI,EAASF,EAAA,GAAEG,EAAYH,EAAA,GACxBI,EAAWC,EAAYX,GAEvBY,EAAkC,SAAbF,GAAuBF,EAElD,OACEK,EACEC,cAAA,MAAA,CAAAvB,IAAKA,EACLC,GAAIA,EACJC,UAAWsB,EACTC,EAAOC,gBAAeC,EAAAA,EACnBF,CAAAA,EAAAA,EAAOG,WATKvB,GAA8B,SAAbc,GASMM,EAAOb,OAASA,GACtDV,GAEW,cAAAC,GAAc0B,EAAUC,EAAuBC,kBAAmB9B,GAC/E+B,KAAK,eACLC,YAAa,WAAA,OAAMf,GAAa,EAAK,EACrCgB,aAAc,WAAA,OAAMhB,GAAa,EAAM,EACvCiB,QAAS,WAAA,OAAMjB,GAAa,EAAK,EACjCkB,OAAQ,WAAA,OAAMlB,GAAa,EAAM,EACtB,YAAAb,EAAgBc,OAAWkB,EACtCC,SAAUjC,EAAgB,OAAIgC,GAE9Bf,EAAAC,cAACgB,EAAK,CAAAC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAOiB,uBAAwBC,IAAI,MAChFpC,GAAQe,EAAAC,cAACqB,EAAI,CAACrC,KAAMA,EAAML,UAAWuB,EAAOlB,OAC3B,iBAAVH,EACNkB,EAAAC,cAACsB,EAAI,CAACC,KAAK,QAAQC,OAAO,SAASC,MAAM,aACtC5C,GAGHA,EAEDE,GACCgB,EAACC,cAAA0B,EAAQ,CAAAC,QAAS5C,EAAa6C,0BAA2B1B,EAAO2B,aAC/D9B,EAAAC,cAACqB,EAAI,CAACrC,KAAM8C,EAAMC,MAAOhD,MAI9BD,GACCiB,EAAAC,cAACgB,EAAI,CAACC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAO8B,qBACrDjC,EAAAC,cAACiC,EACC,CAAAjD,KAAMkD,EAAYhD,GAClBiD,KAAK,WACLC,KAAK,KACO,aAAAhD,EACC,eAACU,EACdnB,UAAWsB,EAAGC,EAAOmC,KAAMC,EAASpC,EAAQhB,GAAUkB,EACnDF,CAAAA,EAAAA,EAAOqC,KAAOzC,IAEjB0C,QAAS,WAAA,OAAM1D,EAAc2D,EAAiBvD,GAAW,KAMrE"}
|
package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableHeaderCell:"tableHeaderCell","focus-visible":"focus-visible",sticky:"sticky",sortActive:"sortActive",tableHeaderCellContent:"tableHeaderCellContent",icon:"icon",infoTooltip:"infoTooltip",tableHeaderCellSort:"tableHeaderCellSort",sort:"sort",asc:"asc",desc:"desc",show:"show"};!function(e){const l="s_id-0fa2e97aa7c9_4_5_27";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+l))return;const t=document.createElement("style");t.id=l,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[l]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.tableHeaderCell {\n height: var(--table-row-size);\n padding: var(--space-8);\n padding-inline-start: var(--space-16);\n color: var(--secondary-text-color);\n box-sizing: border-box;\n text-align: initial;\n border-bottom: 1px solid var(--layout-border-color);\n display: flex;\n justify-content: space-between;\n background-color: inherit;\n}\n.tableHeaderCell:focus-visible, .tableHeaderCell.focus-visible {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.tableHeaderCell:focus:not(.focus-visible) {\n outline: none;\n}\n.tableHeaderCell.sticky {\n z-index: 1;\n position: sticky;\n inset-inline-start: 0;\n box-shadow: var(--sticky-cell-box-shadow);\n}\n.tableHeaderCell.sticky:hover {\n background: var(--sticky-cell-hover-background);\n}\n.tableHeaderCell:hover, .tableHeaderCell.sortActive {\n background-color: var(--primary-background-hover-color);\n}\n.tableHeaderCell .tableHeaderCellContent {\n min-width: 0;\n}\n.tableHeaderCell .tableHeaderCellContent .icon {\n min-width: var(--space-16);\n}\n.tableHeaderCell .tableHeaderCellContent .infoTooltip {\n display: inline-flex;\n}\n.tableHeaderCell .tableHeaderCellSort {\n padding-inline-start: var(--space-8);\n}\n.tableHeaderCell .tableHeaderCellSort .sort {\n color: var(--icon-color);\n transition: opacity 0.1s;\n}\n.tableHeaderCell .tableHeaderCellSort .sort.asc, .tableHeaderCell .tableHeaderCellSort .sort.desc {\n color: var(--primary-text-color);\n}\n.tableHeaderCell .tableHeaderCellSort .sort:not(.show) {\n opacity: 0;\n pointer-events: none;\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableHeaderCell.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import e,{forwardRef as t,useRef as o,useCallback as s}from"react";import{useMergeRef as r}from"@vibe/shared";import{getTestId as a}from"../../../tests/testIds.js";import{ComponentDefaultTestId as n}from"../../../tests/constants.js";import i from"classnames";import m from"./TableRow.module.scss.js";import{useTableRowMenu as l}from"../context/TableRowMenuContext/TableRowMenuContext.js";var d=t((function(t,d){var c=t.highlighted,u=t.children,f=t.style,p=t.id,v=t.className,w=t["data-testid"],R=o(null),b=r(R,d),M=l(),h=M.onMouseOverRow,x=M.onMouseLeaveRow,j=s((function(){h(R)}),[h]);return e.createElement("div",{id:p,"data-testid":w||a(n.TABLE_ROW,p),ref:b,role:"row","aria-selected":c||!1,className:i(m.tableRow,v),style:f,onMouseEnter:j,onMouseLeave:x,tabIndex:-1},u)}));export{d as default};
|
|
2
|
-
//# sourceMappingURL=TableRow.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableRow.js","sources":["../../../../../../src/components/Table/TableRow/TableRow.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useRef } from \"react\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport { type TableCellProps } from \"../TableCell/TableCell\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport cx from \"classnames\";\nimport styles from \"./TableRow.module.scss\";\nimport { useTableRowMenu } from \"../context/TableRowMenuContext/TableRowMenuContext\";\n\nexport interface TableRowProps extends VibeComponentProps {\n /**\n * If true, applies a highlighted style to the row.\n */\n highlighted?: boolean;\n /**\n * The child components inside the table row, typically `<TableCell />` elements.\n */\n children?: React.ReactElement<TableCellProps> | React.ReactElement<TableCellProps>[];\n /**\n * Custom styles applied to the table row.\n */\n style?: React.CSSProperties;\n}\n\nconst TableRow = forwardRef(\n (\n { highlighted, children, style, id, className, \"data-testid\": dataTestId }: TableRowProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const componentRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRef(componentRef, ref);\n const { onMouseOverRow, onMouseLeaveRow } = useTableRowMenu();\n\n const onMouseEnter = useCallback(() => {\n onMouseOverRow(componentRef);\n }, [onMouseOverRow]);\n\n return (\n <div\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_ROW, id)}\n ref={mergedRef}\n role=\"row\"\n aria-selected={highlighted || false}\n className={cx(styles.tableRow, className)}\n style={style}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeaveRow}\n tabIndex={-1}\n >\n {children}\n </div>\n );\n }\n);\n\nexport default TableRow;\n"],"names":["TableRow","forwardRef","_ref","ref","highlighted","children","style","id","className","dataTestId","componentRef","useRef","mergedRef","useMergeRef","_useTableRowMenu","useTableRowMenu","onMouseOverRow","onMouseLeaveRow","onMouseEnter","useCallback","React","createElement","getTestId","ComponentDefaultTestId","TABLE_ROW","role","cx","styles","tableRow","onMouseLeave","tabIndex"],"mappings":"oYAyBMA,IAAAA,EAAWC,GACf,SAAAC,EAEEC,GACE,IAFAC,EAAWF,EAAXE,YAAaC,EAAQH,EAARG,SAAUC,EAAKJ,EAALI,MAAOC,EAAEL,EAAFK,GAAIC,EAASN,EAATM,UAA0BC,EAAUP,EAAzB,eAGzCQ,EAAeC,EAAuB,MACtCC,EAAYC,EAAYH,EAAcP,GAC5CW,EAA4CC,IAApCC,EAAcF,EAAdE,eAAgBC,EAAeH,EAAfG,gBAElBC,EAAeC,GAAY,WAC/BH,EAAeN,EACjB,GAAG,CAACM,IAEJ,OACEI,EAAAC,cAAA,MAAA,CACEd,GAAIA,EAAE,cACOE,GAAca,EAAUC,EAAuBC,UAAWjB,GACvEJ,IAAKS,EACLa,KAAK,MACU,gBAAArB,IAAe,EAC9BI,UAAWkB,EAAGC,EAAOC,SAAUpB,GAC/BF,MAAOA,EACPY,aAAcA,EACdW,aAAcZ,EACda,UAAW,GAEVzB,EAGP"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var e={tableRow:"tableRow"};!function(e){const t="s_id-72a799b963ca_4_5_27";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+t))return;const r=document.createElement("style");r.id=t,l.firstChild?l.insertBefore(r,l.firstChild):l.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.tableRow {\n height: var(--table-row-size);\n display: grid;\n grid-template-columns: var(--table-grid-template-columns);\n min-width: 100%;\n width: fit-content;\n}\n.tableRow[aria-selected=true] > [role=cell] {\n background-color: var(--primary-selected-color);\n}\n.tableRow > [role=cell] {\n background-color: var(--primary-background-color);\n}\n.tableRow:hover > [role=cell] {\n background: var(--sticky-cell-hover-background);\n}\n.tableRow:hover[aria-selected=true] > [role=cell] {\n background: var(--primary-selected-hover-color);\n}");export{e as default};
|
|
2
|
-
//# sourceMappingURL=TableRow.module.scss.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import e,{forwardRef as t,useCallback as o}from"react";import n from"classnames";import{getTestId as r}from"../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../tests/constants.js";import a from"./TableRowMenu.module.scss.js";import{MenuButton as m}from"@vibe/menu-button/mockedClassNames";import{Menu as i}from"@vibe/menu/mockedClassNames";import{createPortal as u}from"react-dom";import{useTable as l}from"../context/TableContext/TableContext.js";import{getStyle as c}from"@vibe/shared";import{useTableRowMenu as d}from"../context/TableRowMenuContext/TableRowMenuContext.js";import{useTableContainer as f}from"../context/TableContainerContext/TableContainerContext.js";var M=t((function(t,M){var b=t.rowId,p=t.className,C=t.id,x=t["data-testid"],v=t.children,w=f().menuContainerRef,T=l().size,R=d(),E=R.hoveredRowId,j=R.setTableMenuHidden,N=R.setTableMenuShown,h=R.menuButtonPosition,I=R.onMouseOverRowMenu,L=R.onMouseLeaveRowMenu,k=o((function(){j()}),[j]),z=o((function(){N()}),[N]);return w.current&&E&&E===b?e.createElement(e.Fragment,null,u(e.createElement("div",{className:n(a.rowMenuContainer,c(a,T)),style:{top:h},onMouseEnter:I,onMouseLeave:L},e.createElement(m,{id:C,ref:M,className:n(a.tableMenu,p),size:"xs",onMenuHide:k,onMenuShow:z,"data-testid":x||r(s.TABLE_ROW_MENU,C)},e.createElement(i,null,v))),w.current)):null}));export{M as default};
|
|
2
|
-
//# sourceMappingURL=TableRowMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TableRowMenu.js","sources":["../../../../../../src/components/Table/TableRowMenu/TableRowMenu.tsx"],"sourcesContent":["import React, { forwardRef, useCallback } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport styles from \"./TableRowMenu.module.scss\";\nimport { MenuButton } from \"@vibe/menu-button\";\nimport { Menu } from \"@vibe/menu\";\nimport { createPortal } from \"react-dom\";\nimport { useTable } from \"../context/TableContext/TableContext\";\nimport { getStyle } from \"@vibe/shared\";\nimport { useTableRowMenu } from \"../context/TableRowMenuContext/TableRowMenuContext\";\nimport { useTableContainer } from \"../context/TableContainerContext/TableContainerContext\";\nimport { type TableMenuProps } from \"./TableRowMenu.types\";\n\nconst TableRowMenu = forwardRef(\n (\n { rowId, className, id, \"data-testid\": dataTestId, children }: TableMenuProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const { menuContainerRef } = useTableContainer();\n const { size } = useTable();\n const {\n hoveredRowId,\n setTableMenuHidden,\n setTableMenuShown,\n menuButtonPosition,\n onMouseOverRowMenu,\n onMouseLeaveRowMenu\n } = useTableRowMenu();\n\n const onMenuHide = useCallback(() => {\n setTableMenuHidden();\n }, [setTableMenuHidden]);\n\n const onMenuShow = useCallback(() => {\n setTableMenuShown();\n }, [setTableMenuShown]);\n\n const shouldShowMenu = menuContainerRef.current && hoveredRowId && hoveredRowId === rowId;\n if (!shouldShowMenu) return null;\n\n return (\n <>\n {createPortal(\n <div\n className={cx(styles.rowMenuContainer, getStyle(styles, size))}\n style={{ top: menuButtonPosition }}\n onMouseEnter={onMouseOverRowMenu}\n onMouseLeave={onMouseLeaveRowMenu}\n >\n <MenuButton\n id={id}\n ref={ref}\n className={cx(styles.tableMenu, className)}\n size=\"xs\"\n onMenuHide={onMenuHide}\n onMenuShow={onMenuShow}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_ROW_MENU, id)}\n >\n <Menu>{children}</Menu>\n </MenuButton>\n </div>,\n menuContainerRef.current\n )}\n </>\n );\n }\n);\n\nexport default TableRowMenu;\n"],"names":["TableRowMenu","forwardRef","_ref","ref","rowId","className","id","dataTestId","children","menuContainerRef","useTableContainer","size","useTable","_useTableRowMenu","useTableRowMenu","hoveredRowId","setTableMenuHidden","setTableMenuShown","menuButtonPosition","onMouseOverRowMenu","onMouseLeaveRowMenu","onMenuHide","useCallback","onMenuShow","current","React","createElement","Fragment","createPortal","cx","styles","rowMenuContainer","getStyle","style","top","onMouseEnter","onMouseLeave","MenuButton","tableMenu","getTestId","ComponentDefaultTestId","TABLE_ROW_MENU","Menu"],"mappings":"srBAcMA,IAAAA,EAAeC,GACnB,SAAAC,EAEEC,GACE,IAFAC,EAAKF,EAALE,MAAOC,EAASH,EAATG,UAAWC,EAAEJ,EAAFI,GAAmBC,EAAUL,EAAzB,eAA2BM,EAAQN,EAARM,SAG3CC,EAAqBC,IAArBD,iBACAE,EAASC,IAATD,KACRE,EAOIC,IANFC,EAAYF,EAAZE,aACAC,EAAkBH,EAAlBG,mBACAC,EAAiBJ,EAAjBI,kBACAC,EAAkBL,EAAlBK,mBACAC,EAAkBN,EAAlBM,mBACAC,EAAmBP,EAAnBO,oBAGIC,EAAaC,GAAY,WAC7BN,GACF,GAAG,CAACA,IAEEO,EAAaD,GAAY,WAC7BL,GACF,GAAG,CAACA,IAGJ,OADuBR,EAAiBe,SAAWT,GAAgBA,IAAiBX,EAIlFqB,EAAAC,cAAAD,EAAAE,SAAA,KACGC,EACCH,uBACEpB,UAAWwB,EAAGC,EAAOC,iBAAkBC,EAASF,EAAQnB,IACxDsB,MAAO,CAAEC,IAAKhB,GACdiB,aAAchB,EACdiB,aAAchB,GAEdK,EAAAC,cAACW,EACC,CAAA/B,GAAIA,EACJH,IAAKA,EACLE,UAAWwB,EAAGC,EAAOQ,UAAWjC,GAChCM,KAAK,KACLU,WAAYA,EACZE,WAAYA,gBACChB,GAAcgC,EAAUC,EAAuBC,eAAgBnC,IAE5EmB,EAAAC,cAACgB,EAAI,KAAElC,KAGXC,EAAiBe,UAvBK,IA2B9B"}
|