UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 10.2 kB
{"version":3,"file":"utils.mjs","sources":["../../../../../../packages/components/focus-trap/src/utils.ts"],"sourcesContent":["import { onBeforeUnmount, onMounted, ref } from 'vue'\nimport { focusElement } from '@element-plus/utils'\nimport { FOCUSOUT_PREVENTED, FOCUSOUT_PREVENTED_OPTS } from './tokens'\n\nconst focusReason = ref<'pointer' | 'keyboard'>()\nconst lastUserFocusTimestamp = ref<number>(0)\nconst lastAutomatedFocusTimestamp = ref<number>(0)\nlet focusReasonUserCount = 0\n\nexport type FocusLayer = {\n paused: boolean\n pause: () => void\n resume: () => void\n}\n\nexport type FocusStack = FocusLayer[]\n\nexport const obtainAllFocusableElements = (\n element: HTMLElement\n): HTMLElement[] => {\n const nodes: HTMLElement[] = []\n const walker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT, {\n acceptNode: (\n node: Element & {\n disabled: boolean\n hidden: boolean\n type: string\n tabIndex: number\n }\n ) => {\n const isHiddenInput = node.tagName === 'INPUT' && node.type === 'hidden'\n if (node.disabled || node.hidden || isHiddenInput)\n return NodeFilter.FILTER_SKIP\n return node.tabIndex >= 0 || node === document.activeElement\n ? NodeFilter.FILTER_ACCEPT\n : NodeFilter.FILTER_SKIP\n },\n })\n while (walker.nextNode()) nodes.push(walker.currentNode as HTMLElement)\n\n return nodes\n}\n\nexport const getVisibleElement = (\n elements: HTMLElement[],\n container: HTMLElement\n) => {\n for (const element of elements) {\n if (!isHidden(element, container)) return element\n }\n}\n\nexport const isHidden = (element: HTMLElement, container: HTMLElement) => {\n if (process.env.NODE_ENV === 'test') return false\n if (getComputedStyle(element).visibility === 'hidden') return true\n\n while (element) {\n if (container && element === container) return false\n if (getComputedStyle(element).display === 'none') return true\n element = element.parentElement as HTMLElement\n }\n\n return false\n}\n\nexport const getEdges = (container: HTMLElement) => {\n const focusable = obtainAllFocusableElements(container)\n const first = getVisibleElement(focusable, container)\n const last = getVisibleElement(focusable.reverse(), container)\n return [first, last]\n}\n\nconst isSelectable = (\n element: any\n): element is HTMLInputElement & { select: () => void } => {\n return element instanceof HTMLInputElement && 'select' in element\n}\n\nexport const tryFocus = (\n element?: HTMLElement | { focus: () => void } | null,\n shouldSelect?: boolean\n) => {\n if (element) {\n const prevFocusedElement = document.activeElement\n\n focusElement(element, { preventScroll: true })\n lastAutomatedFocusTimestamp.value = window.performance.now()\n\n if (\n element !== prevFocusedElement &&\n isSelectable(element) &&\n shouldSelect\n ) {\n element.select()\n }\n }\n}\n\nfunction removeFromStack<T>(list: T[], item: T) {\n const copy = [...list]\n\n const idx = list.indexOf(item)\n\n if (idx !== -1) {\n copy.splice(idx, 1)\n }\n return copy\n}\n\nconst createFocusableStack = () => {\n let stack = [] as FocusStack\n\n const push = (layer: FocusLayer) => {\n const currentLayer = stack[0]\n\n if (currentLayer && layer !== currentLayer) {\n currentLayer.pause()\n }\n\n stack = removeFromStack(stack, layer)\n stack.unshift(layer)\n }\n\n const remove = (layer: FocusLayer) => {\n stack = removeFromStack(stack, layer)\n stack[0]?.resume?.()\n }\n\n return {\n push,\n remove,\n }\n}\n\nexport const focusFirstDescendant = (\n elements: HTMLElement[],\n shouldSelect = false\n) => {\n const prevFocusedElement = document.activeElement\n for (const element of elements) {\n tryFocus(element, shouldSelect)\n if (document.activeElement !== prevFocusedElement) return\n }\n}\n\nexport const focusableStack = createFocusableStack()\n\nexport const isFocusCausedByUserEvent = (): boolean => {\n return lastUserFocusTimestamp.value > lastAutomatedFocusTimestamp.value\n}\n\nconst notifyFocusReasonPointer = () => {\n focusReason.value = 'pointer'\n lastUserFocusTimestamp.value = window.performance.now()\n}\n\nconst notifyFocusReasonKeydown = () => {\n focusReason.value = 'keyboard'\n lastUserFocusTimestamp.value = window.performance.now()\n}\n\nexport const useFocusReason = (): {\n focusReason: typeof focusReason\n lastUserFocusTimestamp: typeof lastUserFocusTimestamp\n lastAutomatedFocusTimestamp: typeof lastAutomatedFocusTimestamp\n} => {\n onMounted(() => {\n if (focusReasonUserCount === 0) {\n document.addEventListener('mousedown', notifyFocusReasonPointer)\n document.addEventListener('touchstart', notifyFocusReasonPointer)\n document.addEventListener('keydown', notifyFocusReasonKeydown)\n }\n focusReasonUserCount++\n })\n\n onBeforeUnmount(() => {\n focusReasonUserCount--\n if (focusReasonUserCount <= 0) {\n document.removeEventListener('mousedown', notifyFocusReasonPointer)\n document.removeEventListener('touchstart', notifyFocusReasonPointer)\n document.removeEventListener('keydown', notifyFocusReasonKeydown)\n }\n })\n\n return {\n focusReason,\n lastUserFocusTimestamp,\n lastAutomatedFocusTimestamp,\n }\n}\n\nexport const createFocusOutPreventedEvent = (\n detail: CustomEventInit['detail']\n) => {\n return new CustomEvent(FOCUSOUT_PREVENTED, {\n ...FOCUSOUT_PREVENTED_OPTS,\n detail,\n })\n}\n"],"names":[],"mappings":"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"}