eidos-ui 3.4.0 → 3.5.1

package/dist/chunk-LQXFXXMJ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-LQXFXXMJ.cjs","../src/components/SplitButton/SplitButton.component.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACVA,8BAAmC;AACnC,2CAA0C;AAsEpC,+CAAA;AA5CC,IAAM,YAAA,EAA0C,CAAC;AAAA,EACtD,KAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA,EAAU,QAAA;AAAA,EACV,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,IAAA;AAAA,EACP,SAAA,EAAW,KAAA;AAAA,EACX,QAAA,EAAU,KAAA;AAAA,EACV,OAAA;AAAA,EACA,UAAA,EAAY;AACd,CAAA,EAAA,GAAM;AAEJ,EAAA,MAAM,UAAA,EAAwB,OAAA,CAAQ,GAAA,CAAI,CAAC,GAAA,EAAA,GAAA,CAAS;AAAA,IAClD,IAAA,EAAM,MAAA;AAAA,IACN,EAAA,EAAI,GAAA,CAAI,EAAA;AAAA,IACR,KAAA,EAAO,GAAA,CAAI,KAAA;AAAA,IACX,IAAA,EAAM,GAAA,CAAI,IAAA;AAAA,IACV,QAAA,EAAU,GAAA,CAAI,QAAA;AAAA,IACd,OAAA,EAAS,GAAA,CAAI;AAAA,EACf,CAAA,CAAE,CAAA;AAEF,EAAA,MAAM,gBAAA,EAAkB,gCAAA,CAAY,EAAA,GAAM;AAExC,IAAA,UAAA,CAAW,CAAA,EAAA,GAAM;AACf,MAAA,QAAA,CAAS,aAAA;AAAA,QACP,IAAI,UAAA,CAAW,WAAA,EAAa,EAAE,OAAA,EAAS,IAAA,EAAM,UAAA,EAAY,IAAA,EAAM,IAAA,EAAM,OAAO,CAAC;AAAA,MAC/E,CAAA;AAAA,IACF,CAAA,EAAG,EAAE,CAAA;AAAA,EACP,CAAA,EAAG,CAAC,CAAC,CAAA;AAEL,EAAA,MAAM,UAAA,EAAY,CAAA,2BAAA,EAA8B,OAAO,CAAA,eAAA,EAAkB,KAAK,CAAA,eAAA,EAAkB,IAAI,CAAA,CAAA;AAC9D,EAAA;AAGpC,EAAA;AAAC,IAAA;AAAA,IAAA;AACM,MAAA;AACkB,MAAA;AACb,MAAA;AACC,MAAA;AAGG,MAAA;AAE4C,MAAA;AAAmB,IAAA;AAC/E,EAAA;AAIA,EAAA;AAAC,IAAA;AAAA,IAAA;AACY,MAAA;AACT,QAAA;AAC8B,QAAA;AACF,QAAA;AACD,QAAA;AACN,QAAA;AACrB,QAAA;AAGS,MAAA;AAGX,MAAA;AAAA,wBAAA;AAAC,UAAA;AAAA,UAAA;AACM,YAAA;AACkB,YAAA;AACb,YAAA;AACV,YAAA;AAEC,YAAA;AACuD,cAAA;AAIL,8BAAA;AAAA,YAAA;AAAA,UAAA;AACrD,QAAA;AAGA,wBAAA;AAAC,UAAA;AAAA,UAAA;AACU,YAAA;AAC2D,YAAA;AAC1D,YAAA;AACJ,YAAA;AACI,YAAA;AAAA,UAAA;AACZ,QAAA;AAAA,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;ADpBuG;AACA;AACA;AACA","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-LQXFXXMJ.cjs","sourcesContent":[null,"import React, { useCallback } from 'react';\nimport { ChevronDown, LoaderCircle } from 'lucide-react';\nimport { Dropdown } from '../Dropdown/Dropdown.component';\nimport { MenuPanel } from '../Menu';\nimport type { MenuItem } from '../Menu';\nimport { renderIcon } from '../../utils';\nimport type { SplitButtonProps } from './SplitButton.types';\n\n/**\n * SplitButton - a two-part control with a primary action button on the left\n * and a chevron that opens a dropdown of secondary actions on the right.\n *\n * The primary button fires `onClick` directly; clicking the chevron opens the\n * dropdown. Visually the two parts share a single bordered unit.\n *\n * @example\n * ```tsx\n * <SplitButton\n *   label=\"Save\"\n *   onClick={() => save()}\n *   options={[\n *     { id: 'draft',    label: 'Save as draft',    onClick: saveDraft },\n *     { id: 'template', label: 'Save as template', onClick: saveTemplate },\n *   ]}\n * />\n * ```\n */\nexport const SplitButton: React.FC<SplitButtonProps> = ({\n  label,\n  onClick,\n  options,\n  variant = 'filled',\n  color = 'primary',\n  size = 'md',\n  disabled = false,\n  loading = false,\n  preIcon,\n  className = '',\n}) => {\n  // Convert SplitButtonOption → MenuItemType so MenuPanel can render them.\n  const menuItems: MenuItem[] = options.map((opt) => ({\n    type: 'item' as const,\n    id: opt.id,\n    label: opt.label,\n    icon: opt.icon,\n    disabled: opt.disabled,\n    onClick: opt.onClick,\n  }));\n\n  const handleItemClick = useCallback(() => {\n    // Close the dropdown by dispatching a mousedown outside it.\n    setTimeout(() => {\n      document.dispatchEvent(\n        new MouseEvent('mousedown', { bubbles: true, cancelable: true, view: window }),\n      );\n    }, 10);\n  }, []);\n\n  const baseClass = `eidos-button eidos-button--${variant} eidos-button--${color} eidos-button--${size}`;\n  const disabledOrLoading = disabled || loading;\n\n  const chevronTrigger = (\n    <button\n      type=\"button\"\n      className={`${baseClass} eidos-split-button__chevron`}\n      disabled={disabledOrLoading}\n      aria-label=\"More options\"\n      // The chevron opens a `MenuPanel`. `Dropdown` adds no ARIA to its trigger,\n      // so without this the control is announced as a plain button.\n      aria-haspopup=\"menu\"\n    >\n      <ChevronDown className=\"eidos-split-button__chevron-icon\" aria-hidden=\"true\" />\n    </button>\n  );\n\n  return (\n    <div\n      className={[\n        'eidos-split-button',\n        `eidos-split-button--${variant}`,\n        `eidos-split-button--${color}`,\n        `eidos-split-button--${size}`,\n        disabledOrLoading && 'eidos-split-button--disabled',\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      {/* Primary action */}\n      <button\n        type=\"button\"\n        className={`${baseClass} eidos-split-button__primary`}\n        disabled={disabledOrLoading}\n        onClick={onClick}\n      >\n        {loading ? (\n          <LoaderCircle className=\"eidos-split-button__spinner\" aria-hidden=\"true\" />\n        ) : (\n          preIcon && renderIcon(preIcon, 'eidos-split-button__pre-icon')\n        )}\n        <span className=\"eidos-split-button__label\">{label}</span>\n      </button>\n\n      {/* Secondary actions dropdown */}\n      <Dropdown\n        trigger={chevronTrigger}\n        content={<MenuPanel items={menuItems} onItemClick={handleItemClick} />}\n        placement=\"bottom\"\n        align=\"end\"\n        disabled={disabledOrLoading}\n      />\n    </div>\n  );\n};\n"]}

package/dist/{chunk-OIXPYXR6.js → chunk-MPIVBAMY.js}

@@ -1,6 +1,6 @@
 import {
   Button
-} from "./chunk-44T4HMFU.js";
+} from "./chunk-75GFIQRU.js";
 
 // src/components/Snackbar/Snackbar.context.tsx
 import { createContext, useContext, useState, useCallback, useRef } from "react";
@@ -293,4 +293,4 @@ export {
   SnackbarContainer,
   useSnackbar
 };
-//# sourceMappingURL=chunk-OIXPYXR6.js.map
+//# sourceMappingURL=chunk-MPIVBAMY.js.map

package/dist/{chunk-TLECMA3B.js → chunk-MQAOXZD4.js}

