vuestic-ui
Version:
Vue 3 UI Framework
1 lines • 1.84 kB
Source Map (JSON)
{"version":3,"file":"focus.mjs","sources":["../../../../src/utils/focus.ts"],"sourcesContent":["const isHTMLElement = (el: unknown): el is HTMLElement => {\n return el instanceof HTMLElement\n}\n\n/**\n * Since `.focus()` does not dispatch native event, this method will dispatch it automatically\n * @emits focus\n */\nexport const focusElement = <T extends Element | undefined>(el: T) => {\n if (!el || !isHTMLElement(el)) { return }\n\n el.focus()\n el.dispatchEvent(new FocusEvent('focus', { bubbles: true }))\n}\n\n/**\n * Since `.blur()` does not dispatch native event, this method will dispatch it automatically\n * @emits blur\n */\nexport const blurElement = <T extends Element | undefined>(el: T) => {\n if (!el || !isHTMLElement(el)) { return }\n\n el.blur()\n el.dispatchEvent(new Event('blur', { bubbles: true }))\n}\n\n/**\n * Focus first focusable child of parent.\n *\n * @example Used to give focus back to menu after closing submenu.\n */\nexport const focusFirstFocusableChild = (el: HTMLElement) => {\n if (el.tabIndex !== -1) {\n focusElement(el)\n return\n }\n\n const focusable = el.querySelector<HTMLElement>('button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])')\n if (focusable) { focusElement(focusable) }\n}\n"],"names":[],"mappings":"AAAA,MAAM,gBAAgB,CAAC,OAAmC;AACxD,SAAO,cAAc;AACvB;AAMa,MAAA,eAAe,CAAgC,OAAU;AACpE,MAAI,CAAC,MAAM,CAAC,cAAc,EAAE,GAAG;AAAE;AAAA,EAAO;AAExC,KAAG,MAAM;AACN,KAAA,cAAc,IAAI,WAAW,SAAS,EAAE,SAAS,KAAM,CAAA,CAAC;AAC7D;AAMa,MAAA,cAAc,CAAgC,OAAU;AACnE,MAAI,CAAC,MAAM,CAAC,cAAc,EAAE,GAAG;AAAE;AAAA,EAAO;AAExC,KAAG,KAAK;AACL,KAAA,cAAc,IAAI,MAAM,QAAQ,EAAE,SAAS,KAAM,CAAA,CAAC;AACvD;AAOa,MAAA,2BAA2B,CAAC,OAAoB;AACvD,MAAA,GAAG,aAAa,IAAI;AACtB,iBAAa,EAAE;AACf;AAAA,EACF;AAEM,QAAA,YAAY,GAAG,cAA2B,0EAA0E;AAC1H,MAAI,WAAW;AAAE,iBAAa,SAAS;AAAA,EAAE;AAC3C;"}