se-design 1.0.62-dev → 1.0.63

package/dist/index212.js.map

@@ -1 +1 @@
-{"version":3,"file":"index212.js","sources":["../src/components/NavigationBar/useTabsA11y.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useRovingFocus } from '../../utils/a11y';\n\nconst getTabId = (itemId: string, idBase: string) => {\n  const suffix = idBase ? `-${idBase}` : '';\n  return `tab${suffix}-${itemId}`;\n};\n\nconst getPanelId = (itemId: string, idBase: string) => {\n  const suffix = idBase ? `-${idBase}` : '';\n  return `panel${suffix}-${itemId}`;\n};\n\ninterface UseTabsA11yProps {\n  itemIds: string[];\n  orientation?: 'horizontal' | 'vertical';\n  activeNavigationItem: string;\n  idBase?: string;\n}\n\ninterface TabA11yProps {\n  ref: (el: HTMLElement | null) => void;\n  tabIndex: number;\n  id: string;\n  'aria-controls': string;\n  'aria-selected': boolean;\n  role: 'tab';\n}\n\n/**\n * Hook for managing Tabs (NavigationBar) focus and ARIA props.\n * Handles roving tabindex pattern and generates tab-specific ARIA attributes.\n * \n * @example\n * const itemIds = useMemo(() => navigationItems.map(item => item.id), [navigationItems]);\n * const { getTabProps, setFocusedTabId, handleKeyDown } = useTabsA11y({\n *   itemIds,\n *   activeNavigationItem: 'tab-1',\n *   orientation: 'horizontal',\n *   idBase: 'settings'\n * });\n */\nexport function useTabsA11y({\n  itemIds,\n  orientation = 'horizontal',\n  activeNavigationItem,\n  idBase = ''\n}: UseTabsA11yProps) {\n  const {\n    setFocusedId: setFocusedTabId,\n    handleKeyDown,\n    getRovingItemProps\n  } = useRovingFocus({\n    itemIds,\n    defaultFocusedId: activeNavigationItem,\n    orientation,\n    loop: true\n  });\n\n  /**\n   * Get all props needed for a tab button.\n   * Combines roving focus props (ref, tabIndex) with tab-specific ARIA attributes.\n   */\n  const getTabProps = useCallback((itemId: string): TabA11yProps => {\n    const { ref, tabIndex } = getRovingItemProps(itemId);\n    const isSelected = activeNavigationItem === itemId;\n\n    return {\n      ref,\n      tabIndex,\n      id: getTabId(itemId, idBase),\n      'aria-controls': getPanelId(itemId, idBase),\n      'aria-selected': isSelected,\n      role: 'tab'\n    };\n  }, [activeNavigationItem, getRovingItemProps, idBase]);\n\n  return {\n    getTabProps,\n    setFocusedTabId,\n    handleKeyDown,\n    getPanelId: (itemId: string) => getPanelId(itemId, idBase),\n    getTabId: (itemId: string) => getTabId(itemId, idBase)\n  };\n}\n\n"],"names":["useCallback","useRovingFocus","getTabId","itemId","idBase","getPanelId","useTabsA11y","itemIds","orientation","activeNavigationItem","setFocusedId","setFocusedTabId","handleKeyDown","getRovingItemProps","defaultFocusedId","loop","getTabProps","ref","tabIndex","isSelected","id","role"],"mappings":"AAGA,SAAA,eAAAA,SAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,MAAMC,IAAWA,CAACC,GAAgBC,MAEzB,MADQA,IAAS,IAAIA,CAAM,KAAK,EACpB,IAAID,CAAM,IAGzBE,IAAaA,CAACF,GAAgBC,MAE3B,QADQA,IAAS,IAAIA,CAAM,KAAK,EAClB,IAAID,CAAM;AAgC1B,SAASG,EAAY;AAAA,EAC1BC,SAAAA;AAAAA,EACAC,aAAAA,IAAc;AAAA,EACdC,sBAAAA;AAAAA,EACAL,QAAAA,IAAS;AACO,GAAG;AACnB,QAAM;AAAA,IACJM,cAAcC;AAAAA,IACdC,eAAAA;AAAAA,IACAC,oBAAAA;AAAAA,EAAAA,IACEZ,EAAe;AAAA,IACjBM,SAAAA;AAAAA,IACAO,kBAAkBL;AAAAA,IAClBD,aAAAA;AAAAA,IACAO,MAAM;AAAA,EAAA,CACP;AAoBD,SAAO;AAAA,IACLC,aAfkBhB,EAAY,CAACG,MAAiC;AAChE,YAAM;AAAA,QAAEc,KAAAA;AAAAA,QAAKC,UAAAA;AAAAA,MAAAA,IAAaL,EAAmBV,CAAM,GAC7CgB,IAAaV,MAAyBN;AAE5C,aAAO;AAAA,QACLc,KAAAA;AAAAA,QACAC,UAAAA;AAAAA,QACAE,IAAIlB,EAASC,GAAQC,CAAM;AAAA,QAC3B,iBAAiBC,EAAWF,GAAQC,CAAM;AAAA,QAC1C,iBAAiBe;AAAAA,QACjBE,MAAM;AAAA,MAAA;AAAA,IAEV,GAAG,CAACZ,GAAsBI,GAAoBT,CAAM,CAAC;AAAA,IAInDO,iBAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAP,YAAYA,CAACF,MAAmBE,EAAWF,GAAQC,CAAM;AAAA,IACzDF,UAAUA,CAACC,MAAmBD,EAASC,GAAQC,CAAM;AAAA,EAAA;AAEzD;"}
+{"version":3,"file":"index212.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/{index211.js → index214.js}

@@ -32,4 +32,4 @@ b.displayName = "TabButton";
 export {
   b as TabButton
 };
-//# sourceMappingURL=index211.js.map
+//# sourceMappingURL=index214.js.map

package/dist/{index211.js.map → index214.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index211.js","sources":["../src/components/NavigationBar/TabButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button } from '../Button';\n\nexport interface TabButtonProps {\n  id: string;\n  label: string;\n  isSelected: boolean;\n  isDisabled?: boolean;\n  panelId: string;\n  tabIndex: number;\n  className?: string;\n  automationId?: string;\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocus: () => void;\n  onKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n}\n\n/**\n * Internal TabButton component for NavigationBar.\n * Uses Button (unstyled) internally for consistent activation handling.\n * Supports forwardRef for focus management (roving tabindex).\n */\nexport const TabButton = forwardRef<HTMLButtonElement, TabButtonProps>(\n  (\n    {\n      id,\n      label,\n      isSelected,\n      isDisabled = false,\n      panelId,\n      tabIndex,\n      className = '',\n      automationId,\n      onClick,\n      onFocus,\n      onKeyDown\n    },\n    ref\n  ) => {\n    return (\n      <Button\n        ref={ref}\n        type=\"unstyled\"\n        label={label}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={className}\n        automationId={automationId}\n        role=\"tab\"\n        id={id}\n        aria-selected={isSelected}\n        aria-controls={panelId}\n        tabIndex={tabIndex}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTabButton.displayName = 'TabButton';\n"],"names":["React__default","forwardRef","Button","TabButton","id","label","isSelected","isDisabled","panelId","tabIndex","className","automationId","onClick","onFocus","onKeyDown","ref","React","createElement","type","disabled","role","displayName"],"mappings":"AAsBO,OAAAA,KAAA,cAAAC,SAAA;AAAA,SAAA,UAAAC,SAAA;AAAA,MAAMC,sBACX,CACE;AAAA,EACEC,IAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,cAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AACF,GACAC,MAGEC,gBAAAA,EAAAC,cAACf,GAAM;AAAA,EACLa,KAAAA;AAAAA,EACAG,MAAK;AAAA,EACLb,OAAAA;AAAAA,EACAc,UAAUZ;AAAAA,EACVK,SAAAA;AAAAA,EACAF,WAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAS,MAAK;AAAA,EACLhB,IAAAA;AAAAA,EACA,iBAAeE;AAAAA,EACf,iBAAeE;AAAAA,EACfC,UAAAA;AAAAA,EACAI,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,CACD,CAGP;AAEAX,EAAUkB,cAAc;"}
+{"version":3,"file":"index214.js","sources":["../src/components/NavigationBar/TabButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button } from '../Button';\n\nexport interface TabButtonProps {\n  id: string;\n  label: string;\n  isSelected: boolean;\n  isDisabled?: boolean;\n  panelId: string;\n  tabIndex: number;\n  className?: string;\n  automationId?: string;\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocus: () => void;\n  onKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n}\n\n/**\n * Internal TabButton component for NavigationBar.\n * Uses Button (unstyled) internally for consistent activation handling.\n * Supports forwardRef for focus management (roving tabindex).\n */\nexport const TabButton = forwardRef<HTMLButtonElement, TabButtonProps>(\n  (\n    {\n      id,\n      label,\n      isSelected,\n      isDisabled = false,\n      panelId,\n      tabIndex,\n      className = '',\n      automationId,\n      onClick,\n      onFocus,\n      onKeyDown\n    },\n    ref\n  ) => {\n    return (\n      <Button\n        ref={ref}\n        type=\"unstyled\"\n        label={label}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={className}\n        automationId={automationId}\n        role=\"tab\"\n        id={id}\n        aria-selected={isSelected}\n        aria-controls={panelId}\n        tabIndex={tabIndex}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTabButton.displayName = 'TabButton';\n"],"names":["TabButton","id","label","isSelected","isDisabled","panelId","tabIndex","className","automationId","onClick","onFocus","onKeyDown","ref","React","createElement","Button","type","disabled","role","displayName"],"mappings":"AAsBaA,OAAAA,KAAAA,cAAAA,SAAAA;AAAAA,SAAAA,UAAAA,SAAAA;AAAAA,MAAAA,sBACX,CACE;AAAA,EACEC,IAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,cAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AACF,GACAC,MAGEC,gBAAAA,EAAAC,cAACC,GAAM;AAAA,EACLH,KAAAA;AAAAA,EACAI,MAAK;AAAA,EACLd,OAAAA;AAAAA,EACAe,UAAUb;AAAAA,EACVK,SAAAA;AAAAA,EACAF,WAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAU,MAAK;AAAA,EACLjB,IAAAA;AAAAA,EACA,iBAAeE;AAAAA,EACf,iBAAeE;AAAAA,EACfC,UAAAA;AAAAA,EACAI,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,CACD,CAGP;AAEAX,EAAUmB,cAAc;"}

package/dist/index215.js

@@ -0,0 +1,44 @@
+import { useCallback as d } from "react";
+import { useRovingFocus as g } from "./index68.js";
+const u = (e, t) => `tab${t ? `-${t}` : ""}-${e}`, c = (e, t) => `panel${t ? `-${t}` : ""}-${e}`;
+function P({
+  itemIds: e,
+  orientation: t = "horizontal",
+  activeNavigationItem: r,
+  idBase: n = ""
+}) {
+  const {
+    setFocusedId: f,
+    handleKeyDown: l,
+    getRovingItemProps: s
+  } = g({
+    itemIds: e,
+    defaultFocusedId: r,
+    orientation: t,
+    loop: !0
+  });
+  return {
+    getTabProps: d((o) => {
+      const {
+        ref: b,
+        tabIndex: a
+      } = s(o), p = r === o;
+      return {
+        ref: b,
+        tabIndex: a,
+        id: u(o, n),
+        "aria-controls": c(o, n),
+        "aria-selected": p,
+        role: "tab"
+      };
+    }, [r, s, n]),
+    setFocusedTabId: f,
+    handleKeyDown: l,
+    getPanelId: (o) => c(o, n),
+    getTabId: (o) => u(o, n)
+  };
+}
+export {
+  P as useTabsA11y
+};
+//# sourceMappingURL=index215.js.map

package/dist/index215.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index215.js","sources":["../src/components/NavigationBar/useTabsA11y.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useRovingFocus } from '../../utils/a11y';\n\nconst getTabId = (itemId: string, idBase: string) => {\n  const suffix = idBase ? `-${idBase}` : '';\n  return `tab${suffix}-${itemId}`;\n};\n\nconst getPanelId = (itemId: string, idBase: string) => {\n  const suffix = idBase ? `-${idBase}` : '';\n  return `panel${suffix}-${itemId}`;\n};\n\ninterface UseTabsA11yProps {\n  itemIds: string[];\n  orientation?: 'horizontal' | 'vertical';\n  activeNavigationItem: string;\n  idBase?: string;\n}\n\ninterface TabA11yProps {\n  ref: (el: HTMLElement | null) => void;\n  tabIndex: number;\n  id: string;\n  'aria-controls': string;\n  'aria-selected': boolean;\n  role: 'tab';\n}\n\n/**\n * Hook for managing Tabs (NavigationBar) focus and ARIA props.\n * Handles roving tabindex pattern and generates tab-specific ARIA attributes.\n * \n * @example\n * const itemIds = useMemo(() => navigationItems.map(item => item.id), [navigationItems]);\n * const { getTabProps, setFocusedTabId, handleKeyDown } = useTabsA11y({\n *   itemIds,\n *   activeNavigationItem: 'tab-1',\n *   orientation: 'horizontal',\n *   idBase: 'settings'\n * });\n */\nexport function useTabsA11y({\n  itemIds,\n  orientation = 'horizontal',\n  activeNavigationItem,\n  idBase = ''\n}: UseTabsA11yProps) {\n  const {\n    setFocusedId: setFocusedTabId,\n    handleKeyDown,\n    getRovingItemProps\n  } = useRovingFocus({\n    itemIds,\n    defaultFocusedId: activeNavigationItem,\n    orientation,\n    loop: true\n  });\n\n  /**\n   * Get all props needed for a tab button.\n   * Combines roving focus props (ref, tabIndex) with tab-specific ARIA attributes.\n   */\n  const getTabProps = useCallback((itemId: string): TabA11yProps => {\n    const { ref, tabIndex } = getRovingItemProps(itemId);\n    const isSelected = activeNavigationItem === itemId;\n\n    return {\n      ref,\n      tabIndex,\n      id: getTabId(itemId, idBase),\n      'aria-controls': getPanelId(itemId, idBase),\n      'aria-selected': isSelected,\n      role: 'tab'\n    };\n  }, [activeNavigationItem, getRovingItemProps, idBase]);\n\n  return {\n    getTabProps,\n    setFocusedTabId,\n    handleKeyDown,\n    getPanelId: (itemId: string) => getPanelId(itemId, idBase),\n    getTabId: (itemId: string) => getTabId(itemId, idBase)\n  };\n}\n\n"],"names":["useCallback","useRovingFocus","getTabId","itemId","idBase","getPanelId","useTabsA11y","itemIds","orientation","activeNavigationItem","setFocusedId","setFocusedTabId","handleKeyDown","getRovingItemProps","defaultFocusedId","loop","getTabProps","ref","tabIndex","isSelected","id","role"],"mappings":"AAGA,SAAA,eAAAA,SAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,MAAMC,IAAWA,CAACC,GAAgBC,MAEzB,MADQA,IAAS,IAAIA,CAAM,KAAK,EACpB,IAAID,CAAM,IAGzBE,IAAaA,CAACF,GAAgBC,MAE3B,QADQA,IAAS,IAAIA,CAAM,KAAK,EAClB,IAAID,CAAM;AAgC1B,SAASG,EAAY;AAAA,EAC1BC,SAAAA;AAAAA,EACAC,aAAAA,IAAc;AAAA,EACdC,sBAAAA;AAAAA,EACAL,QAAAA,IAAS;AACO,GAAG;AACb,QAAA;AAAA,IACJM,cAAcC;AAAAA,IACdC,eAAAA;AAAAA,IACAC,oBAAAA;AAAAA,MACEZ,EAAe;AAAA,IACjBM,SAAAA;AAAAA,IACAO,kBAAkBL;AAAAA,IAClBD,aAAAA;AAAAA,IACAO,MAAM;AAAA,EAAA,CACP;AAoBM,SAAA;AAAA,IACLC,aAfkBhB,EAAY,CAACG,MAAiC;AAC1D,YAAA;AAAA,QAAEc,KAAAA;AAAAA,QAAKC,UAAAA;AAAAA,MAAAA,IAAaL,EAAmBV,CAAM,GAC7CgB,IAAaV,MAAyBN;AAErC,aAAA;AAAA,QACLc,KAAAA;AAAAA,QACAC,UAAAA;AAAAA,QACAE,IAAIlB,EAASC,GAAQC,CAAM;AAAA,QAC3B,iBAAiBC,EAAWF,GAAQC,CAAM;AAAA,QAC1C,iBAAiBe;AAAAA,QACjBE,MAAM;AAAA,MAAA;AAAA,IAEP,GAAA,CAACZ,GAAsBI,GAAoBT,CAAM,CAAC;AAAA,IAInDO,iBAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAP,YAAYA,CAACF,MAAmBE,EAAWF,GAAQC,CAAM;AAAA,IACzDF,UAAUA,CAACC,MAAmBD,EAASC,GAAQC,CAAM;AAAA,EAAA;AAEzD;"}

package/dist/index22.js

@@ -1,7 +1,7 @@
 import i, { useState as D, useEffect as O } from "react";
-import { useStableId as S } from "./index185.js";
+import { useStableId as S } from "./index188.js";
 import { getA11yNameAttributes as _ } from "./index70.js";
-import { mergeIds as $ } from "./index186.js";
+import { mergeIds as $ } from "./index189.js";
 /* empty css         */
 function b() {
   return b = Object.assign ? Object.assign.bind() : function(s) {

package/dist/index22.js.map

@@ -1 +1 @@
-{"version":3,"file":"index22.js","sources":["../src/components/Checkbox/index.tsx"],"sourcesContent":["import React, { FC, useState, useEffect } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport { mergeIds } from '../../utils/mergeIds';\nimport './style.scss';\n\nexport interface CheckboxProps {\n  className?: string;\n  automationId?: string;\n  defaultChecked?: boolean;\n  onChange?: (checked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;\n  disabled?: boolean;\n  checkMarkType?: 'tick' | 'minus-checkbox' | '';\n  label?: string;\n  disabledLabel?: string;\n  containerAutomationId?: string;\n  /**\n   * Explicit accessible name for the checkbox.\n   * Used as fallback when ariaLabelledBy is not provided and no internal label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this checkbox (for screen reader association).\n   * Typically used when checkbox is part of a larger labelled context.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this checkbox (provides additional context).\n   * Often used for help text or instructions.\n   */\n  ariaDescribedBy?: string;\n}\n\nexport const Checkbox: FC<CheckboxProps> = ({\n  className = '',\n  automationId = '',\n  defaultChecked = false,\n  disabled = false,\n  onChange,\n  checkMarkType = '',\n  label = '',\n  disabledLabel = '',\n  containerAutomationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy\n}) => {\n  const [isChecked, setIsChecked] = useState(defaultChecked);\n\n  useEffect(() => {\n    setIsChecked(defaultChecked);\n  }, [defaultChecked]);\n\n  const handleClick = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    setIsChecked((prev) => (checkMarkType === 'minus-checkbox' ? !prev : !prev));\n    onChange?.(!isChecked, e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLLabelElement | HTMLSpanElement>) => {\n    if (disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      e.stopPropagation();\n      const newChecked = !isChecked;\n      setIsChecked(newChecked);\n      \n      // Create a proper synthetic event for the onChange callback\n      const inputElement = e.currentTarget.closest('label')?.querySelector('input');\n      if (inputElement) {\n        const syntheticEvent = {\n          target: inputElement,\n          currentTarget: inputElement,\n        } as React.ChangeEvent<HTMLInputElement>;\n        onChange?.(newChecked, syntheticEvent);\n      }\n    }\n  };\n\n  const getCheckBoxClassName = () => {\n    // Handle disabled states with proper checked status\n    if (disabled) {\n      if (isChecked && checkMarkType === 'tick') return 'disabled-tick';\n      if (isChecked && checkMarkType === 'minus-checkbox') return 'disabled-minus-checkbox';\n      if (isChecked && !checkMarkType) return 'disabled-tick'; // Default to tick for checked disabled\n      return 'disabled-default'; // Unchecked disabled\n    }\n\n    // Handle enabled states\n    if (checkMarkType === 'minus-checkbox' && isChecked) return 'minus-checkbox';\n    return isChecked ? 'checked' : 'unchecked';\n  };\n\n  const getLabelClassName = () => {\n    return disabled ? 'checkbox-label-disabled' : 'checkbox-label';\n  };\n\n  const getLabelText = () => {\n    if (disabled && disabledLabel) {\n      return disabledLabel;\n    }\n    return label;\n  };\n  \n  // Generate stable IDs (persists across renders)\n  const inputId = useStableId(undefined, 'checkbox-input');\n  const labelId = label ? `${inputId}-label` : undefined;\n\n  const a11yNameAttributes = getA11yNameAttributes({\n    ariaLabelledBy: mergeIds(labelId, ariaLabelledBy),\n    ariaLabel,\n    ariaDescribedBy\n  });\n\n  // Determine aria-checked value: \"mixed\" for indeterminate, \"true\" for checked, \"false\" for unchecked\n  const getAriaChecked = () => {\n    if (checkMarkType === 'minus-checkbox' && isChecked) {\n      return 'mixed'; // Indeterminate/half-checked state\n    }\n    return isChecked ? 'true' : 'false';\n  };\n\n  return (\n    <div className=\"se-design-checkbox-ctn\">\n      <label\n        role=\"checkbox\"\n        htmlFor={inputId}\n        className={`se-design-checkbox ${className} ${getCheckBoxClassName()}`}\n        data-automation-id={containerAutomationId || 'checkbox-container'}\n        tabIndex={disabled ? -1 : 0}\n        aria-checked={getAriaChecked()}\n        aria-disabled={disabled ? 'true' : 'false'}\n        {...a11yNameAttributes}\n        onKeyDown={handleKeyDown}\n      >\n        <input\n          id={inputId}\n          type=\"checkbox\"\n          checked={isChecked}\n          onChange={handleClick}\n          disabled={disabled}\n          aria-hidden=\"true\"\n        />\n        <span className=\"checkbox-item\" data-automation-id={automationId}></span>\n        {getLabelText()?.length > 0 && (\n          <span id={labelId} className={getLabelClassName()} data-automation-id=\"checkbox-label\">\n            {getLabelText()}\n          </span>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Checkbox","className","automationId","defaultChecked","disabled","onChange","checkMarkType","label","disabledLabel","containerAutomationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","isChecked","setIsChecked","useState","useEffect","handleClick","e","prev","handleKeyDown","key","preventDefault","stopPropagation","newChecked","inputElement","currentTarget","closest","querySelector","target","getCheckBoxClassName","getLabelClassName","getLabelText","inputId","useStableId","undefined","labelId","a11yNameAttributes","getA11yNameAttributes","mergeIds","getAriaChecked","React","createElement","_extends","role","htmlFor","tabIndex","onKeyDown","id","type","checked","length"],"mappings":"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"}
+{"version":3,"file":"index22.js","sources":["../src/components/Checkbox/index.tsx"],"sourcesContent":["import React, { FC, useState, useEffect } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport { mergeIds } from '../../utils/mergeIds';\nimport './style.scss';\n\nexport interface CheckboxProps {\n  className?: string;\n  automationId?: string;\n  defaultChecked?: boolean;\n  onChange?: (checked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;\n  disabled?: boolean;\n  checkMarkType?: 'tick' | 'minus-checkbox' | '';\n  label?: string;\n  disabledLabel?: string;\n  containerAutomationId?: string;\n  /**\n   * Explicit accessible name for the checkbox.\n   * Used as fallback when ariaLabelledBy is not provided and no internal label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this checkbox (for screen reader association).\n   * Typically used when checkbox is part of a larger labelled context.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this checkbox (provides additional context).\n   * Often used for help text or instructions.\n   */\n  ariaDescribedBy?: string;\n}\n\nexport const Checkbox: FC<CheckboxProps> = ({\n  className = '',\n  automationId = '',\n  defaultChecked = false,\n  disabled = false,\n  onChange,\n  checkMarkType = '',\n  label = '',\n  disabledLabel = '',\n  containerAutomationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy\n}) => {\n  const [isChecked, setIsChecked] = useState(defaultChecked);\n\n  useEffect(() => {\n    setIsChecked(defaultChecked);\n  }, [defaultChecked]);\n\n  const handleClick = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    setIsChecked((prev) => (checkMarkType === 'minus-checkbox' ? !prev : !prev));\n    onChange?.(!isChecked, e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLLabelElement | HTMLSpanElement>) => {\n    if (disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      e.stopPropagation();\n      const newChecked = !isChecked;\n      setIsChecked(newChecked);\n      \n      // Create a proper synthetic event for the onChange callback\n      const inputElement = e.currentTarget.closest('label')?.querySelector('input');\n      if (inputElement) {\n        const syntheticEvent = {\n          target: inputElement,\n          currentTarget: inputElement,\n        } as React.ChangeEvent<HTMLInputElement>;\n        onChange?.(newChecked, syntheticEvent);\n      }\n    }\n  };\n\n  const getCheckBoxClassName = () => {\n    // Handle disabled states with proper checked status\n    if (disabled) {\n      if (isChecked && checkMarkType === 'tick') return 'disabled-tick';\n      if (isChecked && checkMarkType === 'minus-checkbox') return 'disabled-minus-checkbox';\n      if (isChecked && !checkMarkType) return 'disabled-tick'; // Default to tick for checked disabled\n      return 'disabled-default'; // Unchecked disabled\n    }\n\n    // Handle enabled states\n    if (checkMarkType === 'minus-checkbox' && isChecked) return 'minus-checkbox';\n    return isChecked ? 'checked' : 'unchecked';\n  };\n\n  const getLabelClassName = () => {\n    return disabled ? 'checkbox-label-disabled' : 'checkbox-label';\n  };\n\n  const getLabelText = () => {\n    if (disabled && disabledLabel) {\n      return disabledLabel;\n    }\n    return label;\n  };\n  \n  // Generate stable IDs (persists across renders)\n  const inputId = useStableId(undefined, 'checkbox-input');\n  const labelId = label ? `${inputId}-label` : undefined;\n\n  const a11yNameAttributes = getA11yNameAttributes({\n    ariaLabelledBy: mergeIds(labelId, ariaLabelledBy),\n    ariaLabel,\n    ariaDescribedBy\n  });\n\n  // Determine aria-checked value: \"mixed\" for indeterminate, \"true\" for checked, \"false\" for unchecked\n  const getAriaChecked = () => {\n    if (checkMarkType === 'minus-checkbox' && isChecked) {\n      return 'mixed'; // Indeterminate/half-checked state\n    }\n    return isChecked ? 'true' : 'false';\n  };\n\n  return (\n    <div className=\"se-design-checkbox-ctn\">\n      <label\n        role=\"checkbox\"\n        htmlFor={inputId}\n        className={`se-design-checkbox ${className} ${getCheckBoxClassName()}`}\n        data-automation-id={containerAutomationId || 'checkbox-container'}\n        tabIndex={disabled ? -1 : 0}\n        aria-checked={getAriaChecked()}\n        aria-disabled={disabled ? 'true' : 'false'}\n        {...a11yNameAttributes}\n        onKeyDown={handleKeyDown}\n      >\n        <input\n          id={inputId}\n          type=\"checkbox\"\n          checked={isChecked}\n          onChange={handleClick}\n          disabled={disabled}\n          aria-hidden=\"true\"\n        />\n        <span className=\"checkbox-item\" data-automation-id={automationId}></span>\n        {getLabelText()?.length > 0 && (\n          <span id={labelId} className={getLabelClassName()} data-automation-id=\"checkbox-label\">\n            {getLabelText()}\n          </span>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Checkbox","className","automationId","defaultChecked","disabled","onChange","checkMarkType","label","disabledLabel","containerAutomationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","isChecked","setIsChecked","useState","useEffect","handleClick","e","prev","handleKeyDown","key","preventDefault","stopPropagation","newChecked","inputElement","currentTarget","closest","querySelector","target","getCheckBoxClassName","getLabelClassName","getLabelText","inputId","useStableId","undefined","labelId","a11yNameAttributes","getA11yNameAttributes","mergeIds","getAriaChecked","React","createElement","_extends","role","htmlFor","tabIndex","onKeyDown","id","type","checked","length"],"mappings":"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"}

package/dist/index225.js

@@ -1,57 +1,7 @@
-import { useState as m, useEffect as w, useCallback as b } from "react";
-import { useScrollActiveIntoView as x } from "./index232.js";
-function E({
-  items: u,
-  isOpen: t,
-  onSelect: o,
-  onClose: c,
-  onOpen: l,
-  loop: i = !0,
-  disabled: h = !1,
-  listboxRef: k,
-  optionSelector: g = '[role="option"]'
-}) {
-  const [f, a] = m(-1);
-  w(() => {
-    t || a(-1);
-  }, [t]), x({
-    containerRef: k,
-    activeIndex: f,
-    itemSelector: g,
-    enabled: t
-  });
-  const D = b((r) => {
-    if (h) {
-      r.key === "Escape" && t && (r.preventDefault(), c());
-      return;
-    }
-    const e = u.length;
-    switch (r.key) {
-      case "ArrowDown":
-        r.preventDefault(), !t && e > 0 ? (l?.(), a(0)) : t && e > 0 && a((n) => i ? (n + 1) % e : Math.min(n + 1, e - 1));
-        break;
-      case "ArrowUp":
-        r.preventDefault(), t && e > 0 && a((n) => n === -1 ? e - 1 : i ? (n - 1 + e) % e : Math.max(n - 1, 0));
-        break;
-      case "Enter":
-        t && f >= 0 && u[f] && (r.preventDefault(), o(u[f], f), a(-1));
-        break;
-      case "Escape":
-        t && (r.preventDefault(), c(), a(-1));
-        break;
-      case "Tab":
-        t && (c(), a(-1));
-        break;
-    }
-  }, [h, u, t, f, o, c, l, i]), d = b((r, e) => `${r}-option-${e}`, []);
-  return {
-    highlightedIndex: f,
-    setHighlightedIndex: a,
-    handleKeyDown: D,
-    getOptionId: d
-  };
+function n(e) {
+  return new Promise((t) => setTimeout(t, e));
 }
 export {
-  E as useComboboxNavigation
+  n as delay
 };
 //# sourceMappingURL=index225.js.map

package/dist/index225.js.map

@@ -1 +1 @@
-{"version":3,"file":"index225.js","sources":["../src/utils/a11y/useComboboxNavigation.ts"],"sourcesContent":["import { useCallback, useState, useEffect } from 'react';\nimport type { RefObject } from 'react';\nimport { useScrollActiveIntoView } from './useScrollActiveIntoView';\n\nexport interface UseComboboxNavigationOptions<T = any> {\n  /**\n   * Array of items to navigate through\n   */\n  items: T[];\n  \n  /**\n   * Whether the dropdown is currently open\n   */\n  isOpen: boolean;\n  \n  /**\n   * Callback when an item is selected (Enter key)\n   */\n  onSelect: (item: T, index: number) => void;\n  \n  /**\n   * Callback to close the dropdown\n   */\n  onClose: () => void;\n  \n  /**\n   * Optional: Callback to open the dropdown\n   */\n  onOpen?: () => void;\n  \n  /**\n   * Whether to wrap around at the ends of the list.\n   * Default: true\n   */\n  loop?: boolean;\n  \n  /**\n   * Whether keyboard navigation is disabled\n   * (e.g., for custom rendered content)\n   */\n  disabled?: boolean;\n  \n  /**\n   * Ref to the listbox container for scroll management\n   */\n  listboxRef?: RefObject<HTMLElement | null>;\n  \n  /**\n   * CSS selector for option elements (default: '[role=\"option\"]')\n   */\n  optionSelector?: string;\n}\n\nexport interface UseComboboxNavigationReturn {\n  /**\n   * Currently highlighted index (-1 if none)\n   */\n  highlightedIndex: number;\n  \n  /**\n   * Set the highlighted index manually\n   */\n  setHighlightedIndex: (index: number | ((prev: number) => number)) => void;\n  \n  /**\n   * Keyboard event handler for the combobox input\n   */\n  handleKeyDown: (e: React.KeyboardEvent) => void;\n  \n  /**\n   * Generate stable ID for an option\n   */\n  getOptionId: (listboxId: string, index: number) => string;\n  \n}\n\n/**\n * Hook for managing combobox keyboard navigation with aria-activedescendant.\n * \n * Implements WAI-ARIA 1.2 Combobox pattern:\n * - Arrow Up/Down to navigate options\n * - Enter to select highlighted option\n * - Escape to close dropdown\n * - Tab to close and move focus\n * - Auto-scrolls highlighted option into view\n * \n * @example\n * ```tsx\n * const { \n *   highlightedIndex, \n *   handleKeyDown, \n *   getOptionId \n * } = useComboboxNavigation({\n *   items: suggestions,\n *   isOpen: isDropdownOpen,\n *   onSelect: (item, idx) => handleSelect(item),\n *   onClose: () => setIsOpen(false),\n *   listboxRef\n * });\n * \n * <input\n *   role=\"combobox\"\n *   onKeyDown={handleKeyDown}\n *   aria-activedescendant={highlightedIndex >= 0 ? getOptionId(listboxId, highlightedIndex) : undefined}\n * />\n * ```\n */\nexport function useComboboxNavigation<T = any>({\n  items,\n  isOpen,\n  onSelect,\n  onClose,\n  onOpen,\n  loop = true,\n  disabled = false,\n  listboxRef,\n  optionSelector = '[role=\"option\"]'\n}: UseComboboxNavigationOptions<T>): UseComboboxNavigationReturn {\n  const [highlightedIndex, setHighlightedIndex] = useState<number>(-1);\n  \n  // Reset highlighted index when dropdown closes\n  useEffect(() => {\n    if (!isOpen) {\n      setHighlightedIndex(-1);\n    }\n  }, [isOpen]);\n  \n  // Auto-scroll highlighted item into view\n  useScrollActiveIntoView({\n    containerRef: listboxRef,\n    activeIndex: highlightedIndex,\n    itemSelector: optionSelector,\n    enabled: isOpen\n  });\n  \n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (disabled) {\n        // For disabled navigation, still handle Escape\n        if (e.key === 'Escape' && isOpen) {\n          e.preventDefault();\n          onClose();\n        }\n        return;\n      }\n      \n      const itemCount = items.length;\n      \n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault();\n          if (!isOpen && itemCount > 0) {\n            // Open dropdown and highlight first item\n            onOpen?.();\n            setHighlightedIndex(0);\n          } else if (isOpen && itemCount > 0) {\n            // Navigate down\n            setHighlightedIndex((prev) => {\n              if (loop) {\n                return (prev + 1) % itemCount;\n              }\n              return Math.min(prev + 1, itemCount - 1);\n            });\n          }\n          break;\n          \n        case 'ArrowUp':\n          e.preventDefault();\n          if (isOpen && itemCount > 0) {\n            // Navigate up\n            setHighlightedIndex((prev) => {\n              // If nothing highlighted, go to last item\n              if (prev === -1) {\n                return itemCount - 1;\n              }\n              if (loop) {\n                return (prev - 1 + itemCount) % itemCount;\n              }\n              return Math.max(prev - 1, 0);\n            });\n          }\n          break;\n          \n        case 'Enter':\n          if (isOpen && highlightedIndex >= 0 && items[highlightedIndex]) {\n            e.preventDefault();\n            onSelect(items[highlightedIndex], highlightedIndex);\n            setHighlightedIndex(-1);\n          }\n          break;\n          \n        case 'Escape':\n          if (isOpen) {\n            e.preventDefault();\n            onClose();\n            setHighlightedIndex(-1);\n          }\n          break;\n          \n        case 'Tab':\n          // Close dropdown on Tab (don't preventDefault - let focus move naturally)\n          if (isOpen) {\n            onClose();\n            setHighlightedIndex(-1);\n          }\n          break;\n      }\n    },\n    [disabled, items, isOpen, highlightedIndex, onSelect, onClose, onOpen, loop]\n  );\n  \n  const getOptionId = useCallback(\n    (listboxId: string, index: number) => `${listboxId}-option-${index}`,\n    []\n  );\n  \n  return {\n    highlightedIndex,\n    setHighlightedIndex,\n    handleKeyDown,\n    getOptionId\n  };\n}\n"],"names":["useState","useEffect","useCallback","useScrollActiveIntoView","useComboboxNavigation","items","isOpen","onSelect","onClose","onOpen","loop","disabled","listboxRef","optionSelector","highlightedIndex","setHighlightedIndex","containerRef","activeIndex","itemSelector","enabled","handleKeyDown","e","key","preventDefault","itemCount","length","prev","Math","min","max","getOptionId","listboxId","index"],"mappings":"AA2GO,SAAA,YAAAA,GAAA,aAAAC,GAAA,eAAAC,SAAA;AAAA,SAAA,2BAAAC,SAAA;AAAA,SAASC,EAA+B;AAAA,EAC7CC,OAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,MAAAA,IAAO;AAAA,EACPC,UAAAA,IAAW;AAAA,EACXC,YAAAA;AAAAA,EACAC,gBAAAA,IAAiB;AACc,GAAgC;AAC/D,QAAM,CAACC,GAAkBC,CAAmB,IAAIf,EAAiB,EAAE;AAGnEC,EAAAA,EAAU,MAAM;AACd,IAAKK,KACHS,EAAoB,EAAE;AAAA,EAE1B,GAAG,CAACT,CAAM,CAAC,GAGXH,EAAwB;AAAA,IACtBa,cAAcJ;AAAAA,IACdK,aAAaH;AAAAA,IACbI,cAAcL;AAAAA,IACdM,SAASb;AAAAA,EAAAA,CACV;AAED,QAAMc,IAAgBlB,EACpB,CAACmB,MAA2B;AAC1B,QAAIV,GAAU;AAEZ,MAAIU,EAAEC,QAAQ,YAAYhB,MACxBe,EAAEE,eAAAA,GACFf,EAAAA;AAEF;AAAA,IACF;AAEA,UAAMgB,IAAYnB,EAAMoB;AAExB,YAAQJ,EAAEC,KAAAA;AAAAA,MACR,KAAK;AACHD,QAAAA,EAAEE,eAAAA,GACE,CAACjB,KAAUkB,IAAY,KAEzBf,IAAAA,GACAM,EAAoB,CAAC,KACZT,KAAUkB,IAAY,KAE/BT,EAAqBW,CAAAA,MACfhB,KACMgB,IAAO,KAAKF,IAEfG,KAAKC,IAAIF,IAAO,GAAGF,IAAY,CAAC,CACxC;AAEH;AAAA,MAEF,KAAK;AACHH,QAAAA,EAAEE,eAAAA,GACEjB,KAAUkB,IAAY,KAExBT,EAAqBW,CAAAA,MAEfA,MAAS,KACJF,IAAY,IAEjBd,KACMgB,IAAO,IAAIF,KAAaA,IAE3BG,KAAKE,IAAIH,IAAO,GAAG,CAAC,CAC5B;AAEH;AAAA,MAEF,KAAK;AACH,QAAIpB,KAAUQ,KAAoB,KAAKT,EAAMS,CAAgB,MAC3DO,EAAEE,eAAAA,GACFhB,EAASF,EAAMS,CAAgB,GAAGA,CAAgB,GAClDC,EAAoB,EAAE;AAExB;AAAA,MAEF,KAAK;AACH,QAAIT,MACFe,EAAEE,eAAAA,GACFf,EAAAA,GACAO,EAAoB,EAAE;AAExB;AAAA,MAEF,KAAK;AAEH,QAAIT,MACFE,EAAAA,GACAO,EAAoB,EAAE;AAExB;AAAA,IAAA;AAAA,EAEN,GACA,CAACJ,GAAUN,GAAOC,GAAQQ,GAAkBP,GAAUC,GAASC,GAAQC,CAAI,CAC7E,GAEMoB,IAAc5B,EAClB,CAAC6B,GAAmBC,MAAkB,GAAGD,CAAS,WAAWC,CAAK,IAClE,CAAA,CACF;AAEA,SAAO;AAAA,IACLlB,kBAAAA;AAAAA,IACAC,qBAAAA;AAAAA,IACAK,eAAAA;AAAAA,IACAU,aAAAA;AAAAA,EAAAA;AAEJ;"}
+{"version":3,"file":"index225.js","sources":["../src/utils/delay.ts"],"sourcesContent":["/**\n * Delays execution by the specified number of milliseconds\n * @param ms - The number of milliseconds to delay\n * @returns A Promise that resolves after the specified delay\n */\nexport function delay(ms: number): Promise<void> {\n    return new Promise(resolve => setTimeout(resolve, ms));\n} "],"names":["delay","ms","Promise","resolve","setTimeout"],"mappings":"AAKO,SAASA,EAAMC,GAA2B;AAC7C,SAAO,IAAIC,QAAQC,CAAAA,MAAWC,WAAWD,GAASF,CAAE,CAAC;AACzD;"}

package/dist/index227.js

@@ -1,13 +1,62 @@
-function e() {
-  return e = Object.assign ? Object.assign.bind() : function(t) {
-    for (var n = 1; n < arguments.length; n++) {
-      var a = arguments[n];
-      for (var r in a) ({}).hasOwnProperty.call(a, r) && (t[r] = a[r]);
+import { useRef as E, useLayoutEffect as f } from "react";
+import { getFirstFocusableElement as d, getFocusableElements as g } from "./index234.js";
+function y(e, t) {
+  return t === "first" ? d({
+    container: e
+  }) || e : t === "container" ? e : typeof t == "string" ? e.querySelector(t) : t instanceof HTMLElement ? t : null;
+}
+function L({
+  enabled: e,
+  containerRef: t,
+  restoreFocus: i = !0,
+  initialFocus: l = "first"
+}) {
+  const s = E(null), m = E(null);
+  return f(() => {
+    if (!e) {
+      i && s.current && requestAnimationFrame(() => {
+        s.current?.focus(), s.current = null;
+      });
+      return;
     }
-    return t;
-  }, e.apply(null, arguments);
+    const r = t.current;
+    r && (s.current = document.activeElement, requestAnimationFrame(() => {
+      y(r, l)?.focus();
+    }));
+  }, [e, t, i, l]), f(() => {
+    if (!e) return;
+    const r = t.current;
+    if (!r) return;
+    const c = (n) => {
+      if (n.key === "Tab") {
+        const u = g({
+          container: r
+        });
+        if (u.length === 0) {
+          n.preventDefault(), r.focus();
+          return;
+        }
+        const o = u[0], a = u[u.length - 1], v = document.activeElement;
+        n.shiftKey && v === o ? (n.preventDefault(), a.focus()) : !n.shiftKey && v === a && (n.preventDefault(), o.focus());
+      }
+    };
+    return document.addEventListener("keydown", c, !0), () => document.removeEventListener("keydown", c, !0);
+  }, [e, t]), f(() => {
+    if (!e) return;
+    const r = t.current;
+    if (!r) return;
+    const c = (n) => {
+      const u = n.target;
+      r.contains(u) ? m.current = u : (m.current || d({
+        container: r
+      }) || r).focus();
+    };
+    return document.addEventListener("focusin", c, !0), () => document.removeEventListener("focusin", c, !0);
+  }, [e, t]), {
+    triggerRef: s
+  };
 }
 export {
-  e as default
+  L as useFocusTrap
 };
 //# sourceMappingURL=index227.js.map

package/dist/index227.js.map

@@ -1 +1 @@
-{"version":3,"file":"index227.js","sources":["../node_modules/@babel/runtime/helpers/esm/extends.js"],"sourcesContent":["function _extends() {\n  return _extends = Object.assign ? Object.assign.bind() : function (n) {\n    for (var e = 1; e < arguments.length; e++) {\n      var t = arguments[e];\n      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);\n    }\n    return n;\n  }, _extends.apply(null, arguments);\n}\nexport { _extends as default };"],"names":["_extends","n","e","t"],"mappings":"AAAA,SAASA,IAAW;AAClB,SAAOA,IAAW,OAAO,SAAS,OAAO,OAAO,KAAI,IAAK,SAAUC,GAAG;AACpE,aAASC,IAAI,GAAGA,IAAI,UAAU,QAAQA,KAAK;AACzC,UAAIC,IAAI,UAAUD,CAAC;AACnB,eAAS,KAAKC,EAAG,EAAC,CAAA,GAAI,eAAe,KAAKA,GAAG,CAAC,MAAMF,EAAE,CAAC,IAAIE,EAAE,CAAC;AAAA,IAChE;AACA,WAAOF;AAAA,EACT,GAAGD,EAAS,MAAM,MAAM,SAAS;AACnC;","x_google_ignoreList":[0]}
+{"version":3,"file":"index227.js","sources":["../src/utils/a11y/useFocusTrap.ts"],"sourcesContent":["import { useLayoutEffect, useRef } from 'react';\nimport { getFocusableElements, getFirstFocusableElement } from './focusableElements';\n\nexport interface UseFocusTrapOptions<T extends HTMLElement = HTMLElement> {\n  /**\n   * Whether the focus trap is active.\n   */\n  enabled: boolean;\n  /**\n   * Container element ref to trap focus within.\n   */\n  containerRef: React.RefObject<T | null>;\n  /**\n   * Whether to restore focus to the element that had focus before trap activated.\n   * Default: true\n   */\n  restoreFocus?: boolean;\n  /**\n   * Initial focus target when trap activates.\n   * - 'first': Focus first focusable element (default)\n   * - 'container': Focus the container itself\n   * - CSS selector: Focus element matching selector\n   * - HTMLElement: Focus this specific element\n   */\n  initialFocus?: 'first' | 'container' | string | HTMLElement;\n}\n\nexport interface UseFocusTrapReturn {\n  /**\n   * Ref to the element that had focus before trap activated.\n   * Useful for manual focus restoration if needed.\n   */\n  triggerRef: React.MutableRefObject<HTMLElement | null>;\n}\n\n/**\n * Hook to trap focus within a container (for modals, dialogs, drawers).\n * \n * Implements WCAG 2.1 focus trap pattern:\n * - Moves focus into container on activation\n * - Wraps Tab/Shift+Tab navigation within container\n * - Restores focus to trigger element on deactivation\n * - Safety net: catches focus escaping via other means\n * \n * Note: For Escape key handling, use `useDismissOnEscape` hook separately.\n * This keeps focus trap (accessibility) separate from Escape handling (UX).\n * \n * @example\n * ```tsx\n * const MyModal = ({ isOpen, onClose }) => {\n *   const containerRef = useRef<HTMLDivElement>(null);\n *   \n *   // Escape handling (UX)\n *   useDismissOnEscape({\n *     containerRef,\n *     onDismiss: onClose,\n *     enabled: isOpen\n *   });\n *   \n *   // Focus trap (accessibility)\n *   const { triggerRef } = useFocusTrap({\n *     enabled: isOpen,\n *     containerRef,\n *     restoreFocus: true\n *   });\n *   \n *   return (\n *     <div ref={containerRef}>\n *       <button>First</button>\n *       <button>Second</button>\n *     </div>\n *   );\n * };\n * ```\n */\n/**\n * Resolve the initial focus target based on the initialFocus option.\n */\nfunction resolveInitialFocusTarget(\n  container: HTMLElement,\n  initialFocus: 'first' | 'container' | string | HTMLElement\n): HTMLElement | null {\n  if (initialFocus === 'first') {\n    return getFirstFocusableElement({ container }) || container;\n  }\n  if (initialFocus === 'container') {\n    return container;\n  }\n  if (typeof initialFocus === 'string') {\n    return container.querySelector<HTMLElement>(initialFocus);\n  }\n  if (initialFocus instanceof HTMLElement) {\n    return initialFocus;\n  }\n  return null;\n}\n\nexport function useFocusTrap<T extends HTMLElement = HTMLElement>({\n  enabled,\n  containerRef,\n  restoreFocus = true,\n  initialFocus = 'first'\n}: UseFocusTrapOptions<T>): UseFocusTrapReturn {\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const lastFocusedInContainer = useRef<HTMLElement | null>(null);\n\n  // Focus management: save trigger, move focus into container on activate, restore on deactivate\n  useLayoutEffect(() => {\n    if (!enabled) {\n      // Restore focus to trigger when trap deactivates\n      if (restoreFocus && triggerRef.current) {\n        requestAnimationFrame(() => {\n          triggerRef.current?.focus();\n          triggerRef.current = null;\n        });\n      }\n      return;\n    }\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    // Save the element that had focus before trap activated\n    triggerRef.current = document.activeElement as HTMLElement;\n\n    // Focus initial target\n    requestAnimationFrame(() => {\n      resolveInitialFocusTarget(container, initialFocus)?.focus();\n    });\n  }, [enabled, containerRef, restoreFocus, initialFocus]);\n\n  // Focus trap: Tab wrapping (only when enabled)\n  useLayoutEffect(() => {\n    if (!enabled) return;\n    \n    const container = containerRef.current;\n    if (!container) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      // Tab wrapping\n      if (e.key === 'Tab') {\n        const focusables = getFocusableElements({ container });\n\n        if (focusables.length === 0) {\n          e.preventDefault();\n          container.focus();\n          return;\n        }\n\n        const first = focusables[0];\n        const last = focusables[focusables.length - 1];\n        const activeElement = document.activeElement;\n\n        if (e.shiftKey && activeElement === first) {\n          e.preventDefault();\n          last.focus();\n        } else if (!e.shiftKey && activeElement === last) {\n          e.preventDefault();\n          first.focus();\n        }\n      }\n    };\n\n    document.addEventListener('keydown', handleKeyDown, true);\n    return () => document.removeEventListener('keydown', handleKeyDown, true);\n  }, [enabled, containerRef]);\n\n  // Focus trap safety net: catch focus escaping\n  useLayoutEffect(() => {\n    if (!enabled) return;\n    \n    const container = containerRef.current;\n    if (!container) return;\n\n    const handleFocusIn = (e: FocusEvent) => {\n      const target = e.target as Node;\n      \n      if (container.contains(target)) {\n        lastFocusedInContainer.current = target as HTMLElement;\n      } else {\n        // Focus escaped - redirect back\n        const fallback = lastFocusedInContainer.current \n          || getFirstFocusableElement({ container }) \n          || container;\n        fallback.focus();\n      }\n    };\n\n    document.addEventListener('focusin', handleFocusIn, true);\n    return () => document.removeEventListener('focusin', handleFocusIn, true);\n  }, [enabled, containerRef]);\n\n  return { triggerRef };\n}\n"],"names":["useRef","useLayoutEffect","getFirstFocusableElement","getFocusableElements","resolveInitialFocusTarget","container","initialFocus","querySelector","HTMLElement","useFocusTrap","enabled","containerRef","restoreFocus","triggerRef","lastFocusedInContainer","current","requestAnimationFrame","focus","document","activeElement","handleKeyDown","e","key","focusables","length","preventDefault","first","last","shiftKey","addEventListener","removeEventListener","handleFocusIn","target","contains"],"mappings":"AA8EA,SAAA,UAAAA,GAAA,mBAAAC,SAAA;AAAA,SAAA,4BAAAC,GAAA,wBAAAC,SAAA;AAAA,SAASC,EACPC,GACAC,GACoB;AACpB,SAAIA,MAAiB,UACZJ,EAAyB;AAAA,IAAEG,WAAAA;AAAAA,EAAW,CAAA,KAAKA,IAEhDC,MAAiB,cACZD,IAEL,OAAOC,KAAiB,WACnBD,EAAUE,cAA2BD,CAAY,IAEtDA,aAAwBE,cACnBF,IAEF;AACT;AAEO,SAASG,EAAkD;AAAA,EAChEC,SAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,cAAAA,IAAe;AAAA,EACfN,cAAAA,IAAe;AACO,GAAuB;AACvCO,QAAAA,IAAab,EAA2B,IAAI,GAC5Cc,IAAyBd,EAA2B,IAAI;AAG9DC,SAAAA,EAAgB,MAAM;AACpB,QAAI,CAACS,GAAS;AAERE,MAAAA,KAAgBC,EAAWE,WAC7BC,sBAAsB,MAAM;AAC1BH,QAAAA,EAAWE,SAASE,SACpBJ,EAAWE,UAAU;AAAA,MAAA,CACtB;AAEH;AAAA,IACF;AAEA,UAAMV,IAAYM,EAAaI;AAC/B,IAAKV,MAGLQ,EAAWE,UAAUG,SAASC,eAG9BH,sBAAsB,MAAM;AACAX,MAAAA,EAAAA,GAAWC,CAAY,GAAGW,MAAM;AAAA,IAAA,CAC3D;AAAA,KACA,CAACP,GAASC,GAAcC,GAAcN,CAAY,CAAC,GAGtDL,EAAgB,MAAM;AACpB,QAAI,CAACS,EAAS;AAEd,UAAML,IAAYM,EAAaI;AAC/B,QAAI,CAACV,EAAW;AAEVe,UAAAA,IAAgBA,CAACC,MAAqB;AAEtCA,UAAAA,EAAEC,QAAQ,OAAO;AACnB,cAAMC,IAAapB,EAAqB;AAAA,UAAEE,WAAAA;AAAAA,QAAAA,CAAW;AAEjDkB,YAAAA,EAAWC,WAAW,GAAG;AAC3BH,UAAAA,EAAEI,eAAe,GACjBpB,EAAUY,MAAM;AAChB;AAAA,QACF;AAEMS,cAAAA,IAAQH,EAAW,CAAC,GACpBI,IAAOJ,EAAWA,EAAWC,SAAS,CAAC,GACvCL,IAAgBD,SAASC;AAE3BE,QAAAA,EAAEO,YAAYT,MAAkBO,KAClCL,EAAEI,eAAe,GACjBE,EAAKV,MAAM,KACF,CAACI,EAAEO,YAAYT,MAAkBQ,MAC1CN,EAAEI,eAAe,GACjBC,EAAMT,MAAM;AAAA,MAEhB;AAAA,IAAA;AAGOY,oBAAAA,iBAAiB,WAAWT,GAAe,EAAI,GACjD,MAAMF,SAASY,oBAAoB,WAAWV,GAAe,EAAI;AAAA,EAAA,GACvE,CAACV,GAASC,CAAY,CAAC,GAG1BV,EAAgB,MAAM;AACpB,QAAI,CAACS,EAAS;AAEd,UAAML,IAAYM,EAAaI;AAC/B,QAAI,CAACV,EAAW;AAEV0B,UAAAA,IAAgBA,CAACV,MAAkB;AACvC,YAAMW,IAASX,EAAEW;AAEb3B,MAAAA,EAAU4B,SAASD,CAAM,IAC3BlB,EAAuBC,UAAUiB,KAGhBlB,EAAuBC,WACnCb,EAAyB;AAAA,QAAEG,WAAAA;AAAAA,MAAW,CAAA,KACtCA,GACIY,MAAM;AAAA,IACjB;AAGOY,oBAAAA,iBAAiB,WAAWE,GAAe,EAAI,GACjD,MAAMb,SAASY,oBAAoB,WAAWC,GAAe,EAAI;AAAA,EAAA,GACvE,CAACrB,GAASC,CAAY,CAAC,GAEnB;AAAA,IAAEE,YAAAA;AAAAA,EAAAA;AACX;"}

package/dist/index228.js

@@ -1,8 +1,57 @@
-import e from "./index233.js";
-function p(o, t) {
-  o.prototype = Object.create(t.prototype), o.prototype.constructor = o, e(o, t);
+import { useState as m, useEffect as w, useCallback as b } from "react";
+import { useScrollActiveIntoView as x } from "./index235.js";
+function E({
+  items: u,
+  isOpen: t,
+  onSelect: o,
+  onClose: c,
+  onOpen: l,
+  loop: i = !0,
+  disabled: h = !1,
+  listboxRef: k,
+  optionSelector: g = '[role="option"]'
+}) {
+  const [f, a] = m(-1);
+  w(() => {
+    t || a(-1);
+  }, [t]), x({
+    containerRef: k,
+    activeIndex: f,
+    itemSelector: g,
+    enabled: t
+  });
+  const D = b((r) => {
+    if (h) {
+      r.key === "Escape" && t && (r.preventDefault(), c());
+      return;
+    }
+    const e = u.length;
+    switch (r.key) {
+      case "ArrowDown":
+        r.preventDefault(), !t && e > 0 ? (l?.(), a(0)) : t && e > 0 && a((n) => i ? (n + 1) % e : Math.min(n + 1, e - 1));
+        break;
+      case "ArrowUp":
+        r.preventDefault(), t && e > 0 && a((n) => n === -1 ? e - 1 : i ? (n - 1 + e) % e : Math.max(n - 1, 0));
+        break;
+      case "Enter":
+        t && f >= 0 && u[f] && (r.preventDefault(), o(u[f], f), a(-1));
+        break;
+      case "Escape":
+        t && (r.preventDefault(), c(), a(-1));
+        break;
+      case "Tab":
+        t && (c(), a(-1));
+        break;
+    }
+  }, [h, u, t, f, o, c, l, i]), d = b((r, e) => `${r}-option-${e}`, []);
+  return {
+    highlightedIndex: f,
+    setHighlightedIndex: a,
+    handleKeyDown: D,
+    getOptionId: d
+  };
 }
 export {
-  p as default
+  E as useComboboxNavigation
 };
 //# sourceMappingURL=index228.js.map

package/dist/index228.js.map

@@ -1 +1 @@
-{"version":3,"file":"index228.js","sources":["../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js"],"sourcesContent":["import setPrototypeOf from \"./setPrototypeOf.js\";\nfunction _inheritsLoose(t, o) {\n  t.prototype = Object.create(o.prototype), t.prototype.constructor = t, setPrototypeOf(t, o);\n}\nexport { _inheritsLoose as default };"],"names":["_setPrototypeOf","_inheritsLoose","t","o","setPrototypeOf"],"mappings":"AACA,OAAAA,OAAA;AAAA,SAASC,EAAeC,GAAGC,GAAG;AAC5B,EAAAD,EAAE,YAAY,OAAO,OAAOC,EAAE,SAAS,GAAGD,EAAE,UAAU,cAAcA,GAAGE,EAAeF,GAAGC,CAAC;AAC5F;","x_google_ignoreList":[0]}
+{"version":3,"file":"index228.js","sources":["../src/utils/a11y/useComboboxNavigation.ts"],"sourcesContent":["import { useCallback, useState, useEffect } from 'react';\nimport type { RefObject } from 'react';\nimport { useScrollActiveIntoView } from './useScrollActiveIntoView';\n\nexport interface UseComboboxNavigationOptions<T = any> {\n  /**\n   * Array of items to navigate through\n   */\n  items: T[];\n  \n  /**\n   * Whether the dropdown is currently open\n   */\n  isOpen: boolean;\n  \n  /**\n   * Callback when an item is selected (Enter key)\n   */\n  onSelect: (item: T, index: number) => void;\n  \n  /**\n   * Callback to close the dropdown\n   */\n  onClose: () => void;\n  \n  /**\n   * Optional: Callback to open the dropdown\n   */\n  onOpen?: () => void;\n  \n  /**\n   * Whether to wrap around at the ends of the list.\n   * Default: true\n   */\n  loop?: boolean;\n  \n  /**\n   * Whether keyboard navigation is disabled\n   * (e.g., for custom rendered content)\n   */\n  disabled?: boolean;\n  \n  /**\n   * Ref to the listbox container for scroll management\n   */\n  listboxRef?: RefObject<HTMLElement | null>;\n  \n  /**\n   * CSS selector for option elements (default: '[role=\"option\"]')\n   */\n  optionSelector?: string;\n}\n\nexport interface UseComboboxNavigationReturn {\n  /**\n   * Currently highlighted index (-1 if none)\n   */\n  highlightedIndex: number;\n  \n  /**\n   * Set the highlighted index manually\n   */\n  setHighlightedIndex: (index: number | ((prev: number) => number)) => void;\n  \n  /**\n   * Keyboard event handler for the combobox input\n   */\n  handleKeyDown: (e: React.KeyboardEvent) => void;\n  \n  /**\n   * Generate stable ID for an option\n   */\n  getOptionId: (listboxId: string, index: number) => string;\n  \n}\n\n/**\n * Hook for managing combobox keyboard navigation with aria-activedescendant.\n * \n * Implements WAI-ARIA 1.2 Combobox pattern:\n * - Arrow Up/Down to navigate options\n * - Enter to select highlighted option\n * - Escape to close dropdown\n * - Tab to close and move focus\n * - Auto-scrolls highlighted option into view\n * \n * @example\n * ```tsx\n * const { \n *   highlightedIndex, \n *   handleKeyDown, \n *   getOptionId \n * } = useComboboxNavigation({\n *   items: suggestions,\n *   isOpen: isDropdownOpen,\n *   onSelect: (item, idx) => handleSelect(item),\n *   onClose: () => setIsOpen(false),\n *   listboxRef\n * });\n * \n * <input\n *   role=\"combobox\"\n *   onKeyDown={handleKeyDown}\n *   aria-activedescendant={highlightedIndex >= 0 ? getOptionId(listboxId, highlightedIndex) : undefined}\n * />\n * ```\n */\nexport function useComboboxNavigation<T = any>({\n  items,\n  isOpen,\n  onSelect,\n  onClose,\n  onOpen,\n  loop = true,\n  disabled = false,\n  listboxRef,\n  optionSelector = '[role=\"option\"]'\n}: UseComboboxNavigationOptions<T>): UseComboboxNavigationReturn {\n  const [highlightedIndex, setHighlightedIndex] = useState<number>(-1);\n  \n  // Reset highlighted index when dropdown closes\n  useEffect(() => {\n    if (!isOpen) {\n      setHighlightedIndex(-1);\n    }\n  }, [isOpen]);\n  \n  // Auto-scroll highlighted item into view\n  useScrollActiveIntoView({\n    containerRef: listboxRef,\n    activeIndex: highlightedIndex,\n    itemSelector: optionSelector,\n    enabled: isOpen\n  });\n  \n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (disabled) {\n        // For disabled navigation, still handle Escape\n        if (e.key === 'Escape' && isOpen) {\n          e.preventDefault();\n          onClose();\n        }\n        return;\n      }\n      \n      const itemCount = items.length;\n      \n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault();\n          if (!isOpen && itemCount > 0) {\n            // Open dropdown and highlight first item\n            onOpen?.();\n            setHighlightedIndex(0);\n          } else if (isOpen && itemCount > 0) {\n            // Navigate down\n            setHighlightedIndex((prev) => {\n              if (loop) {\n                return (prev + 1) % itemCount;\n              }\n              return Math.min(prev + 1, itemCount - 1);\n            });\n          }\n          break;\n          \n        case 'ArrowUp':\n          e.preventDefault();\n          if (isOpen && itemCount > 0) {\n            // Navigate up\n            setHighlightedIndex((prev) => {\n              // If nothing highlighted, go to last item\n              if (prev === -1) {\n                return itemCount - 1;\n              }\n              if (loop) {\n                return (prev - 1 + itemCount) % itemCount;\n              }\n              return Math.max(prev - 1, 0);\n            });\n          }\n          break;\n          \n        case 'Enter':\n          if (isOpen && highlightedIndex >= 0 && items[highlightedIndex]) {\n            e.preventDefault();\n            onSelect(items[highlightedIndex], highlightedIndex);\n            setHighlightedIndex(-1);\n          }\n          break;\n          \n        case 'Escape':\n          if (isOpen) {\n            e.preventDefault();\n            onClose();\n            setHighlightedIndex(-1);\n          }\n          break;\n          \n        case 'Tab':\n          // Close dropdown on Tab (don't preventDefault - let focus move naturally)\n          if (isOpen) {\n            onClose();\n            setHighlightedIndex(-1);\n          }\n          break;\n      }\n    },\n    [disabled, items, isOpen, highlightedIndex, onSelect, onClose, onOpen, loop]\n  );\n  \n  const getOptionId = useCallback(\n    (listboxId: string, index: number) => `${listboxId}-option-${index}`,\n    []\n  );\n  \n  return {\n    highlightedIndex,\n    setHighlightedIndex,\n    handleKeyDown,\n    getOptionId\n  };\n}\n"],"names":["useState","useEffect","useCallback","useScrollActiveIntoView","useComboboxNavigation","items","isOpen","onSelect","onClose","onOpen","loop","disabled","listboxRef","optionSelector","highlightedIndex","setHighlightedIndex","containerRef","activeIndex","itemSelector","enabled","handleKeyDown","e","key","preventDefault","itemCount","length","prev","Math","min","max","getOptionId","listboxId","index"],"mappings":"AA2GO,SAAA,YAAAA,GAAA,aAAAC,GAAA,eAAAC,SAAA;AAAA,SAAA,2BAAAC,SAAA;AAAA,SAASC,EAA+B;AAAA,EAC7CC,OAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,MAAAA,IAAO;AAAA,EACPC,UAAAA,IAAW;AAAA,EACXC,YAAAA;AAAAA,EACAC,gBAAAA,IAAiB;AACc,GAAgC;AAC/D,QAAM,CAACC,GAAkBC,CAAmB,IAAIf,EAAiB,EAAE;AAGnEC,EAAAA,EAAU,MAAM;AACd,IAAKK,KACHS,EAAoB,EAAE;AAAA,EACxB,GACC,CAACT,CAAM,CAAC,GAGaH,EAAA;AAAA,IACtBa,cAAcJ;AAAAA,IACdK,aAAaH;AAAAA,IACbI,cAAcL;AAAAA,IACdM,SAASb;AAAAA,EAAAA,CACV;AAEKc,QAAAA,IAAgBlB,EACpB,CAACmB,MAA2B;AAC1B,QAAIV,GAAU;AAERU,MAAAA,EAAEC,QAAQ,YAAYhB,MACxBe,EAAEE,eAAe,GACTf;AAEV;AAAA,IACF;AAEA,UAAMgB,IAAYnB,EAAMoB;AAExB,YAAQJ,EAAEC,KAAG;AAAA,MACX,KAAK;AACHD,QAAAA,EAAEE,eAAe,GACb,CAACjB,KAAUkB,IAAY,KAEhBf,OACTM,EAAoB,CAAC,KACZT,KAAUkB,IAAY,KAE/BT,EAAqBW,CAASA,MACxBhB,KACMgB,IAAO,KAAKF,IAEfG,KAAKC,IAAIF,IAAO,GAAGF,IAAY,CAAC,CACxC;AAEH;AAAA,MAEF,KAAK;AACHH,QAAAA,EAAEE,eAAe,GACbjB,KAAUkB,IAAY,KAExBT,EAAqBW,CAASA,MAExBA,MAAS,KACJF,IAAY,IAEjBd,KACMgB,IAAO,IAAIF,KAAaA,IAE3BG,KAAKE,IAAIH,IAAO,GAAG,CAAC,CAC5B;AAEH;AAAA,MAEF,KAAK;AACH,QAAIpB,KAAUQ,KAAoB,KAAKT,EAAMS,CAAgB,MAC3DO,EAAEE,eAAe,GACRlB,EAAAA,EAAMS,CAAgB,GAAGA,CAAgB,GAClDC,EAAoB,EAAE;AAExB;AAAA,MAEF,KAAK;AACH,QAAIT,MACFe,EAAEE,eAAe,GACTf,KACRO,EAAoB,EAAE;AAExB;AAAA,MAEF,KAAK;AAEH,QAAIT,MACME,KACRO,EAAoB,EAAE;AAExB;AAAA,IACJ;AAAA,EAAA,GAEF,CAACJ,GAAUN,GAAOC,GAAQQ,GAAkBP,GAAUC,GAASC,GAAQC,CAAI,CAC7E,GAEMoB,IAAc5B,EAClB,CAAC6B,GAAmBC,MAAkB,GAAGD,CAAS,WAAWC,CAAK,IAClE,CACF,CAAA;AAEO,SAAA;AAAA,IACLlB,kBAAAA;AAAAA,IACAC,qBAAAA;AAAAA,IACAK,eAAAA;AAAAA,IACAU,aAAAA;AAAAA,EAAAA;AAEJ;"}

package/dist/index229.js

@@ -1,173 +1,13 @@
-import { __spreadArray as D } from "./index234.js";
-import { parse as ut } from "./index235.js";
-var g = /* @__PURE__ */ new Map(), Y = function(t) {
-  return t.cloneNode(!0);
-}, z = function() {
-  return window.location.protocol === "file:";
-}, Z = function(t, o, n) {
-  var e = new XMLHttpRequest();
-  e.onreadystatechange = function() {
-    try {
-      if (!/\.svg/i.test(t) && e.readyState === 2) {
-        var s = e.getResponseHeader("Content-Type");
-        if (!s)
-          throw new Error("Content type not found");
-        var i = ut(s).type;
-        if (!(i === "image/svg+xml" || i === "text/plain"))
-          throw new Error("Invalid content type: ".concat(i));
-      }
-      if (e.readyState === 4) {
-        if (e.status === 404 || e.responseXML === null)
-          throw new Error(z() ? "Note: SVG injection ajax calls do not work locally without adjusting security settings in your browser. Or consider using a local webserver." : "Unable to load SVG file: " + t);
-        if (e.status === 200 || z() && e.status === 0)
-          n(null, e);
-        else
-          throw new Error("There was a problem injecting the SVG: " + e.status + " " + e.statusText);
-      }
-    } catch (a) {
-      if (e.abort(), a instanceof Error)
-        n(a, e);
-      else
-        throw a;
-    }
-  }, e.open("GET", t), e.withCredentials = o, e.overrideMimeType && e.overrideMimeType("text/xml"), e.send();
-}, v = {}, B = function(t, o) {
-  v[t] = v[t] || [], v[t].push(o);
-}, ft = function(t) {
-  for (var o = function(i, a) {
-    setTimeout(function() {
-      if (Array.isArray(v[t])) {
-        var u = g.get(t), p = v[t][i];
-        u instanceof SVGSVGElement && p(null, Y(u)), u instanceof Error && p(u), i === v[t].length - 1 && delete v[t];
-      }
-    }, 0);
-  }, n = 0, e = v[t].length; n < e; n++)
-    o(n);
-}, lt = function(t, o, n) {
-  if (g.has(t)) {
-    var e = g.get(t);
-    if (e === void 0) {
-      B(t, n);
-      return;
-    }
-    if (e instanceof SVGSVGElement) {
-      n(null, Y(e));
-      return;
-    }
+function r(t, i) {
+  if (t == null) return {};
+  var o = {};
+  for (var e in t) if ({}.hasOwnProperty.call(t, e)) {
+    if (i.indexOf(e) >= 0) continue;
+    o[e] = t[e];
   }
-  g.set(t, void 0), B(t, n), Z(t, o, function(s, i) {
-    var a;
-    s ? g.set(t, s) : ((a = i.responseXML) === null || a === void 0 ? void 0 : a.documentElement) instanceof SVGSVGElement && g.set(t, i.responseXML.documentElement), ft(t);
-  });
-}, ct = function(t, o, n) {
-  Z(t, o, function(e, s) {
-    var i;
-    e ? n(e) : ((i = s.responseXML) === null || i === void 0 ? void 0 : i.documentElement) instanceof SVGSVGElement && n(null, s.responseXML.documentElement);
-  });
-}, dt = 0, vt = function() {
-  return ++dt;
-}, l = [], J = {}, pt = "http://www.w3.org/2000/svg", F = "http://www.w3.org/1999/xlink", K = function(t, o, n, e, s, i, a) {
-  var u = t.getAttribute("data-src") || t.getAttribute("src");
-  if (!u) {
-    a(new Error("Invalid data-src or src attribute"));
-    return;
-  }
-  if (l.indexOf(t) !== -1) {
-    l.splice(l.indexOf(t), 1), t = null;
-    return;
-  }
-  l.push(t), t.setAttribute("src", "");
-  var p = e ? lt : ct;
-  p(u, s, function(j, r) {
-    if (!r) {
-      l.splice(l.indexOf(t), 1), t = null, a(j);
-      return;
-    }
-    var w = t.getAttribute("id");
-    w && r.setAttribute("id", w);
-    var S = t.getAttribute("title");
-    S && r.setAttribute("title", S);
-    var E = t.getAttribute("width");
-    E && r.setAttribute("width", E);
-    var y = t.getAttribute("height");
-    y && r.setAttribute("height", y);
-    var G = Array.from(new Set(D(D(D([], (r.getAttribute("class") || "").split(" "), !0), ["injected-svg"], !1), (t.getAttribute("class") || "").split(" "), !0))).join(" ").trim();
-    r.setAttribute("class", G);
-    var b = t.getAttribute("style");
-    b && r.setAttribute("style", b), r.setAttribute("data-src", u);
-    var R = [].filter.call(t.attributes, function(f) {
-      return /^data-\w[\w-]*$/.test(f.name);
-    });
-    if (Array.prototype.forEach.call(R, function(f) {
-      f.name && f.value && r.setAttribute(f.name, f.value);
-    }), n) {
-      var h = {
-        clipPath: ["clip-path"],
-        "color-profile": ["color-profile"],
-        cursor: ["cursor"],
-        filter: ["filter"],
-        linearGradient: ["fill", "stroke"],
-        marker: ["marker", "marker-start", "marker-mid", "marker-end"],
-        mask: ["mask"],
-        path: [],
-        pattern: ["fill", "stroke"],
-        radialGradient: ["fill", "stroke"]
-      }, C, d, m, T, k;
-      Object.keys(h).forEach(function(f) {
-        C = f, m = h[f], d = r.querySelectorAll(C + "[id]");
-        for (var nt = function(I, mt) {
-          T = d[I].id, k = T + "-" + vt();
-          var M;
-          Array.prototype.forEach.call(m, function(W) {
-            M = r.querySelectorAll("[" + W + '*="' + T + '"]');
-            for (var O = 0, st = M.length; O < st; O++) {
-              var $ = M[O].getAttribute(W);
-              $ && !$.match(new RegExp('url\\("?#' + T + '"?\\)')) || M[O].setAttribute(W, "url(#" + k + ")");
-            }
-          });
-          for (var U = r.querySelectorAll("[*|href]"), H = [], N = 0, at = U.length; N < at; N++) {
-            var P = U[N].getAttributeNS(F, "href");
-            P && P.toString() === "#" + d[I].id && H.push(U[N]);
-          }
-          for (var Q = 0, ot = H.length; Q < ot; Q++)
-            H[Q].setAttributeNS(F, "href", "#" + k);
-          d[I].id = k;
-        }, _ = 0, it = d.length; _ < it; _++)
-          nt(_);
-      });
-    }
-    r.removeAttribute("xmlns:a");
-    for (var x = r.querySelectorAll("script"), L = [], V, q, A = 0, tt = x.length; A < tt; A++)
-      q = x[A].getAttribute("type"), (!q || q === "application/ecmascript" || q === "application/javascript" || q === "text/javascript") && (V = x[A].innerText || x[A].textContent, V && L.push(V), r.removeChild(x[A]));
-    if (L.length > 0 && (o === "always" || o === "once" && !J[u])) {
-      for (var X = 0, et = L.length; X < et; X++)
-        new Function(L[X])(window);
-      J[u] = !0;
-    }
-    var rt = r.querySelectorAll("style");
-    if (Array.prototype.forEach.call(rt, function(f) {
-      f.textContent += "";
-    }), r.setAttribute("xmlns", pt), r.setAttribute("xmlns:xlink", F), i(r), !t.parentNode) {
-      l.splice(l.indexOf(t), 1), t = null, a(new Error("Parent node is null"));
-      return;
-    }
-    t.parentNode.replaceChild(r, t), l.splice(l.indexOf(t), 1), t = null, a(null, r);
-  });
-}, wt = function(t, o) {
-  var n = o === void 0 ? {} : o, e = n.afterAll, s = e === void 0 ? function() {
-  } : e, i = n.afterEach, a = i === void 0 ? function() {
-  } : i, u = n.beforeEach, p = u === void 0 ? function() {
-  } : u, j = n.cacheRequests, r = j === void 0 ? !0 : j, w = n.evalScripts, S = w === void 0 ? "never" : w, E = n.httpRequestWithCredentials, y = E === void 0 ? !1 : E, G = n.renumerateIRIElements, b = G === void 0 ? !0 : G;
-  if (t && "length" in t)
-    for (var R = 0, h = 0, C = t.length; h < C; h++)
-      K(t[h], S, b, r, y, p, function(d, m) {
-        a(d, m), t && "length" in t && t.length === ++R && s(R);
-      });
-  else t ? K(t, S, b, r, y, p, function(d, m) {
-    a(d, m), s(1), t = null;
-  }) : s(0);
-};
+  return o;
+}
 export {
-  wt as SVGInjector
+  r as default
 };
 //# sourceMappingURL=index229.js.map