@@ -1,13 +1,14 @@
 import {
   Input
-} from "./chunk-CEC3GO4R.js";
+} from "./chunk-YAKTVIVK.js";
 import {
   Dropdown
-} from "./chunk-67EXHO4T.js";
+} from "./chunk-JHX6JK3M.js";
 import {
+  devWarn,
   fullWidthModifier,
   renderIcon
-} from "./chunk-WT4WBHBR.js";
+} from "./chunk-RHHZRTWM.js";
 
 // src/components/Select/Select.component.tsx
 import React, { useState, useCallback, useRef, useEffect, useMemo } from "react";
@@ -21,6 +22,7 @@ var Select = React.forwardRef(
     onChange,
     className = "",
     multiple = false,
+    label,
     placeholder = "Select an option...",
     disabled = false,
     inputProps = {},
@@ -45,9 +47,8 @@ var Select = React.forwardRef(
       }
       return /* @__PURE__ */ new Set();
     });
-    const [menuKey, setMenuKey] = useState(0);
     const [focusedIndex, setFocusedIndex] = useState(-1);
-    const [isOpen, setIsOpen] = useState(false);
+    const [isOpen, setIsOpen] = useState(autoOpen);
     const inputRef = useRef(null);
     const triggerRef = useRef(null);
     const optionRefs = useRef([]);
@@ -95,7 +96,7 @@ var Select = React.forwardRef(
         }
         if (!multiple) {
           setIsOpen(false);
-          setMenuKey((prev) => prev + 1);
+          inputRef.current?.focus();
         }
       },
       [multiple, onChange, selectedValues, isControlled]
@@ -109,13 +110,24 @@ var Select = React.forwardRef(
           setSelectedValues(/* @__PURE__ */ new Set());
         }
         setIsOpen(false);
-        setMenuKey((prev) => prev + 1);
+        inputRef.current?.focus();
         if (onChange) {
           onChange(multiple ? [] : "");
         }
       },
       [multiple, onChange, isControlled]
     );
