@lumx/react 2.2.8 → 2.2.9-alpha-exported-hooks1
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/esm/_internal/{_rollupPluginBabelHelpers.js → _rolluppluginbabelhelpers.53.js} +1 -1
- package/esm/_internal/_rolluppluginbabelhelpers.53.js.map +1 -0
- package/esm/_internal/alert-dialog.js +19 -19
- package/esm/_internal/{AlertDialog.js → alertdialog.1.js} +8 -8
- package/esm/_internal/alertdialog.1.js.map +1 -0
- package/esm/_internal/autocomplete.js +20 -20
- package/esm/_internal/{AutocompleteMultiple.js → autocompletemultiple.2.js} +9 -9
- package/esm/_internal/autocompletemultiple.2.js.map +1 -0
- package/esm/_internal/{Avatar2.js → avatar.3.js} +4 -4
- package/esm/_internal/avatar.3.js.map +1 -0
- package/esm/_internal/avatar.js +6 -6
- package/esm/_internal/{Badge2.js → badge.4.js} +3 -3
- package/esm/_internal/badge.4.js.map +1 -0
- package/esm/_internal/badge.js +3 -3
- package/esm/_internal/{Button2.js → button.5.js} +5 -5
- package/esm/_internal/button.5.js.map +1 -0
- package/esm/_internal/button.js +14 -14
- package/esm/_internal/{ButtonGroup.js → buttongroup.7.js} +3 -3
- package/esm/_internal/buttongroup.7.js.map +1 -0
- package/esm/_internal/{ButtonRoot.js → buttonroot.57.js} +4 -4
- package/esm/_internal/buttonroot.57.js.map +1 -0
- package/esm/_internal/{Checkbox2.js → checkbox.8.js} +7 -7
- package/esm/_internal/checkbox.8.js.map +1 -0
- package/esm/_internal/checkbox.js +7 -7
- package/esm/_internal/{Chip2.js → chip.9.js} +3 -3
- package/esm/_internal/chip.9.js.map +1 -0
- package/esm/_internal/chip.js +4 -4
- package/esm/_internal/{ChipGroup.js → chipgroup.10.js} +3 -3
- package/esm/_internal/chipgroup.10.js.map +1 -0
- package/esm/_internal/{ClickAwayProvider.js → clickawayprovider.60.js} +4 -4
- package/esm/_internal/clickawayprovider.60.js.map +1 -0
- package/esm/_internal/comment-block.js +7 -7
- package/esm/_internal/{CommentBlock.js → commentblock.11.js} +4 -4
- package/esm/_internal/commentblock.11.js.map +1 -0
- package/esm/_internal/components.js +1 -1
- package/esm/_internal/{constants.js → constants.59.js} +1 -1
- package/esm/_internal/constants.59.js.map +1 -0
- package/esm/_internal/date-picker.js +18 -18
- package/esm/_internal/{DatePickerField.js → datepickerfield.12.js} +9 -9
- package/esm/_internal/datepickerfield.12.js.map +1 -0
- package/esm/_internal/{Dialog2.js → dialog.13.js} +12 -12
- package/esm/_internal/dialog.13.js.map +1 -0
- package/esm/_internal/dialog.js +12 -12
- package/esm/_internal/{Divider2.js → divider.14.js} +3 -3
- package/esm/_internal/divider.14.js.map +1 -0
- package/esm/_internal/divider.js +3 -3
- package/esm/_internal/drag-handle.js +4 -4
- package/esm/_internal/{DragHandle.js → draghandle.15.js} +4 -4
- package/esm/_internal/draghandle.15.js.map +1 -0
- package/esm/_internal/{Dropdown2.js → dropdown.16.js} +6 -6
- package/esm/_internal/dropdown.16.js.map +1 -0
- package/esm/_internal/dropdown.js +10 -10
- package/esm/_internal/expansion-panel.js +16 -16
- package/esm/_internal/{ExpansionPanel.js → expansionpanel.17.js} +8 -8
- package/esm/_internal/expansionpanel.17.js.map +1 -0
- package/esm/_internal/{Flag2.js → flag.18.js} +4 -4
- package/esm/_internal/flag.18.js.map +1 -0
- package/esm/_internal/flag.js +4 -4
- package/esm/_internal/flex-box.js +3 -3
- package/esm/_internal/{FlexBox.js → flexbox.19.js} +3 -3
- package/esm/_internal/flexbox.19.js.map +1 -0
- package/esm/_internal/{getRootClassName.js → getrootclassname.54.js} +2 -2
- package/esm/_internal/getrootclassname.54.js.map +1 -0
- package/esm/_internal/grid.js +3 -3
- package/esm/_internal/{GridItem.js → griditem.20.js} +3 -3
- package/esm/_internal/griditem.20.js.map +1 -0
- package/esm/_internal/{Icon2.js → icon.21.js} +3 -3
- package/esm/_internal/icon.21.js.map +1 -0
- package/esm/_internal/icon.js +3 -3
- package/esm/_internal/{IconButton.js → iconbutton.6.js} +6 -6
- package/esm/_internal/iconbutton.6.js.map +1 -0
- package/esm/_internal/image-block.js +6 -6
- package/esm/_internal/{ImageBlock.js → imageblock.22.js} +4 -4
- package/esm/_internal/imageblock.22.js.map +1 -0
- package/esm/{index2.js → _internal/index.55.js} +1 -1
- package/esm/_internal/index.55.js.map +1 -0
- package/esm/_internal/input-helper.js +3 -3
- package/esm/_internal/input-label.js +3 -3
- package/esm/_internal/{InputHelper.js → inputhelper.23.js} +3 -3
- package/esm/_internal/inputhelper.23.js.map +1 -0
- package/esm/_internal/{InputLabel.js → inputlabel.24.js} +3 -3
- package/esm/_internal/inputlabel.24.js.map +1 -0
- package/esm/_internal/{Lightbox2.js → lightbox.25.js} +11 -11
- package/esm/_internal/lightbox.25.js.map +1 -0
- package/esm/_internal/lightbox.js +16 -16
- package/esm/_internal/link-preview.js +8 -8
- package/esm/_internal/{Link2.js → link.26.js} +5 -5
- package/esm/_internal/link.26.js.map +1 -0
- package/esm/_internal/link.js +5 -5
- package/esm/_internal/{LinkPreview.js → linkpreview.27.js} +5 -5
- package/esm/_internal/linkpreview.27.js.map +1 -0
- package/esm/_internal/{List2.js → list.28.js} +6 -6
- package/esm/_internal/list.28.js.map +1 -0
- package/esm/_internal/list.js +7 -7
- package/esm/_internal/{ListSubheader.js → listsubheader.29.js} +3 -3
- package/esm/_internal/listsubheader.29.js.map +1 -0
- package/esm/_internal/{mergeRefs.js → mergerefs.56.js} +1 -1
- package/esm/_internal/mergerefs.56.js.map +1 -0
- package/esm/_internal/{Message2.js → message.30.js} +4 -4
- package/esm/_internal/message.30.js.map +1 -0
- package/esm/_internal/message.js +4 -4
- package/esm/_internal/{Mosaic2.js → mosaic.31.js} +4 -4
- package/esm/_internal/mosaic.31.js.map +1 -0
- package/esm/_internal/mosaic.js +6 -6
- package/esm/_internal/{Notification2.js → notification.32.js} +7 -7
- package/esm/_internal/notification.32.js.map +1 -0
- package/esm/_internal/notification.js +9 -9
- package/esm/_internal/{partitionMulti.js → partitionmulti.62.js} +1 -1
- package/esm/_internal/partitionmulti.62.js.map +1 -0
- package/esm/_internal/{Popover2.js → popover.33.js} +6 -6
- package/esm/_internal/popover.33.js.map +1 -0
- package/esm/_internal/popover.js +6 -6
- package/esm/_internal/post-block.js +7 -7
- package/esm/_internal/{PostBlock.js → postblock.34.js} +5 -5
- package/esm/_internal/postblock.34.js.map +1 -0
- package/esm/_internal/progress-tracker.js +9 -9
- package/esm/_internal/{Progress2.js → progress.35.js} +3 -3
- package/esm/_internal/progress.35.js.map +1 -0
- package/esm/_internal/progress.js +3 -3
- package/esm/_internal/{ProgressTrackerStepPanel.js → progresstrackersteppanel.36.js} +8 -8
- package/esm/_internal/progresstrackersteppanel.36.js.map +1 -0
- package/esm/_internal/radio-button.js +6 -6
- package/esm/_internal/{RadioGroup.js → radiogroup.37.js} +6 -6
- package/esm/_internal/radiogroup.37.js.map +1 -0
- package/esm/_internal/{renderLink.js → renderlink.65.js} +2 -2
- package/esm/_internal/renderlink.65.js.map +1 -0
- package/esm/_internal/select.js +19 -19
- package/esm/_internal/{SelectMultiple.js → selectmultiple.38.js} +12 -12
- package/esm/_internal/selectmultiple.38.js.map +1 -0
- package/esm/_internal/side-navigation.js +14 -14
- package/esm/_internal/{SideNavigationItem.js → sidenavigationitem.39.js} +7 -7
- package/esm/_internal/sidenavigationitem.39.js.map +1 -0
- package/esm/_internal/skeleton.js +3 -3
- package/esm/_internal/{SkeletonTypography.js → skeletontypography.40.js} +3 -3
- package/esm/_internal/skeletontypography.40.js.map +1 -0
- package/esm/_internal/{Slider2.js → slider.41.js} +6 -6
- package/esm/_internal/slider.41.js.map +1 -0
- package/esm/_internal/slider.js +6 -6
- package/esm/_internal/slideshow.js +14 -13
- package/esm/_internal/slideshow.js.map +1 -1
- package/esm/_internal/{SlideshowControls.js → slideshowcontrols.42.js} +8 -31
- package/esm/_internal/slideshowcontrols.42.js.map +1 -0
- package/esm/_internal/{Switch2.js → switch.43.js} +6 -6
- package/esm/_internal/switch.43.js.map +1 -0
- package/esm/_internal/switch.js +6 -6
- package/esm/_internal/table.js +4 -4
- package/esm/_internal/{TableRow.js → tablerow.44.js} +4 -4
- package/esm/_internal/tablerow.44.js.map +1 -0
- package/esm/_internal/{TabPanel.js → tabpanel.45.js} +6 -6
- package/esm/_internal/tabpanel.45.js.map +1 -0
- package/esm/_internal/tabs.js +7 -7
- package/esm/_internal/text-field.js +15 -15
- package/esm/_internal/{TextField.js → textfield.46.js} +9 -9
- package/esm/_internal/textfield.46.js.map +1 -0
- package/esm/_internal/{Thumbnail2.js → thumbnail.47.js} +6 -6
- package/esm/_internal/thumbnail.47.js.map +1 -0
- package/esm/_internal/thumbnail.js +6 -6
- package/esm/_internal/{Toolbar2.js → toolbar.49.js} +3 -3
- package/esm/_internal/toolbar.49.js.map +1 -0
- package/esm/_internal/toolbar.js +3 -3
- package/esm/_internal/{Tooltip2.js → tooltip.50.js} +7 -7
- package/esm/_internal/tooltip.50.js.map +1 -0
- package/esm/_internal/tooltip.js +8 -8
- package/esm/_internal/{type.js → type.64.js} +1 -1
- package/esm/_internal/type.64.js.map +1 -0
- package/esm/_internal/{types.js → types.48.js} +2 -3
- package/esm/_internal/types.48.js.map +1 -0
- package/esm/_internal/{Uploader2.js → uploader.51.js} +4 -4
- package/esm/_internal/uploader.51.js.map +1 -0
- package/esm/_internal/uploader.js +4 -4
- package/esm/_internal/{useDelayedVisibility.js → usedelayedvisibility.63.js} +2 -2
- package/esm/_internal/usedelayedvisibility.63.js.map +1 -0
- package/esm/_internal/{useDisableBodyScroll.js → usedisablebodyscroll.61.js} +1 -1
- package/esm/_internal/usedisablebodyscroll.61.js.map +1 -0
- package/esm/_internal/{useFocusTrap.js → usefocustrap.58.js} +2 -2
- package/esm/_internal/usefocustrap.58.js.map +1 -0
- package/esm/_internal/user-block.js +9 -9
- package/esm/_internal/{UserBlock.js → userblock.52.js} +5 -5
- package/esm/_internal/userblock.52.js.map +1 -0
- package/esm/_internal/{useRovingTabIndex.js → userovingtabindex.66.js} +3 -3
- package/esm/_internal/userovingtabindex.66.js.map +1 -0
- package/hooks/useFocusWithin.d.ts +16 -0
- package/hooks/useFocusWithin.js +28 -0
- package/hooks/useFocusWithin.js.map +1 -0
- package/index.d.ts +2723 -0
- package/index.js +90 -0
- package/{esm/index.js.map → index.js.map} +1 -1
- package/package.json +9 -10
- package/src/components/thumbnail/index.ts +0 -1
- package/esm/_internal/AlertDialog.js.map +0 -1
- package/esm/_internal/AutocompleteMultiple.js.map +0 -1
- package/esm/_internal/Avatar2.js.map +0 -1
- package/esm/_internal/Badge2.js.map +0 -1
- package/esm/_internal/Button2.js.map +0 -1
- package/esm/_internal/ButtonGroup.js.map +0 -1
- package/esm/_internal/ButtonRoot.js.map +0 -1
- package/esm/_internal/Checkbox2.js.map +0 -1
- package/esm/_internal/Chip2.js.map +0 -1
- package/esm/_internal/ChipGroup.js.map +0 -1
- package/esm/_internal/ClickAwayProvider.js.map +0 -1
- package/esm/_internal/CommentBlock.js.map +0 -1
- package/esm/_internal/DatePickerField.js.map +0 -1
- package/esm/_internal/Dialog2.js.map +0 -1
- package/esm/_internal/Divider2.js.map +0 -1
- package/esm/_internal/DragHandle.js.map +0 -1
- package/esm/_internal/Dropdown2.js.map +0 -1
- package/esm/_internal/ExpansionPanel.js.map +0 -1
- package/esm/_internal/Flag2.js.map +0 -1
- package/esm/_internal/FlexBox.js.map +0 -1
- package/esm/_internal/GridItem.js.map +0 -1
- package/esm/_internal/Icon2.js.map +0 -1
- package/esm/_internal/IconButton.js.map +0 -1
- package/esm/_internal/ImageBlock.js.map +0 -1
- package/esm/_internal/InputHelper.js.map +0 -1
- package/esm/_internal/InputLabel.js.map +0 -1
- package/esm/_internal/Lightbox2.js.map +0 -1
- package/esm/_internal/Link2.js.map +0 -1
- package/esm/_internal/LinkPreview.js.map +0 -1
- package/esm/_internal/List2.js.map +0 -1
- package/esm/_internal/ListSubheader.js.map +0 -1
- package/esm/_internal/Message2.js.map +0 -1
- package/esm/_internal/Mosaic2.js.map +0 -1
- package/esm/_internal/Notification2.js.map +0 -1
- package/esm/_internal/Popover2.js.map +0 -1
- package/esm/_internal/PostBlock.js.map +0 -1
- package/esm/_internal/Progress2.js.map +0 -1
- package/esm/_internal/ProgressTrackerStepPanel.js.map +0 -1
- package/esm/_internal/RadioGroup.js.map +0 -1
- package/esm/_internal/SelectMultiple.js.map +0 -1
- package/esm/_internal/SideNavigationItem.js.map +0 -1
- package/esm/_internal/SkeletonTypography.js.map +0 -1
- package/esm/_internal/Slider2.js.map +0 -1
- package/esm/_internal/SlideshowControls.js.map +0 -1
- package/esm/_internal/Switch2.js.map +0 -1
- package/esm/_internal/TabPanel.js.map +0 -1
- package/esm/_internal/TableRow.js.map +0 -1
- package/esm/_internal/TextField.js.map +0 -1
- package/esm/_internal/Thumbnail2.js.map +0 -1
- package/esm/_internal/Toolbar2.js.map +0 -1
- package/esm/_internal/Tooltip2.js.map +0 -1
- package/esm/_internal/Uploader2.js.map +0 -1
- package/esm/_internal/UserBlock.js.map +0 -1
- package/esm/_internal/_rollupPluginBabelHelpers.js.map +0 -1
- package/esm/_internal/constants.js.map +0 -1
- package/esm/_internal/getRootClassName.js.map +0 -1
- package/esm/_internal/mergeRefs.js.map +0 -1
- package/esm/_internal/partitionMulti.js.map +0 -1
- package/esm/_internal/renderLink.js.map +0 -1
- package/esm/_internal/type.js.map +0 -1
- package/esm/_internal/types.js.map +0 -1
- package/esm/_internal/useDelayedVisibility.js.map +0 -1
- package/esm/_internal/useDisableBodyScroll.js.map +0 -1
- package/esm/_internal/useFocusTrap.js.map +0 -1
- package/esm/_internal/useRovingTabIndex.js.map +0 -1
- package/esm/index.js +0 -89
- package/esm/index2.js.map +0 -1
- package/types.d.ts +0 -2629
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"userovingtabindex.66.js","sources":["../../../src/components/tabs/state.ts","../../../src/hooks/useRovingTabIndex.tsx"],"sourcesContent":["import { Dispatch, createContext, useCallback, useContext, useEffect, useMemo } from 'react';\nimport { uid } from 'uid';\n\ntype TabType = 'tab' | 'tabPanel';\n\nexport interface State {\n isLazy: boolean;\n shouldActivateOnFocus: boolean;\n activeTabIndex: number;\n ids: Record<TabType, string[]>;\n}\n\nexport const INIT_STATE: State = {\n isLazy: true,\n shouldActivateOnFocus: false,\n activeTabIndex: 0,\n ids: { tab: [], tabPanel: [] },\n};\n\nexport type Action =\n | { type: 'update'; payload: Partial<State> }\n | { type: 'setActiveTabIndex'; payload: number }\n | { type: 'register'; payload: { type: TabType; id: string } }\n | { type: 'unregister'; payload: { type: TabType; id: string } };\n\nexport const reducer = (state: State, action: Action): State => {\n switch (action.type) {\n case 'update':\n return { ...state, ...action.payload };\n case 'setActiveTabIndex': {\n if (state.activeTabIndex === action.payload) {\n return state;\n }\n // Change active tab index.\n return { ...state, activeTabIndex: action.payload };\n }\n case 'register': {\n const { type, id } = action.payload;\n // Append tab/tabPanel id in state.\n return { ...state, ids: { ...state.ids, [type]: [...state.ids[type], id] } };\n }\n case 'unregister': {\n const { type, id } = action.payload;\n const index = state.ids[type].indexOf(id);\n if (index === -1) return state;\n // Remove tab & tab panel at index.\n const tabIds = [...state.ids.tab];\n tabIds.splice(index, 1);\n const tabPanelIds = [...state.ids.tabPanel];\n tabPanelIds.splice(index, 1);\n return {\n ...state,\n ids: { tab: tabIds, tabPanel: tabPanelIds },\n };\n }\n default:\n return state;\n }\n};\n\nexport const TabProviderContext = createContext<[State, Dispatch<Action>] | null>(null);\n\nexport type TabState = Pick<Required<State>, 'isLazy' | 'shouldActivateOnFocus'> & {\n isActive: boolean;\n tabId: string;\n tabPanelId: string;\n changeToTab(): void;\n};\n\n/* eslint-disable react-hooks/rules-of-hooks */\nexport const useTabProviderContext = (type: TabType, originalId?: string): undefined | TabState => {\n const context = useContext(TabProviderContext);\n if (!context) {\n return undefined;\n }\n const [state, dispatch] = context;\n\n // Current tab or tab panel id.\n const id = useMemo(\n () => originalId || `${type}-${uid()}`,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n useEffect(\n () => {\n // On mount: register tab or tab panel id.\n dispatch({ type: 'register', payload: { type, id } });\n return () => {\n // On unmount: unregister tab or tab panel id.\n dispatch({ type: 'unregister', payload: { type, id } });\n };\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n\n // Find tab/tabPanel index using it's id.\n const index = useMemo(() => state.ids[type].indexOf(id), [state.ids, type, id]);\n const tabId = useMemo(() => state.ids.tab[index] || '', [state, index]);\n const tabPanelId = useMemo(() => state.ids.tabPanel[index] || '', [state, index]);\n const isActive = useMemo(() => state.activeTabIndex === index, [state, index]);\n const changeToTab = useCallback(() => dispatch({ type: 'setActiveTabIndex', payload: index }), [dispatch, index]);\n return {\n isLazy: state.isLazy,\n shouldActivateOnFocus: state.shouldActivateOnFocus,\n tabId,\n tabPanelId,\n isActive,\n changeToTab,\n };\n};\n\nexport const useTabProviderContextState = (): State | undefined => {\n const context = useContext(TabProviderContext);\n return context?.[0];\n};\n","import { RefObject, useEffect } from 'react';\n\ninterface UseRovingTabIndexOptions {\n parentRef: RefObject<HTMLElement>;\n elementSelector: string;\n keepTabIndex?: boolean;\n /** List of values to be used as extra dependencies of the useEffect */\n extraDependencies?: any[];\n}\n\nexport const useRovingTabIndex = ({\n parentRef,\n elementSelector,\n keepTabIndex,\n extraDependencies = [],\n}: UseRovingTabIndexOptions): void => {\n useEffect(\n () => {\n const parent = parentRef?.current;\n if (!parent) {\n return undefined;\n }\n\n const elements = parent.querySelectorAll(elementSelector) as NodeListOf<HTMLElement>;\n const initialFocusableElement = parent?.querySelector(`${elementSelector}[tabindex=\"0\"]`);\n\n const handleKeyDown = (index: number) => (evt: KeyboardEvent) => {\n let newTabFocus = index;\n if (!(evt.key === 'ArrowRight' || evt.key === 'ArrowLeft')) {\n return;\n }\n\n if (evt.key === 'ArrowRight') {\n // Move right\n newTabFocus += 1;\n // If we're at the end, go to the start\n if (newTabFocus >= elements.length) {\n newTabFocus = 0;\n }\n } else if (evt.key === 'ArrowLeft') {\n // Move left\n newTabFocus -= 1;\n if (newTabFocus < 0) {\n // If we're at the start, move to the end\n newTabFocus = elements.length - 1;\n }\n }\n const newElement = elements[newTabFocus];\n newElement?.focus();\n if (keepTabIndex) {\n (evt.currentTarget as HTMLElement).setAttribute('tabindex', '-1');\n newElement?.setAttribute('tabindex', '0');\n }\n };\n\n if (elements?.length > 0) {\n elements.forEach((el, key) => {\n // if no element has tabindex set to 0, set the first element as focusable\n if (!initialFocusableElement && key === 0) {\n el.setAttribute('tabindex', '0');\n // set all other to -1\n } else if (initialFocusableElement !== el) {\n el.setAttribute('tabindex', '-1');\n }\n // add event listener\n el.addEventListener('keydown', handleKeyDown(key) as EventListener);\n });\n }\n\n // Cleanup listeners\n return () => {\n if (elements?.length > 0) {\n elements.forEach((el, key) => {\n el.removeEventListener('keydown', handleKeyDown(key) as EventListener);\n });\n }\n };\n }, // eslint-disable-next-line react-hooks/exhaustive-deps\n [parentRef, ...extraDependencies],\n );\n};\n"],"names":["INIT_STATE","isLazy","shouldActivateOnFocus","activeTabIndex","ids","tab","tabPanel","reducer","state","action","type","payload","id","index","indexOf","tabIds","splice","tabPanelIds","TabProviderContext","createContext","useTabProviderContext","originalId","context","useContext","undefined","dispatch","useMemo","uid","useEffect","tabId","tabPanelId","isActive","changeToTab","useCallback","useTabProviderContextState","useRovingTabIndex","parentRef","elementSelector","keepTabIndex","extraDependencies","parent","current","elements","querySelectorAll","initialFocusableElement","querySelector","handleKeyDown","evt","newTabFocus","key","length","newElement","focus","currentTarget","setAttribute","forEach","el","addEventListener","removeEventListener"],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
interface UseFocusWithinOptions {
|
|
2
|
+
/** element to add the focus within to */
|
|
3
|
+
element: HTMLElement | undefined;
|
|
4
|
+
/** callback to be executed on focus in */
|
|
5
|
+
onFocusIn: (ev: FocusEvent) => void;
|
|
6
|
+
/** callback to be executed on focus out */
|
|
7
|
+
onFocusOut: (ev: FocusEvent) => void;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Hook that allows to control when there is a focus event within a given element, meaning
|
|
11
|
+
* that any element within the given target will trigger the focus in and focus out events.
|
|
12
|
+
* @param options - UseFocusWithinOptions
|
|
13
|
+
*/
|
|
14
|
+
declare const useFocusWithin: ({ element, onFocusIn, onFocusOut }: UseFocusWithinOptions) => void;
|
|
15
|
+
|
|
16
|
+
export { UseFocusWithinOptions, useFocusWithin };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Hook that allows to control when there is a focus event within a given element, meaning
|
|
5
|
+
* that any element within the given target will trigger the focus in and focus out events.
|
|
6
|
+
* @param options - UseFocusWithinOptions
|
|
7
|
+
*/
|
|
8
|
+
var useFocusWithin = function useFocusWithin(_ref) {
|
|
9
|
+
var element = _ref.element,
|
|
10
|
+
onFocusIn = _ref.onFocusIn,
|
|
11
|
+
onFocusOut = _ref.onFocusOut;
|
|
12
|
+
useEffect(function () {
|
|
13
|
+
if (element) {
|
|
14
|
+
element.addEventListener('focusin', onFocusIn);
|
|
15
|
+
element.addEventListener('focusout', onFocusOut);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
return function () {
|
|
19
|
+
if (element) {
|
|
20
|
+
element.removeEventListener('focusin', onFocusIn);
|
|
21
|
+
element.addEventListener('focusout', onFocusOut);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
}, [onFocusIn, element, onFocusOut]);
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export { useFocusWithin };
|
|
28
|
+
//# sourceMappingURL=useFocusWithin.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFocusWithin.js","sources":["../../src/hooks/useFocusWithin.ts"],"sourcesContent":["import { useEffect } from 'react';\n\nexport interface UseFocusWithinOptions {\n /** element to add the focus within to */\n element: HTMLElement | undefined;\n /** callback to be executed on focus in */\n onFocusIn: (ev: FocusEvent) => void;\n /** callback to be executed on focus out */\n onFocusOut: (ev: FocusEvent) => void;\n}\n\n/**\n * Hook that allows to control when there is a focus event within a given element, meaning\n * that any element within the given target will trigger the focus in and focus out events.\n * @param options - UseFocusWithinOptions\n */\nexport const useFocusWithin = ({ element, onFocusIn, onFocusOut }: UseFocusWithinOptions) => {\n useEffect(() => {\n if (element) {\n element.addEventListener('focusin', onFocusIn);\n\n element.addEventListener('focusout', onFocusOut);\n }\n\n return () => {\n if (element) {\n element.removeEventListener('focusin', onFocusIn);\n\n element.addEventListener('focusout', onFocusOut);\n }\n };\n }, [onFocusIn, element, onFocusOut]);\n};\n"],"names":["useFocusWithin","element","onFocusIn","onFocusOut","useEffect","addEventListener","removeEventListener"],"mappings":";;AAWA;;;;;IAKaA,cAAc,GAAG,SAAjBA,cAAiB,OAA+D;AAAA,MAA5DC,OAA4D,QAA5DA,OAA4D;AAAA,MAAnDC,SAAmD,QAAnDA,SAAmD;AAAA,MAAxCC,UAAwC,QAAxCA,UAAwC;AACzFC,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAIH,OAAJ,EAAa;AACTA,MAAAA,OAAO,CAACI,gBAAR,CAAyB,SAAzB,EAAoCH,SAApC;AAEAD,MAAAA,OAAO,CAACI,gBAAR,CAAyB,UAAzB,EAAqCF,UAArC;AACH;;AAED,WAAO,YAAM;AACT,UAAIF,OAAJ,EAAa;AACTA,QAAAA,OAAO,CAACK,mBAAR,CAA4B,SAA5B,EAAuCJ,SAAvC;AAEAD,QAAAA,OAAO,CAACI,gBAAR,CAAyB,UAAzB,EAAqCF,UAArC;AACH;AACJ,KAND;AAOH,GAdQ,EAcN,CAACD,SAAD,EAAYD,OAAZ,EAAqBE,UAArB,CAdM,CAAT;AAeH;;;;"}
|