@apia/components 2.0.6 → 2.0.8
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/IconsList/Icon.js.map +1 -1
- package/dist/components/IconsList/IconWrapper.js.map +1 -1
- package/dist/components/IconsList/KeyHandler.js.map +1 -1
- package/dist/components/IconsList/context.js.map +1 -1
- package/dist/components/IconsList/index.js.map +1 -1
- package/dist/components/IconsList/renderers/DefaultIconRenderer.js.map +1 -1
- package/dist/components/IconsList/store/context.js.map +1 -1
- package/dist/components/IconsList/store/distinctors.js.map +1 -1
- package/dist/components/IconsList/store/keysMaker.js.map +1 -1
- package/dist/components/IconsList/store/operations.js.map +1 -1
- package/dist/components/IconsList/store/state.js.map +1 -1
- package/dist/components/IconsList/store/useStore.js.map +1 -1
- package/dist/components/IconsList/styles.js.map +1 -1
- package/dist/components/IconsList/util.js.map +1 -1
- package/dist/components/ListBox/Combobox.js.map +1 -1
- package/dist/components/ListBox/listbox.js.map +1 -1
- package/dist/components/ListBox/operations.js.map +1 -1
- package/dist/components/ListBox/useIndexedChildren.js.map +1 -1
- package/dist/components/ListBox/useListboxAutofocus.js.map +1 -1
- package/dist/components/ListBox/useListboxContextValue.js.map +1 -1
- package/dist/components/ListBox/useShoutSelectionChange.js.map +1 -1
- package/dist/components/ListBox/useStore.js.map +1 -1
- package/dist/components/ListBox/useUpdateRowCount.js.map +1 -1
- package/dist/components/SortableList/SortableListHandler.js +1 -1
- package/dist/components/SortableList/SortableListHandler.js.map +1 -1
- package/dist/components/SortableList/SortableListItem.js.map +1 -1
- package/dist/components/SortableList/index.js.map +1 -1
- package/dist/components/Toolbar/ToolbarController.js.map +1 -1
- package/dist/components/Toolbar/ToolbarIconButton.js.map +1 -1
- package/dist/components/Toolbar/ToolbarInput.js.map +1 -1
- package/dist/components/Toolbar/ToolbarSelect.js.map +1 -1
- package/dist/components/Toolbar/ToolbarSeparator.js.map +1 -1
- package/dist/components/Toolbar/ToolbarTextButton.js.map +1 -1
- package/dist/components/Toolbar/index.js.map +1 -1
- package/dist/components/Toolbar/styles.js.map +1 -1
- package/dist/components/accordion/Accordion.d.ts +1 -0
- package/dist/components/accordion/Accordion.js +6 -0
- package/dist/components/accordion/Accordion.js.map +1 -1
- package/dist/components/accordion/AccordionItem.d.ts +2 -1
- package/dist/components/accordion/AccordionItem.js +5 -1
- package/dist/components/accordion/AccordionItem.js.map +1 -1
- package/dist/components/accordion/AccordionItemButton.js.map +1 -1
- package/dist/components/accordion/AccordionItemContent.js.map +1 -1
- package/dist/components/accordion/KeyHandler.js +64 -59
- package/dist/components/accordion/KeyHandler.js.map +1 -1
- package/dist/components/accordion/context.js.map +1 -1
- package/dist/components/accordion/defaultElements/Checkbox.js.map +1 -1
- package/dist/components/accordion/defaultElements/DefaultAccordionItemButton.js +1 -3
- package/dist/components/accordion/defaultElements/DefaultAccordionItemButton.js.map +1 -1
- package/dist/components/accordion/defaultElements/useIsChecked.js.map +1 -1
- package/dist/components/accordion/handler.d.ts +1 -1
- package/dist/components/accordion/handler.js +11 -3
- package/dist/components/accordion/handler.js.map +1 -1
- package/dist/components/apia/ApiaDateFilter.js.map +1 -1
- package/dist/components/apia/ApiaFilter.js.map +1 -1
- package/dist/components/buttons/useOtherTagButton.js.map +1 -1
- package/dist/components/collapsiblePanel/index.js.map +1 -1
- package/dist/components/collapsiblePanel/styles.js.map +1 -1
- package/dist/components/dialogs/AlertModal.js.map +1 -1
- package/dist/components/dialogs/ConfirmModal.js.map +1 -1
- package/dist/components/forms/Captcha.js.map +1 -1
- package/dist/components/forms/Checkbox.js.map +1 -1
- package/dist/components/forms/DateInput.js.map +1 -1
- package/dist/components/forms/FieldErrorMessage.js.map +1 -1
- package/dist/components/forms/FieldLabel.js.map +1 -1
- package/dist/components/forms/IconInput.js.map +1 -1
- package/dist/components/forms/NumberInput.js.map +1 -1
- package/dist/components/forms/RequiredMark.js.map +1 -1
- package/dist/components/forms/buttons/BaseButton.js.map +1 -1
- package/dist/components/forms/buttons/IconButton.js.map +1 -1
- package/dist/components/forms/buttons/SimpleButton.js.map +1 -1
- package/dist/components/forms/util/style.js.map +1 -1
- package/dist/components/importComponent.js +1 -1
- package/dist/components/importComponent.js.map +1 -1
- package/dist/components/loaders/LinearLoader.js.map +1 -1
- package/dist/components/loaders/LoaderSpinner.js.map +1 -1
- package/dist/components/loaders/ProgressBar.js.map +1 -1
- package/dist/components/modals/CalendarModal.js.map +1 -1
- package/dist/components/modals/Modal.d.ts +28 -2
- package/dist/components/modals/Modal.js +3 -1
- package/dist/components/modals/Modal.js.map +1 -1
- package/dist/components/modals/ModalContext.js.map +1 -1
- package/dist/components/modals/Overlay.js.map +1 -1
- package/dist/components/modals/StaticModal.js.map +1 -1
- package/dist/components/modals/WindowModal.js +225 -4
- package/dist/components/modals/WindowModal.js.map +1 -1
- package/dist/components/modals/hooks/useEscapeKey.js +36 -0
- package/dist/components/modals/hooks/useEscapeKey.js.map +1 -0
- package/dist/components/modals/hooks/useInitialFocus.js +37 -0
- package/dist/components/modals/hooks/useInitialFocus.js.map +1 -0
- package/dist/components/modals/hooks/useModal.js.map +1 -1
- package/dist/components/modals/hooks/useStyleState.js +44 -0
- package/dist/components/modals/hooks/useStyleState.js.map +1 -0
- package/dist/components/modals/layout/Confirm.js.map +1 -1
- package/dist/components/modals/layout/DialogButtonBar.js.map +1 -1
- package/dist/components/modals/layout/DialogHeader.js +1 -2
- package/dist/components/modals/layout/DialogHeader.js.map +1 -1
- package/dist/components/responsive/AutoEllipsis.js.map +1 -1
- package/dist/components/responsive/makeResponsiveComponent.js.map +1 -1
- package/dist/components/waiAriaHelpers/typeAhead.js.map +1 -1
- package/dist/globalFocus.js +2 -2
- package/dist/globalFocus.js.map +1 -1
- package/dist/hooks/useBodyScrollLock.js +2 -2
- package/dist/hooks/useBodyScrollLock.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/objects/ApiaUtil/dialogs/ApiaUtilDialogs.js +3 -3
- package/dist/objects/ApiaUtil/dialogs/ApiaUtilDialogs.js.map +1 -1
- package/dist/objects/ApiaUtil/index.js +1 -1
- package/dist/objects/ApiaUtil/index.js.map +1 -1
- package/dist/objects/ApiaUtil/menu/ApiaUtilMenu.js +2 -2
- package/dist/objects/ApiaUtil/menu/ApiaUtilMenu.js.map +1 -1
- package/dist/objects/ApiaUtil/modals/ApiaUtilModals.js +3 -3
- package/dist/objects/ApiaUtil/modals/ApiaUtilModals.js.map +1 -1
- package/dist/objects/ApiaUtil/modals/OpenModal.d.ts +31 -1
- package/dist/objects/ApiaUtil/modals/OpenModal.js +18 -0
- package/dist/objects/ApiaUtil/modals/OpenModal.js.map +1 -1
- package/dist/objects/ApiaUtil/mouse/ApiaUtilMouse.js.map +1 -1
- package/dist/objects/ApiaUtil/notifications/ApiaUtilNotifications.js.map +1 -1
- package/dist/objects/ApiaUtil/parsers/ApiaUtilParsers.js.map +1 -1
- package/dist/objects/ApiaUtil/tabs/ApiaUtilCurrentTab.js.map +1 -1
- package/dist/objects/ApiaUtil/tabs/ApiaUtilTabsController.js +1 -1
- package/dist/objects/ApiaUtil/tabs/ApiaUtilTabsController.js.map +1 -1
- package/dist/objects/ApiaUtil/tabs/util.js.map +1 -1
- package/dist/objects/ApiaUtil/tooltips/ApiaUtilTooltip.js +1 -1
- package/dist/objects/ApiaUtil/tooltips/ApiaUtilTooltip.js.map +1 -1
- package/dist/objects/ApiaUtil/tooltips/ApiaUtilTooltips.js.map +1 -1
- package/dist/objects/ApiaUtil/tooltips/AutomaticTooltip.js +1 -1
- package/dist/objects/ApiaUtil/tooltips/AutomaticTooltip.js.map +1 -1
- package/dist/objects/ApiaUtil/tooltips/tooltip/Tooltip.js.map +1 -1
- package/dist/objects/ApiaUtil/tooltips/tooltip/util.js.map +1 -1
- package/dist/tabs/Content.js.map +1 -1
- package/dist/tabs/ContextMenu.js +1 -2
- package/dist/tabs/ContextMenu.js.map +1 -1
- package/dist/tabs/Item.js +1 -2
- package/dist/tabs/Item.js.map +1 -1
- package/dist/tabs/Tabs.js.map +1 -1
- package/dist/tabs/TabsList.js.map +1 -1
- package/dist/tabs/renderers/DefaultTabsLabelRenderer.js.map +1 -1
- package/dist/tabs/tabsController.js.map +1 -1
- package/dist/tabs/useTabsList.js.map +1 -1
- package/dist/tabs/util.js.map +1 -1
- package/package.json +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sources":["../../../src/components/IconsList/Icon.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\nimport { TIcon } from '.';\nimport { useMemo } from 'react';\nimport { useIconsListStoreContext } from './store/context';\nimport { useIconRendererContext } from './context';\n\nexport const Icon = (\n props: TIcon & { rowIndex: number; colIndex: number; width: number },\n) => {\n const { useProps } = useIconsListStoreContext();\n\n const ref = useProps<HTMLElement>('cell', {\n columnIndex: props.colIndex,\n rowIndex: props.rowIndex,\n });\n\n const Renderer = useIconRendererContext();\n\n return (\n <Box\n ref={ref}\n role=\"gridcell\"\n data-id={props.id}\n className={`iconsList__iconWrapper ${props.className ?? ''}`}\n aria-label={props.ariaLabel}\n sx={useMemo(\n () => ({\n width: `${props.width}px`,\n\n '.iconsList__icon__image__wrapper': {\n height: `${props.width - 4}px`,\n },\n\n '.iconsList__icon__image': {\n maxHeight: `${props.width - 32}px`,\n maxWidth: `${props.width - 32}px`,\n },\n }),\n [props.width],\n )}\n aria-colindex={props.colIndex}\n >\n <Renderer {...props} />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;;AAMa,MAAA,IAAA,GAAO,CAClB,KACG,KAAA;AACH,EAAM,MAAA,EAAE,QAAS,EAAA,GAAI,wBAAyB,EAAA,CAAA;AAE9C,EAAM,MAAA,GAAA,GAAM,SAAsB,MAAQ,EAAA;AAAA,IACxC,aAAa,KAAM,CAAA,QAAA;AAAA,IACnB,UAAU,KAAM,CAAA,QAAA;AAAA,GACjB,CAAA,CAAA;AAED,EAAA,MAAM,WAAW,sBAAuB,EAAA,CAAA;AAExC,EACE,uBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAK,EAAA,UAAA;AAAA,MACL,WAAS,KAAM,CAAA,EAAA;AAAA,MACf,SAAW,EAAA,CAAA,uBAAA,EAA0B,KAAM,CAAA,SAAA,IAAa,EAAE,CAAA,CAAA;AAAA,MAC1D,cAAY,KAAM,CAAA,SAAA;AAAA,MAClB,EAAI,EAAA,OAAA;AAAA,QACF,OAAO;AAAA,UACL,KAAA,EAAO,CAAG,EAAA,KAAA,CAAM,KAAK,CAAA,EAAA,CAAA;AAAA,UAErB,kCAAoC,EAAA;AAAA,YAClC,MAAQ,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,CAAC,CAAA,EAAA,CAAA;AAAA,WAC5B;AAAA,UAEA,yBAA2B,EAAA;AAAA,YACzB,SAAW,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,EAAE,CAAA,EAAA,CAAA;AAAA,YAC9B,QAAU,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,EAAE,CAAA,EAAA,CAAA;AAAA,WAC/B;AAAA,SACF,CAAA;AAAA,QACA,CAAC,MAAM,KAAK,CAAA;AAAA,OACd;AAAA,MACA,iBAAe,KAAM,CAAA,QAAA;AAAA,MAErB,QAAA,kBAAA,GAAA,CAAC,QAAU,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA,KAAA;AAAA,GACvB,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"Icon.js","sources":["../../../src/components/IconsList/Icon.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\r\nimport { TIcon } from '.';\r\nimport { useMemo } from 'react';\r\nimport { useIconsListStoreContext } from './store/context';\r\nimport { useIconRendererContext } from './context';\r\n\r\nexport const Icon = (\r\n props: TIcon & { rowIndex: number; colIndex: number; width: number },\r\n) => {\r\n const { useProps } = useIconsListStoreContext();\r\n\r\n const ref = useProps<HTMLElement>('cell', {\r\n columnIndex: props.colIndex,\r\n rowIndex: props.rowIndex,\r\n });\r\n\r\n const Renderer = useIconRendererContext();\r\n\r\n return (\r\n <Box\r\n ref={ref}\r\n role=\"gridcell\"\r\n data-id={props.id}\r\n className={`iconsList__iconWrapper ${props.className ?? ''}`}\r\n aria-label={props.ariaLabel}\r\n sx={useMemo(\r\n () => ({\r\n width: `${props.width}px`,\r\n\r\n '.iconsList__icon__image__wrapper': {\r\n height: `${props.width - 4}px`,\r\n },\r\n\r\n '.iconsList__icon__image': {\r\n maxHeight: `${props.width - 32}px`,\r\n maxWidth: `${props.width - 32}px`,\r\n },\r\n }),\r\n [props.width],\r\n )}\r\n aria-colindex={props.colIndex}\r\n >\r\n <Renderer {...props} />\r\n </Box>\r\n );\r\n};\r\n"],"names":[],"mappings":";;;;;;AAMa,MAAA,IAAA,GAAO,CAClB,KACG,KAAA;AACH,EAAM,MAAA,EAAE,QAAS,EAAA,GAAI,wBAAyB,EAAA,CAAA;AAE9C,EAAM,MAAA,GAAA,GAAM,SAAsB,MAAQ,EAAA;AAAA,IACxC,aAAa,KAAM,CAAA,QAAA;AAAA,IACnB,UAAU,KAAM,CAAA,QAAA;AAAA,GACjB,CAAA,CAAA;AAED,EAAA,MAAM,WAAW,sBAAuB,EAAA,CAAA;AAExC,EACE,uBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAK,EAAA,UAAA;AAAA,MACL,WAAS,KAAM,CAAA,EAAA;AAAA,MACf,SAAW,EAAA,CAAA,uBAAA,EAA0B,KAAM,CAAA,SAAA,IAAa,EAAE,CAAA,CAAA;AAAA,MAC1D,cAAY,KAAM,CAAA,SAAA;AAAA,MAClB,EAAI,EAAA,OAAA;AAAA,QACF,OAAO;AAAA,UACL,KAAA,EAAO,CAAG,EAAA,KAAA,CAAM,KAAK,CAAA,EAAA,CAAA;AAAA,UAErB,kCAAoC,EAAA;AAAA,YAClC,MAAQ,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,CAAC,CAAA,EAAA,CAAA;AAAA,WAC5B;AAAA,UAEA,yBAA2B,EAAA;AAAA,YACzB,SAAW,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,EAAE,CAAA,EAAA,CAAA;AAAA,YAC9B,QAAU,EAAA,CAAA,EAAG,KAAM,CAAA,KAAA,GAAQ,EAAE,CAAA,EAAA,CAAA;AAAA,WAC/B;AAAA,SACF,CAAA;AAAA,QACA,CAAC,MAAM,KAAK,CAAA;AAAA,OACd;AAAA,MACA,iBAAe,KAAM,CAAA,QAAA;AAAA,MAErB,QAAA,kBAAA,GAAA,CAAC,QAAU,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA,KAAA;AAAA,GACvB,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconWrapper.js","sources":["../../../src/components/IconsList/IconWrapper.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\nimport { TIcon } from '.';\nimport { Icon } from './Icon';\nimport { justToFillTheRow } from './util';\n\nexport const IconWrapper = <P extends Record<string, unknown>>({\n icon,\n iconWidth,\n rowIndex,\n colIndex,\n}: {\n icon: string | TIcon<P>;\n iconWidth: number;\n rowIndex: number;\n colIndex: number;\n}) => {\n return icon === justToFillTheRow ? (\n <Box sx={{ width: `${iconWidth}px` }} className=\"fill__the__row\" />\n ) : (\n <Icon\n rowIndex={rowIndex}\n colIndex={colIndex}\n width={iconWidth}\n {...(icon as TIcon<P>)}\n />\n );\n};\n"],"names":[],"mappings":";;;;;AAKO,MAAM,cAAc,CAAoC;AAAA,EAC7D,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AACF,CAKM,KAAA;AACJ,EAAA,OAAO,IAAS,KAAA,gBAAA,mBACb,GAAA,CAAA,GAAA,EAAA,EAAI,EAAI,EAAA,EAAE,KAAO,EAAA,CAAA,EAAG,SAAS,CAAA,EAAA,CAAA,EAAQ,EAAA,SAAA,EAAU,kBAAiB,CAEjE,mBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,QAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAI,IAAA;AAAA,KAAA;AAAA,GACP,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"IconWrapper.js","sources":["../../../src/components/IconsList/IconWrapper.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\r\nimport { TIcon } from '.';\r\nimport { Icon } from './Icon';\r\nimport { justToFillTheRow } from './util';\r\n\r\nexport const IconWrapper = <P extends Record<string, unknown>>({\r\n icon,\r\n iconWidth,\r\n rowIndex,\r\n colIndex,\r\n}: {\r\n icon: string | TIcon<P>;\r\n iconWidth: number;\r\n rowIndex: number;\r\n colIndex: number;\r\n}) => {\r\n return icon === justToFillTheRow ? (\r\n <Box sx={{ width: `${iconWidth}px` }} className=\"fill__the__row\" />\r\n ) : (\r\n <Icon\r\n rowIndex={rowIndex}\r\n colIndex={colIndex}\r\n width={iconWidth}\r\n {...(icon as TIcon<P>)}\r\n />\r\n );\r\n};\r\n"],"names":[],"mappings":";;;;;AAKO,MAAM,cAAc,CAAoC;AAAA,EAC7D,IAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AACF,CAKM,KAAA;AACJ,EAAA,OAAO,IAAS,KAAA,gBAAA,mBACb,GAAA,CAAA,GAAA,EAAA,EAAI,EAAI,EAAA,EAAE,KAAO,EAAA,CAAA,EAAG,SAAS,CAAA,EAAA,CAAA,EAAQ,EAAA,SAAA,EAAU,kBAAiB,CAEjE,mBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,QAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACN,GAAI,IAAA;AAAA,KAAA;AAAA,GACP,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyHandler.js","sources":["../../../src/components/IconsList/KeyHandler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Box } from '@apia/theme';\nimport {\n FocusEvent,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n useCallback,\n} from 'react';\nimport { useIconsListStoreContext } from './store/context';\nimport { isChild, TId, noNaN } from '@apia/util';\nimport { TIcon, TIconsList } from './types';\nimport { ApiaUtil } from '../../objects/ApiaUtil';\n\nfunction findIcon(icons: TIcon[], arg: EventTarget | TId) {\n const iconId =\n arg instanceof HTMLElement\n ? arg.closest<HTMLElement>('.iconsList__iconWrapper[data-id]')?.dataset\n ?.id\n : arg;\n\n if (iconId !== undefined) {\n const icon = icons.find((current) => String(current.id) === iconId);\n\n return icon ?? null;\n }\n}\n\nexport const KeyHandler = ({\n children,\n icons,\n onIconClick,\n onIconDoubleClick,\n onIconGetDetails,\n onIconKeyDown,\n storeId,\n}: { children: ReactNode; storeId: TId } & Pick<\n TIconsList<any>,\n | 'icons'\n | 'onIconClick'\n | 'onIconDoubleClick'\n | 'onIconGetDetails'\n | 'onIconKeyDown'\n>) => {\n const { actions, getState } = useIconsListStoreContext();\n\n const showIconDetails = useCallback(\n (icon: TIcon) => {\n if (onIconGetDetails) {\n new ApiaUtil().tooltips.open({\n attachToElement: () =>\n document.querySelector(\n `#${storeId} .iconsList__iconWrapper[data-id=\"${icon.id}\"]`,\n ) as HTMLElement,\n children: onIconGetDetails(icon),\n closeOnClick: false,\n minSize: { width: 200, height: 0 },\n });\n }\n },\n [onIconGetDetails, storeId],\n );\n\n return (\n <Box\n className=\"iconsList__keyHandler\"\n tabIndex={0}\n onFocus={useCallback(\n (ev: FocusEvent) => {\n if (\n !isChild(ev.target as HTMLElement, (current) =>\n current.classList?.contains('iconsList__keyHandler'),\n )\n )\n return;\n const icon = findIcon(icons, getState().focusedId);\n if (icon) {\n showIconDetails(icon);\n }\n },\n [getState, icons, showIconDetails],\n )}\n onMouseDown={useCallback(\n (ev: MouseEvent) => {\n if (ev.target instanceof HTMLElement) {\n const colIndex = noNaN(\n ev.target.closest('[aria-colindex]')?.ariaColIndex,\n -1,\n );\n const rowIndex = noNaN(\n ev.target.closest('[aria-rowindex]')?.ariaRowIndex,\n -1,\n );\n\n if (colIndex >= 0 && rowIndex >= 0) {\n actions.setFocused({\n colIndex,\n rowIndex,\n });\n }\n }\n },\n [actions],\n )}\n onClick={useCallback(\n (ev: MouseEvent<HTMLElement>) => {\n const icon = findIcon(icons, ev.target);\n\n if (icon) showIconDetails(icon);\n if (onIconClick && icon) {\n onIconClick(ev, icon);\n }\n },\n [icons, onIconClick, showIconDetails],\n )}\n onDoubleClick={useCallback(\n (ev: MouseEvent<HTMLElement>) => {\n if (onIconDoubleClick) {\n const icon = findIcon(icons, ev.target);\n if (icon) onIconDoubleClick(ev, icon);\n }\n },\n [icons, onIconDoubleClick],\n )}\n onKeyDown={useCallback(\n (ev: KeyboardEvent<HTMLElement>) => {\n function showIconByFocusChange() {\n const icon = findIcon(icons, getState().focusedId);\n\n if (icon) showIconDetails(icon);\n if (icon && onIconKeyDown) {\n onIconKeyDown(ev, icon);\n }\n }\n\n function shoutKeyDown() {\n const icon = findIcon(icons, getState().focusedId);\n if (icon && onIconKeyDown) {\n onIconKeyDown(ev, icon);\n }\n }\n\n switch (ev.code) {\n case 'ArrowUp':\n actions.arrowUp();\n showIconByFocusChange();\n break;\n case 'ArrowDown':\n actions.arrowDown();\n showIconByFocusChange();\n break;\n case 'ArrowRight':\n actions.arrowRight();\n showIconByFocusChange();\n break;\n case 'ArrowLeft':\n actions.arrowLeft();\n showIconByFocusChange();\n break;\n default:\n shoutKeyDown();\n break;\n }\n },\n [actions, getState, icons, onIconKeyDown, showIconDetails],\n )}\n >\n {children}\n </Box>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"KeyHandler.js","sources":["../../../src/components/IconsList/KeyHandler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport { Box } from '@apia/theme';\r\nimport {\r\n FocusEvent,\r\n KeyboardEvent,\r\n MouseEvent,\r\n ReactNode,\r\n useCallback,\r\n} from 'react';\r\nimport { useIconsListStoreContext } from './store/context';\r\nimport { isChild, TId, noNaN } from '@apia/util';\r\nimport { TIcon, TIconsList } from './types';\r\nimport { ApiaUtil } from '../../objects/ApiaUtil';\r\n\r\nfunction findIcon(icons: TIcon[], arg: EventTarget | TId) {\r\n const iconId =\r\n arg instanceof HTMLElement\r\n ? arg.closest<HTMLElement>('.iconsList__iconWrapper[data-id]')?.dataset\r\n ?.id\r\n : arg;\r\n\r\n if (iconId !== undefined) {\r\n const icon = icons.find((current) => String(current.id) === iconId);\r\n\r\n return icon ?? null;\r\n }\r\n}\r\n\r\nexport const KeyHandler = ({\r\n children,\r\n icons,\r\n onIconClick,\r\n onIconDoubleClick,\r\n onIconGetDetails,\r\n onIconKeyDown,\r\n storeId,\r\n}: { children: ReactNode; storeId: TId } & Pick<\r\n TIconsList<any>,\r\n | 'icons'\r\n | 'onIconClick'\r\n | 'onIconDoubleClick'\r\n | 'onIconGetDetails'\r\n | 'onIconKeyDown'\r\n>) => {\r\n const { actions, getState } = useIconsListStoreContext();\r\n\r\n const showIconDetails = useCallback(\r\n (icon: TIcon) => {\r\n if (onIconGetDetails) {\r\n new ApiaUtil().tooltips.open({\r\n attachToElement: () =>\r\n document.querySelector(\r\n `#${storeId} .iconsList__iconWrapper[data-id=\"${icon.id}\"]`,\r\n ) as HTMLElement,\r\n children: onIconGetDetails(icon),\r\n closeOnClick: false,\r\n minSize: { width: 200, height: 0 },\r\n });\r\n }\r\n },\r\n [onIconGetDetails, storeId],\r\n );\r\n\r\n return (\r\n <Box\r\n className=\"iconsList__keyHandler\"\r\n tabIndex={0}\r\n onFocus={useCallback(\r\n (ev: FocusEvent) => {\r\n if (\r\n !isChild(ev.target as HTMLElement, (current) =>\r\n current.classList?.contains('iconsList__keyHandler'),\r\n )\r\n )\r\n return;\r\n const icon = findIcon(icons, getState().focusedId);\r\n if (icon) {\r\n showIconDetails(icon);\r\n }\r\n },\r\n [getState, icons, showIconDetails],\r\n )}\r\n onMouseDown={useCallback(\r\n (ev: MouseEvent) => {\r\n if (ev.target instanceof HTMLElement) {\r\n const colIndex = noNaN(\r\n ev.target.closest('[aria-colindex]')?.ariaColIndex,\r\n -1,\r\n );\r\n const rowIndex = noNaN(\r\n ev.target.closest('[aria-rowindex]')?.ariaRowIndex,\r\n -1,\r\n );\r\n\r\n if (colIndex >= 0 && rowIndex >= 0) {\r\n actions.setFocused({\r\n colIndex,\r\n rowIndex,\r\n });\r\n }\r\n }\r\n },\r\n [actions],\r\n )}\r\n onClick={useCallback(\r\n (ev: MouseEvent<HTMLElement>) => {\r\n const icon = findIcon(icons, ev.target);\r\n\r\n if (icon) showIconDetails(icon);\r\n if (onIconClick && icon) {\r\n onIconClick(ev, icon);\r\n }\r\n },\r\n [icons, onIconClick, showIconDetails],\r\n )}\r\n onDoubleClick={useCallback(\r\n (ev: MouseEvent<HTMLElement>) => {\r\n if (onIconDoubleClick) {\r\n const icon = findIcon(icons, ev.target);\r\n if (icon) onIconDoubleClick(ev, icon);\r\n }\r\n },\r\n [icons, onIconDoubleClick],\r\n )}\r\n onKeyDown={useCallback(\r\n (ev: KeyboardEvent<HTMLElement>) => {\r\n function showIconByFocusChange() {\r\n const icon = findIcon(icons, getState().focusedId);\r\n\r\n if (icon) showIconDetails(icon);\r\n if (icon && onIconKeyDown) {\r\n onIconKeyDown(ev, icon);\r\n }\r\n }\r\n\r\n function shoutKeyDown() {\r\n const icon = findIcon(icons, getState().focusedId);\r\n if (icon && onIconKeyDown) {\r\n onIconKeyDown(ev, icon);\r\n }\r\n }\r\n\r\n switch (ev.code) {\r\n case 'ArrowUp':\r\n actions.arrowUp();\r\n showIconByFocusChange();\r\n break;\r\n case 'ArrowDown':\r\n actions.arrowDown();\r\n showIconByFocusChange();\r\n break;\r\n case 'ArrowRight':\r\n actions.arrowRight();\r\n showIconByFocusChange();\r\n break;\r\n case 'ArrowLeft':\r\n actions.arrowLeft();\r\n showIconByFocusChange();\r\n break;\r\n default:\r\n shoutKeyDown();\r\n break;\r\n }\r\n },\r\n [actions, getState, icons, onIconKeyDown, showIconDetails],\r\n )}\r\n >\r\n {children}\r\n </Box>\r\n );\r\n};\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","sources":["../../../src/components/IconsList/context.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { TIconRenderer } from './types';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const IconRendererContext = createContext<TIconRenderer<any> | null>(\n null,\n);\n\nexport function useIconRendererContext<\n P extends Record<string, unknown> = Record<string, unknown>,\n>() {\n const context = useContext(IconRendererContext);\n\n if (!context) throw new Error('There is no IconRendererContext');\n\n return context as TIconRenderer<P>;\n}\n"],"names":[],"mappings":";;AAIO,MAAM,mBAAsB,GAAA,aAAA;AAAA,EACjC,IAAA;AACF,EAAA;AAEO,SAAS,sBAEZ,GAAA;AACF,EAAM,MAAA,OAAA,GAAU,WAAW,mBAAmB,CAAA,CAAA;AAE9C,EAAA,IAAI,CAAC,OAAA;AAAS,IAAM,MAAA,IAAI,MAAM,iCAAiC,CAAA,CAAA;AAE/D,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}
|
|
1
|
+
{"version":3,"file":"context.js","sources":["../../../src/components/IconsList/context.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\r\nimport { TIconRenderer } from './types';\r\n\r\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\r\nexport const IconRendererContext = createContext<TIconRenderer<any> | null>(\r\n null,\r\n);\r\n\r\nexport function useIconRendererContext<\r\n P extends Record<string, unknown> = Record<string, unknown>,\r\n>() {\r\n const context = useContext(IconRendererContext);\r\n\r\n if (!context) throw new Error('There is no IconRendererContext');\r\n\r\n return context as TIconRenderer<P>;\r\n}\r\n"],"names":[],"mappings":";;AAIO,MAAM,mBAAsB,GAAA,aAAA;AAAA,EACjC,IAAA;AACF,EAAA;AAEO,SAAS,sBAEZ,GAAA;AACF,EAAM,MAAA,OAAA,GAAU,WAAW,mBAAmB,CAAA,CAAA;AAE9C,EAAA,IAAI,CAAC,OAAA;AAAS,IAAM,MAAA,IAAI,MAAM,iCAAiC,CAAA,CAAA;AAE/D,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/IconsList/index.tsx"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\nimport { Box, Grid } from '@apia/theme';\nimport {\n ForwardedRef,\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { makeResponsiveComponent } from '../responsive';\nimport { useStore } from './store/useStore';\nimport { uniqueId } from '../ListBox/common';\nimport { makeStyledComponent } from '@apia/theme';\nimport { KeyHandler } from './KeyHandler';\nimport { styles } from './styles';\nimport { getBreakpoints, getRowIcons, useStyles } from './util';\nimport { IconWrapper } from './IconWrapper';\nimport { DefaultIconRenderer } from './renderers/DefaultIconRenderer';\nimport { TIconsList, TIcon, TIconRenderer } from './types';\nimport { IconRendererContext } from './context';\nimport { useLatest, usePrevious } from '@apia/util';\nimport { shallowEqual } from '@apia/store';\n\nexport type { TIcon, TIconRenderer, TIconsList };\n\nconst IconsListNonForwarded = <P extends Record<string, unknown>>(\n props: TIconsList<P>,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const propsRef = useLatest(props);\n let render: () => void = () => {};\n const previousProps = usePrevious(props);\n if (!shallowEqual(props, previousProps.current)) {\n setTimeout(() => render(), 0);\n }\n\n const ResponsiveContainer = useMemo(() => {\n const iconWidth = propsRef.current.iconWidth ?? 100;\n const minGap = propsRef.current.minHorizontalGap ?? 30;\n const blockWidth = iconWidth + minGap;\n const styledComponent = (styledComponentProps: unknown) => {\n const { breakPoint, containerWidth } = styledComponentProps as {\n breakPoint: number;\n containerWidth: number;\n };\n const [, doRender] = useState(true);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n render = useCallback(() => doRender((current) => !current), []);\n const storeId = useMemo(() => uniqueId('IconsList'), []);\n const [actions, useProps, , , Context] = useStore({ storeId });\n const rows = Math.ceil(propsRef.current.icons.length / breakPoint);\n const sx = useStyles({\n breakPoint,\n containerWidth,\n iconWidth: propsRef.current.iconWidth ?? 100,\n verticalGap: propsRef.current.verticalGap,\n removeHorizontalPadding: propsRef.current.removeHorizontalPadding,\n });\n\n useEffect(() => {\n actions.recalculateIndexByResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [breakPoint]);\n const IconRenderer = propsRef.current.iconRenderer ?? DefaultIconRenderer;\n const gridRef = useProps('grid', {\n columns: breakPoint,\n iconsCount: propsRef.current.icons.length,\n rows,\n });\n\n return (\n <IconRendererContext.Provider value={IconRenderer}>\n <Context>\n <KeyHandler\n icons={propsRef.current.icons}\n onIconClick={propsRef.current.onIconClick}\n onIconDoubleClick={propsRef.current.onIconDoubleClick}\n onIconGetDetails={propsRef.current.onIconGetDetails}\n onIconKeyDown={propsRef.current.onIconKeyDown}\n storeId={storeId}\n >\n <Box ref={gridRef}>\n {Array(rows)\n .fill(1)\n .map((_, i) => {\n const icons = getRowIcons({\n breakPoint,\n i,\n icons: propsRef.current.icons,\n });\n return (\n <Grid\n aria-rowindex={i + 1}\n role=\"row\"\n key={i}\n ref={ref}\n sx={sx}\n >\n {icons.map((current, j) => (\n <IconWrapper\n key={uniqueId(String(j + i))}\n colIndex={j + 1}\n icon={current}\n iconWidth={propsRef.current.iconWidth ?? 100}\n rowIndex={i + 1}\n />\n ))}\n </Grid>\n );\n })}\n </Box>\n </KeyHandler>\n </Context>\n </IconRendererContext.Provider>\n );\n };\n\n const Component = makeResponsiveComponent({\n breakPoints: getBreakpoints(blockWidth),\n Component: makeStyledComponent(\n 'IconsList',\n 'layout.common.components.iconsList',\n styles,\n styledComponent,\n ),\n debounce: 50,\n });\n\n return Component;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n if (previousProps.current?.iconWidth !== props.iconWidth) {\n const iconWidth = props.iconWidth ?? 100;\n const minGap = props.minHorizontalGap ?? 30;\n\n const blockWidth = iconWidth + minGap;\n setTimeout(\n () =>\n ResponsiveContainer.setBreakpoints.current(getBreakpoints(blockWidth)),\n 0,\n );\n }\n\n return <ResponsiveContainer />;\n};\n\nIconsListNonForwarded.displayName = 'IconsList';\n\nexport const IconsList = forwardRef(\n IconsListNonForwarded,\n) as typeof IconsListNonForwarded;\n\nexport { DefaultIconRenderer };\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/IconsList/index.tsx"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\r\nimport { Box, Grid } from '@apia/theme';\r\nimport {\r\n ForwardedRef,\r\n forwardRef,\r\n useCallback,\r\n useEffect,\r\n useMemo,\r\n useState,\r\n} from 'react';\r\nimport { makeResponsiveComponent } from '../responsive';\r\nimport { useStore } from './store/useStore';\r\nimport { uniqueId } from '../ListBox/common';\r\nimport { makeStyledComponent } from '@apia/theme';\r\nimport { KeyHandler } from './KeyHandler';\r\nimport { styles } from './styles';\r\nimport { getBreakpoints, getRowIcons, useStyles } from './util';\r\nimport { IconWrapper } from './IconWrapper';\r\nimport { DefaultIconRenderer } from './renderers/DefaultIconRenderer';\r\nimport { TIconsList, TIcon, TIconRenderer } from './types';\r\nimport { IconRendererContext } from './context';\r\nimport { useLatest, usePrevious } from '@apia/util';\r\nimport { shallowEqual } from '@apia/store';\r\n\r\nexport type { TIcon, TIconRenderer, TIconsList };\r\n\r\nconst IconsListNonForwarded = <P extends Record<string, unknown>>(\r\n props: TIconsList<P>,\r\n ref: ForwardedRef<HTMLDivElement>,\r\n) => {\r\n const propsRef = useLatest(props);\r\n let render: () => void = () => {};\r\n const previousProps = usePrevious(props);\r\n if (!shallowEqual(props, previousProps.current)) {\r\n setTimeout(() => render(), 0);\r\n }\r\n\r\n const ResponsiveContainer = useMemo(() => {\r\n const iconWidth = propsRef.current.iconWidth ?? 100;\r\n const minGap = propsRef.current.minHorizontalGap ?? 30;\r\n const blockWidth = iconWidth + minGap;\r\n const styledComponent = (styledComponentProps: unknown) => {\r\n const { breakPoint, containerWidth } = styledComponentProps as {\r\n breakPoint: number;\r\n containerWidth: number;\r\n };\r\n const [, doRender] = useState(true);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n render = useCallback(() => doRender((current) => !current), []);\r\n const storeId = useMemo(() => uniqueId('IconsList'), []);\r\n const [actions, useProps, , , Context] = useStore({ storeId });\r\n const rows = Math.ceil(propsRef.current.icons.length / breakPoint);\r\n const sx = useStyles({\r\n breakPoint,\r\n containerWidth,\r\n iconWidth: propsRef.current.iconWidth ?? 100,\r\n verticalGap: propsRef.current.verticalGap,\r\n removeHorizontalPadding: propsRef.current.removeHorizontalPadding,\r\n });\r\n\r\n useEffect(() => {\r\n actions.recalculateIndexByResize();\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [breakPoint]);\r\n const IconRenderer = propsRef.current.iconRenderer ?? DefaultIconRenderer;\r\n const gridRef = useProps('grid', {\r\n columns: breakPoint,\r\n iconsCount: propsRef.current.icons.length,\r\n rows,\r\n });\r\n\r\n return (\r\n <IconRendererContext.Provider value={IconRenderer}>\r\n <Context>\r\n <KeyHandler\r\n icons={propsRef.current.icons}\r\n onIconClick={propsRef.current.onIconClick}\r\n onIconDoubleClick={propsRef.current.onIconDoubleClick}\r\n onIconGetDetails={propsRef.current.onIconGetDetails}\r\n onIconKeyDown={propsRef.current.onIconKeyDown}\r\n storeId={storeId}\r\n >\r\n <Box ref={gridRef}>\r\n {Array(rows)\r\n .fill(1)\r\n .map((_, i) => {\r\n const icons = getRowIcons({\r\n breakPoint,\r\n i,\r\n icons: propsRef.current.icons,\r\n });\r\n return (\r\n <Grid\r\n aria-rowindex={i + 1}\r\n role=\"row\"\r\n key={i}\r\n ref={ref}\r\n sx={sx}\r\n >\r\n {icons.map((current, j) => (\r\n <IconWrapper\r\n key={uniqueId(String(j + i))}\r\n colIndex={j + 1}\r\n icon={current}\r\n iconWidth={propsRef.current.iconWidth ?? 100}\r\n rowIndex={i + 1}\r\n />\r\n ))}\r\n </Grid>\r\n );\r\n })}\r\n </Box>\r\n </KeyHandler>\r\n </Context>\r\n </IconRendererContext.Provider>\r\n );\r\n };\r\n\r\n const Component = makeResponsiveComponent({\r\n breakPoints: getBreakpoints(blockWidth),\r\n Component: makeStyledComponent(\r\n 'IconsList',\r\n 'layout.common.components.iconsList',\r\n styles,\r\n styledComponent,\r\n ),\r\n debounce: 50,\r\n });\r\n\r\n return Component;\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n if (previousProps.current?.iconWidth !== props.iconWidth) {\r\n const iconWidth = props.iconWidth ?? 100;\r\n const minGap = props.minHorizontalGap ?? 30;\r\n\r\n const blockWidth = iconWidth + minGap;\r\n setTimeout(\r\n () =>\r\n ResponsiveContainer.setBreakpoints.current(getBreakpoints(blockWidth)),\r\n 0,\r\n );\r\n }\r\n\r\n return <ResponsiveContainer />;\r\n};\r\n\r\nIconsListNonForwarded.displayName = 'IconsList';\r\n\r\nexport const IconsList = forwardRef(\r\n IconsListNonForwarded,\r\n) as typeof IconsListNonForwarded;\r\n\r\nexport { DefaultIconRenderer };\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultIconRenderer.js","sources":["../../../../src/components/IconsList/renderers/DefaultIconRenderer.tsx"],"sourcesContent":["import { Icon } from '@apia/icons';\nimport { TIconRenderer } from '../types';\nimport { Box, Image } from '@apia/theme';\nimport { memo } from 'react';\n\nconst DefaultIconRendererNoMemo: TIconRenderer = (props) => {\n if (!props.icon && !props.imageUrl) {\n console.error({ props });\n throw new Error('The icon has no imageUrl nor icon defined');\n }\n\n return (\n <Box title={props.label} className=\"iconsList__icon__wrapper\">\n <Box className=\"iconsList__icon__image__wrapper\">\n {props.imageUrl && (\n <Image\n className=\"iconsList__icon__image\"\n src={props.imageUrl}\n role=\"none\"\n alt=\"\"\n />\n )}\n {props.icon && <Icon icon={props.icon} title={props.ariaLabel} />}\n </Box>\n <Box className=\"iconsList__icon__label\">{props.label}</Box>\n </Box>\n );\n};\n\nexport const DefaultIconRenderer = memo(DefaultIconRendererNoMemo);\n"],"names":[],"mappings":";;;;;AAKA,MAAM,yBAAA,GAA2C,CAAC,KAAU,KAAA;AAC1D,EAAA,IAAI,CAAC,KAAA,CAAM,IAAQ,IAAA,CAAC,MAAM,QAAU,EAAA;AAClC,IAAQ,OAAA,CAAA,KAAA,CAAM,EAAE,KAAA,EAAO,CAAA,CAAA;AACvB,IAAM,MAAA,IAAI,MAAM,2CAA2C,CAAA,CAAA;AAAA,GAC7D;AAEA,EAAA,4BACG,GAAI,EAAA,EAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAU,0BACjC,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,GAAA,EAAA,EAAI,WAAU,iCACZ,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA,CAAM,QACL,oBAAA,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,wBAAA;AAAA,UACV,KAAK,KAAM,CAAA,QAAA;AAAA,UACX,IAAK,EAAA,MAAA;AAAA,UACL,GAAI,EAAA,EAAA;AAAA,SAAA;AAAA,OACN;AAAA,MAED,KAAA,CAAM,wBAAS,GAAA,CAAA,IAAA,EAAA,EAAK,MAAM,KAAM,CAAA,IAAA,EAAM,KAAO,EAAA,KAAA,CAAM,SAAW,EAAA,CAAA;AAAA,KACjE,EAAA,CAAA;AAAA,oBACC,GAAA,CAAA,GAAA,EAAA,EAAI,SAAU,EAAA,wBAAA,EAA0B,gBAAM,KAAM,EAAA,CAAA;AAAA,GACvD,EAAA,CAAA,CAAA;AAEJ,CAAA,CAAA;AAEa,MAAA,mBAAA,GAAsB,KAAK,yBAAyB;;;;"}
|
|
1
|
+
{"version":3,"file":"DefaultIconRenderer.js","sources":["../../../../src/components/IconsList/renderers/DefaultIconRenderer.tsx"],"sourcesContent":["import { Icon } from '@apia/icons';\r\nimport { TIconRenderer } from '../types';\r\nimport { Box, Image } from '@apia/theme';\r\nimport { memo } from 'react';\r\n\r\nconst DefaultIconRendererNoMemo: TIconRenderer = (props) => {\r\n if (!props.icon && !props.imageUrl) {\r\n console.error({ props });\r\n throw new Error('The icon has no imageUrl nor icon defined');\r\n }\r\n\r\n return (\r\n <Box title={props.label} className=\"iconsList__icon__wrapper\">\r\n <Box className=\"iconsList__icon__image__wrapper\">\r\n {props.imageUrl && (\r\n <Image\r\n className=\"iconsList__icon__image\"\r\n src={props.imageUrl}\r\n role=\"none\"\r\n alt=\"\"\r\n />\r\n )}\r\n {props.icon && <Icon icon={props.icon} title={props.ariaLabel} />}\r\n </Box>\r\n <Box className=\"iconsList__icon__label\">{props.label}</Box>\r\n </Box>\r\n );\r\n};\r\n\r\nexport const DefaultIconRenderer = memo(DefaultIconRendererNoMemo);\r\n"],"names":[],"mappings":";;;;;AAKA,MAAM,yBAAA,GAA2C,CAAC,KAAU,KAAA;AAC1D,EAAA,IAAI,CAAC,KAAA,CAAM,IAAQ,IAAA,CAAC,MAAM,QAAU,EAAA;AAClC,IAAQ,OAAA,CAAA,KAAA,CAAM,EAAE,KAAA,EAAO,CAAA,CAAA;AACvB,IAAM,MAAA,IAAI,MAAM,2CAA2C,CAAA,CAAA;AAAA,GAC7D;AAEA,EAAA,4BACG,GAAI,EAAA,EAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAU,0BACjC,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,GAAA,EAAA,EAAI,WAAU,iCACZ,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA,CAAM,QACL,oBAAA,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,wBAAA;AAAA,UACV,KAAK,KAAM,CAAA,QAAA;AAAA,UACX,IAAK,EAAA,MAAA;AAAA,UACL,GAAI,EAAA,EAAA;AAAA,SAAA;AAAA,OACN;AAAA,MAED,KAAA,CAAM,wBAAS,GAAA,CAAA,IAAA,EAAA,EAAK,MAAM,KAAM,CAAA,IAAA,EAAM,KAAO,EAAA,KAAA,CAAM,SAAW,EAAA,CAAA;AAAA,KACjE,EAAA,CAAA;AAAA,oBACC,GAAA,CAAA,GAAA,EAAA,EAAI,SAAU,EAAA,wBAAA,EAA0B,gBAAM,KAAM,EAAA,CAAA;AAAA,GACvD,EAAA,CAAA,CAAA;AAEJ,CAAA,CAAA;AAEa,MAAA,mBAAA,GAAsB,KAAK,yBAAyB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","sources":["../../../../src/components/IconsList/store/context.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport {\n TActionsMap,\n TDistinctorProperties,\n TGetState,\n TRegisterStateChangeListener,\n TUseProperties,\n} from '@apia/dom-store';\nimport { TCellDistinctions, TGridDistinctions, TState } from './types';\nimport { operations } from './operations';\n\nexport type TStoreContext = {\n actions: TActionsMap<TState, typeof operations>;\n useProps: TUseProperties<\n TState,\n {\n cell: [\n (\n distinctions: TCellDistinctions,\n state: TState,\n ) => TDistinctorProperties,\n ];\n grid: [\n (\n distinctions: TGridDistinctions,\n state: TState,\n ) => TDistinctorProperties,\n ];\n }\n >;\n getState: TGetState<TState>;\n registerStateChangeListener: TRegisterStateChangeListener<TState>;\n};\n\nexport const StoreContext = createContext<TStoreContext>({} as TStoreContext);\n\nexport const useIconsListStoreContext = () => {\n return useContext(StoreContext);\n};\n"],"names":[],"mappings":";;AAkCa,MAAA,YAAA,GAAe,aAA6B,CAAA,EAAmB,EAAA;AAErE,MAAM,2BAA2B,MAAM;AAC5C,EAAA,OAAO,WAAW,YAAY,CAAA,CAAA;AAChC;;;;"}
|
|
1
|
+
{"version":3,"file":"context.js","sources":["../../../../src/components/IconsList/store/context.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\r\nimport {\r\n TActionsMap,\r\n TDistinctorProperties,\r\n TGetState,\r\n TRegisterStateChangeListener,\r\n TUseProperties,\r\n} from '@apia/dom-store';\r\nimport { TCellDistinctions, TGridDistinctions, TState } from './types';\r\nimport { operations } from './operations';\r\n\r\nexport type TStoreContext = {\r\n actions: TActionsMap<TState, typeof operations>;\r\n useProps: TUseProperties<\r\n TState,\r\n {\r\n cell: [\r\n (\r\n distinctions: TCellDistinctions,\r\n state: TState,\r\n ) => TDistinctorProperties,\r\n ];\r\n grid: [\r\n (\r\n distinctions: TGridDistinctions,\r\n state: TState,\r\n ) => TDistinctorProperties,\r\n ];\r\n }\r\n >;\r\n getState: TGetState<TState>;\r\n registerStateChangeListener: TRegisterStateChangeListener<TState>;\r\n};\r\n\r\nexport const StoreContext = createContext<TStoreContext>({} as TStoreContext);\r\n\r\nexport const useIconsListStoreContext = () => {\r\n return useContext(StoreContext);\r\n};\r\n"],"names":[],"mappings":";;AAkCa,MAAA,YAAA,GAAe,aAA6B,CAAA,EAAmB,EAAA;AAErE,MAAM,2BAA2B,MAAM;AAC5C,EAAA,OAAO,WAAW,YAAY,CAAA,CAAA;AAChC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"distinctors.js","sources":["../../../../src/components/IconsList/store/distinctors.ts"],"sourcesContent":["import { TDistinctors } from '@apia/dom-store';\nimport { TCellDistinctions, TGridDistinctions, TState } from './types';\n\nexport const distinctors: TDistinctors<TState> = {\n grid: [\n (distinctors: TGridDistinctions, state) => {\n return {\n etc: {\n 'aria-activedescendant':\n distinctors.iconsCount > 0\n ? `${state.storeId}__${state.focusedRow}__${state.focusedColumn}`\n : undefined,\n role: 'grid',\n 'aria-rowcount': distinctors.rows,\n 'aria-colcount': distinctors.columns,\n id: state.storeId,\n },\n };\n },\n ],\n cell: [\n (distinctions: TCellDistinctions, state) => {\n const isFocused =\n state.focusedColumn === distinctions.columnIndex &&\n state.focusedRow === distinctions.rowIndex;\n return {\n etc: {\n id: `${state.storeId}__${distinctions.rowIndex}__${distinctions.columnIndex}`,\n },\n classList: {\n add: isFocused ? ['focused'] : undefined,\n remove: isFocused ? undefined : ['focused'],\n },\n };\n },\n (_: TState, state: TState) => {\n const focusedCell = document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow}\"] [aria-colindex=\"${state.focusedColumn}\"]`,\n );\n\n focusedCell?.scrollIntoView({\n behavior: 'instant',\n block: 'nearest',\n inline: 'nearest',\n });\n },\n ],\n};\n"],"names":["distinctors"],"mappings":"AAGO,MAAM,WAAoC,GAAA;AAAA,EAC/C,IAAM,EAAA;AAAA,IACJ,CAACA,cAAgC,KAAU,KAAA;AACzC,MAAO,OAAA;AAAA,QACL,GAAK,EAAA;AAAA,UACH,uBACEA,EAAAA,YAAAA,CAAY,UAAa,GAAA,CAAA,GACrB,CAAG,EAAA,KAAA,CAAM,OAAO,CAAA,EAAA,EAAK,KAAM,CAAA,UAAU,CAAK,EAAA,EAAA,KAAA,CAAM,aAAa,CAC7D,CAAA,GAAA,KAAA,CAAA;AAAA,UACN,IAAM,EAAA,MAAA;AAAA,UACN,iBAAiBA,YAAY,CAAA,IAAA;AAAA,UAC7B,iBAAiBA,YAAY,CAAA,OAAA;AAAA,UAC7B,IAAI,KAAM,CAAA,OAAA;AAAA,SACZ;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACF;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,CAAC,cAAiC,KAAU,KAAA;AAC1C,MAAA,MAAM,YACJ,KAAM,CAAA,aAAA,KAAkB,aAAa,WACrC,IAAA,KAAA,CAAM,eAAe,YAAa,CAAA,QAAA,CAAA;AACpC,MAAO,OAAA;AAAA,QACL,GAAK,EAAA;AAAA,UACH,EAAA,EAAI,GAAG,KAAM,CAAA,OAAO,KAAK,YAAa,CAAA,QAAQ,CAAK,EAAA,EAAA,YAAA,CAAa,WAAW,CAAA,CAAA;AAAA,SAC7E;AAAA,QACA,SAAW,EAAA;AAAA,UACT,GAAK,EAAA,SAAA,GAAY,CAAC,SAAS,CAAI,GAAA,KAAA,CAAA;AAAA,UAC/B,MAAQ,EAAA,SAAA,GAAY,KAAY,CAAA,GAAA,CAAC,SAAS,CAAA;AAAA,SAC5C;AAAA,OACF,CAAA;AAAA,KACF;AAAA,IACA,CAAC,GAAW,KAAkB,KAAA;AAC5B,MAAA,MAAM,cAAc,QAAS,CAAA,aAAA;AAAA,QAC3B,CAAA,CAAA,EAAI,MAAM,OAAO,CAAA,iBAAA,EAAoB,MAAM,UAAU,CAAA,mBAAA,EAAsB,MAAM,aAAa,CAAA,EAAA,CAAA;AAAA,OAChG,CAAA;AAEA,MAAA,WAAA,EAAa,cAAe,CAAA;AAAA,QAC1B,QAAU,EAAA,SAAA;AAAA,QACV,KAAO,EAAA,SAAA;AAAA,QACP,MAAQ,EAAA,SAAA;AAAA,OACT,CAAA,CAAA;AAAA,KACH;AAAA,GACF;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"distinctors.js","sources":["../../../../src/components/IconsList/store/distinctors.ts"],"sourcesContent":["import { TDistinctors } from '@apia/dom-store';\r\nimport { TCellDistinctions, TGridDistinctions, TState } from './types';\r\n\r\nexport const distinctors: TDistinctors<TState> = {\r\n grid: [\r\n (distinctors: TGridDistinctions, state) => {\r\n return {\r\n etc: {\r\n 'aria-activedescendant':\r\n distinctors.iconsCount > 0\r\n ? `${state.storeId}__${state.focusedRow}__${state.focusedColumn}`\r\n : undefined,\r\n role: 'grid',\r\n 'aria-rowcount': distinctors.rows,\r\n 'aria-colcount': distinctors.columns,\r\n id: state.storeId,\r\n },\r\n };\r\n },\r\n ],\r\n cell: [\r\n (distinctions: TCellDistinctions, state) => {\r\n const isFocused =\r\n state.focusedColumn === distinctions.columnIndex &&\r\n state.focusedRow === distinctions.rowIndex;\r\n return {\r\n etc: {\r\n id: `${state.storeId}__${distinctions.rowIndex}__${distinctions.columnIndex}`,\r\n },\r\n classList: {\r\n add: isFocused ? ['focused'] : undefined,\r\n remove: isFocused ? undefined : ['focused'],\r\n },\r\n };\r\n },\r\n (_: TState, state: TState) => {\r\n const focusedCell = document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow}\"] [aria-colindex=\"${state.focusedColumn}\"]`,\r\n );\r\n\r\n focusedCell?.scrollIntoView({\r\n behavior: 'instant',\r\n block: 'nearest',\r\n inline: 'nearest',\r\n });\r\n },\r\n ],\r\n};\r\n"],"names":["distinctors"],"mappings":"AAGO,MAAM,WAAoC,GAAA;AAAA,EAC/C,IAAM,EAAA;AAAA,IACJ,CAACA,cAAgC,KAAU,KAAA;AACzC,MAAO,OAAA;AAAA,QACL,GAAK,EAAA;AAAA,UACH,uBACEA,EAAAA,YAAAA,CAAY,UAAa,GAAA,CAAA,GACrB,CAAG,EAAA,KAAA,CAAM,OAAO,CAAA,EAAA,EAAK,KAAM,CAAA,UAAU,CAAK,EAAA,EAAA,KAAA,CAAM,aAAa,CAC7D,CAAA,GAAA,KAAA,CAAA;AAAA,UACN,IAAM,EAAA,MAAA;AAAA,UACN,iBAAiBA,YAAY,CAAA,IAAA;AAAA,UAC7B,iBAAiBA,YAAY,CAAA,OAAA;AAAA,UAC7B,IAAI,KAAM,CAAA,OAAA;AAAA,SACZ;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACF;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,CAAC,cAAiC,KAAU,KAAA;AAC1C,MAAA,MAAM,YACJ,KAAM,CAAA,aAAA,KAAkB,aAAa,WACrC,IAAA,KAAA,CAAM,eAAe,YAAa,CAAA,QAAA,CAAA;AACpC,MAAO,OAAA;AAAA,QACL,GAAK,EAAA;AAAA,UACH,EAAA,EAAI,GAAG,KAAM,CAAA,OAAO,KAAK,YAAa,CAAA,QAAQ,CAAK,EAAA,EAAA,YAAA,CAAa,WAAW,CAAA,CAAA;AAAA,SAC7E;AAAA,QACA,SAAW,EAAA;AAAA,UACT,GAAK,EAAA,SAAA,GAAY,CAAC,SAAS,CAAI,GAAA,KAAA,CAAA;AAAA,UAC/B,MAAQ,EAAA,SAAA,GAAY,KAAY,CAAA,GAAA,CAAC,SAAS,CAAA;AAAA,SAC5C;AAAA,OACF,CAAA;AAAA,KACF;AAAA,IACA,CAAC,GAAW,KAAkB,KAAA;AAC5B,MAAA,MAAM,cAAc,QAAS,CAAA,aAAA;AAAA,QAC3B,CAAA,CAAA,EAAI,MAAM,OAAO,CAAA,iBAAA,EAAoB,MAAM,UAAU,CAAA,mBAAA,EAAsB,MAAM,aAAa,CAAA,EAAA,CAAA;AAAA,OAChG,CAAA;AAEA,MAAA,WAAA,EAAa,cAAe,CAAA;AAAA,QAC1B,QAAU,EAAA,SAAA;AAAA,QACV,KAAO,EAAA,SAAA;AAAA,QACP,MAAQ,EAAA,SAAA;AAAA,OACT,CAAA,CAAA;AAAA,KACH;AAAA,GACF;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"keysMaker.js","sources":["../../../../src/components/IconsList/store/keysMaker.ts"],"sourcesContent":["import { TDistinctors, TKeysMaker } from '@apia/dom-store';\nimport { TState } from './types';\n\nexport const makeCellKey = (distinctions: {\n columnIndex: number;\n rowIndex: number;\n}) => `${distinctions.columnIndex}__${distinctions.rowIndex}`;\n\nexport const keysMakers: TKeysMaker<TState, TDistinctors<TState>> = {\n cell: makeCellKey,\n grid: () => 'grid',\n};\n"],"names":[],"mappings":"AAGa,MAAA,WAAA,GAAc,CAAC,YAGtB,KAAA,CAAA,EAAG,aAAa,WAAW,CAAA,EAAA,EAAK,aAAa,QAAQ,CAAA,EAAA;AAEpD,MAAM,UAAuD,GAAA;AAAA,EAClE,IAAM,EAAA,WAAA;AAAA,EACN,MAAM,MAAM,MAAA;AACd;;;;"}
|
|
1
|
+
{"version":3,"file":"keysMaker.js","sources":["../../../../src/components/IconsList/store/keysMaker.ts"],"sourcesContent":["import { TDistinctors, TKeysMaker } from '@apia/dom-store';\r\nimport { TState } from './types';\r\n\r\nexport const makeCellKey = (distinctions: {\r\n columnIndex: number;\r\n rowIndex: number;\r\n}) => `${distinctions.columnIndex}__${distinctions.rowIndex}`;\r\n\r\nexport const keysMakers: TKeysMaker<TState, TDistinctors<TState>> = {\r\n cell: makeCellKey,\r\n grid: () => 'grid',\r\n};\r\n"],"names":[],"mappings":"AAGa,MAAA,WAAA,GAAc,CAAC,YAGtB,KAAA,CAAA,EAAG,aAAa,WAAW,CAAA,EAAA,EAAK,aAAa,QAAQ,CAAA,EAAA;AAEpD,MAAM,UAAuD,GAAA;AAAA,EAClE,IAAM,EAAA,WAAA;AAAA,EACN,MAAM,MAAM,MAAA;AACd;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"operations.js","sources":["../../../../src/components/IconsList/store/operations.ts"],"sourcesContent":["import { noNaN } from '@apia/util';\nimport { makeCellKey } from './keysMaker';\nimport { TIconsListOperation, TState } from './types';\n\nfunction assignSelectedIndexId(state: TState) {\n const element = document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow}\"] [aria-colindex=\"${state.focusedColumn}\"]`,\n );\n\n if (element instanceof HTMLElement) {\n state.focusedId = element.dataset.id as string;\n }\n}\n\nconst arrowDown: TIconsListOperation<void> = (state: TState, _: void, keys) => {\n if (\n !document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${\n state.focusedRow + 1\n }\"] [aria-colindex=\"${state.focusedColumn}\"]`,\n )\n )\n return;\n\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow + 1,\n }),\n 'grid',\n ]);\n state.focusedRow++;\n\n assignSelectedIndexId(state);\n};\nconst arrowUp: TIconsListOperation<void> = (state, _: void, keys) => {\n if (state.focusedRow > 1) {\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow - 1,\n }),\n 'grid',\n ]);\n state.focusedRow--;\n\n assignSelectedIndexId(state);\n }\n};\nconst arrowLeft: TIconsListOperation<void> = (state, _: void, keys) => {\n if (state.focusedColumn > 1) {\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: state.focusedColumn - 1,\n rowIndex: state.focusedRow,\n }),\n 'grid',\n ]);\n state.focusedColumn--;\n\n assignSelectedIndexId(state);\n }\n /**\n * Este bloque agrega el comportamiento de que, al presionar la flecha\n * derecha estando en el último ícono de una fila, salta a la fila\n * siguiente. El problema es que solamente funciona cuando las ids son\n * secuenciales, lo cual no siempre es cierto. Habría que agregar un sistema\n * de doble id para garantizar la secuencialidad de las ids usadas por este\n * método, independientemente de las ids provistas por el usuario del\n * componente.\n */\n /* else if (state.focusedRow > 1) {\n const focusedRow = document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow - 1}\"]`,\n );\n\n if (focusedRow instanceof HTMLElement) {\n const colIndex = noNaN(\n focusedRow.querySelector('[aria-colIndex]:last-of-type')?.ariaColIndex,\n -1,\n );\n\n if (colIndex !== -1) {\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: colIndex,\n rowIndex: state.focusedRow - 1,\n }),\n 'grid',\n ]);\n\n state.focusedRow--;\n state.focusedColumn = colIndex;\n\n assignSelectedIndexId(state);\n }\n }\n } */\n};\nconst arrowRight: TIconsListOperation<void> = (state, _: void, keys) => {\n if (\n !document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${\n state.focusedRow\n }\"] [aria-colindex=\"${state.focusedColumn + 1}\"]`,\n )\n ) {\n /**\n * Este bloque agrega el comportamiento de que, al presionar la flecha\n * derecha estando en el último ícono de una fila, salta a la fila\n * siguiente. El problema es que solamente funciona cuando las ids son\n * secuenciales, lo cual no siempre es cierto. Habría que agregar un sistema\n * de doble id para garantizar la secuencialidad de las ids usadas por este\n * método, independientemente de las ids provistas por el usuario del\n * componente.\n */\n /* const newFocusedId = noNaN(state.focusedId) + 1;\n const element = document.querySelector(\n `#${state.storeId} [data-id=\"${newFocusedId}\"]`,\n );\n\n if (element instanceof HTMLElement) {\n const rowIndex = noNaN(\n element.closest('[aria-rowindex]')?.ariaRowIndex,\n -1,\n );\n const colIndex = noNaN(\n element.closest('[aria-colindex]')?.ariaColIndex,\n -1,\n );\n\n if (rowIndex !== -1 && colIndex !== -1) {\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: colIndex,\n rowIndex: rowIndex,\n }),\n 'grid',\n ]);\n\n state.focusedColumn = colIndex;\n state.focusedRow = rowIndex;\n\n assignSelectedIndexId(state);\n }\n } */\n\n return;\n }\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({\n columnIndex: state.focusedColumn + 1,\n rowIndex: state.focusedRow,\n }),\n 'grid',\n ]);\n state.focusedColumn++;\n assignSelectedIndexId(state);\n};\nconst setFocused: TIconsListOperation<{\n rowIndex: number;\n colIndex: number;\n}> = (state, payload, keys) => {\n if (\n !document.querySelector(\n `#${state.storeId} [aria-rowindex=\"${payload.rowIndex}\"] [aria-colindex=\"${payload.colIndex}\"]`,\n )\n )\n return;\n\n keys.set([\n makeCellKey({ columnIndex: payload.colIndex, rowIndex: payload.rowIndex }),\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n 'grid',\n ]);\n\n state.focusedColumn = payload.colIndex;\n state.focusedRow = payload.rowIndex;\n\n assignSelectedIndexId(state);\n};\n\nconst recalculateIndexByResize: TIconsListOperation<void> = (\n state: TState,\n _: void,\n keys,\n) => {\n const element = document.querySelector(\n `#${state.storeId} [data-id=\"${state.focusedId}\"]`,\n );\n\n if (element instanceof HTMLElement) {\n const rowIndex = noNaN(\n element.closest('[aria-rowindex]')?.ariaRowIndex,\n -1,\n );\n const colIndex = noNaN(\n element.closest('[aria-colindex]')?.ariaColIndex,\n -1,\n );\n\n if (rowIndex !== -1 && colIndex !== -1) {\n keys.set([\n makeCellKey({\n columnIndex: state.focusedColumn,\n rowIndex: state.focusedRow,\n }),\n makeCellKey({ columnIndex: colIndex, rowIndex }),\n ]);\n\n state.focusedColumn = colIndex;\n state.focusedRow = rowIndex;\n }\n }\n};\n\nexport const operations = {\n arrowDown,\n arrowLeft,\n arrowRight,\n arrowUp,\n setFocused,\n recalculateIndexByResize,\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"operations.js","sources":["../../../../src/components/IconsList/store/operations.ts"],"sourcesContent":["import { noNaN } from '@apia/util';\r\nimport { makeCellKey } from './keysMaker';\r\nimport { TIconsListOperation, TState } from './types';\r\n\r\nfunction assignSelectedIndexId(state: TState) {\r\n const element = document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow}\"] [aria-colindex=\"${state.focusedColumn}\"]`,\r\n );\r\n\r\n if (element instanceof HTMLElement) {\r\n state.focusedId = element.dataset.id as string;\r\n }\r\n}\r\n\r\nconst arrowDown: TIconsListOperation<void> = (state: TState, _: void, keys) => {\r\n if (\r\n !document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${\r\n state.focusedRow + 1\r\n }\"] [aria-colindex=\"${state.focusedColumn}\"]`,\r\n )\r\n )\r\n return;\r\n\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow + 1,\r\n }),\r\n 'grid',\r\n ]);\r\n state.focusedRow++;\r\n\r\n assignSelectedIndexId(state);\r\n};\r\nconst arrowUp: TIconsListOperation<void> = (state, _: void, keys) => {\r\n if (state.focusedRow > 1) {\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow - 1,\r\n }),\r\n 'grid',\r\n ]);\r\n state.focusedRow--;\r\n\r\n assignSelectedIndexId(state);\r\n }\r\n};\r\nconst arrowLeft: TIconsListOperation<void> = (state, _: void, keys) => {\r\n if (state.focusedColumn > 1) {\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: state.focusedColumn - 1,\r\n rowIndex: state.focusedRow,\r\n }),\r\n 'grid',\r\n ]);\r\n state.focusedColumn--;\r\n\r\n assignSelectedIndexId(state);\r\n }\r\n /**\r\n * Este bloque agrega el comportamiento de que, al presionar la flecha\r\n * derecha estando en el último ícono de una fila, salta a la fila\r\n * siguiente. El problema es que solamente funciona cuando las ids son\r\n * secuenciales, lo cual no siempre es cierto. Habría que agregar un sistema\r\n * de doble id para garantizar la secuencialidad de las ids usadas por este\r\n * método, independientemente de las ids provistas por el usuario del\r\n * componente.\r\n */\r\n /* else if (state.focusedRow > 1) {\r\n const focusedRow = document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${state.focusedRow - 1}\"]`,\r\n );\r\n\r\n if (focusedRow instanceof HTMLElement) {\r\n const colIndex = noNaN(\r\n focusedRow.querySelector('[aria-colIndex]:last-of-type')?.ariaColIndex,\r\n -1,\r\n );\r\n\r\n if (colIndex !== -1) {\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: colIndex,\r\n rowIndex: state.focusedRow - 1,\r\n }),\r\n 'grid',\r\n ]);\r\n\r\n state.focusedRow--;\r\n state.focusedColumn = colIndex;\r\n\r\n assignSelectedIndexId(state);\r\n }\r\n }\r\n } */\r\n};\r\nconst arrowRight: TIconsListOperation<void> = (state, _: void, keys) => {\r\n if (\r\n !document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${\r\n state.focusedRow\r\n }\"] [aria-colindex=\"${state.focusedColumn + 1}\"]`,\r\n )\r\n ) {\r\n /**\r\n * Este bloque agrega el comportamiento de que, al presionar la flecha\r\n * derecha estando en el último ícono de una fila, salta a la fila\r\n * siguiente. El problema es que solamente funciona cuando las ids son\r\n * secuenciales, lo cual no siempre es cierto. Habría que agregar un sistema\r\n * de doble id para garantizar la secuencialidad de las ids usadas por este\r\n * método, independientemente de las ids provistas por el usuario del\r\n * componente.\r\n */\r\n /* const newFocusedId = noNaN(state.focusedId) + 1;\r\n const element = document.querySelector(\r\n `#${state.storeId} [data-id=\"${newFocusedId}\"]`,\r\n );\r\n\r\n if (element instanceof HTMLElement) {\r\n const rowIndex = noNaN(\r\n element.closest('[aria-rowindex]')?.ariaRowIndex,\r\n -1,\r\n );\r\n const colIndex = noNaN(\r\n element.closest('[aria-colindex]')?.ariaColIndex,\r\n -1,\r\n );\r\n\r\n if (rowIndex !== -1 && colIndex !== -1) {\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: colIndex,\r\n rowIndex: rowIndex,\r\n }),\r\n 'grid',\r\n ]);\r\n\r\n state.focusedColumn = colIndex;\r\n state.focusedRow = rowIndex;\r\n\r\n assignSelectedIndexId(state);\r\n }\r\n } */\r\n\r\n return;\r\n }\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({\r\n columnIndex: state.focusedColumn + 1,\r\n rowIndex: state.focusedRow,\r\n }),\r\n 'grid',\r\n ]);\r\n state.focusedColumn++;\r\n assignSelectedIndexId(state);\r\n};\r\nconst setFocused: TIconsListOperation<{\r\n rowIndex: number;\r\n colIndex: number;\r\n}> = (state, payload, keys) => {\r\n if (\r\n !document.querySelector(\r\n `#${state.storeId} [aria-rowindex=\"${payload.rowIndex}\"] [aria-colindex=\"${payload.colIndex}\"]`,\r\n )\r\n )\r\n return;\r\n\r\n keys.set([\r\n makeCellKey({ columnIndex: payload.colIndex, rowIndex: payload.rowIndex }),\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n 'grid',\r\n ]);\r\n\r\n state.focusedColumn = payload.colIndex;\r\n state.focusedRow = payload.rowIndex;\r\n\r\n assignSelectedIndexId(state);\r\n};\r\n\r\nconst recalculateIndexByResize: TIconsListOperation<void> = (\r\n state: TState,\r\n _: void,\r\n keys,\r\n) => {\r\n const element = document.querySelector(\r\n `#${state.storeId} [data-id=\"${state.focusedId}\"]`,\r\n );\r\n\r\n if (element instanceof HTMLElement) {\r\n const rowIndex = noNaN(\r\n element.closest('[aria-rowindex]')?.ariaRowIndex,\r\n -1,\r\n );\r\n const colIndex = noNaN(\r\n element.closest('[aria-colindex]')?.ariaColIndex,\r\n -1,\r\n );\r\n\r\n if (rowIndex !== -1 && colIndex !== -1) {\r\n keys.set([\r\n makeCellKey({\r\n columnIndex: state.focusedColumn,\r\n rowIndex: state.focusedRow,\r\n }),\r\n makeCellKey({ columnIndex: colIndex, rowIndex }),\r\n ]);\r\n\r\n state.focusedColumn = colIndex;\r\n state.focusedRow = rowIndex;\r\n }\r\n }\r\n};\r\n\r\nexport const operations = {\r\n arrowDown,\r\n arrowLeft,\r\n arrowRight,\r\n arrowUp,\r\n setFocused,\r\n recalculateIndexByResize,\r\n};\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"state.js","sources":["../../../../src/components/IconsList/store/state.ts"],"sourcesContent":["import { TState } from './types';\n\nexport const getInitialState = (props: Pick<TState, 'storeId'>): TState => ({\n focusedColumn: 1,\n focusedRow: 1,\n focusedId: 0,\n ...props,\n});\n"],"names":[],"mappings":"AAEa,MAAA,eAAA,GAAkB,CAAC,KAA4C,MAAA;AAAA,EAC1E,aAAe,EAAA,CAAA;AAAA,EACf,UAAY,EAAA,CAAA;AAAA,EACZ,SAAW,EAAA,CAAA;AAAA,EACX,GAAG,KAAA;AACL,CAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"state.js","sources":["../../../../src/components/IconsList/store/state.ts"],"sourcesContent":["import { TState } from './types';\r\n\r\nexport const getInitialState = (props: Pick<TState, 'storeId'>): TState => ({\r\n focusedColumn: 1,\r\n focusedRow: 1,\r\n focusedId: 0,\r\n ...props,\r\n});\r\n"],"names":[],"mappings":"AAEa,MAAA,eAAA,GAAkB,CAAC,KAA4C,MAAA;AAAA,EAC1E,aAAe,EAAA,CAAA;AAAA,EACf,UAAY,EAAA,CAAA;AAAA,EACZ,SAAW,EAAA,CAAA;AAAA,EACX,GAAG,KAAA;AACL,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStore.js","sources":["../../../../src/components/IconsList/store/useStore.tsx"],"sourcesContent":["import { createFAsomeStore } from '@apia/dom-store';\nimport { ReactNode, useCallback, useMemo } from 'react';\nimport { distinctors } from './distinctors';\nimport { operations } from './operations';\nimport { keysMakers } from './keysMaker';\nimport { getInitialState } from './state';\nimport { StoreContext, TStoreContext } from './context';\nimport { TState } from './types';\n\nexport const useStore = ({\n storeId,\n}: Pick<TState, 'storeId'>): [\n TStoreContext['actions'],\n TStoreContext['useProps'],\n TStoreContext['getState'],\n TStoreContext['registerStateChangeListener'],\n ({ children }: { children: ReactNode }) => JSX.Element,\n] => {\n const [actions, useProps, getState, registerStateChangeListener] = useMemo(\n () =>\n createFAsomeStore({\n initialState: getInitialState({\n storeId,\n }),\n distinctors,\n keysMakers,\n operations,\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n\n const ContextProvider = useCallback(\n ({ children }: { children: ReactNode }) => {\n return (\n <StoreContext.Provider\n value={{\n actions,\n useProps,\n getState,\n registerStateChangeListener,\n }}\n >\n {children}\n </StoreContext.Provider>\n );\n },\n [actions, getState, registerStateChangeListener, useProps],\n );\n\n return [\n actions,\n useProps,\n getState,\n registerStateChangeListener,\n ContextProvider,\n ];\n};\n"],"names":[],"mappings":";;;;;;;;;AASO,MAAM,WAAW,CAAC;AAAA,EACvB,OAAA;AACF,CAMK,KAAA;AACH,EAAA,MAAM,CAAC,OAAA,EAAS,QAAU,EAAA,QAAA,EAAU,2BAA2B,CAAI,GAAA,OAAA;AAAA,IACjE,MACE,iBAAkB,CAAA;AAAA,MAChB,cAAc,eAAgB,CAAA;AAAA,QAC5B,OAAA;AAAA,OACD,CAAA;AAAA,MACD,WAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,KACD,CAAA;AAAA;AAAA,IAEH,EAAC;AAAA,GACH,CAAA;AAEA,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,EAAE,QAAA,EAAwC,KAAA;AACzC,MACE,uBAAA,GAAA;AAAA,QAAC,YAAa,CAAA,QAAA;AAAA,QAAb;AAAA,UACC,KAAO,EAAA;AAAA,YACL,OAAA;AAAA,YACA,QAAA;AAAA,YACA,QAAA;AAAA,YACA,2BAAA;AAAA,WACF;AAAA,UAEC,QAAA;AAAA,SAAA;AAAA,OACH,CAAA;AAAA,KAEJ;AAAA,IACA,CAAC,OAAA,EAAS,QAAU,EAAA,2BAAA,EAA6B,QAAQ,CAAA;AAAA,GAC3D,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,OAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,2BAAA;AAAA,IACA,eAAA;AAAA,GACF,CAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"useStore.js","sources":["../../../../src/components/IconsList/store/useStore.tsx"],"sourcesContent":["import { createFAsomeStore } from '@apia/dom-store';\r\nimport { ReactNode, useCallback, useMemo } from 'react';\r\nimport { distinctors } from './distinctors';\r\nimport { operations } from './operations';\r\nimport { keysMakers } from './keysMaker';\r\nimport { getInitialState } from './state';\r\nimport { StoreContext, TStoreContext } from './context';\r\nimport { TState } from './types';\r\n\r\nexport const useStore = ({\r\n storeId,\r\n}: Pick<TState, 'storeId'>): [\r\n TStoreContext['actions'],\r\n TStoreContext['useProps'],\r\n TStoreContext['getState'],\r\n TStoreContext['registerStateChangeListener'],\r\n ({ children }: { children: ReactNode }) => JSX.Element,\r\n] => {\r\n const [actions, useProps, getState, registerStateChangeListener] = useMemo(\r\n () =>\r\n createFAsomeStore({\r\n initialState: getInitialState({\r\n storeId,\r\n }),\r\n distinctors,\r\n keysMakers,\r\n operations,\r\n }),\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n [],\r\n );\r\n\r\n const ContextProvider = useCallback(\r\n ({ children }: { children: ReactNode }) => {\r\n return (\r\n <StoreContext.Provider\r\n value={{\r\n actions,\r\n useProps,\r\n getState,\r\n registerStateChangeListener,\r\n }}\r\n >\r\n {children}\r\n </StoreContext.Provider>\r\n );\r\n },\r\n [actions, getState, registerStateChangeListener, useProps],\r\n );\r\n\r\n return [\r\n actions,\r\n useProps,\r\n getState,\r\n registerStateChangeListener,\r\n ContextProvider,\r\n ];\r\n};\r\n"],"names":[],"mappings":";;;;;;;;;AASO,MAAM,WAAW,CAAC;AAAA,EACvB,OAAA;AACF,CAMK,KAAA;AACH,EAAA,MAAM,CAAC,OAAA,EAAS,QAAU,EAAA,QAAA,EAAU,2BAA2B,CAAI,GAAA,OAAA;AAAA,IACjE,MACE,iBAAkB,CAAA;AAAA,MAChB,cAAc,eAAgB,CAAA;AAAA,QAC5B,OAAA;AAAA,OACD,CAAA;AAAA,MACD,WAAA;AAAA,MACA,UAAA;AAAA,MACA,UAAA;AAAA,KACD,CAAA;AAAA;AAAA,IAEH,EAAC;AAAA,GACH,CAAA;AAEA,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,EAAE,QAAA,EAAwC,KAAA;AACzC,MACE,uBAAA,GAAA;AAAA,QAAC,YAAa,CAAA,QAAA;AAAA,QAAb;AAAA,UACC,KAAO,EAAA;AAAA,YACL,OAAA;AAAA,YACA,QAAA;AAAA,YACA,QAAA;AAAA,YACA,2BAAA;AAAA,WACF;AAAA,UAEC,QAAA;AAAA,SAAA;AAAA,OACH,CAAA;AAAA,KAEJ;AAAA,IACA,CAAC,OAAA,EAAS,QAAU,EAAA,2BAAA,EAA6B,QAAQ,CAAA;AAAA,GAC3D,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,OAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,2BAAA;AAAA,IACA,eAAA;AAAA,GACF,CAAA;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../src/components/IconsList/styles.ts"],"sourcesContent":["import { focusOutline } from '@apia/theme';\nimport { ThemeUICSSObject } from '@apia/theme';\n\nexport const styles: ThemeUICSSObject = {\n '&, *': {\n textAlign: 'center',\n },\n\n '.iconsList__icon__image__wrapper': {\n boxShadow: '1px 1px 3px #0001',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n\n '.iconsList__icon__image': {\n maxWidth: 'calc(100% - 4px)',\n },\n\n '.iconsList__icon__wrapper': {\n p: 2,\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n\n '&:hover': (theme) => {\n return {\n ...theme.palette.getOneState(\n { backgroundColor: 'palette.background.paper' },\n 'hover',\n ),\n };\n },\n },\n\n '.iconsList__icon__label': {\n wordBreak: 'break-word',\n display: '-webkit-box',\n WebkitLineClamp: '3',\n WebkitBoxOrient: 'vertical',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n lineHeight: '20px',\n },\n\n '.iconsList__keyHandler:focus': {\n outline: 'none',\n\n '.focused .iconsList__icon__wrapper': {\n ...focusOutline,\n },\n },\n};\n"],"names":[],"mappings":";;AAGO,MAAM,MAA2B,GAAA;AAAA,EACtC,MAAQ,EAAA;AAAA,IACN,SAAW,EAAA,QAAA;AAAA,GACb;AAAA,EAEA,kCAAoC,EAAA;AAAA,IAClC,SAAW,EAAA,mBAAA;AAAA,IACX,OAAS,EAAA,MAAA;AAAA,IACT,UAAY,EAAA,QAAA;AAAA,IACZ,cAAgB,EAAA,QAAA;AAAA,GAClB;AAAA,EAEA,yBAA2B,EAAA;AAAA,IACzB,QAAU,EAAA,kBAAA;AAAA,GACZ;AAAA,EAEA,2BAA6B,EAAA;AAAA,IAC3B,CAAG,EAAA,CAAA;AAAA,IACH,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA,QAAA;AAAA,IACf,GAAK,EAAA,CAAA;AAAA,IAEL,SAAA,EAAW,CAAC,KAAU,KAAA;AACpB,MAAO,OAAA;AAAA,QACL,GAAG,MAAM,OAAQ,CAAA,WAAA;AAAA,UACf,EAAE,iBAAiB,0BAA2B,EAAA;AAAA,UAC9C,OAAA;AAAA,SACF;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACF;AAAA,EAEA,yBAA2B,EAAA;AAAA,IACzB,SAAW,EAAA,YAAA;AAAA,IACX,OAAS,EAAA,aAAA;AAAA,IACT,eAAiB,EAAA,GAAA;AAAA,IACjB,eAAiB,EAAA,UAAA;AAAA,IACjB,QAAU,EAAA,QAAA;AAAA,IACV,YAAc,EAAA,UAAA;AAAA,IACd,UAAY,EAAA,MAAA;AAAA,GACd;AAAA,EAEA,8BAAgC,EAAA;AAAA,IAC9B,OAAS,EAAA,MAAA;AAAA,IAET,oCAAsC,EAAA;AAAA,MACpC,GAAG,YAAA;AAAA,KACL;AAAA,GACF;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../src/components/IconsList/styles.ts"],"sourcesContent":["import { focusOutline } from '@apia/theme';\r\nimport { ThemeUICSSObject } from '@apia/theme';\r\n\r\nexport const styles: ThemeUICSSObject = {\r\n '&, *': {\r\n textAlign: 'center',\r\n },\r\n\r\n '.iconsList__icon__image__wrapper': {\r\n boxShadow: '1px 1px 3px #0001',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n },\r\n\r\n '.iconsList__icon__image': {\r\n maxWidth: 'calc(100% - 4px)',\r\n },\r\n\r\n '.iconsList__icon__wrapper': {\r\n p: 2,\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: 3,\r\n\r\n '&:hover': (theme) => {\r\n return {\r\n ...theme.palette.getOneState(\r\n { backgroundColor: 'palette.background.paper' },\r\n 'hover',\r\n ),\r\n };\r\n },\r\n },\r\n\r\n '.iconsList__icon__label': {\r\n wordBreak: 'break-word',\r\n display: '-webkit-box',\r\n WebkitLineClamp: '3',\r\n WebkitBoxOrient: 'vertical',\r\n overflow: 'hidden',\r\n textOverflow: 'ellipsis',\r\n lineHeight: '20px',\r\n },\r\n\r\n '.iconsList__keyHandler:focus': {\r\n outline: 'none',\r\n\r\n '.focused .iconsList__icon__wrapper': {\r\n ...focusOutline,\r\n },\r\n },\r\n};\r\n"],"names":[],"mappings":";;AAGO,MAAM,MAA2B,GAAA;AAAA,EACtC,MAAQ,EAAA;AAAA,IACN,SAAW,EAAA,QAAA;AAAA,GACb;AAAA,EAEA,kCAAoC,EAAA;AAAA,IAClC,SAAW,EAAA,mBAAA;AAAA,IACX,OAAS,EAAA,MAAA;AAAA,IACT,UAAY,EAAA,QAAA;AAAA,IACZ,cAAgB,EAAA,QAAA;AAAA,GAClB;AAAA,EAEA,yBAA2B,EAAA;AAAA,IACzB,QAAU,EAAA,kBAAA;AAAA,GACZ;AAAA,EAEA,2BAA6B,EAAA;AAAA,IAC3B,CAAG,EAAA,CAAA;AAAA,IACH,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA,QAAA;AAAA,IACf,GAAK,EAAA,CAAA;AAAA,IAEL,SAAA,EAAW,CAAC,KAAU,KAAA;AACpB,MAAO,OAAA;AAAA,QACL,GAAG,MAAM,OAAQ,CAAA,WAAA;AAAA,UACf,EAAE,iBAAiB,0BAA2B,EAAA;AAAA,UAC9C,OAAA;AAAA,SACF;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACF;AAAA,EAEA,yBAA2B,EAAA;AAAA,IACzB,SAAW,EAAA,YAAA;AAAA,IACX,OAAS,EAAA,aAAA;AAAA,IACT,eAAiB,EAAA,GAAA;AAAA,IACjB,eAAiB,EAAA,UAAA;AAAA,IACjB,QAAU,EAAA,QAAA;AAAA,IACV,YAAc,EAAA,UAAA;AAAA,IACd,UAAY,EAAA,MAAA;AAAA,GACd;AAAA,EAEA,8BAAgC,EAAA;AAAA,IAC9B,OAAS,EAAA,MAAA;AAAA,IAET,oCAAsC,EAAA;AAAA,MACpC,GAAG,YAAA;AAAA,KACL;AAAA,GACF;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"util.js","sources":["../../../src/components/IconsList/util.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { TIcon } from './types';\n\nexport function getBreakpoints(blockWidth: number) {\n return Array(Math.floor(4000 / blockWidth))\n .fill(1)\n .map((_, i) => (i + 1) * blockWidth);\n}\n\nexport function useStyles({\n containerWidth,\n iconWidth,\n breakPoint,\n verticalGap,\n removeHorizontalPadding,\n}: {\n containerWidth: number;\n iconWidth: number;\n breakPoint: number;\n verticalGap?: number;\n removeHorizontalPadding?: boolean;\n}) {\n const gap =\n (containerWidth - iconWidth * breakPoint) /\n (breakPoint + (removeHorizontalPadding ? -1 : 1));\n const sx = useMemo(\n () => ({\n justifyContent: 'space-evenly',\n gridTemplateColumns: `repeat(${breakPoint}, 1fr)`,\n rowGap: verticalGap ?? 0,\n columnGap: `${gap}px`,\n px: removeHorizontalPadding ? 0 : `${gap}px`,\n }),\n [removeHorizontalPadding, breakPoint, gap, verticalGap],\n );\n\n return sx;\n}\n\nexport const justToFillTheRow = 'JUST TO FILL THE ROW';\n\nexport function getRowIcons<P>({\n breakPoint,\n icons,\n i,\n}: {\n breakPoint: number;\n icons: TIcon<P>[];\n i: number;\n}) {\n const actualIcons: (string | TIcon<P>)[] = icons.slice(\n i * breakPoint,\n (i + 1) * breakPoint,\n );\n if (actualIcons.length < breakPoint)\n actualIcons.push(\n ...(Array(breakPoint - actualIcons.length).fill(\n justToFillTheRow,\n ) as string[]),\n );\n\n return actualIcons;\n}\n"],"names":[],"mappings":";;AAGO,SAAS,eAAe,UAAoB,EAAA;AACjD,EAAA,OAAO,MAAM,IAAK,CAAA,KAAA,CAAM,GAAO,GAAA,UAAU,CAAC,CACvC,CAAA,IAAA,CAAK,CAAC,CAAA,CACN,IAAI,CAAC,CAAA,EAAG,CAAO,KAAA,CAAA,CAAA,GAAI,KAAK,UAAU,CAAA,CAAA;AACvC,CAAA;AAEO,SAAS,SAAU,CAAA;AAAA,EACxB,cAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,uBAAA;AACF,CAMG,EAAA;AACD,EAAA,MAAM,OACH,cAAiB,GAAA,SAAA,GAAY,UAC7B,KAAA,UAAA,IAAc,0BAA0B,CAAK,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAChD,EAAA,MAAM,EAAK,GAAA,OAAA;AAAA,IACT,OAAO;AAAA,MACL,cAAgB,EAAA,cAAA;AAAA,MAChB,mBAAA,EAAqB,UAAU,UAAU,CAAA,MAAA,CAAA;AAAA,MACzC,QAAQ,WAAe,IAAA,CAAA;AAAA,MACvB,SAAA,EAAW,GAAG,GAAG,CAAA,EAAA,CAAA;AAAA,MACjB,EAAI,EAAA,uBAAA,GAA0B,CAAI,GAAA,CAAA,EAAG,GAAG,CAAA,EAAA,CAAA;AAAA,KAC1C,CAAA;AAAA,IACA,CAAC,uBAAA,EAAyB,UAAY,EAAA,GAAA,EAAK,WAAW,CAAA;AAAA,GACxD,CAAA;AAEA,EAAO,OAAA,EAAA,CAAA;AACT,CAAA;AAEO,MAAM,gBAAmB,GAAA,uBAAA;AAEzB,SAAS,WAAe,CAAA;AAAA,EAC7B,UAAA;AAAA,EACA,KAAA;AAAA,EACA,CAAA;AACF,CAIG,EAAA;AACD,EAAA,MAAM,cAAqC,KAAM,CAAA,KAAA;AAAA,IAC/C,CAAI,GAAA,UAAA;AAAA,IAAA,CACH,IAAI,CAAK,IAAA,UAAA;AAAA,GACZ,CAAA;AACA,EAAA,IAAI,YAAY,MAAS,GAAA,UAAA;AACvB,IAAY,WAAA,CAAA,IAAA;AAAA,MACV,GAAI,KAAA,CAAM,UAAa,GAAA,WAAA,CAAY,MAAM,CAAE,CAAA,IAAA;AAAA,QACzC,gBAAA;AAAA,OACF;AAAA,KACF,CAAA;AAEF,EAAO,OAAA,WAAA,CAAA;AACT;;;;"}
|
|
1
|
+
{"version":3,"file":"util.js","sources":["../../../src/components/IconsList/util.ts"],"sourcesContent":["import { useMemo } from 'react';\r\nimport { TIcon } from './types';\r\n\r\nexport function getBreakpoints(blockWidth: number) {\r\n return Array(Math.floor(4000 / blockWidth))\r\n .fill(1)\r\n .map((_, i) => (i + 1) * blockWidth);\r\n}\r\n\r\nexport function useStyles({\r\n containerWidth,\r\n iconWidth,\r\n breakPoint,\r\n verticalGap,\r\n removeHorizontalPadding,\r\n}: {\r\n containerWidth: number;\r\n iconWidth: number;\r\n breakPoint: number;\r\n verticalGap?: number;\r\n removeHorizontalPadding?: boolean;\r\n}) {\r\n const gap =\r\n (containerWidth - iconWidth * breakPoint) /\r\n (breakPoint + (removeHorizontalPadding ? -1 : 1));\r\n const sx = useMemo(\r\n () => ({\r\n justifyContent: 'space-evenly',\r\n gridTemplateColumns: `repeat(${breakPoint}, 1fr)`,\r\n rowGap: verticalGap ?? 0,\r\n columnGap: `${gap}px`,\r\n px: removeHorizontalPadding ? 0 : `${gap}px`,\r\n }),\r\n [removeHorizontalPadding, breakPoint, gap, verticalGap],\r\n );\r\n\r\n return sx;\r\n}\r\n\r\nexport const justToFillTheRow = 'JUST TO FILL THE ROW';\r\n\r\nexport function getRowIcons<P>({\r\n breakPoint,\r\n icons,\r\n i,\r\n}: {\r\n breakPoint: number;\r\n icons: TIcon<P>[];\r\n i: number;\r\n}) {\r\n const actualIcons: (string | TIcon<P>)[] = icons.slice(\r\n i * breakPoint,\r\n (i + 1) * breakPoint,\r\n );\r\n if (actualIcons.length < breakPoint)\r\n actualIcons.push(\r\n ...(Array(breakPoint - actualIcons.length).fill(\r\n justToFillTheRow,\r\n ) as string[]),\r\n );\r\n\r\n return actualIcons;\r\n}\r\n"],"names":[],"mappings":";;AAGO,SAAS,eAAe,UAAoB,EAAA;AACjD,EAAA,OAAO,MAAM,IAAK,CAAA,KAAA,CAAM,GAAO,GAAA,UAAU,CAAC,CACvC,CAAA,IAAA,CAAK,CAAC,CAAA,CACN,IAAI,CAAC,CAAA,EAAG,CAAO,KAAA,CAAA,CAAA,GAAI,KAAK,UAAU,CAAA,CAAA;AACvC,CAAA;AAEO,SAAS,SAAU,CAAA;AAAA,EACxB,cAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,uBAAA;AACF,CAMG,EAAA;AACD,EAAA,MAAM,OACH,cAAiB,GAAA,SAAA,GAAY,UAC7B,KAAA,UAAA,IAAc,0BAA0B,CAAK,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAChD,EAAA,MAAM,EAAK,GAAA,OAAA;AAAA,IACT,OAAO;AAAA,MACL,cAAgB,EAAA,cAAA;AAAA,MAChB,mBAAA,EAAqB,UAAU,UAAU,CAAA,MAAA,CAAA;AAAA,MACzC,QAAQ,WAAe,IAAA,CAAA;AAAA,MACvB,SAAA,EAAW,GAAG,GAAG,CAAA,EAAA,CAAA;AAAA,MACjB,EAAI,EAAA,uBAAA,GAA0B,CAAI,GAAA,CAAA,EAAG,GAAG,CAAA,EAAA,CAAA;AAAA,KAC1C,CAAA;AAAA,IACA,CAAC,uBAAA,EAAyB,UAAY,EAAA,GAAA,EAAK,WAAW,CAAA;AAAA,GACxD,CAAA;AAEA,EAAO,OAAA,EAAA,CAAA;AACT,CAAA;AAEO,MAAM,gBAAmB,GAAA,uBAAA;AAEzB,SAAS,WAAe,CAAA;AAAA,EAC7B,UAAA;AAAA,EACA,KAAA;AAAA,EACA,CAAA;AACF,CAIG,EAAA;AACD,EAAA,MAAM,cAAqC,KAAM,CAAA,KAAA;AAAA,IAC/C,CAAI,GAAA,UAAA;AAAA,IAAA,CACH,IAAI,CAAK,IAAA,UAAA;AAAA,GACZ,CAAA;AACA,EAAA,IAAI,YAAY,MAAS,GAAA,UAAA;AACvB,IAAY,WAAA,CAAA,IAAA;AAAA,MACV,GAAI,KAAA,CAAM,UAAa,GAAA,WAAA,CAAY,MAAM,CAAE,CAAA,IAAA;AAAA,QACzC,gBAAA;AAAA,OACF;AAAA,KACF,CAAA;AAEF,EAAO,OAAA,WAAA,CAAA;AACT;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.js","sources":["../../../src/components/ListBox/Combobox.tsx"],"sourcesContent":["import { ChangeEvent, FC, ReactNode, useCallback, useContext } from 'react';\nimport { ListboxContext } from './ListboxContext';\nimport { useDebouncedCallback } from '@apia/util';\nimport { Box, BoxProps, Input } from '@apia/theme';\n\nconst Combobox: FC<{ children: ReactNode } & BoxProps> = ({\n children,\n ...props\n}) => {\n const { id, listboxActions, useListbox } = useContext(ListboxContext);\n const run = useDebouncedCallback((ev: ChangeEvent<HTMLInputElement>) => {\n listboxActions.filter({ searchString: ev.target.value });\n });\n\n const ref = useListbox<HTMLInputElement>('searchbox', null);\n\n return (\n <>\n <Input\n ref={ref}\n type=\"text\"\n id={`${id}__searchbox`}\n placeholder=\"Search...\"\n aria-autocomplete=\"list\"\n aria-controls={`${id}__list__container`}\n role=\"combobox\"\n aria-expanded\n aria-haspopup=\"listbox\"\n onChange={run}\n autoComplete=\"off\"\n />\n <Box\n as=\"ul\"\n id={`${id}__list__container`}\n role=\"listbox\"\n className=\"listbox__list\"\n {...props}\n onClick={useCallback(() => {\n if (\n document.activeElement !==\n document.getElementById(`${id}__searchbox`)\n )\n document.getElementById(`${id}__searchbox`)?.focus();\n }, [id])}\n >\n {children}\n </Box>\n </>\n );\n};\n\nexport { Combobox };\n"],"names":[],"mappings":";;;;;;AAKA,MAAM,WAAmD,CAAC;AAAA,EACxD,QAAA;AAAA,EACA,GAAG,KAAA;AACL,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,EAAI,EAAA,cAAA,EAAgB,UAAW,EAAA,GAAI,WAAW,cAAc,CAAA,CAAA;AACpE,EAAM,MAAA,GAAA,GAAM,oBAAqB,CAAA,CAAC,EAAsC,KAAA;AACtE,IAAA,cAAA,CAAe,OAAO,EAAE,YAAA,EAAc,EAAG,CAAA,MAAA,CAAO,OAAO,CAAA,CAAA;AAAA,GACxD,CAAA,CAAA;AAED,EAAM,MAAA,GAAA,GAAM,UAA6B,CAAA,WAAA,EAAa,IAAI,CAAA,CAAA;AAE1D,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAK,EAAA,MAAA;AAAA,QACL,EAAA,EAAI,GAAG,EAAE,CAAA,WAAA,CAAA;AAAA,QACT,WAAY,EAAA,WAAA;AAAA,QACZ,mBAAkB,EAAA,MAAA;AAAA,QAClB,eAAA,EAAe,GAAG,EAAE,CAAA,iBAAA,CAAA;AAAA,QACpB,IAAK,EAAA,UAAA;AAAA,QACL,eAAa,EAAA,IAAA;AAAA,QACb,eAAc,EAAA,SAAA;AAAA,QACd,QAAU,EAAA,GAAA;AAAA,QACV,YAAa,EAAA,KAAA;AAAA,OAAA;AAAA,KACf;AAAA,oBACA,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,EAAG,EAAA,IAAA;AAAA,QACH,EAAA,EAAI,GAAG,EAAE,CAAA,iBAAA,CAAA;AAAA,QACT,IAAK,EAAA,SAAA;AAAA,QACL,SAAU,EAAA,eAAA;AAAA,QACT,GAAG,KAAA;AAAA,QACJ,OAAA,EAAS,YAAY,MAAM;AACzB,UAAA,IACE,SAAS,aACT,KAAA,QAAA,CAAS,cAAe,CAAA,CAAA,EAAG,EAAE,CAAa,WAAA,CAAA,CAAA;AAE1C,YAAA,QAAA,CAAS,cAAe,CAAA,CAAA,EAAG,EAAE,CAAA,WAAA,CAAa,GAAG,KAAM,EAAA,CAAA;AAAA,SACvD,EAAG,CAAC,EAAE,CAAC,CAAA;AAAA,QAEN,QAAA;AAAA,OAAA;AAAA,KACH;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"Combobox.js","sources":["../../../src/components/ListBox/Combobox.tsx"],"sourcesContent":["import { ChangeEvent, FC, ReactNode, useCallback, useContext } from 'react';\r\nimport { ListboxContext } from './ListboxContext';\r\nimport { useDebouncedCallback } from '@apia/util';\r\nimport { Box, BoxProps, Input } from '@apia/theme';\r\n\r\nconst Combobox: FC<{ children: ReactNode } & BoxProps> = ({\r\n children,\r\n ...props\r\n}) => {\r\n const { id, listboxActions, useListbox } = useContext(ListboxContext);\r\n const run = useDebouncedCallback((ev: ChangeEvent<HTMLInputElement>) => {\r\n listboxActions.filter({ searchString: ev.target.value });\r\n });\r\n\r\n const ref = useListbox<HTMLInputElement>('searchbox', null);\r\n\r\n return (\r\n <>\r\n <Input\r\n ref={ref}\r\n type=\"text\"\r\n id={`${id}__searchbox`}\r\n placeholder=\"Search...\"\r\n aria-autocomplete=\"list\"\r\n aria-controls={`${id}__list__container`}\r\n role=\"combobox\"\r\n aria-expanded\r\n aria-haspopup=\"listbox\"\r\n onChange={run}\r\n autoComplete=\"off\"\r\n />\r\n <Box\r\n as=\"ul\"\r\n id={`${id}__list__container`}\r\n role=\"listbox\"\r\n className=\"listbox__list\"\r\n {...props}\r\n onClick={useCallback(() => {\r\n if (\r\n document.activeElement !==\r\n document.getElementById(`${id}__searchbox`)\r\n )\r\n document.getElementById(`${id}__searchbox`)?.focus();\r\n }, [id])}\r\n >\r\n {children}\r\n </Box>\r\n </>\r\n );\r\n};\r\n\r\nexport { Combobox };\r\n"],"names":[],"mappings":";;;;;;AAKA,MAAM,WAAmD,CAAC;AAAA,EACxD,QAAA;AAAA,EACA,GAAG,KAAA;AACL,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,EAAI,EAAA,cAAA,EAAgB,UAAW,EAAA,GAAI,WAAW,cAAc,CAAA,CAAA;AACpE,EAAM,MAAA,GAAA,GAAM,oBAAqB,CAAA,CAAC,EAAsC,KAAA;AACtE,IAAA,cAAA,CAAe,OAAO,EAAE,YAAA,EAAc,EAAG,CAAA,MAAA,CAAO,OAAO,CAAA,CAAA;AAAA,GACxD,CAAA,CAAA;AAED,EAAM,MAAA,GAAA,GAAM,UAA6B,CAAA,WAAA,EAAa,IAAI,CAAA,CAAA;AAE1D,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAK,EAAA,MAAA;AAAA,QACL,EAAA,EAAI,GAAG,EAAE,CAAA,WAAA,CAAA;AAAA,QACT,WAAY,EAAA,WAAA;AAAA,QACZ,mBAAkB,EAAA,MAAA;AAAA,QAClB,eAAA,EAAe,GAAG,EAAE,CAAA,iBAAA,CAAA;AAAA,QACpB,IAAK,EAAA,UAAA;AAAA,QACL,eAAa,EAAA,IAAA;AAAA,QACb,eAAc,EAAA,SAAA;AAAA,QACd,QAAU,EAAA,GAAA;AAAA,QACV,YAAa,EAAA,KAAA;AAAA,OAAA;AAAA,KACf;AAAA,oBACA,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,EAAG,EAAA,IAAA;AAAA,QACH,EAAA,EAAI,GAAG,EAAE,CAAA,iBAAA,CAAA;AAAA,QACT,IAAK,EAAA,SAAA;AAAA,QACL,SAAU,EAAA,eAAA;AAAA,QACT,GAAG,KAAA;AAAA,QACJ,OAAA,EAAS,YAAY,MAAM;AACzB,UAAA,IACE,SAAS,aACT,KAAA,QAAA,CAAS,cAAe,CAAA,CAAA,EAAG,EAAE,CAAa,WAAA,CAAA,CAAA;AAE1C,YAAA,QAAA,CAAS,cAAe,CAAA,CAAA,EAAG,EAAE,CAAA,WAAA,CAAa,GAAG,KAAM,EAAA,CAAA;AAAA,SACvD,EAAG,CAAC,EAAE,CAAC,CAAA;AAAA,QAEN,QAAA;AAAA,OAAA;AAAA,KACH;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"listbox.js","sources":["../../../src/components/ListBox/listbox.ts"],"sourcesContent":["import { focusOutline } from '@apia/theme';\nimport { ThemeUICSSObject } from '@apia/theme';\n\nexport const styles: ThemeUICSSObject = {\n '&:focus-within': {\n '.listbox__list': {\n outline: 'none',\n },\n\n '.focused': focusOutline,\n\n '&.withSearchbox': {\n '.focused': {\n outline: '1px solid',\n outlineColor: 'palette.border.field',\n outlineOffset: 0,\n },\n '.listbox__searchbox': focusOutline,\n },\n },\n\n '.listbox__list': {\n listStyle: 'none',\n m: 0,\n p: 0,\n },\n\n '&.withSearchbox': {\n '.listbox__list': {\n maxHeight: 'calc(100vh - 80px)',\n overflow: 'auto',\n },\n },\n\n '.listbox__row': {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n\n '&:hover': (theme) => {\n return {\n ...theme.palette.getOneState(\n { backgroundColor: 'palette.background.paper' },\n 'hover',\n ),\n cursor: 'pointer',\n };\n },\n },\n};\n"],"names":[],"mappings":";;AAGO,MAAM,MAA2B,GAAA;AAAA,EACtC,gBAAkB,EAAA;AAAA,IAChB,gBAAkB,EAAA;AAAA,MAChB,OAAS,EAAA,MAAA;AAAA,KACX;AAAA,IAEA,UAAY,EAAA,YAAA;AAAA,IAEZ,iBAAmB,EAAA;AAAA,MACjB,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,YAAc,EAAA,sBAAA;AAAA,QACd,aAAe,EAAA,CAAA;AAAA,OACjB;AAAA,MACA,qBAAuB,EAAA,YAAA;AAAA,KACzB;AAAA,GACF;AAAA,EAEA,gBAAkB,EAAA;AAAA,IAChB,SAAW,EAAA,MAAA;AAAA,IACX,CAAG,EAAA,CAAA;AAAA,IACH,CAAG,EAAA,CAAA;AAAA,GACL;AAAA,EAEA,iBAAmB,EAAA;AAAA,IACjB,gBAAkB,EAAA;AAAA,MAChB,SAAW,EAAA,oBAAA;AAAA,MACX,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,GACF;AAAA,EAEA,eAAiB,EAAA;AAAA,IACf,QAAU,EAAA,QAAA;AAAA,IACV,UAAY,EAAA,QAAA;AAAA,IACZ,YAAc,EAAA,UAAA;AAAA,IAEd,SAAA,EAAW,CAAC,KAAU,KAAA;AACpB,MAAO,OAAA;AAAA,QACL,GAAG,MAAM,OAAQ,CAAA,WAAA;AAAA,UACf,EAAE,iBAAiB,0BAA2B,EAAA;AAAA,UAC9C,OAAA;AAAA,SACF;AAAA,QACA,MAAQ,EAAA,SAAA;AAAA,OACV,CAAA;AAAA,KACF;AAAA,GACF;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"listbox.js","sources":["../../../src/components/ListBox/listbox.ts"],"sourcesContent":["import { focusOutline } from '@apia/theme';\r\nimport { ThemeUICSSObject } from '@apia/theme';\r\n\r\nexport const styles: ThemeUICSSObject = {\r\n '&:focus-within': {\r\n '.listbox__list': {\r\n outline: 'none',\r\n },\r\n\r\n '.focused': focusOutline,\r\n\r\n '&.withSearchbox': {\r\n '.focused': {\r\n outline: '1px solid',\r\n outlineColor: 'palette.border.field',\r\n outlineOffset: 0,\r\n },\r\n '.listbox__searchbox': focusOutline,\r\n },\r\n },\r\n\r\n '.listbox__list': {\r\n listStyle: 'none',\r\n m: 0,\r\n p: 0,\r\n },\r\n\r\n '&.withSearchbox': {\r\n '.listbox__list': {\r\n maxHeight: 'calc(100vh - 80px)',\r\n overflow: 'auto',\r\n },\r\n },\r\n\r\n '.listbox__row': {\r\n overflow: 'hidden',\r\n whiteSpace: 'nowrap',\r\n textOverflow: 'ellipsis',\r\n\r\n '&:hover': (theme) => {\r\n return {\r\n ...theme.palette.getOneState(\r\n { backgroundColor: 'palette.background.paper' },\r\n 'hover',\r\n ),\r\n cursor: 'pointer',\r\n };\r\n },\r\n },\r\n};\r\n"],"names":[],"mappings":";;AAGO,MAAM,MAA2B,GAAA;AAAA,EACtC,gBAAkB,EAAA;AAAA,IAChB,gBAAkB,EAAA;AAAA,MAChB,OAAS,EAAA,MAAA;AAAA,KACX;AAAA,IAEA,UAAY,EAAA,YAAA;AAAA,IAEZ,iBAAmB,EAAA;AAAA,MACjB,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,WAAA;AAAA,QACT,YAAc,EAAA,sBAAA;AAAA,QACd,aAAe,EAAA,CAAA;AAAA,OACjB;AAAA,MACA,qBAAuB,EAAA,YAAA;AAAA,KACzB;AAAA,GACF;AAAA,EAEA,gBAAkB,EAAA;AAAA,IAChB,SAAW,EAAA,MAAA;AAAA,IACX,CAAG,EAAA,CAAA;AAAA,IACH,CAAG,EAAA,CAAA;AAAA,GACL;AAAA,EAEA,iBAAmB,EAAA;AAAA,IACjB,gBAAkB,EAAA;AAAA,MAChB,SAAW,EAAA,oBAAA;AAAA,MACX,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,GACF;AAAA,EAEA,eAAiB,EAAA;AAAA,IACf,QAAU,EAAA,QAAA;AAAA,IACV,UAAY,EAAA,QAAA;AAAA,IACZ,YAAc,EAAA,UAAA;AAAA,IAEd,SAAA,EAAW,CAAC,KAAU,KAAA;AACpB,MAAO,OAAA;AAAA,QACL,GAAG,MAAM,OAAQ,CAAA,WAAA;AAAA,UACf,EAAE,iBAAiB,0BAA2B,EAAA;AAAA,UAC9C,OAAA;AAAA,SACF;AAAA,QACA,MAAQ,EAAA,SAAA;AAAA,OACV,CAAA;AAAA,KACF;AAAA,GACF;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"operations.js","sources":["../../../src/components/ListBox/operations.ts"],"sourcesContent":["import { Draft, TKeysDefine } from '@apia/dom-store';\nimport { TListboxState, makeRowKey } from './common';\nimport { addBoundary, getIndex } from '@apia/util';\n\ntype TListboxOperation<Payload> = (\n state: Draft<TListboxState>,\n payload: Payload,\n keys: TKeysDefine,\n) => void;\n\nconst filter: TListboxOperation<{\n searchString: string;\n}> = makeOperation((state, { searchString }, keys) => {\n let focusChanged = false;\n const rows = new Array(state.rowsCount).fill(1).map((_, i) => i);\n\n const shownRows: number[] = [];\n const hiddenRows = rows.filter((_, i) => {\n const el = document.getElementById(`${state.id}__row__${i}`);\n if (!el) {\n console.warn('Element not found', `${state.id}__row__${i}`);\n return false;\n }\n\n const matches = state.searchFunction(el.ariaLabel ?? '', searchString);\n\n if (matches) {\n el.style.display = 'block';\n } else {\n el.style.display = 'none';\n }\n\n if (matches) shownRows.push(i);\n else if (state.focusedRow === i) {\n focusChanged = true;\n }\n\n return !matches;\n });\n keys.set(hiddenRows.map((current) => makeRowKey(current)));\n state.hiddenRows = hiddenRows;\n state.shownRows = shownRows;\n\n if (focusChanged) {\n for (const row of rows) {\n if (!hiddenRows.includes(row)) {\n state.focusedRow = row;\n keys.push(makeRowKey(row));\n keys.push(makeRowKey(state.focusedRow));\n break;\n }\n }\n }\n});\n\nfunction makeOperation<T>(operation: TListboxOperation<T>) {\n const method: TListboxOperation<T> = (state, payload, keys) => {\n keys.push('searchbox');\n keys.push('listbox');\n operation(state, payload, keys);\n };\n return method;\n}\n\nconst moveFocusAndToggleSelection: TListboxOperation<{\n isShiftKey: boolean;\n which: 'next' | 'previous' | 'first' | 'last' | 'pageUp' | 'pageDown';\n}> = makeOperation((state, { isShiftKey, which }, keys) => {\n if (state.shownRows.length <= 1) {\n keys.push(makeRowKey(state.focusedRow));\n state.focusedRow = state.shownRows[0];\n\n if (state.shownRows.length === 1) keys.push(makeRowKey(state.focusedRow));\n\n return;\n }\n\n switch (which) {\n case 'first':\n {\n const newFocused = state.shownRows[0];\n if (newFocused === state.focusedRow) return;\n\n keys.push(makeRowKey(state.focusedRow));\n keys.push(makeRowKey(newFocused));\n\n if (state.isMultipleSelection) {\n if (isShiftKey) {\n const selectedElements = new Array(state.focusedRow + 1)\n .fill(1)\n .map((_, i) => i);\n keys.set(selectedElements.map((_, i) => makeRowKey(i)));\n state.selectedRows = selectedElements;\n state.lastSelectedRow = newFocused;\n }\n } else {\n state.selectedRows = [newFocused];\n state.lastSelectedRow = newFocused;\n }\n\n state.focusedRow = newFocused;\n }\n break;\n case 'last':\n {\n const newFocused = state.shownRows[state.shownRows.length - 1];\n if (newFocused === state.focusedRow) return;\n\n keys.push(makeRowKey(state.focusedRow));\n keys.push(makeRowKey(newFocused));\n\n if (state.isMultipleSelection) {\n if (isShiftKey) {\n const selectedElements = new Array(\n state.rowsCount - state.focusedRow,\n )\n .fill(1)\n .map((_, i) => i + Math.min(newFocused, state.focusedRow));\n keys.push(...selectedElements.map((i) => makeRowKey(i)));\n state.selectedRows = selectedElements;\n state.lastSelectedRow = newFocused;\n }\n } else {\n state.selectedRows = [newFocused];\n state.lastSelectedRow = newFocused;\n }\n\n state.focusedRow = newFocused;\n }\n break;\n case 'previous':\n case 'next':\n case 'pageDown':\n case 'pageUp':\n {\n const sum = getIndex(\n [-1, 1, -10, 10],\n [\n which === 'previous',\n which === 'next',\n which === 'pageUp',\n which === 'pageDown',\n ],\n );\n\n const currentIndex = state.shownRows.findIndex(\n (current) => state.focusedRow === current,\n );\n const newFocused =\n state.shownRows[\n addBoundary({\n number: currentIndex + sum,\n min: 0,\n max: state.shownRows.length - 1,\n })\n ];\n if (newFocused === state.focusedRow) return;\n\n keys.push(makeRowKey(state.focusedRow));\n keys.push(makeRowKey(newFocused));\n\n if (state.isMultipleSelection) {\n if (isShiftKey) {\n if (state.selectedRows.includes(newFocused)) {\n state.selectedRows = state.selectedRows.filter(\n (current) => current !== newFocused,\n );\n } else {\n state.selectedRows.push(newFocused);\n }\n state.lastSelectedRow = newFocused;\n }\n } else {\n state.selectedRows = [newFocused];\n state.lastSelectedRow = newFocused;\n }\n\n state.focusedRow = newFocused;\n }\n break;\n }\n state.isEverythingSelected = false;\n});\n\nconst resetFocus: TListboxOperation<null> = makeOperation((state, _, keys) => {\n keys.push(makeRowKey(state.focusedRow));\n state.focusedRow = 0;\n keys.push(makeRowKey(0));\n});\n\nconst searchElementsByStartingCharacters: TListboxOperation<{\n characters: string;\n}> = makeOperation((state, payload, keys) => {\n const currentIndex = state.shownRows.findIndex(\n (current) => current === state.focusedRow,\n );\n\n function match(rowIndex: number) {\n keys.push(makeRowKey(state.focusedRow));\n\n state.focusedRow = rowIndex;\n\n if (!state.isMultipleSelection) {\n keys.push(...state.selectedRows.map((current) => makeRowKey(current)));\n state.selectedRows = [rowIndex];\n }\n\n keys.push(makeRowKey(state.focusedRow));\n }\n\n function tryIndex(rowIndex: number) {\n const el = document.getElementById(`${state.id}__row__${rowIndex}`);\n if (!el) {\n console.warn('Element not found', `${state.id}__row__${rowIndex}`);\n return false;\n }\n\n const matches = state.startsWithFunction(\n el.ariaLabel ?? '',\n payload.characters,\n );\n\n if (matches) {\n match(state.shownRows[rowIndex]);\n return true;\n }\n\n return false;\n }\n\n for (let i = currentIndex + 1; i < state.shownRows.length; i++) {\n if (tryIndex(i)) return;\n }\n\n for (let i = 0; i < currentIndex; i++) {\n if (tryIndex(i)) return;\n }\n});\n\n/**\n * No actualiza ningún key porque al llamar a selectAll, todos los elementos\n * son afectados y el comportamiento por defecto del store es actualizar todo\n */\nconst selectAll: TListboxOperation<void> = makeOperation(\n (state, payload, keys) => {\n keys.push(...state.selectedRows.map(makeRowKey));\n if (state.isEverythingSelected) {\n state.isEverythingSelected = false;\n state.selectedRows = [];\n } else {\n state.isEverythingSelected = true;\n state.selectedRows = state.shownRows;\n }\n state.lastSelectedRow = state.focusedRow;\n keys.push(...state.shownRows.map(makeRowKey));\n },\n);\n\nconst setState: TListboxOperation<\n Partial<TListboxState> & { affectedKeys: string[] }\n> = makeOperation((state, { affectedKeys, ...payload }, keys) => {\n const newRowsCount = payload.rowsCount ?? state.rowsCount;\n if (state.rowsCount < newRowsCount) {\n for (let i = state.rowsCount; i < (payload.rowsCount as number); i++) {\n state.shownRows.push(i);\n }\n } else if (state.rowsCount > newRowsCount) {\n state.shownRows = state.shownRows.filter(\n (current) => current < newRowsCount,\n );\n if (state.focusedRow > newRowsCount - 1) {\n state.focusedRow = newRowsCount - 1;\n keys.push(makeRowKey(state.focusedRow));\n }\n state.selectedRows = state.selectedRows.filter(\n (current) => current < newRowsCount,\n );\n }\n\n Object.assign(state, payload);\n keys.set(affectedKeys);\n state.isEverythingSelected = false;\n});\n\nconst updateFocusByClickEvent: TListboxOperation<{\n rowIndex: number;\n isCtrlKey: boolean;\n isShiftKey: boolean;\n}> = makeOperation((state, payload, keys) => {\n keys.push(makeRowKey(state.focusedRow));\n keys.push(makeRowKey(payload.rowIndex));\n\n state.focusedRow = payload.rowIndex;\n if (payload.isShiftKey) {\n updateFocusBySpaceEvent(state, { isShiftKey: payload.isShiftKey }, keys);\n } else {\n state.lastSelectedRow = payload.rowIndex;\n if (payload.isCtrlKey) {\n if (state.selectedRows.includes(payload.rowIndex)) {\n state.selectedRows = state.selectedRows.filter(\n (current) => current !== payload.rowIndex,\n );\n } else {\n state.selectedRows.push(payload.rowIndex);\n }\n } else {\n keys.push(...state.selectedRows.map((current) => makeRowKey(current)));\n state.selectedRows = [state.focusedRow];\n }\n }\n});\n\nconst updateFocusBySpaceEvent: TListboxOperation<{\n isShiftKey: boolean;\n}> = makeOperation((state, { isShiftKey }, keys) => {\n const rowIndex = state.focusedRow;\n keys.push(makeRowKey(rowIndex));\n if (state.isMultipleSelection) {\n if (isShiftKey) {\n if (state.lastSelectedRow === -1) {\n state.selectedRows.push(rowIndex);\n } else {\n const newSelection = new Array(\n Math.abs(state.lastSelectedRow - rowIndex),\n )\n .fill(1)\n .map(\n (_, i) =>\n i +\n Math.min(rowIndex, state.lastSelectedRow) +\n (state.lastSelectedRow > rowIndex ? 0 : 1),\n );\n keys.push(...newSelection.map((current) => makeRowKey(current)));\n newSelection.forEach((current) => {\n if (!state.shownRows.includes(current)) return;\n\n if (state.selectedRows.includes(current)) {\n state.selectedRows = state.selectedRows.filter(\n (search) => search !== current,\n );\n } else {\n state.selectedRows.push(current);\n }\n });\n }\n } else {\n if (state.selectedRows.includes(rowIndex)) {\n state.selectedRows = state.selectedRows.filter(\n (current) => current !== rowIndex,\n );\n } else {\n state.selectedRows.push(rowIndex);\n }\n }\n }\n state.lastSelectedRow = rowIndex;\n});\n\nconst operations = {\n filter,\n /**\n // eslint-disable-next-line comment-length/limit-multi-line-comments\n * **Este método debe llamarse solamente cuando se efectúan acciones desde el\n * teclado**. Su función es controlar el flujo correcto de foco y selección de\n * acuerdo a las especificaciones de wai-aria.\n */\n moveFocusAndToggleSelection,\n resetFocus,\n /**\n * Este método debe utilizarse para la búsqueda por caracter simple o\n * múltiple en cuanto a la implementación de las funcionalidades\n * especificadas por wai-aria.\n */\n searchElementsByStartingCharacters,\n /**\n * **Método empleado cuando se presiona ctrl+shift+A**. Su función es\n * controlar el flujo correcto de foco y selección de acuerdo a las\n * especificaciones de wai-aria.\n */\n selectAll,\n /**\n * Permite alterar el estado en forma arbitraria. Debe pasarse un array con\n * los keys afectados por la acción efectuada.\n */\n setState,\n /**\n * **Este método debe llamarse solamente cuando se efectúan acciones con el\n * mouse**. Su función es controlar el flujo correcto de foco y selección de\n * acuerdo a las especificaciones de wai-aria.\n */\n updateFocusByClickEvent,\n /**\n * **Este método debe llamarse solamente cuando se efectúan acciones con la\n * tecla espacio**. Su función es controlar el flujo correcto de foco y\n * selección de acuerdo a las especificaciones de wai-aria.\n */\n updateFocusBySpaceEvent,\n};\nexport { operations };\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"operations.js","sources":["../../../src/components/ListBox/operations.ts"],"sourcesContent":["import { Draft, TKeysDefine } from '@apia/dom-store';\r\nimport { TListboxState, makeRowKey } from './common';\r\nimport { addBoundary, getIndex } from '@apia/util';\r\n\r\ntype TListboxOperation<Payload> = (\r\n state: Draft<TListboxState>,\r\n payload: Payload,\r\n keys: TKeysDefine,\r\n) => void;\r\n\r\nconst filter: TListboxOperation<{\r\n searchString: string;\r\n}> = makeOperation((state, { searchString }, keys) => {\r\n let focusChanged = false;\r\n const rows = new Array(state.rowsCount).fill(1).map((_, i) => i);\r\n\r\n const shownRows: number[] = [];\r\n const hiddenRows = rows.filter((_, i) => {\r\n const el = document.getElementById(`${state.id}__row__${i}`);\r\n if (!el) {\r\n console.warn('Element not found', `${state.id}__row__${i}`);\r\n return false;\r\n }\r\n\r\n const matches = state.searchFunction(el.ariaLabel ?? '', searchString);\r\n\r\n if (matches) {\r\n el.style.display = 'block';\r\n } else {\r\n el.style.display = 'none';\r\n }\r\n\r\n if (matches) shownRows.push(i);\r\n else if (state.focusedRow === i) {\r\n focusChanged = true;\r\n }\r\n\r\n return !matches;\r\n });\r\n keys.set(hiddenRows.map((current) => makeRowKey(current)));\r\n state.hiddenRows = hiddenRows;\r\n state.shownRows = shownRows;\r\n\r\n if (focusChanged) {\r\n for (const row of rows) {\r\n if (!hiddenRows.includes(row)) {\r\n state.focusedRow = row;\r\n keys.push(makeRowKey(row));\r\n keys.push(makeRowKey(state.focusedRow));\r\n break;\r\n }\r\n }\r\n }\r\n});\r\n\r\nfunction makeOperation<T>(operation: TListboxOperation<T>) {\r\n const method: TListboxOperation<T> = (state, payload, keys) => {\r\n keys.push('searchbox');\r\n keys.push('listbox');\r\n operation(state, payload, keys);\r\n };\r\n return method;\r\n}\r\n\r\nconst moveFocusAndToggleSelection: TListboxOperation<{\r\n isShiftKey: boolean;\r\n which: 'next' | 'previous' | 'first' | 'last' | 'pageUp' | 'pageDown';\r\n}> = makeOperation((state, { isShiftKey, which }, keys) => {\r\n if (state.shownRows.length <= 1) {\r\n keys.push(makeRowKey(state.focusedRow));\r\n state.focusedRow = state.shownRows[0];\r\n\r\n if (state.shownRows.length === 1) keys.push(makeRowKey(state.focusedRow));\r\n\r\n return;\r\n }\r\n\r\n switch (which) {\r\n case 'first':\r\n {\r\n const newFocused = state.shownRows[0];\r\n if (newFocused === state.focusedRow) return;\r\n\r\n keys.push(makeRowKey(state.focusedRow));\r\n keys.push(makeRowKey(newFocused));\r\n\r\n if (state.isMultipleSelection) {\r\n if (isShiftKey) {\r\n const selectedElements = new Array(state.focusedRow + 1)\r\n .fill(1)\r\n .map((_, i) => i);\r\n keys.set(selectedElements.map((_, i) => makeRowKey(i)));\r\n state.selectedRows = selectedElements;\r\n state.lastSelectedRow = newFocused;\r\n }\r\n } else {\r\n state.selectedRows = [newFocused];\r\n state.lastSelectedRow = newFocused;\r\n }\r\n\r\n state.focusedRow = newFocused;\r\n }\r\n break;\r\n case 'last':\r\n {\r\n const newFocused = state.shownRows[state.shownRows.length - 1];\r\n if (newFocused === state.focusedRow) return;\r\n\r\n keys.push(makeRowKey(state.focusedRow));\r\n keys.push(makeRowKey(newFocused));\r\n\r\n if (state.isMultipleSelection) {\r\n if (isShiftKey) {\r\n const selectedElements = new Array(\r\n state.rowsCount - state.focusedRow,\r\n )\r\n .fill(1)\r\n .map((_, i) => i + Math.min(newFocused, state.focusedRow));\r\n keys.push(...selectedElements.map((i) => makeRowKey(i)));\r\n state.selectedRows = selectedElements;\r\n state.lastSelectedRow = newFocused;\r\n }\r\n } else {\r\n state.selectedRows = [newFocused];\r\n state.lastSelectedRow = newFocused;\r\n }\r\n\r\n state.focusedRow = newFocused;\r\n }\r\n break;\r\n case 'previous':\r\n case 'next':\r\n case 'pageDown':\r\n case 'pageUp':\r\n {\r\n const sum = getIndex(\r\n [-1, 1, -10, 10],\r\n [\r\n which === 'previous',\r\n which === 'next',\r\n which === 'pageUp',\r\n which === 'pageDown',\r\n ],\r\n );\r\n\r\n const currentIndex = state.shownRows.findIndex(\r\n (current) => state.focusedRow === current,\r\n );\r\n const newFocused =\r\n state.shownRows[\r\n addBoundary({\r\n number: currentIndex + sum,\r\n min: 0,\r\n max: state.shownRows.length - 1,\r\n })\r\n ];\r\n if (newFocused === state.focusedRow) return;\r\n\r\n keys.push(makeRowKey(state.focusedRow));\r\n keys.push(makeRowKey(newFocused));\r\n\r\n if (state.isMultipleSelection) {\r\n if (isShiftKey) {\r\n if (state.selectedRows.includes(newFocused)) {\r\n state.selectedRows = state.selectedRows.filter(\r\n (current) => current !== newFocused,\r\n );\r\n } else {\r\n state.selectedRows.push(newFocused);\r\n }\r\n state.lastSelectedRow = newFocused;\r\n }\r\n } else {\r\n state.selectedRows = [newFocused];\r\n state.lastSelectedRow = newFocused;\r\n }\r\n\r\n state.focusedRow = newFocused;\r\n }\r\n break;\r\n }\r\n state.isEverythingSelected = false;\r\n});\r\n\r\nconst resetFocus: TListboxOperation<null> = makeOperation((state, _, keys) => {\r\n keys.push(makeRowKey(state.focusedRow));\r\n state.focusedRow = 0;\r\n keys.push(makeRowKey(0));\r\n});\r\n\r\nconst searchElementsByStartingCharacters: TListboxOperation<{\r\n characters: string;\r\n}> = makeOperation((state, payload, keys) => {\r\n const currentIndex = state.shownRows.findIndex(\r\n (current) => current === state.focusedRow,\r\n );\r\n\r\n function match(rowIndex: number) {\r\n keys.push(makeRowKey(state.focusedRow));\r\n\r\n state.focusedRow = rowIndex;\r\n\r\n if (!state.isMultipleSelection) {\r\n keys.push(...state.selectedRows.map((current) => makeRowKey(current)));\r\n state.selectedRows = [rowIndex];\r\n }\r\n\r\n keys.push(makeRowKey(state.focusedRow));\r\n }\r\n\r\n function tryIndex(rowIndex: number) {\r\n const el = document.getElementById(`${state.id}__row__${rowIndex}`);\r\n if (!el) {\r\n console.warn('Element not found', `${state.id}__row__${rowIndex}`);\r\n return false;\r\n }\r\n\r\n const matches = state.startsWithFunction(\r\n el.ariaLabel ?? '',\r\n payload.characters,\r\n );\r\n\r\n if (matches) {\r\n match(state.shownRows[rowIndex]);\r\n return true;\r\n }\r\n\r\n return false;\r\n }\r\n\r\n for (let i = currentIndex + 1; i < state.shownRows.length; i++) {\r\n if (tryIndex(i)) return;\r\n }\r\n\r\n for (let i = 0; i < currentIndex; i++) {\r\n if (tryIndex(i)) return;\r\n }\r\n});\r\n\r\n/**\r\n * No actualiza ningún key porque al llamar a selectAll, todos los elementos\r\n * son afectados y el comportamiento por defecto del store es actualizar todo\r\n */\r\nconst selectAll: TListboxOperation<void> = makeOperation(\r\n (state, payload, keys) => {\r\n keys.push(...state.selectedRows.map(makeRowKey));\r\n if (state.isEverythingSelected) {\r\n state.isEverythingSelected = false;\r\n state.selectedRows = [];\r\n } else {\r\n state.isEverythingSelected = true;\r\n state.selectedRows = state.shownRows;\r\n }\r\n state.lastSelectedRow = state.focusedRow;\r\n keys.push(...state.shownRows.map(makeRowKey));\r\n },\r\n);\r\n\r\nconst setState: TListboxOperation<\r\n Partial<TListboxState> & { affectedKeys: string[] }\r\n> = makeOperation((state, { affectedKeys, ...payload }, keys) => {\r\n const newRowsCount = payload.rowsCount ?? state.rowsCount;\r\n if (state.rowsCount < newRowsCount) {\r\n for (let i = state.rowsCount; i < (payload.rowsCount as number); i++) {\r\n state.shownRows.push(i);\r\n }\r\n } else if (state.rowsCount > newRowsCount) {\r\n state.shownRows = state.shownRows.filter(\r\n (current) => current < newRowsCount,\r\n );\r\n if (state.focusedRow > newRowsCount - 1) {\r\n state.focusedRow = newRowsCount - 1;\r\n keys.push(makeRowKey(state.focusedRow));\r\n }\r\n state.selectedRows = state.selectedRows.filter(\r\n (current) => current < newRowsCount,\r\n );\r\n }\r\n\r\n Object.assign(state, payload);\r\n keys.set(affectedKeys);\r\n state.isEverythingSelected = false;\r\n});\r\n\r\nconst updateFocusByClickEvent: TListboxOperation<{\r\n rowIndex: number;\r\n isCtrlKey: boolean;\r\n isShiftKey: boolean;\r\n}> = makeOperation((state, payload, keys) => {\r\n keys.push(makeRowKey(state.focusedRow));\r\n keys.push(makeRowKey(payload.rowIndex));\r\n\r\n state.focusedRow = payload.rowIndex;\r\n if (payload.isShiftKey) {\r\n updateFocusBySpaceEvent(state, { isShiftKey: payload.isShiftKey }, keys);\r\n } else {\r\n state.lastSelectedRow = payload.rowIndex;\r\n if (payload.isCtrlKey) {\r\n if (state.selectedRows.includes(payload.rowIndex)) {\r\n state.selectedRows = state.selectedRows.filter(\r\n (current) => current !== payload.rowIndex,\r\n );\r\n } else {\r\n state.selectedRows.push(payload.rowIndex);\r\n }\r\n } else {\r\n keys.push(...state.selectedRows.map((current) => makeRowKey(current)));\r\n state.selectedRows = [state.focusedRow];\r\n }\r\n }\r\n});\r\n\r\nconst updateFocusBySpaceEvent: TListboxOperation<{\r\n isShiftKey: boolean;\r\n}> = makeOperation((state, { isShiftKey }, keys) => {\r\n const rowIndex = state.focusedRow;\r\n keys.push(makeRowKey(rowIndex));\r\n if (state.isMultipleSelection) {\r\n if (isShiftKey) {\r\n if (state.lastSelectedRow === -1) {\r\n state.selectedRows.push(rowIndex);\r\n } else {\r\n const newSelection = new Array(\r\n Math.abs(state.lastSelectedRow - rowIndex),\r\n )\r\n .fill(1)\r\n .map(\r\n (_, i) =>\r\n i +\r\n Math.min(rowIndex, state.lastSelectedRow) +\r\n (state.lastSelectedRow > rowIndex ? 0 : 1),\r\n );\r\n keys.push(...newSelection.map((current) => makeRowKey(current)));\r\n newSelection.forEach((current) => {\r\n if (!state.shownRows.includes(current)) return;\r\n\r\n if (state.selectedRows.includes(current)) {\r\n state.selectedRows = state.selectedRows.filter(\r\n (search) => search !== current,\r\n );\r\n } else {\r\n state.selectedRows.push(current);\r\n }\r\n });\r\n }\r\n } else {\r\n if (state.selectedRows.includes(rowIndex)) {\r\n state.selectedRows = state.selectedRows.filter(\r\n (current) => current !== rowIndex,\r\n );\r\n } else {\r\n state.selectedRows.push(rowIndex);\r\n }\r\n }\r\n }\r\n state.lastSelectedRow = rowIndex;\r\n});\r\n\r\nconst operations = {\r\n filter,\r\n /**\r\n // eslint-disable-next-line comment-length/limit-multi-line-comments\r\n * **Este método debe llamarse solamente cuando se efectúan acciones desde el\r\n * teclado**. Su función es controlar el flujo correcto de foco y selección de\r\n * acuerdo a las especificaciones de wai-aria.\r\n */\r\n moveFocusAndToggleSelection,\r\n resetFocus,\r\n /**\r\n * Este método debe utilizarse para la búsqueda por caracter simple o\r\n * múltiple en cuanto a la implementación de las funcionalidades\r\n * especificadas por wai-aria.\r\n */\r\n searchElementsByStartingCharacters,\r\n /**\r\n * **Método empleado cuando se presiona ctrl+shift+A**. Su función es\r\n * controlar el flujo correcto de foco y selección de acuerdo a las\r\n * especificaciones de wai-aria.\r\n */\r\n selectAll,\r\n /**\r\n * Permite alterar el estado en forma arbitraria. Debe pasarse un array con\r\n * los keys afectados por la acción efectuada.\r\n */\r\n setState,\r\n /**\r\n * **Este método debe llamarse solamente cuando se efectúan acciones con el\r\n * mouse**. Su función es controlar el flujo correcto de foco y selección de\r\n * acuerdo a las especificaciones de wai-aria.\r\n */\r\n updateFocusByClickEvent,\r\n /**\r\n * **Este método debe llamarse solamente cuando se efectúan acciones con la\r\n * tecla espacio**. Su función es controlar el flujo correcto de foco y\r\n * selección de acuerdo a las especificaciones de wai-aria.\r\n */\r\n updateFocusBySpaceEvent,\r\n};\r\nexport { operations };\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIndexedChildren.js","sources":["../../../src/components/ListBox/useIndexedChildren.ts"],"sourcesContent":["import {\n useMemo,\n Children,\n isValidElement,\n cloneElement,\n ReactElement,\n} from 'react';\nimport { ListboxItem, TListboxItem } from './ListboxItem';\nimport { useStore } from './useStore';\n\nexport function useIndexedChildren(\n children: React.ReactNode | React.ReactNode[],\n listboxActions: ReturnType<typeof useStore>[0],\n) {\n return useMemo(\n function makeChildrenIndices() {\n listboxActions.resetFocus(null);\n\n return Children.map(children, (child, rowIndex) => {\n if (isValidElement(child) && child.type === ListboxItem) {\n return cloneElement<TListboxItem>(\n child as ReactElement<TListboxItem>,\n {\n rowIndex,\n },\n );\n }\n return child;\n });\n },\n [children, listboxActions],\n );\n}\n"],"names":[],"mappings":";;;AAUgB,SAAA,kBAAA,CACd,UACA,cACA,EAAA;AACA,EAAO,OAAA,OAAA;AAAA,IACL,SAAS,mBAAsB,GAAA;AAC7B,MAAA,cAAA,CAAe,WAAW,IAAI,CAAA,CAAA;AAE9B,MAAA,OAAO,QAAS,CAAA,GAAA,CAAI,QAAU,EAAA,CAAC,OAAO,QAAa,KAAA;AACjD,QAAA,IAAI,cAAe,CAAA,KAAK,CAAK,IAAA,KAAA,CAAM,SAAS,WAAa,EAAA;AACvD,UAAO,OAAA,YAAA;AAAA,YACL,KAAA;AAAA,YACA;AAAA,cACE,QAAA;AAAA,aACF;AAAA,WACF,CAAA;AAAA,SACF;AACA,QAAO,OAAA,KAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,UAAU,cAAc,CAAA;AAAA,GAC3B,CAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"useIndexedChildren.js","sources":["../../../src/components/ListBox/useIndexedChildren.ts"],"sourcesContent":["import {\r\n useMemo,\r\n Children,\r\n isValidElement,\r\n cloneElement,\r\n ReactElement,\r\n} from 'react';\r\nimport { ListboxItem, TListboxItem } from './ListboxItem';\r\nimport { useStore } from './useStore';\r\n\r\nexport function useIndexedChildren(\r\n children: React.ReactNode | React.ReactNode[],\r\n listboxActions: ReturnType<typeof useStore>[0],\r\n) {\r\n return useMemo(\r\n function makeChildrenIndices() {\r\n listboxActions.resetFocus(null);\r\n\r\n return Children.map(children, (child, rowIndex) => {\r\n if (isValidElement(child) && child.type === ListboxItem) {\r\n return cloneElement<TListboxItem>(\r\n child as ReactElement<TListboxItem>,\r\n {\r\n rowIndex,\r\n },\r\n );\r\n }\r\n return child;\r\n });\r\n },\r\n [children, listboxActions],\r\n );\r\n}\r\n"],"names":[],"mappings":";;;AAUgB,SAAA,kBAAA,CACd,UACA,cACA,EAAA;AACA,EAAO,OAAA,OAAA;AAAA,IACL,SAAS,mBAAsB,GAAA;AAC7B,MAAA,cAAA,CAAe,WAAW,IAAI,CAAA,CAAA;AAE9B,MAAA,OAAO,QAAS,CAAA,GAAA,CAAI,QAAU,EAAA,CAAC,OAAO,QAAa,KAAA;AACjD,QAAA,IAAI,cAAe,CAAA,KAAK,CAAK,IAAA,KAAA,CAAM,SAAS,WAAa,EAAA;AACvD,UAAO,OAAA,YAAA;AAAA,YACL,KAAA;AAAA,YACA;AAAA,cACE,QAAA;AAAA,aACF;AAAA,WACF,CAAA;AAAA,SACF;AACA,QAAO,OAAA,KAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,UAAU,cAAc,CAAA;AAAA,GAC3B,CAAA;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useListboxAutofocus.js","sources":["../../../src/components/ListBox/useListboxAutofocus.ts"],"sourcesContent":["import { TGetState } from '@apia/dom-store';\nimport { useCallback } from 'react';\nimport { TListboxState } from './common';\nimport { findScrollContainer } from '@apia/util';\n\nexport function useListboxAutofocus(\n storeId: string,\n getState: TGetState<TListboxState>,\n) {\n return {\n onClick: useCallback(() => {\n if (\n document.activeElement !==\n document.querySelector(`#${storeId} .listbox__list`)\n ) {\n const el = document.querySelector<HTMLElement>(\n `#${storeId} .listbox__list`,\n );\n el?.focus({ preventScroll: true });\n el?.scrollIntoView({\n behavior: 'instant' as unknown as 'instant',\n block: 'nearest',\n inline: 'nearest',\n });\n }\n }, [storeId]),\n onFocus: useCallback(() => {\n const focusedRowId = getState().focusedRow + 1;\n const focusedRow = document.querySelector<HTMLElement>(\n `#${storeId} .listbox__list .listbox__row:nth-child(${focusedRowId})`,\n );\n\n if (focusedRow) {\n focusedRow.scrollIntoView({\n behavior: 'auto',\n block: 'nearest',\n inline: 'nearest',\n });\n const scrollContainer = findScrollContainer(focusedRow);\n\n if (scrollContainer && scrollContainer !== document.body) {\n scrollContainer.scrollIntoView({\n behavior: 'auto',\n block: 'nearest',\n inline: 'nearest',\n });\n const elRect = focusedRow.getBoundingClientRect();\n const contRect = scrollContainer.getBoundingClientRect();\n\n if (elRect.top - contRect.top < elRect.height)\n scrollContainer.scrollTop -= elRect.height;\n }\n }\n }, [getState, storeId]),\n };\n}\n"],"names":[],"mappings":";;;AAKgB,SAAA,mBAAA,CACd,SACA,QACA,EAAA;AACA,EAAO,OAAA;AAAA,IACL,OAAA,EAAS,YAAY,MAAM;AACzB,MAAA,IACE,SAAS,aACT,KAAA,QAAA,CAAS,cAAc,CAAI,CAAA,EAAA,OAAO,iBAAiB,CACnD,EAAA;AACA,QAAA,MAAM,KAAK,QAAS,CAAA,aAAA;AAAA,UAClB,IAAI,OAAO,CAAA,eAAA,CAAA;AAAA,SACb,CAAA;AACA,QAAA,EAAA,EAAI,KAAM,CAAA,EAAE,aAAe,EAAA,IAAA,EAAM,CAAA,CAAA;AACjC,QAAA,EAAA,EAAI,cAAe,CAAA;AAAA,UACjB,QAAU,EAAA,SAAA;AAAA,UACV,KAAO,EAAA,SAAA;AAAA,UACP,MAAQ,EAAA,SAAA;AAAA,SACT,CAAA,CAAA;AAAA,OACH;AAAA,KACF,EAAG,CAAC,OAAO,CAAC,CAAA;AAAA,IACZ,OAAA,EAAS,YAAY,MAAM;AACzB,MAAM,MAAA,YAAA,GAAe,QAAS,EAAA,CAAE,UAAa,GAAA,CAAA,CAAA;AAC7C,MAAA,MAAM,aAAa,QAAS,CAAA,aAAA;AAAA,QAC1B,CAAA,CAAA,EAAI,OAAO,CAAA,wCAAA,EAA2C,YAAY,CAAA,CAAA,CAAA;AAAA,OACpE,CAAA;AAEA,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,UAAA,CAAW,cAAe,CAAA;AAAA,UACxB,QAAU,EAAA,MAAA;AAAA,UACV,KAAO,EAAA,SAAA;AAAA,UACP,MAAQ,EAAA,SAAA;AAAA,SACT,CAAA,CAAA;AACD,QAAM,MAAA,eAAA,GAAkB,oBAAoB,UAAU,CAAA,CAAA;AAEtD,QAAI,IAAA,eAAA,IAAmB,eAAoB,KAAA,QAAA,CAAS,IAAM,EAAA;AACxD,UAAA,eAAA,CAAgB,cAAe,CAAA;AAAA,YAC7B,QAAU,EAAA,MAAA;AAAA,YACV,KAAO,EAAA,SAAA;AAAA,YACP,MAAQ,EAAA,SAAA;AAAA,WACT,CAAA,CAAA;AACD,UAAM,MAAA,MAAA,GAAS,WAAW,qBAAsB,EAAA,CAAA;AAChD,UAAM,MAAA,QAAA,GAAW,gBAAgB,qBAAsB,EAAA,CAAA;AAEvD,UAAA,IAAI,MAAO,CAAA,GAAA,GAAM,QAAS,CAAA,GAAA,GAAM,MAAO,CAAA,MAAA;AACrC,YAAA,eAAA,CAAgB,aAAa,MAAO,CAAA,MAAA,CAAA;AAAA,SACxC;AAAA,OACF;AAAA,KACC,EAAA,CAAC,QAAU,EAAA,OAAO,CAAC,CAAA;AAAA,GACxB,CAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"useListboxAutofocus.js","sources":["../../../src/components/ListBox/useListboxAutofocus.ts"],"sourcesContent":["import { TGetState } from '@apia/dom-store';\r\nimport { useCallback } from 'react';\r\nimport { TListboxState } from './common';\r\nimport { findScrollContainer } from '@apia/util';\r\n\r\nexport function useListboxAutofocus(\r\n storeId: string,\r\n getState: TGetState<TListboxState>,\r\n) {\r\n return {\r\n onClick: useCallback(() => {\r\n if (\r\n document.activeElement !==\r\n document.querySelector(`#${storeId} .listbox__list`)\r\n ) {\r\n const el = document.querySelector<HTMLElement>(\r\n `#${storeId} .listbox__list`,\r\n );\r\n el?.focus({ preventScroll: true });\r\n el?.scrollIntoView({\r\n behavior: 'instant' as unknown as 'instant',\r\n block: 'nearest',\r\n inline: 'nearest',\r\n });\r\n }\r\n }, [storeId]),\r\n onFocus: useCallback(() => {\r\n const focusedRowId = getState().focusedRow + 1;\r\n const focusedRow = document.querySelector<HTMLElement>(\r\n `#${storeId} .listbox__list .listbox__row:nth-child(${focusedRowId})`,\r\n );\r\n\r\n if (focusedRow) {\r\n focusedRow.scrollIntoView({\r\n behavior: 'auto',\r\n block: 'nearest',\r\n inline: 'nearest',\r\n });\r\n const scrollContainer = findScrollContainer(focusedRow);\r\n\r\n if (scrollContainer && scrollContainer !== document.body) {\r\n scrollContainer.scrollIntoView({\r\n behavior: 'auto',\r\n block: 'nearest',\r\n inline: 'nearest',\r\n });\r\n const elRect = focusedRow.getBoundingClientRect();\r\n const contRect = scrollContainer.getBoundingClientRect();\r\n\r\n if (elRect.top - contRect.top < elRect.height)\r\n scrollContainer.scrollTop -= elRect.height;\r\n }\r\n }\r\n }, [getState, storeId]),\r\n };\r\n}\r\n"],"names":[],"mappings":";;;AAKgB,SAAA,mBAAA,CACd,SACA,QACA,EAAA;AACA,EAAO,OAAA;AAAA,IACL,OAAA,EAAS,YAAY,MAAM;AACzB,MAAA,IACE,SAAS,aACT,KAAA,QAAA,CAAS,cAAc,CAAI,CAAA,EAAA,OAAO,iBAAiB,CACnD,EAAA;AACA,QAAA,MAAM,KAAK,QAAS,CAAA,aAAA;AAAA,UAClB,IAAI,OAAO,CAAA,eAAA,CAAA;AAAA,SACb,CAAA;AACA,QAAA,EAAA,EAAI,KAAM,CAAA,EAAE,aAAe,EAAA,IAAA,EAAM,CAAA,CAAA;AACjC,QAAA,EAAA,EAAI,cAAe,CAAA;AAAA,UACjB,QAAU,EAAA,SAAA;AAAA,UACV,KAAO,EAAA,SAAA;AAAA,UACP,MAAQ,EAAA,SAAA;AAAA,SACT,CAAA,CAAA;AAAA,OACH;AAAA,KACF,EAAG,CAAC,OAAO,CAAC,CAAA;AAAA,IACZ,OAAA,EAAS,YAAY,MAAM;AACzB,MAAM,MAAA,YAAA,GAAe,QAAS,EAAA,CAAE,UAAa,GAAA,CAAA,CAAA;AAC7C,MAAA,MAAM,aAAa,QAAS,CAAA,aAAA;AAAA,QAC1B,CAAA,CAAA,EAAI,OAAO,CAAA,wCAAA,EAA2C,YAAY,CAAA,CAAA,CAAA;AAAA,OACpE,CAAA;AAEA,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,UAAA,CAAW,cAAe,CAAA;AAAA,UACxB,QAAU,EAAA,MAAA;AAAA,UACV,KAAO,EAAA,SAAA;AAAA,UACP,MAAQ,EAAA,SAAA;AAAA,SACT,CAAA,CAAA;AACD,QAAM,MAAA,eAAA,GAAkB,oBAAoB,UAAU,CAAA,CAAA;AAEtD,QAAI,IAAA,eAAA,IAAmB,eAAoB,KAAA,QAAA,CAAS,IAAM,EAAA;AACxD,UAAA,eAAA,CAAgB,cAAe,CAAA;AAAA,YAC7B,QAAU,EAAA,MAAA;AAAA,YACV,KAAO,EAAA,SAAA;AAAA,YACP,MAAQ,EAAA,SAAA;AAAA,WACT,CAAA,CAAA;AACD,UAAM,MAAA,MAAA,GAAS,WAAW,qBAAsB,EAAA,CAAA;AAChD,UAAM,MAAA,QAAA,GAAW,gBAAgB,qBAAsB,EAAA,CAAA;AAEvD,UAAA,IAAI,MAAO,CAAA,GAAA,GAAM,QAAS,CAAA,GAAA,GAAM,MAAO,CAAA,MAAA;AACrC,YAAA,eAAA,CAAgB,aAAa,MAAO,CAAA,MAAA,CAAA;AAAA,SACxC;AAAA,OACF;AAAA,KACC,EAAA,CAAC,QAAU,EAAA,OAAO,CAAC,CAAA;AAAA,GACxB,CAAA;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useListboxContextValue.js","sources":["../../../src/components/ListBox/useListboxContextValue.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { TListboxContext } from './ListboxContext';\n\nexport function useListboxContextValue(props: TListboxContext) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return useMemo(() => props, [...Object.values(props)]);\n}\n"],"names":[],"mappings":";;AAGO,SAAS,uBAAuB,KAAwB,EAAA;AAE7D,EAAO,OAAA,OAAA,CAAQ,MAAM,KAAO,EAAA,CAAC,GAAG,MAAO,CAAA,MAAA,CAAO,KAAK,CAAC,CAAC,CAAA,CAAA;AACvD;;;;"}
|
|
1
|
+
{"version":3,"file":"useListboxContextValue.js","sources":["../../../src/components/ListBox/useListboxContextValue.ts"],"sourcesContent":["import { useMemo } from 'react';\r\nimport { TListboxContext } from './ListboxContext';\r\n\r\nexport function useListboxContextValue(props: TListboxContext) {\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n return useMemo(() => props, [...Object.values(props)]);\r\n}\r\n"],"names":[],"mappings":";;AAGO,SAAS,uBAAuB,KAAwB,EAAA;AAE7D,EAAO,OAAA,OAAA,CAAQ,MAAM,KAAO,EAAA,CAAC,GAAG,MAAO,CAAA,MAAA,CAAO,KAAK,CAAC,CAAC,CAAA,CAAA;AACvD;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useShoutSelectionChange.js","sources":["../../../src/components/ListBox/useShoutSelectionChange.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { useMemo } from 'react';\nimport { TRegisterStateChangeListener } from '@apia/dom-store';\nimport { TListbox } from './ListboxContext';\nimport { TListboxState } from './common';\n\nexport function useShoutSelectionChange(\n onSelectionChange: TListbox['onSelectionChange'],\n registerCallback: TRegisterStateChangeListener<TListboxState>,\n) {\n useMemo(\n function shoutSelectionChange() {\n registerCallback((state, previousState) => {\n if (state.selectedRows !== previousState.selectedRows) {\n onSelectionChange?.({\n focusedElement: document.querySelector<HTMLElement>(\n `#${state.id}__row__${state.focusedRow}`,\n ) as HTMLElement,\n selectedElements: state.selectedRows.map((current) => {\n return document.querySelector<HTMLElement>(\n `#${state.id}__row__${current}`,\n ) as HTMLElement;\n }),\n });\n }\n });\n },\n [onSelectionChange, registerCallback],\n );\n}\n"],"names":[],"mappings":";;AAMgB,SAAA,uBAAA,CACd,mBACA,gBACA,EAAA;AACA,EAAA,OAAA;AAAA,IACE,SAAS,oBAAuB,GAAA;AAC9B,MAAiB,gBAAA,CAAA,CAAC,OAAO,aAAkB,KAAA;AACzC,QAAI,IAAA,KAAA,CAAM,YAAiB,KAAA,aAAA,CAAc,YAAc,EAAA;AACrD,UAAoB,iBAAA,GAAA;AAAA,YAClB,gBAAgB,QAAS,CAAA,aAAA;AAAA,cACvB,CAAI,CAAA,EAAA,KAAA,CAAM,EAAE,CAAA,OAAA,EAAU,MAAM,UAAU,CAAA,CAAA;AAAA,aACxC;AAAA,YACA,gBAAkB,EAAA,KAAA,CAAM,YAAa,CAAA,GAAA,CAAI,CAAC,OAAY,KAAA;AACpD,cAAA,OAAO,QAAS,CAAA,aAAA;AAAA,gBACd,CAAI,CAAA,EAAA,KAAA,CAAM,EAAE,CAAA,OAAA,EAAU,OAAO,CAAA,CAAA;AAAA,eAC/B,CAAA;AAAA,aACD,CAAA;AAAA,WACF,CAAA,CAAA;AAAA,SACH;AAAA,OACD,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,mBAAmB,gBAAgB,CAAA;AAAA,GACtC,CAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"useShoutSelectionChange.js","sources":["../../../src/components/ListBox/useShoutSelectionChange.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport { useMemo } from 'react';\r\nimport { TRegisterStateChangeListener } from '@apia/dom-store';\r\nimport { TListbox } from './ListboxContext';\r\nimport { TListboxState } from './common';\r\n\r\nexport function useShoutSelectionChange(\r\n onSelectionChange: TListbox['onSelectionChange'],\r\n registerCallback: TRegisterStateChangeListener<TListboxState>,\r\n) {\r\n useMemo(\r\n function shoutSelectionChange() {\r\n registerCallback((state, previousState) => {\r\n if (state.selectedRows !== previousState.selectedRows) {\r\n onSelectionChange?.({\r\n focusedElement: document.querySelector<HTMLElement>(\r\n `#${state.id}__row__${state.focusedRow}`,\r\n ) as HTMLElement,\r\n selectedElements: state.selectedRows.map((current) => {\r\n return document.querySelector<HTMLElement>(\r\n `#${state.id}__row__${current}`,\r\n ) as HTMLElement;\r\n }),\r\n });\r\n }\r\n });\r\n },\r\n [onSelectionChange, registerCallback],\r\n );\r\n}\r\n"],"names":[],"mappings":";;AAMgB,SAAA,uBAAA,CACd,mBACA,gBACA,EAAA;AACA,EAAA,OAAA;AAAA,IACE,SAAS,oBAAuB,GAAA;AAC9B,MAAiB,gBAAA,CAAA,CAAC,OAAO,aAAkB,KAAA;AACzC,QAAI,IAAA,KAAA,CAAM,YAAiB,KAAA,aAAA,CAAc,YAAc,EAAA;AACrD,UAAoB,iBAAA,GAAA;AAAA,YAClB,gBAAgB,QAAS,CAAA,aAAA;AAAA,cACvB,CAAI,CAAA,EAAA,KAAA,CAAM,EAAE,CAAA,OAAA,EAAU,MAAM,UAAU,CAAA,CAAA;AAAA,aACxC;AAAA,YACA,gBAAkB,EAAA,KAAA,CAAM,YAAa,CAAA,GAAA,CAAI,CAAC,OAAY,KAAA;AACpD,cAAA,OAAO,QAAS,CAAA,aAAA;AAAA,gBACd,CAAI,CAAA,EAAA,KAAA,CAAM,EAAE,CAAA,OAAA,EAAU,OAAO,CAAA,CAAA;AAAA,eAC/B,CAAA;AAAA,aACD,CAAA;AAAA,WACF,CAAA,CAAA;AAAA,SACH;AAAA,OACD,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,mBAAmB,gBAAgB,CAAA;AAAA,GACtC,CAAA;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStore.js","sources":["../../../src/components/ListBox/useStore.ts"],"sourcesContent":["import { createFAsomeStore } from '@apia/dom-store';\nimport { useMemo } from 'react';\nimport { getInitialState, getDistinctors, keysMakers } from './common';\nimport { operations } from './operations';\nimport { TListbox } from './ListboxContext';\n\nexport function useStore(\n storeId: string,\n {\n allowMultipleCharacterSearch,\n allowSelection,\n allowSingleCharacterSearch,\n isMultipleSelection,\n searchFunction,\n showSearchbox,\n startsWithFunction,\n }: TListbox,\n) {\n return useMemo(() => {\n const newStore = createFAsomeStore({\n initialState: getInitialState({\n allowSelection: allowSelection ?? true,\n allowMultipleCharacterSearch:\n (allowMultipleCharacterSearch ?? true) && !showSearchbox,\n allowSingleCharacterSearch:\n (allowSingleCharacterSearch ?? true) && !showSearchbox,\n id: storeId,\n isMultipleSelection: !!isMultipleSelection,\n searchFunction,\n showSearchbox: showSearchbox ?? false,\n startsWithFunction,\n }),\n operations,\n distinctors: getDistinctors(storeId),\n keysMakers,\n });\n\n return newStore;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n}\n"],"names":[],"mappings":";;;;;AAMO,SAAS,SACd,OACA,EAAA;AAAA,EACE,4BAAA;AAAA,EACA,cAAA;AAAA,EACA,0BAAA;AAAA,EACA,mBAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,kBAAA;AACF,CACA,EAAA;AACA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAA,MAAM,WAAW,iBAAkB,CAAA;AAAA,MACjC,cAAc,eAAgB,CAAA;AAAA,QAC5B,gBAAgB,cAAkB,IAAA,IAAA;AAAA,QAClC,4BAAA,EAAA,CACG,4BAAgC,IAAA,IAAA,KAAS,CAAC,aAAA;AAAA,QAC7C,0BAAA,EAAA,CACG,0BAA8B,IAAA,IAAA,KAAS,CAAC,aAAA;AAAA,QAC3C,EAAI,EAAA,OAAA;AAAA,QACJ,mBAAA,EAAqB,CAAC,CAAC,mBAAA;AAAA,QACvB,cAAA;AAAA,QACA,eAAe,aAAiB,IAAA,KAAA;AAAA,QAChC,kBAAA;AAAA,OACD,CAAA;AAAA,MACD,UAAA;AAAA,MACA,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,MACnC,UAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAO,OAAA,QAAA,CAAA;AAAA,GAET,EAAG,EAAE,CAAA,CAAA;AACP;;;;"}
|
|
1
|
+
{"version":3,"file":"useStore.js","sources":["../../../src/components/ListBox/useStore.ts"],"sourcesContent":["import { createFAsomeStore } from '@apia/dom-store';\r\nimport { useMemo } from 'react';\r\nimport { getInitialState, getDistinctors, keysMakers } from './common';\r\nimport { operations } from './operations';\r\nimport { TListbox } from './ListboxContext';\r\n\r\nexport function useStore(\r\n storeId: string,\r\n {\r\n allowMultipleCharacterSearch,\r\n allowSelection,\r\n allowSingleCharacterSearch,\r\n isMultipleSelection,\r\n searchFunction,\r\n showSearchbox,\r\n startsWithFunction,\r\n }: TListbox,\r\n) {\r\n return useMemo(() => {\r\n const newStore = createFAsomeStore({\r\n initialState: getInitialState({\r\n allowSelection: allowSelection ?? true,\r\n allowMultipleCharacterSearch:\r\n (allowMultipleCharacterSearch ?? true) && !showSearchbox,\r\n allowSingleCharacterSearch:\r\n (allowSingleCharacterSearch ?? true) && !showSearchbox,\r\n id: storeId,\r\n isMultipleSelection: !!isMultipleSelection,\r\n searchFunction,\r\n showSearchbox: showSearchbox ?? false,\r\n startsWithFunction,\r\n }),\r\n operations,\r\n distinctors: getDistinctors(storeId),\r\n keysMakers,\r\n });\r\n\r\n return newStore;\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n}\r\n"],"names":[],"mappings":";;;;;AAMO,SAAS,SACd,OACA,EAAA;AAAA,EACE,4BAAA;AAAA,EACA,cAAA;AAAA,EACA,0BAAA;AAAA,EACA,mBAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,kBAAA;AACF,CACA,EAAA;AACA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAA,MAAM,WAAW,iBAAkB,CAAA;AAAA,MACjC,cAAc,eAAgB,CAAA;AAAA,QAC5B,gBAAgB,cAAkB,IAAA,IAAA;AAAA,QAClC,4BAAA,EAAA,CACG,4BAAgC,IAAA,IAAA,KAAS,CAAC,aAAA;AAAA,QAC7C,0BAAA,EAAA,CACG,0BAA8B,IAAA,IAAA,KAAS,CAAC,aAAA;AAAA,QAC3C,EAAI,EAAA,OAAA;AAAA,QACJ,mBAAA,EAAqB,CAAC,CAAC,mBAAA;AAAA,QACvB,cAAA;AAAA,QACA,eAAe,aAAiB,IAAA,KAAA;AAAA,QAChC,kBAAA;AAAA,OACD,CAAA;AAAA,MACD,UAAA;AAAA,MACA,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,MACnC,UAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAO,OAAA,QAAA,CAAA;AAAA,GAET,EAAG,EAAE,CAAA,CAAA;AACP;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useUpdateRowCount.js","sources":["../../../src/components/ListBox/useUpdateRowCount.ts"],"sourcesContent":["import { Children, isValidElement, useMemo } from 'react';\nimport { ListboxItem } from './ListboxItem';\nimport { TActionsMap } from '@apia/dom-store';\nimport { TListboxState } from './common';\nimport { operations } from './operations';\n\nexport function useUpdateRowCount(\n children: React.ReactNode | React.ReactNode[],\n listboxActions: TActionsMap<TListboxState, typeof operations>,\n) {\n useMemo(\n function updateRowCount() {\n let count = 0;\n Children.forEach(children, (current) => {\n if (isValidElement(current) && current.type === ListboxItem) count++;\n });\n listboxActions.setState({ rowsCount: count, affectedKeys: [] });\n },\n [listboxActions, children],\n );\n}\n"],"names":[],"mappings":";;;AAMgB,SAAA,iBAAA,CACd,UACA,cACA,EAAA;AACA,EAAA,OAAA;AAAA,IACE,SAAS,cAAiB,GAAA;AACxB,MAAA,IAAI,KAAQ,GAAA,CAAA,CAAA;AACZ,MAAS,QAAA,CAAA,OAAA,CAAQ,QAAU,EAAA,CAAC,OAAY,KAAA;AACtC,QAAA,IAAI,cAAe,CAAA,OAAO,CAAK,IAAA,OAAA,CAAQ,IAAS,KAAA,WAAA;AAAa,UAAA,KAAA,EAAA,CAAA;AAAA,OAC9D,CAAA,CAAA;AACD,MAAA,cAAA,CAAe,SAAS,EAAE,SAAA,EAAW,OAAO,YAAc,EAAA,IAAI,CAAA,CAAA;AAAA,KAChE;AAAA,IACA,CAAC,gBAAgB,QAAQ,CAAA;AAAA,GAC3B,CAAA;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"useUpdateRowCount.js","sources":["../../../src/components/ListBox/useUpdateRowCount.ts"],"sourcesContent":["import { Children, isValidElement, useMemo } from 'react';\r\nimport { ListboxItem } from './ListboxItem';\r\nimport { TActionsMap } from '@apia/dom-store';\r\nimport { TListboxState } from './common';\r\nimport { operations } from './operations';\r\n\r\nexport function useUpdateRowCount(\r\n children: React.ReactNode | React.ReactNode[],\r\n listboxActions: TActionsMap<TListboxState, typeof operations>,\r\n) {\r\n useMemo(\r\n function updateRowCount() {\r\n let count = 0;\r\n Children.forEach(children, (current) => {\r\n if (isValidElement(current) && current.type === ListboxItem) count++;\r\n });\r\n listboxActions.setState({ rowsCount: count, affectedKeys: [] });\r\n },\r\n [listboxActions, children],\r\n );\r\n}\r\n"],"names":[],"mappings":";;;AAMgB,SAAA,iBAAA,CACd,UACA,cACA,EAAA;AACA,EAAA,OAAA;AAAA,IACE,SAAS,cAAiB,GAAA;AACxB,MAAA,IAAI,KAAQ,GAAA,CAAA,CAAA;AACZ,MAAS,QAAA,CAAA,OAAA,CAAQ,QAAU,EAAA,CAAC,OAAY,KAAA;AACtC,QAAA,IAAI,cAAe,CAAA,OAAO,CAAK,IAAA,OAAA,CAAQ,IAAS,KAAA,WAAA;AAAa,UAAA,KAAA,EAAA,CAAA;AAAA,OAC9D,CAAA,CAAA;AACD,MAAA,cAAA,CAAe,SAAS,EAAE,SAAA,EAAW,OAAO,YAAc,EAAA,IAAI,CAAA,CAAA;AAAA,KAChE;AAAA,IACA,CAAC,gBAAgB,QAAQ,CAAA;AAAA,GAC3B,CAAA;AACF;;;;"}
|
|
@@ -24,7 +24,7 @@ var __privateAdd = (obj, member, value) => {
|
|
|
24
24
|
};
|
|
25
25
|
var __privateSet = (obj, member, value, setter) => {
|
|
26
26
|
__accessCheck(obj, member, "write to private field");
|
|
27
|
-
|
|
27
|
+
member.set(obj, value);
|
|
28
28
|
return value;
|
|
29
29
|
};
|
|
30
30
|
var _emitter, _items, _moveItem;
|