+    useEffect(() => {
+      const element = inputRef.current;
+      if (!element) return;
+      const named = (element.labels?.length ?? 0) > 0 || element.hasAttribute("aria-label") || element.hasAttribute("aria-labelledby");
+      if (!named) {
+        devWarn(
+          "select-missing-label",
+          'Select: no accessible name. Pass `label` for a visible one, or `inputProps={{ "aria-label": "..." }}` where it must stay visually unlabelled - otherwise the field is announced as just "combobox". A placeholder is not a label, and disappears as soon as something is chosen.'
+        );
+      }
+    }, []);
     const handleKeyDown = useCallback(
       (e) => {
         if (disabled) return;
@@ -172,7 +184,6 @@ var Select = React.forwardRef(
             if (isOpen) {
               setIsOpen(false);
               setFocusedIndex(-1);
-              setMenuKey((prev) => prev + 1);
             }
             break;
           case "Home":
@@ -251,6 +262,7 @@ var Select = React.forwardRef(
         return /* @__PURE__ */ jsxs(
           "div",
           {
+            id: `${id || "select"}-option-${index}`,
             ref: (el) => {
               optionRefs.current[index] = el;
             },
@@ -274,7 +286,7 @@ var Select = React.forwardRef(
           option.id
         );
       }) }),
-      [options, selectedValues, focusedIndex, handleOptionSelect, handleOptionsMount]
+      [options, selectedValues, focusedIndex, handleOptionSelect, handleOptionsMount, id]
     );
     const triggerElement = /* @__PURE__ */ jsx(
       "div",
@@ -286,7 +298,7 @@ var Select = React.forwardRef(
         role: "combobox",
         "aria-expanded": isOpen,
         "aria-haspopup": "listbox",
-        "aria-controls": `${id || "select"}-options`,
+        "aria-controls": isOpen ? `${id || "select"}-options` : void 0,
         "aria-activedescendant": focusedIndex >= 0 ? `${id || "select"}-option-${focusedIndex}` : void 0,
         children: /* @__PURE__ */ jsx(
           Input,
@@ -301,6 +313,7 @@ var Select = React.forwardRef(
             disabled,
             readOnly: true,
             isSelect: true,
+            label,
             name,
             id,
             required,
@@ -318,7 +331,8 @@ var Select = React.forwardRef(
         children: /* @__PURE__ */ jsx(
           Dropdown,
           {
-            defaultOpen: autoOpen,
+            open: isOpen,
+            onOpenChange: setIsOpen,
             trigger: triggerElement,
             content: /* @__PURE__ */ jsx("div", { id: `${id || "select"}-options`, role: "listbox", "aria-multiselectable": multiple, children: selectContent }),
             minWidth,
@@ -329,8 +343,7 @@ var Select = React.forwardRef(
             fullWidth,
             triggerRef,
             ...dropdownProps
-          },
-          menuKey
+          }
         )
       }
     );
@@ -341,4 +354,4 @@ Select.displayName = "Select";
 export {
   Select
 };
-//# sourceMappingURL=chunk-TLECMA3B.js.map
+//# sourceMappingURL=chunk-MQAOXZD4.js.map

package/dist/chunk-MQAOXZD4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Select/Select.component.tsx"],"sourcesContent":["import React, { useState, useCallback, useRef, useEffect, useMemo } from 'react';\nimport { X, Check } from 'lucide-react';\nimport { Input } from '../Input/Input.component';\nimport { Dropdown } from '../Dropdown/Dropdown.component';\nimport type { SelectProps, SelectOption } from './Select.types';\nimport { renderIcon, fullWidthModifier, devWarn } from '../../utils';\n\nexport const Select = React.forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      options = [],\n      value,\n      defaultValue,\n      onChange,\n      className = '',\n      multiple = false,\n      label,\n      placeholder = 'Select an option...',\n      disabled = false,\n      inputProps = {},\n      name,\n      id,\n      required = false,\n      fullWidth = false,\n      minWidth,\n      maxWidth,\n      minHeight,\n      maxHeight = '300px',\n      autoWidth = true,\n      clearable = true,\n      autoOpen = false,\n      dropdownProps = {},\n    },\n    ref,\n  ) => {\n    const isControlled = value !== undefined;\n\n    // Lazy initializer: seed from defaultValue in uncontrolled mode.\n    const [selectedValues, setSelectedValues] = useState<Set<string>>(() => {\n      if (defaultValue !== undefined) {\n        const vals = Array.isArray(defaultValue) ? defaultValue : [defaultValue];\n        return new Set(vals.filter((v) => v !== ''));\n      }\n      return new Set();\n    });\n\n    const [focusedIndex, setFocusedIndex] = useState(-1);\n    // `Select` owns the open state and hands it to `Dropdown` as a controlled\n    // value. It used to keep this flag *and* force the dropdown closed by\n    // remounting it through a changing `key`, because `Dropdown`'s own state was\n    // private - which meant this flag drove the ARIA attributes while reaching\n    // nothing that renders, so the keyboard could not open the listbox at all.\n    const [isOpen, setIsOpen] = useState(autoOpen);\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const triggerRef = useRef<HTMLDivElement>(null);\n    const optionRefs = useRef<(HTMLDivElement | null)[]>([]);\n\n    // Kept in sync every render so the mount-only callback ref below can\n    // read the latest values without needing them in its dependency array\n    // (see `handleOptionsMount`).\n    const optionsRef = useRef(options);\n    optionsRef.current = options;\n    const selectedValuesRef = useRef(selectedValues);\n    selectedValuesRef.current = selectedValues;\n\n    useEffect(() => {\n      if (value !== undefined) {\n        const values = Array.isArray(value) ? value : [value];\n\n        const validValues = values.filter((v) => v !== '');\n        setSelectedValues(new Set(validValues));\n      }\n    }, [value]);\n\n    useEffect(() => {\n      setFocusedIndex(-1);\n    }, [options]);\n\n    useEffect(() => {\n      optionRefs.current = optionRefs.current.slice(0, options.length);\n    }, [options.length]);\n\n    const handleOptionSelect = useCallback(\n      (option: SelectOption) => {\n        if (option.disabled) return;\n\n        const newSelectedValues = new Set(selectedValues);\n\n        if (multiple) {\n          if (newSelectedValues.has(option.value)) {\n            newSelectedValues.delete(option.value);\n          } else {\n            newSelectedValues.add(option.value);\n          }\n        } else {\n          if (newSelectedValues.has(option.value)) {\n            newSelectedValues.clear();\n          } else {\n            newSelectedValues.clear();\n            newSelectedValues.add(option.value);\n          }\n        }\n\n        // In uncontrolled mode, own the state directly.\n        // In controlled mode, let the parent drive via value prop + useEffect sync.\n        if (!isControlled) {\n          setSelectedValues(newSelectedValues);\n        }\n\n        if (onChange) {\n          const newValue = multiple\n            ? Array.from(newSelectedValues)\n            : Array.from(newSelectedValues)[0] || '';\n          onChange(newValue);\n        }\n\n        if (!multiple) {\n          setIsOpen(false);\n          // Focus is returned explicitly because a click lands on an option\n          // `div`, which is not focusable - without this, choosing with the\n          // mouse would leave focus on `<body>` and the field would be\n          // unreachable by keyboard until tabbed to again.\n          inputRef.current?.focus();\n        }\n      },\n      [multiple, onChange, selectedValues, isControlled],\n    );\n\n    const handleClear = useCallback(\n      (e?: React.MouseEvent) => {\n        if (e) {\n          e.stopPropagation();\n        }\n        if (!isControlled) {\n          setSelectedValues(new Set());\n        }\n\n        setIsOpen(false);\n        inputRef.current?.focus();\n        if (onChange) {\n          onChange(multiple ? [] : '');\n        }\n      },\n      [multiple, onChange, isControlled],\n    );\n\n    // A form control with no accessible name is announced as just \"combobox\".\n    // `Select` was the only field in the library that could not be labelled\n    // without knowing about `inputProps`, and three call sites duly shipped\n    // without one - so the gap is closed from both ends: a first-class `label`\n    // prop, and this warning.\n    //\n    // Measured from the DOM rather than from props, because a caller may name\n    // the field with an external `<label for>` - `Pagination`'s page-size\n    // picker does exactly that, and a props-only check would cry wolf at it.\n    // `HTMLInputElement.labels` covers both wrapping and `for` labels.\n    useEffect(() => {\n      const element = inputRef.current;\n      if (!element) return;\n      const named =\n        (element.labels?.length ?? 0) > 0 ||\n        element.hasAttribute('aria-label') ||\n        element.hasAttribute('aria-labelledby');\n      if (!named) {\n        devWarn(\n          'select-missing-label',\n          'Select: no accessible name. Pass `label` for a visible one, or `inputProps={{ \"aria-label\": \"...\" }}` where it must stay visually unlabelled - otherwise the field is announced as just \"combobox\". A placeholder is not a label, and disappears as soon as something is chosen.',\n        );\n      }\n    }, []);\n\n    const handleKeyDown = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (disabled) return;\n\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            if (!isOpen) {\n              setIsOpen(true);\n              setFocusedIndex(0);\n            } else {\n              setFocusedIndex((prev) => {\n                const nextIndex = prev < options.length - 1 ? prev + 1 : 0;\n\n                setTimeout(() => {\n                  optionRefs.current[nextIndex]?.scrollIntoView({\n                    block: 'nearest',\n                    behavior: 'smooth',\n                  });\n                }, 0);\n                return nextIndex;\n              });\n            }\n            break;\n\n          case 'ArrowUp':\n            e.preventDefault();\n            if (!isOpen) {\n              setIsOpen(true);\n              setFocusedIndex(options.length - 1);\n            } else {\n              setFocusedIndex((prev) => {\n                const nextIndex = prev > 0 ? prev - 1 : options.length - 1;\n\n                setTimeout(() => {\n                  optionRefs.current[nextIndex]?.scrollIntoView({\n                    block: 'nearest',\n                    behavior: 'smooth',\n                  });\n                }, 0);\n                return nextIndex;\n              });\n            }\n            break;\n\n          case 'Enter':\n          case ' ':\n            e.preventDefault();\n            if (!isOpen) {\n              setIsOpen(true);\n              setFocusedIndex(0);\n            } else if (focusedIndex >= 0 && focusedIndex < options.length) {\n              const focusedOption = options[focusedIndex];\n              handleOptionSelect(focusedOption);\n            }\n            break;\n\n          case 'Escape':\n            e.preventDefault();\n            if (isOpen) {\n              setIsOpen(false);\n              setFocusedIndex(-1);\n            }\n            break;\n\n          case 'Home':\n            e.preventDefault();\n            if (isOpen) {\n              setFocusedIndex(0);\n              optionRefs.current[0]?.scrollIntoView({\n                block: 'nearest',\n                behavior: 'smooth',\n              });\n            }\n            break;\n\n          case 'End':\n            e.preventDefault();\n            if (isOpen) {\n              const lastIndex = options.length - 1;\n              setFocusedIndex(lastIndex);\n              optionRefs.current[lastIndex]?.scrollIntoView({\n                block: 'nearest',\n                behavior: 'smooth',\n              });\n            }\n            break;\n\n          default:\n            if (isOpen && e.key.length === 1 && /[a-zA-Z0-9]/.test(e.key)) {\n              const searchChar = e.key.toLowerCase();\n              const foundIndex = options.findIndex(\n                (option, index) =>\n                  index > focusedIndex && option.label.toLowerCase().startsWith(searchChar),\n              );\n\n              if (foundIndex !== -1) {\n                setFocusedIndex(foundIndex);\n                optionRefs.current[foundIndex]?.scrollIntoView({\n                  block: 'nearest',\n                  behavior: 'smooth',\n                });\n              } else {\n                const foundFromStart = options.findIndex((option) =>\n                  option.label.toLowerCase().startsWith(searchChar),\n                );\n                if (foundFromStart !== -1) {\n                  setFocusedIndex(foundFromStart);\n                  optionRefs.current[foundFromStart]?.scrollIntoView({\n                    block: 'nearest',\n                    behavior: 'smooth',\n                  });\n                }\n              }\n            }\n            break;\n        }\n      },\n      [disabled, isOpen, options, focusedIndex, handleOptionSelect],\n    );\n\n    // Scrolls the first selected option into view. Attached as the options\n    // list's own ref below with an empty dependency array, so its identity\n    // never changes and React only invokes it on genuine DOM mount/unmount -\n    // i.e. exactly when the dropdown opens/closes (Dropdown unmounts its\n    // `content` entirely while closed), not on every re-render while open.\n    const handleOptionsMount = useCallback((el: HTMLDivElement | null) => {\n      if (!el) return;\n      const idx = optionsRef.current.findIndex((option) =>\n        selectedValuesRef.current.has(option.value),\n      );\n      if (idx === -1) return;\n      optionRefs.current[idx]?.scrollIntoView({ block: 'nearest' });\n    }, []);\n\n    // Past this many selections the full comma-joined label list becomes\n    // unreadable in the trigger, so we switch to a compact \"N selected\" label.\n    const COMPACT_LABEL_THRESHOLD = 2;\n\n    const displayValue = useMemo(() => {\n      if (selectedValues.size === 0) return '';\n\n      if (multiple && selectedValues.size > COMPACT_LABEL_THRESHOLD) {\n        return `${selectedValues.size} selected`;\n      }\n\n      const selectedOptions = options.filter((option) => selectedValues.has(option.value));\n      const text = selectedOptions.map((option) => option.label).join(', ');\n      return text;\n    }, [options, selectedValues, multiple]);\n\n    const selectContent = useMemo(\n      () => (\n        <div className={'eidos-select-options'} ref={handleOptionsMount}>\n          {options.map((option, index) => {\n            const isSelected = selectedValues.has(option.value);\n            const isFocused = index === focusedIndex;\n            return (\n              <div\n                key={option.id}\n                // The trigger points `aria-activedescendant` at\n                // `${id}-option-${focusedIndex}`, and nothing carried that id -\n                // so the moment an option was hovered or arrowed to, the\n                // attribute referenced an element that did not exist\n                // (`aria-valid-attr-value`, critical). Invisible to axe until a\n                // story left the listbox open, because the attribute is only\n                // set once something is focused.\n                id={`${id || 'select'}-option-${index}`}\n                ref={(el) => {\n                  optionRefs.current[index] = el;\n                }}\n                className={`\n\t\t\t\t\t\t\t\t\t\t${'eidos-select-option'}\n\t\t\t\t\t\t\t\t\t\t${isSelected ? 'eidos-select-option--selected' : ''}\n\t\t\t\t\t\t\t\t\t\t${option.disabled ? 'eidos-select-option--disabled' : ''}\n\t\t\t\t\t\t\t\t\t\t${isFocused ? 'eidos-select-option--focused' : ''}\n\t\t\t\t\t\t\t\t\t`.trim()}\n                onClick={() => handleOptionSelect(option)}\n                onMouseEnter={() => setFocusedIndex(index)}\n                role=\"option\"\n                aria-selected={isSelected}\n                aria-disabled={option.disabled}\n              >\n                {option.icon && renderIcon(option.icon, 'eidos-select-option-icon')}\n                <span className={'eidos-select-option-label'}>{option.label}</span>\n                {isSelected && <Check className={'eidos-select-option-check-icon'} />}\n              </div>\n            );\n          })}\n        </div>\n      ),\n      [options, selectedValues, focusedIndex, handleOptionSelect, handleOptionsMount, id],\n    );\n\n    const triggerElement = (\n      <div\n        ref={triggerRef}\n        className={`eidos-select-trigger ${fullWidth ? fullWidthModifier('eidos-select-trigger') : ''}`}\n        onKeyDown={handleKeyDown}\n        tabIndex={disabled ? -1 : undefined}\n        role=\"combobox\"\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        // Only while the listbox exists. An `aria-controls` pointing at an id\n        // that is not in the document is invalid, and the listbox only renders\n        // while open - `Combobox`, `TagInput` and `CommandPalette` already gate\n        // theirs this way. It could not be gated here before, because `isOpen`\n        // did not track whether the panel had actually rendered.\n        aria-controls={isOpen ? `${id || 'select'}-options` : undefined}\n        aria-activedescendant={\n          focusedIndex >= 0 ? `${id || 'select'}-option-${focusedIndex}` : undefined\n        }\n      >\n        <Input\n          ref={inputRef}\n          value={selectedValues.size > 0 ? displayValue : ''}\n          placeholder={selectedValues.size === 0 ? placeholder : ''}\n          posIcon={selectedValues.size > 0 && clearable ? X : undefined}\n          posIconButton={selectedValues.size > 0 && clearable}\n          onPosIconClick={selectedValues.size > 0 && clearable ? handleClear : undefined}\n          posIconLabel=\"Clear selection\"\n          disabled={disabled}\n          readOnly={true}\n          isSelect={true}\n          label={label}\n          name={name}\n          id={id}\n          required={required}\n          fullWidth={fullWidth}\n          {...inputProps}\n        />\n      </div>\n    );\n\n    return (\n      <div\n        ref={ref}\n        className={`${'eidos-select-container'} ${\n          fullWidth ? fullWidthModifier('eidos-select-container') : ''\n        } ${className}`}\n      >\n        <Dropdown\n          open={isOpen}\n          onOpenChange={setIsOpen}\n          trigger={triggerElement}\n          content={\n            <div id={`${id || 'select'}-options`} role=\"listbox\" aria-multiselectable={multiple}>\n              {selectContent}\n            </div>\n          }\n          minWidth={minWidth}\n          maxWidth={maxWidth}\n          minHeight={minHeight}\n          maxHeight={maxHeight}\n          autoWidth={autoWidth}\n          fullWidth={fullWidth}\n          triggerRef={triggerRef as React.RefObject<HTMLElement | null>}\n          {...dropdownProps}\n        />\n      </div>\n    );\n  },\n);\n\nSelect.displayName = 'Select';\n"],"mappings":"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","names":[]}

package/dist/{chunk-YUH56CJI.cjs → chunk-NOQF7UQ5.cjs}

@@ -2,7 +2,7 @@
 
 
 
-var _chunkVHSTB7GBcjs = require('./chunk-VHSTB7GB.cjs');
+var _chunk35LGEPLPcjs = require('./chunk-35LGEPLP.cjs');
 
 // src/components/Tabs/Tabs.component.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
@@ -47,7 +47,7 @@ var Tab = ({
     `eidos-tab--${size}`,
     isActive && "eidos-tab--active",
     disabled && "eidos-tab--disabled",
-    fullWidth && _chunkVHSTB7GBcjs.fullWidthModifier.call(void 0, "eidos-tab"),
+    fullWidth && _chunk35LGEPLPcjs.fullWidthModifier.call(void 0, "eidos-tab"),
     className
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -64,7 +64,7 @@ var Tab = ({
       onKeyDown: handleKeyDown,
       type: "button",
       children: [
-        icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-tab-icon", children: _chunkVHSTB7GBcjs.renderIcon.call(void 0, icon, "eidos-tab-icon-svg") }),
+        icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-tab-icon", children: _chunk35LGEPLPcjs.renderIcon.call(void 0, icon, "eidos-tab-icon-svg") }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-tab-label", children })
       ]
     }
@@ -188,11 +188,11 @@ var Tabs = ({
   const listClasses = [
     "eidos-tabs-list",
     `eidos-tabs-list--${size}`,
-    fullWidth && _chunkVHSTB7GBcjs.fullWidthModifier.call(void 0, "eidos-tabs-list"),
+    fullWidth && _chunk35LGEPLPcjs.fullWidthModifier.call(void 0, "eidos-tabs-list"),
     // With buttons, they are the affordance - a native scrollbar underneath
     // them is redundant, and on a space-taking one it would also sit over the
     // `line` variant's rule.
-    hasScrollButtons && _chunkVHSTB7GBcjs.dualModifier.call(void 0, "eidos-tabs-list", "hide-scrollbar", "hideScrollbar")
+    hasScrollButtons && _chunk35LGEPLPcjs.dualModifier.call(void 0, "eidos-tabs-list", "hide-scrollbar", "hideScrollbar")
   ].filter(Boolean).join(" ");
   const showPrevButton = hasScrollButtons && scrollState.canScrollPrev;
   const showNextButton = hasScrollButtons && scrollState.canScrollNext;
@@ -251,4 +251,4 @@ Tabs.displayName = "Tabs";
 
 
 exports.Tab = Tab; exports.TabPanel = TabPanel; exports.Tabs = Tabs;
-//# sourceMappingURL=chunk-YUH56CJI.cjs.map
+//# sourceMappingURL=chunk-NOQF7UQ5.cjs.map

package/dist/{chunk-YUH56CJI.cjs.map → chunk-NOQF7UQ5.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-YUH56CJI.cjs","../src/components/Tabs/Tabs.component.tsx"],"names":[],"mappings":"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","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-YUH56CJI.cjs","sourcesContent":[null,"import React, { useState, useRef, useContext, useEffect, useLayoutEffect } from 'react';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\nimport { renderIcon, dualModifier, fullWidthModifier } from '../../utils';\nimport type { TabsProps, TabProps, TabPanelProps, TabsContextValue } from './Tabs.types';\n\n// ============================================================================\n// CONTEXT\n// ============================================================================\n\nconst TabsContext = React.createContext<TabsContextValue | null>(null);\n\nconst useTabsContext = (): TabsContextValue => {\n  const ctx = useContext(TabsContext);\n  if (!ctx) throw new Error('Tab/TabPanel must be used inside <Tabs>');\n  return ctx;\n};\n\n// ============================================================================\n// TAB - individual tab trigger button\n// Defined before Tabs so Tabs can use `child.type === Tab` for child separation.\n// ============================================================================\n\nexport const Tab: React.FC<TabProps> = ({\n  value,\n  children,\n  disabled = false,\n  icon,\n  className = '',\n}) => {\n  const { activeValue, onSelect, size, fullWidth, listRef } = useTabsContext();\n  const isActive = activeValue === value;\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n    const list = listRef.current;\n    if (!list) return;\n\n    const allTabs = Array.from(\n      list.querySelectorAll('[role=\"tab\"]:not([disabled])'),\n    ) as HTMLElement[];\n    const currentIndex = allTabs.indexOf(e.currentTarget);\n    if (currentIndex === -1) return;\n\n    let targetIndex = -1;\n    if (e.key === 'ArrowRight') targetIndex = (currentIndex + 1) % allTabs.length;\n    else if (e.key === 'ArrowLeft')\n      targetIndex = (currentIndex - 1 + allTabs.length) % allTabs.length;\n    else if (e.key === 'Home') targetIndex = 0;\n    else if (e.key === 'End') targetIndex = allTabs.length - 1;\n\n    if (targetIndex !== -1) {\n      e.preventDefault();\n      allTabs[targetIndex].focus();\n    }\n  };\n\n  const tabClasses = [\n    'eidos-tab',\n    `eidos-tab--${size}`,\n    isActive && 'eidos-tab--active',\n    disabled && 'eidos-tab--disabled',\n    fullWidth && fullWidthModifier('eidos-tab'),\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <button\n      id={`eidos-tab-${value}`}\n      role=\"tab\"\n      aria-selected={isActive}\n      aria-controls={`eidos-tabpanel-${value}`}\n      tabIndex={isActive ? 0 : -1}\n      disabled={disabled}\n      className={tabClasses}\n      onClick={() => !disabled && onSelect(value)}\n      onKeyDown={handleKeyDown}\n      type=\"button\"\n    >\n      {icon && <span className=\"eidos-tab-icon\">{renderIcon(icon, 'eidos-tab-icon-svg')}</span>}\n      <span className=\"eidos-tab-label\">{children}</span>\n    </button>\n  );\n};\n\nTab.displayName = 'Tab';\n\n// ============================================================================\n// TAB PANEL - content region shown when its value matches the active tab\n// Defined before Tabs for the same `child.type === TabPanel` check.\n// ============================================================================\n\nexport const TabPanel: React.FC<TabPanelProps> = ({ value, children, className = '' }) => {\n  const { activeValue } = useTabsContext();\n  const isActive = activeValue === value;\n\n  if (!isActive) return null;\n\n  return (\n    <div\n      id={`eidos-tabpanel-${value}`}\n      role=\"tabpanel\"\n      aria-labelledby={`eidos-tab-${value}`}\n      tabIndex={0}\n      className={['eidos-tab-panel', className].filter(Boolean).join(' ')}\n    >\n      {children}\n    </div>\n  );\n};\n\nTabPanel.displayName = 'TabPanel';\n\n// ============================================================================\n// TABS - root container; provides context, separates tab/panel children\n// ============================================================================\n\nexport const Tabs: React.FC<TabsProps> = ({\n  value,\n  defaultValue,\n  onChange,\n  variant = 'line',\n  size = 'md',\n  color = 'primary',\n  fullWidth = false,\n  scrollButtons = 'auto',\n  className = '',\n  children,\n}) => {\n  const isControlled = value !== undefined;\n  const [localValue, setLocalValue] = useState(defaultValue ?? '');\n  const activeValue = isControlled ? value! : localValue;\n\n  // Separate Tab and TabPanel children so the list and panels render in\n  // distinct DOM regions, regardless of how the consumer orders them.\n  const tabChildren: React.ReactElement[] = [];\n  const panelChildren: React.ReactElement[] = [];\n\n  React.Children.forEach(children, (child) => {\n    if (!React.isValidElement(child)) return;\n    if (child.type === Tab) {\n      tabChildren.push(child);\n    } else if (child.type === TabPanel) {\n      panelChildren.push(child);\n    }\n  });\n\n  const listRef = useRef<HTMLDivElement>(null);\n  const indicatorRef = useRef<HTMLSpanElement>(null);\n  // Tracks whether the indicator has been positioned at least once so we can\n  // skip the CSS transition on the very first render and avoid it animating\n  // from the top-left corner to the initial tab.\n  const hasPositioned = useRef(false);\n\n  useLayoutEffect(() => {\n    if (variant !== 'line') return;\n    const list = listRef.current;\n    const indicator = indicatorRef.current;\n    if (!list || !indicator) return;\n\n    const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n    if (!activeTab) return;\n\n    // Suppress the CSS transition on the initial paint so the indicator snaps\n    // into place rather than sliding from 0.\n    if (!hasPositioned.current) {\n      indicator.style.transition = 'none';\n    }\n\n    indicator.style.left = `${activeTab.offsetLeft}px`;\n    indicator.style.width = `${activeTab.offsetWidth}px`;\n\n    if (!hasPositioned.current) {\n      // Force a synchronous reflow so the browser commits the no-transition\n      // position before we re-enable the transition for future clicks.\n      void indicator.offsetWidth;\n      indicator.style.transition = '';\n      hasPositioned.current = true;\n    }\n  }, [activeValue, variant, fullWidth]);\n\n  // The list scrolls horizontally when the strip is wider than its container,\n  // so an activated tab can sit outside the scrollport - reachable by keyboard\n  // (`End`) or by a controlled `value` change, but invisible. `scrollLeft` is\n  // adjusted directly rather than via `scrollIntoView`, which walks the whole\n  // ancestor chain and would scroll the page vertically when the strip is below\n  // the fold.\n  useLayoutEffect(() => {\n    const list = listRef.current;\n    if (!list) return;\n\n    const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n    if (!activeTab) return;\n\n    const left = activeTab.offsetLeft;\n    const right = left + activeTab.offsetWidth;\n\n    if (left < list.scrollLeft) {\n      list.scrollLeft = left;\n    } else if (right > list.scrollLeft + list.clientWidth) {\n      list.scrollLeft = right - list.clientWidth;\n    }\n  }, [activeValue]);\n\n  // Whether either end of the strip has content hidden past it. Drives both\n  // the presence of the scroll buttons (neither end scrollable = the strip\n  // fits, so no buttons) and their disabled state at the extremes.\n  const [scrollState, setScrollState] = useState({ canScrollPrev: false, canScrollNext: false });\n  const hasScrollButtons = scrollButtons !== 'none';\n\n  useEffect(() => {\n    if (!hasScrollButtons) return;\n    const list = listRef.current;\n    if (!list) return;\n\n    const update = () => {\n      const maxScroll = list.scrollWidth - list.clientWidth;\n      // 1px of tolerance: fractional layout widths leave a sub-pixel remainder\n      // at either end that would otherwise keep a button enabled for a scroll\n      // that can no longer move anything.\n      const canScrollPrev = list.scrollLeft > 1;\n      const canScrollNext = list.scrollLeft < maxScroll - 1;\n      setScrollState((previous) =>\n        previous.canScrollPrev === canScrollPrev && previous.canScrollNext === canScrollNext\n          ? previous\n          : { canScrollPrev, canScrollNext },\n      );\n    };\n\n    update();\n    list.addEventListener('scroll', update, { passive: true });\n\n    // The list's own box stays the same width when a tab's label reflows or a\n    // font finishes loading, so the tabs have to be observed as well as the\n    // container - only their sizes tell us the strip started overflowing.\n    const observer = new ResizeObserver(update);\n    observer.observe(list);\n    Array.from(list.children).forEach((child) => observer.observe(child));\n\n    return () => {\n      list.removeEventListener('scroll', update);\n      observer.disconnect();\n    };\n  }, [hasScrollButtons, tabChildren.length, size, variant, fullWidth]);\n\n  const scrollByStep = (direction: -1 | 1) => {\n    const list = listRef.current;\n    if (!list) return;\n\n    // A step just short of a full page keeps a tab of context on screen, the\n    // same way a paged scrollbar click does.\n    const step = list.clientWidth * 0.8;\n    const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    list.scrollBy({ left: direction * step, behavior: reducedMotion ? 'auto' : 'smooth' });\n  };\n\n  const onSelect = (newValue: string) => {\n    if (!isControlled) {\n      setLocalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const rootClasses = ['eidos-tabs', `eidos-tabs--${variant}`, `eidos-tabs--${color}`, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const listClasses = [\n    'eidos-tabs-list',\n    `eidos-tabs-list--${size}`,\n    fullWidth && fullWidthModifier('eidos-tabs-list'),\n    // With buttons, they are the affordance - a native scrollbar underneath\n    // them is redundant, and on a space-taking one it would also sit over the\n    // `line` variant's rule.\n    hasScrollButtons && dualModifier('eidos-tabs-list', 'hide-scrollbar', 'hideScrollbar'),\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  // Each button exists only while its own direction has somewhere to go: none\n  // at all when the strip fits, and none at the end you have reached. A\n  // disabled button would be pointing at nothing. They are positioned\n  // absolutely, so appearing and disappearing never moves the tabs.\n  const showPrevButton = hasScrollButtons && scrollState.canScrollPrev;\n  const showNextButton = hasScrollButtons && scrollState.canScrollNext;\n\n  const scrollButtonClasses = (direction: 'prev' | 'next') =>\n    [\n      'eidos-tabs-scroll-button',\n      `eidos-tabs-scroll-button--${direction}`,\n      `eidos-tabs-scroll-button--${size}`,\n    ].join(' ');\n\n  const contextValue: TabsContextValue = {\n    activeValue,\n    onSelect,\n    variant,\n    size,\n    color,\n    fullWidth,\n    listRef,\n  };\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <div className={rootClasses}>\n        {/* The buttons are siblings of the tab list, never children of it:\n            `role=\"tablist\"` only accepts tabs. They are also hidden from\n            assistive tech and skipped by Tab, because they are a pointer\n            affordance for something the keyboard already does - arrow keys\n            move between tabs and scroll the active one into view. */}\n        <div className=\"eidos-tabs-bar\">\n          {showPrevButton && (\n            <button\n              type=\"button\"\n              className={scrollButtonClasses('prev')}\n              onClick={() => scrollByStep(-1)}\n              // `tabIndex={-1}` keeps these out of the tab order but does not\n              // stop a click from focusing them, and focus inside an\n              // `aria-hidden` subtree is an error the browser reports\n              // (\"Blocked aria-hidden on an element because its descendant\n              // retained focus\"). Suppressing the default mousedown keeps\n              // them unfocusable by pointer too; the click still fires.\n              // `inert` would prevent the click as well, so it is no help.\n              onMouseDown={(event) => event.preventDefault()}\n              tabIndex={-1}\n              aria-hidden=\"true\"\n            >\n              <ChevronLeft className=\"eidos-tabs-scroll-button-icon\" />\n            </button>\n          )}\n\n          <div ref={listRef} className={listClasses} role=\"tablist\">\n            {tabChildren}\n            {variant === 'line' && (\n              <span ref={indicatorRef} className=\"eidos-tabs-indicator\" aria-hidden=\"true\" />\n            )}\n          </div>\n\n          {showNextButton && (\n            <button\n              type=\"button\"\n              className={scrollButtonClasses('next')}\n              onClick={() => scrollByStep(1)}\n              onMouseDown={(event) => event.preventDefault()} // see the prev button\n              tabIndex={-1}\n              aria-hidden=\"true\"\n            >\n              <ChevronRight className=\"eidos-tabs-scroll-button-icon\" />\n            </button>\n          )}\n        </div>\n\n        <div className=\"eidos-tabs-panels\">{panelChildren}</div>\n      </div>\n    </TabsContext.Provider>\n  );\n};\n\nTabs.displayName = 'Tabs';\n"]}
+{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-NOQF7UQ5.cjs","../src/components/Tabs/Tabs.component.tsx"],"names":[],"mappings":"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","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-NOQF7UQ5.cjs","sourcesContent":[null,"import React, { useState, useRef, useContext, useEffect, useLayoutEffect } from 'react';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\nimport { renderIcon, dualModifier, fullWidthModifier } from '../../utils';\nimport type { TabsProps, TabProps, TabPanelProps, TabsContextValue } from './Tabs.types';\n\n// ============================================================================\n// CONTEXT\n// ============================================================================\n\nconst TabsContext = React.createContext<TabsContextValue | null>(null);\n\nconst useTabsContext = (): TabsContextValue => {\n  const ctx = useContext(TabsContext);\n  if (!ctx) throw new Error('Tab/TabPanel must be used inside <Tabs>');\n  return ctx;\n};\n\n// ============================================================================\n// TAB - individual tab trigger button\n// Defined before Tabs so Tabs can use `child.type === Tab` for child separation.\n// ============================================================================\n\nexport const Tab: React.FC<TabProps> = ({\n  value,\n  children,\n  disabled = false,\n  icon,\n  className = '',\n}) => {\n  const { activeValue, onSelect, size, fullWidth, listRef } = useTabsContext();\n  const isActive = activeValue === value;\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n    const list = listRef.current;\n    if (!list) return;\n\n    const allTabs = Array.from(\n      list.querySelectorAll('[role=\"tab\"]:not([disabled])'),\n    ) as HTMLElement[];\n    const currentIndex = allTabs.indexOf(e.currentTarget);\n    if (currentIndex === -1) return;\n\n    let targetIndex = -1;\n    if (e.key === 'ArrowRight') targetIndex = (currentIndex + 1) % allTabs.length;\n    else if (e.key === 'ArrowLeft')\n      targetIndex = (currentIndex - 1 + allTabs.length) % allTabs.length;\n    else if (e.key === 'Home') targetIndex = 0;\n    else if (e.key === 'End') targetIndex = allTabs.length - 1;\n\n    if (targetIndex !== -1) {\n      e.preventDefault();\n      allTabs[targetIndex].focus();\n    }\n  };\n\n  const tabClasses = [\n    'eidos-tab',\n    `eidos-tab--${size}`,\n    isActive && 'eidos-tab--active',\n    disabled && 'eidos-tab--disabled',\n    fullWidth && fullWidthModifier('eidos-tab'),\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <button\n      id={`eidos-tab-${value}`}\n      role=\"tab\"\n      aria-selected={isActive}\n      aria-controls={`eidos-tabpanel-${value}`}\n      tabIndex={isActive ? 0 : -1}\n      disabled={disabled}\n      className={tabClasses}\n      onClick={() => !disabled && onSelect(value)}\n      onKeyDown={handleKeyDown}\n      type=\"button\"\n    >\n      {icon && <span className=\"eidos-tab-icon\">{renderIcon(icon, 'eidos-tab-icon-svg')}</span>}\n      <span className=\"eidos-tab-label\">{children}</span>\n    </button>\n  );\n};\n\nTab.displayName = 'Tab';\n\n// ============================================================================\n// TAB PANEL - content region shown when its value matches the active tab\n// Defined before Tabs for the same `child.type === TabPanel` check.\n// ============================================================================\n\nexport const TabPanel: React.FC<TabPanelProps> = ({ value, children, className = '' }) => {\n  const { activeValue } = useTabsContext();\n  const isActive = activeValue === value;\n\n  if (!isActive) return null;\n\n  return (\n    <div\n      id={`eidos-tabpanel-${value}`}\n      role=\"tabpanel\"\n      aria-labelledby={`eidos-tab-${value}`}\n      tabIndex={0}\n      className={['eidos-tab-panel', className].filter(Boolean).join(' ')}\n    >\n      {children}\n    </div>\n  );\n};\n\nTabPanel.displayName = 'TabPanel';\n\n// ============================================================================\n// TABS - root container; provides context, separates tab/panel children\n// ============================================================================\n\nexport const Tabs: React.FC<TabsProps> = ({\n  value,\n  defaultValue,\n  onChange,\n  variant = 'line',\n  size = 'md',\n  color = 'primary',\n  fullWidth = false,\n  scrollButtons = 'auto',\n  className = '',\n  children,\n}) => {\n  const isControlled = value !== undefined;\n  const [localValue, setLocalValue] = useState(defaultValue ?? '');\n  const activeValue = isControlled ? value! : localValue;\n\n  // Separate Tab and TabPanel children so the list and panels render in\n  // distinct DOM regions, regardless of how the consumer orders them.\n  const tabChildren: React.ReactElement[] = [];\n  const panelChildren: React.ReactElement[] = [];\n\n  React.Children.forEach(children, (child) => {\n    if (!React.isValidElement(child)) return;\n    if (child.type === Tab) {\n      tabChildren.push(child);\n    } else if (child.type === TabPanel) {\n      panelChildren.push(child);\n    }\n  });\n\n  const listRef = useRef<HTMLDivElement>(null);\n  const indicatorRef = useRef<HTMLSpanElement>(null);\n  // Tracks whether the indicator has been positioned at least once so we can\n  // skip the CSS transition on the very first render and avoid it animating\n  // from the top-left corner to the initial tab.\n  const hasPositioned = useRef(false);\n\n  useLayoutEffect(() => {\n    if (variant !== 'line') return;\n    const list = listRef.current;\n    const indicator = indicatorRef.current;\n    if (!list || !indicator) return;\n\n    const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n    if (!activeTab) return;\n\n    // Suppress the CSS transition on the initial paint so the indicator snaps\n    // into place rather than sliding from 0.\n    if (!hasPositioned.current) {\n      indicator.style.transition = 'none';\n    }\n\n    indicator.style.left = `${activeTab.offsetLeft}px`;\n    indicator.style.width = `${activeTab.offsetWidth}px`;\n\n    if (!hasPositioned.current) {\n      // Force a synchronous reflow so the browser commits the no-transition\n      // position before we re-enable the transition for future clicks.\n      void indicator.offsetWidth;\n      indicator.style.transition = '';\n      hasPositioned.current = true;\n    }\n  }, [activeValue, variant, fullWidth]);\n\n  // The list scrolls horizontally when the strip is wider than its container,\n  // so an activated tab can sit outside the scrollport - reachable by keyboard\n  // (`End`) or by a controlled `value` change, but invisible. `scrollLeft` is\n  // adjusted directly rather than via `scrollIntoView`, which walks the whole\n  // ancestor chain and would scroll the page vertically when the strip is below\n  // the fold.\n  useLayoutEffect(() => {\n    const list = listRef.current;\n    if (!list) return;\n\n    const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n    if (!activeTab) return;\n\n    const left = activeTab.offsetLeft;\n    const right = left + activeTab.offsetWidth;\n\n    if (left < list.scrollLeft) {\n      list.scrollLeft = left;\n    } else if (right > list.scrollLeft + list.clientWidth) {\n      list.scrollLeft = right - list.clientWidth;\n    }\n  }, [activeValue]);\n\n  // Whether either end of the strip has content hidden past it. Drives both\n  // the presence of the scroll buttons (neither end scrollable = the strip\n  // fits, so no buttons) and their disabled state at the extremes.\n  const [scrollState, setScrollState] = useState({ canScrollPrev: false, canScrollNext: false });\n  const hasScrollButtons = scrollButtons !== 'none';\n\n  useEffect(() => {\n    if (!hasScrollButtons) return;\n    const list = listRef.current;\n    if (!list) return;\n\n    const update = () => {\n      const maxScroll = list.scrollWidth - list.clientWidth;\n      // 1px of tolerance: fractional layout widths leave a sub-pixel remainder\n      // at either end that would otherwise keep a button enabled for a scroll\n      // that can no longer move anything.\n      const canScrollPrev = list.scrollLeft > 1;\n      const canScrollNext = list.scrollLeft < maxScroll - 1;\n      setScrollState((previous) =>\n        previous.canScrollPrev === canScrollPrev && previous.canScrollNext === canScrollNext\n          ? previous\n          : { canScrollPrev, canScrollNext },\n      );\n    };\n\n    update();\n    list.addEventListener('scroll', update, { passive: true });\n\n    // The list's own box stays the same width when a tab's label reflows or a\n    // font finishes loading, so the tabs have to be observed as well as the\n    // container - only their sizes tell us the strip started overflowing.\n    const observer = new ResizeObserver(update);\n    observer.observe(list);\n    Array.from(list.children).forEach((child) => observer.observe(child));\n\n    return () => {\n      list.removeEventListener('scroll', update);\n      observer.disconnect();\n    };\n  }, [hasScrollButtons, tabChildren.length, size, variant, fullWidth]);\n\n  const scrollByStep = (direction: -1 | 1) => {\n    const list = listRef.current;\n    if (!list) return;\n\n    // A step just short of a full page keeps a tab of context on screen, the\n    // same way a paged scrollbar click does.\n    const step = list.clientWidth * 0.8;\n    const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    list.scrollBy({ left: direction * step, behavior: reducedMotion ? 'auto' : 'smooth' });\n  };\n\n  const onSelect = (newValue: string) => {\n    if (!isControlled) {\n      setLocalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const rootClasses = ['eidos-tabs', `eidos-tabs--${variant}`, `eidos-tabs--${color}`, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const listClasses = [\n    'eidos-tabs-list',\n    `eidos-tabs-list--${size}`,\n    fullWidth && fullWidthModifier('eidos-tabs-list'),\n    // With buttons, they are the affordance - a native scrollbar underneath\n    // them is redundant, and on a space-taking one it would also sit over the\n    // `line` variant's rule.\n    hasScrollButtons && dualModifier('eidos-tabs-list', 'hide-scrollbar', 'hideScrollbar'),\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  // Each button exists only while its own direction has somewhere to go: none\n  // at all when the strip fits, and none at the end you have reached. A\n  // disabled button would be pointing at nothing. They are positioned\n  // absolutely, so appearing and disappearing never moves the tabs.\n  const showPrevButton = hasScrollButtons && scrollState.canScrollPrev;\n  const showNextButton = hasScrollButtons && scrollState.canScrollNext;\n\n  const scrollButtonClasses = (direction: 'prev' | 'next') =>\n    [\n      'eidos-tabs-scroll-button',\n      `eidos-tabs-scroll-button--${direction}`,\n      `eidos-tabs-scroll-button--${size}`,\n    ].join(' ');\n\n  const contextValue: TabsContextValue = {\n    activeValue,\n    onSelect,\n    variant,\n    size,\n    color,\n    fullWidth,\n    listRef,\n  };\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <div className={rootClasses}>\n        {/* The buttons are siblings of the tab list, never children of it:\n            `role=\"tablist\"` only accepts tabs. They are also hidden from\n            assistive tech and skipped by Tab, because they are a pointer\n            affordance for something the keyboard already does - arrow keys\n            move between tabs and scroll the active one into view. */}\n        <div className=\"eidos-tabs-bar\">\n          {showPrevButton && (\n            <button\n              type=\"button\"\n              className={scrollButtonClasses('prev')}\n              onClick={() => scrollByStep(-1)}\n              // `tabIndex={-1}` keeps these out of the tab order but does not\n              // stop a click from focusing them, and focus inside an\n              // `aria-hidden` subtree is an error the browser reports\n              // (\"Blocked aria-hidden on an element because its descendant\n              // retained focus\"). Suppressing the default mousedown keeps\n              // them unfocusable by pointer too; the click still fires.\n              // `inert` would prevent the click as well, so it is no help.\n              onMouseDown={(event) => event.preventDefault()}\n              tabIndex={-1}\n              aria-hidden=\"true\"\n            >\n              <ChevronLeft className=\"eidos-tabs-scroll-button-icon\" />\n            </button>\n          )}\n\n          <div ref={listRef} className={listClasses} role=\"tablist\">\n            {tabChildren}\n            {variant === 'line' && (\n              <span ref={indicatorRef} className=\"eidos-tabs-indicator\" aria-hidden=\"true\" />\n            )}\n          </div>\n\n          {showNextButton && (\n            <button\n              type=\"button\"\n              className={scrollButtonClasses('next')}\n              onClick={() => scrollByStep(1)}\n              onMouseDown={(event) => event.preventDefault()} // see the prev button\n              tabIndex={-1}\n              aria-hidden=\"true\"\n            >\n              <ChevronRight className=\"eidos-tabs-scroll-button-icon\" />\n            </button>\n          )}\n        </div>\n\n        <div className=\"eidos-tabs-panels\">{panelChildren}</div>\n      </div>\n    </TabsContext.Provider>\n  );\n};\n\nTabs.displayName = 'Tabs';\n"]}

package/dist/{chunk-DMOZURHV.js → chunk-O3QM3BFE.js}

@@ -1,6 +1,6 @@
 import {
   MenuPanel
-} from "./chunk-CP335H4Q.js";
+} from "./chunk-P4XZH3OR.js";
 
 // src/components/ContextMenu/ContextMenu.component.tsx
 import { useState, useEffect, useRef, useCallback } from "react";
@@ -103,4 +103,4 @@ var ContextMenu = ({
 export {
   ContextMenu
 };
-//# sourceMappingURL=chunk-DMOZURHV.js.map
+//# sourceMappingURL=chunk-O3QM3BFE.js.map

package/dist/{chunk-SFRILDXY.js → chunk-OOCCSMWM.js}

@@ -1,16 +1,16 @@
 import {
   Popover
-} from "./chunk-UDRAM6JU.js";
+} from "./chunk-4J25XZDI.js";
 import {
   Avatar
 } from "./chunk-XJBWFDDE.js";
 import {
   Button
-} from "./chunk-44T4HMFU.js";
+} from "./chunk-75GFIQRU.js";
 import {
   devWarn,
   renderIcon
-} from "./chunk-WT4WBHBR.js";
+} from "./chunk-RHHZRTWM.js";
 
 // src/components/Header/Header.component.tsx
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
@@ -142,4 +142,4 @@ export {
   Header,
   IdentityHeader
 };
-//# sourceMappingURL=chunk-SFRILDXY.js.map
+//# sourceMappingURL=chunk-OOCCSMWM.js.map

package/dist/chunk-P4XZH3OR.js

@@ -0,0 +1,225 @@
+import {
+  Dropdown
+} from "./chunk-JHX6JK3M.js";
+import {
+  Kbd
+} from "./chunk-LYH3EKKQ.js";
+import {
+  Tooltip
+} from "./chunk-JNY7TUDS.js";
+import {
+  renderIcon,
+  useDialogFocus
+} from "./chunk-RHHZRTWM.js";
+
+// src/components/Menu/Menu.component.tsx
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { ChevronRight } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var MenuPanel = ({
+  items,
+  className = "",
+  onItemClick,
+  onRequestClose
+}) => {
+  const listRef = useRef(null);
+  const itemRefs = useRef(/* @__PURE__ */ new Map());
+  const registerItem = useCallback((id, element) => {
+    if (element) itemRefs.current.set(id, element);
+    else itemRefs.current.delete(id);
+  }, []);
+  useDialogFocus(true, listRef, { trapTab: false });
+  const handleItemClick = useCallback(
+    (item) => {
+      if (item.disabled) return;
+      if (item.onClick) {
+        item.onClick();
+      }
+      if (onItemClick) {
+        onItemClick(item);
+      }
+    },
+    [onItemClick]
+  );
+  const navigableIds = useMemo(
+    () => items.filter((item) => (item.type === "item" || item.type === "nested") && !item.disabled).map((item) => item.id),
+    [items]
+  );
+  const [focusedId, setFocusedId] = useState(null);
+  const [openSubmenuId, setOpenSubmenuId] = useState(null);
+  const activeId = focusedId && navigableIds.includes(focusedId) ? focusedId : navigableIds[0] ?? null;
+  const handleKeyDown = useCallback(
+    (event) => {
+      if (!event.target.closest('[role="menuitem"]')) return;
+      if (navigableIds.length === 0) return;
+      const focusAt = (index) => {
+        const id = navigableIds[(index + navigableIds.length) % navigableIds.length];
+        setFocusedId(id);
+        itemRefs.current.get(id)?.focus();
+      };
+      const current = Math.max(0, navigableIds.indexOf(activeId ?? ""));
+      switch (event.key) {
+        case "ArrowDown":
+          event.preventDefault();
+          focusAt(current + 1);
+          break;
+        case "ArrowUp":
+          event.preventDefault();
+          focusAt(current - 1);
+          break;
+        case "Home":
+          event.preventDefault();
+          focusAt(0);
+          break;
+        case "End":
+          event.preventDefault();
+          focusAt(navigableIds.length - 1);
+          break;
+        case "ArrowLeft":
+          if (onRequestClose) {
+            event.preventDefault();
+            event.stopPropagation();
+            onRequestClose();
+          }
+          break;
+        default:
+          break;
+      }
+    },
+    [navigableIds, activeId, onRequestClose]
+  );
+  const renderMenuItem = (item) => {
+    switch (item.type) {
+      case "item":
+        return /* @__PURE__ */ jsxs(
+          "li",
+          {
+            ref: (element) => registerItem(item.id, element),
+            role: "menuitem",
+            tabIndex: !item.disabled && item.id === activeId ? 0 : -1,
+            "aria-disabled": item.disabled || void 0,
+            className: [
+              "eidos-menu-item",
+              item.disabled ? "eidos-menu-item--disabled" : "",
+              item.color ? `eidos-menu-item--${item.color}` : ""
+            ].filter(Boolean).join(" "),
+            onClick: () => handleItemClick(item),
+            onKeyDown: (event) => {
+              if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                handleItemClick(item);
+              }
+            },
+            children: [
+              item.icon && renderIcon(item.icon, "eidos-menu-icon"),
+              /* @__PURE__ */ jsx("span", { className: `eidos-menu-label`, children: item.label }),
+              item.shortcut && /* @__PURE__ */ jsx(Kbd, { size: "sm", className: "eidos-menu-shortcut", children: item.shortcut })
+            ]
+          },
+          item.id
+        );
+      case "component":
+        return /* @__PURE__ */ jsx("li", { role: "none", className: `eidos-menu-component-item`, children: item.component }, item.id);
+      case "separator":
+        return /* @__PURE__ */ jsx("li", { role: "separator", className: `eidos-menu-separator` }, item.id);
+      case "nested": {
+        const triggerElement = /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ref: (element) => registerItem(item.id, element),
+            role: "menuitem",
+            "aria-haspopup": "menu",
+            "aria-expanded": openSubmenuId === item.id,
+            "aria-disabled": item.disabled || void 0,
+            tabIndex: !item.disabled && item.id === activeId ? 0 : -1,
+            className: [
+              "eidos-menu-nested-trigger",
+              item.disabled ? "eidos-menu-nested-trigger--disabled" : ""
+            ].filter(Boolean).join(" "),
+            onKeyDown: (event) => {
+              if (item.disabled) return;
+              if (event.key === "ArrowRight" || event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                setOpenSubmenuId(item.id);
+              }
+            },
+            children: [
+              item.icon && renderIcon(item.icon, "eidos-menu-icon"),
+              /* @__PURE__ */ jsx("span", { className: `eidos-menu-label`, children: item.label }),
+              /* @__PURE__ */ jsx(ChevronRight, { className: `eidos-menu-nested-arrow` })
+            ]
+          }
+        );
+        return /* @__PURE__ */ jsx("li", { role: "none", className: `eidos-menu-nested-item`, children: /* @__PURE__ */ jsx(
+          Dropdown,
+          {
+            open: openSubmenuId === item.id,
+            onOpenChange: (next) => setOpenSubmenuId(next ? item.id : null),
+            trigger: triggerElement,
+            content: /* @__PURE__ */ jsx(
+              MenuPanel,
+              {
+                items: item.items,
+                onItemClick,
+                onRequestClose: () => setOpenSubmenuId(null)
+              }
+            ),
+            placement: "right",
+            isNested: true,
+            fullWidth: true,
+            disabled: item.disabled
+          }
+        ) }, item.id);
+      }
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ jsx("ul", { ref: listRef, role: "menu", className: `eidos-menu ${className}`, onKeyDown: handleKeyDown, children: items.map(renderMenuItem) });
+};
+var Menu = ({
+  trigger,
+  items,
+  minWidth,
+  maxWidth,
+  minHeight,
+  maxHeight,
+  autoWidth = true,
+  triggerRef,
+  closeOnItemClick = true,
+  tooltip
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const handleItemClick = useCallback(
+    (_item) => {
+      if (closeOnItemClick) setIsOpen(false);
+    },
+    [closeOnItemClick]
+  );
+  const describedTrigger = React.isValidElement(trigger) ? React.cloneElement(
+    trigger,
+    { "aria-haspopup": "menu", "aria-expanded": isOpen }
+  ) : trigger;
+  const dropdown = /* @__PURE__ */ jsx(
+    Dropdown,
+    {
+      open: isOpen,
+      onOpenChange: setIsOpen,
+      trigger: describedTrigger,
+      content: /* @__PURE__ */ jsx(MenuPanel, { items, onItemClick: handleItemClick }),
+      minWidth,
+      maxWidth,
+      minHeight,
+      maxHeight,
+      autoWidth,
+      triggerRef
+    }
+  );
+  return tooltip ? /* @__PURE__ */ jsx(Tooltip, { message: tooltip, children: dropdown }) : dropdown;
+};
+
+export {
+  MenuPanel,
+  Menu
+};
+//# sourceMappingURL=chunk-P4XZH3OR.js.map