@namroodinc/liquid-editorial 0.1.6 → 0.1.8

package/dist/components/Select/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useId","useCallback","Icon","Popover","require_Icon","require_components_Popover_index","react","react_jsx_runtime","cx","parts","Select","rest","internal","setInternal","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","triggerRef","listRef","listId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","next","onValueChange","index","onPointerDown","target","event","step","order","o","delta","handleKeyDown","pick","node","ref","isInvalid","size","className","onClick","open","onKeyDown","placeholder","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n  value: string;\n  label: string;\n  /** Secondary line under the label. */\n  description?: string;\n  isDisabled?: boolean;\n}\n\nexport interface SelectProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n  options: SelectOption[];\n  /** Controlled value. Leave undefined to let the select hold its own. */\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  placeholder?: string;\n  size?: FieldSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Preferred side of the menu; flips when space requires it. */\n  menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n  {\n    options,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder = \"Select an option\",\n    size = \"md\",\n    isDisabled = false,\n    isInvalid = false,\n    menuPlacement = \"bottom\",\n    className,\n    disabled,\n    onClick,\n    onKeyDown,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState(defaultValue ?? \"\");\n  const current = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(0);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const listId = useId();\n  const effectiveDisabled = isDisabled || disabled;\n  const isVisible = isOpen && !effectiveDisabled;\n\n  const selected = options.find((option) => option.value === current);\n  const enabled = options.filter((option) => !option.isDisabled);\n\n  const commit = useCallback(\n    (next: string) => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, value],\n  );\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n    setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n    };\n    document.addEventListener(\"mousedown\", onPointerDown);\n    return () => document.removeEventListener(\"mousedown\", onPointerDown);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isVisible]);\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n    activeOption?.scrollIntoView({ block: \"nearest\" });\n  }, [activeIndex, isVisible]);\n\n  const step = (delta: number) => {\n    const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n    if (order.length === 0) return;\n    const at = order.findIndex((o) => o.index === activeIndex);\n    const next = order[(at + delta + order.length) % order.length]!;\n    setActiveIndex(next.index);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (effectiveDisabled) return;\n    if (event.key === \"Escape\") {\n      setOpen(false);\n      triggerRef.current?.focus();\n      return;\n    }\n    if (!isVisible && (event.key === \"ArrowDown\" || event.key === \"ArrowUp\" || event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      setOpen(true);\n      return;\n    }\n    if (!isVisible) return;\n    if (event.key === \"Tab\") {\n      setOpen(false);\n      return;\n    }\n    if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n      event.preventDefault();\n      step(event.key === \"ArrowDown\" ? 1 : -1);\n    } else if (event.key === \"Home\" || event.key === \"End\") {\n      event.preventDefault();\n      const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n      if (pick) setActiveIndex(options.indexOf(pick));\n    } else if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      const option = options[activeIndex];\n      if (option && !option.isDisabled) commit(option.value);\n    }\n  };\n\n  return (\n    <div className=\"ds-select-root\" ref={rootRef}>\n      <button\n        ref={(node) => {\n          triggerRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        type=\"button\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={isVisible}\n        aria-controls={isVisible ? listId : undefined}\n        aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n        aria-invalid={isInvalid || undefined}\n        disabled={effectiveDisabled}\n        data-size={size}\n        data-placeholder={selected ? undefined : \"\"}\n        className={cx(\"ds-field-skin\", \"ds-select\", className)}\n        onClick={(event) => {\n          onClick?.(event);\n          if (!event.defaultPrevented) setOpen((open) => !open);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown?.(event);\n          if (!event.defaultPrevented) handleKeyDown(event);\n        }}\n        {...rest}\n      >\n        <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n        <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n      </button>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isVisible}\n        placement={menuPlacement}\n        matchAnchorWidth\n        panelRef={listRef}\n        id={listId}\n        role=\"listbox\"\n        aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n        aria-labelledby={rest[\"aria-labelledby\"]}\n        className=\"ds-surface-raised ds-select__menu\"\n      >\n        <div onKeyDown={handleKeyDown}>\n          {options.map((option, index) => (\n            <div\n              key={option.value}\n              id={`${listId}-option-${index}`}\n              role=\"option\"\n              aria-selected={option.value === current}\n              aria-disabled={option.isDisabled || undefined}\n              data-active={index === activeIndex || undefined}\n              className=\"ds-select__option\"\n              onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n              onClick={() => {\n                if (!option.isDisabled) {\n                  commit(option.value);\n                  triggerRef.current?.focus();\n                }\n              }}\n            >\n              <span className=\"ds-select__option-body\">\n                <span className=\"ds-select__option-label\">{option.label}</span>\n                {option.description && (\n                  <span className=\"ds-select__option-description\">{option.description}</span>\n                )}\n              </span>\n              {option.value === current && <Icon name=\"check\" size={16} />}\n            </div>\n          ))}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useId","useCallback","Button","Icon","Popover","require_Icon","require_components_Button_index","require_components_Popover_index","react","react_jsx_runtime","cx","parts","Select","rest","internal","setInternal","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","triggerRef","listRef","listId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","next","onValueChange","index","onPointerDown","target","event","step","order","o","delta","handleListKeyDown","pick","handleKeyDown","node","ref","isInvalid","className","onClick","open","onKeyDown","placeholder","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n  value: string;\n  label: string;\n  /** Secondary line under the label. */\n  description?: string;\n  isDisabled?: boolean;\n}\n\nexport interface SelectProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n  options: SelectOption[];\n  /** Controlled value. Leave undefined to let the select hold its own. */\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  placeholder?: string;\n  size?: FieldSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Preferred side of the menu; flips when space requires it. */\n  menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n  {\n    options,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder = \"Select an option\",\n    size = \"md\",\n    isDisabled = false,\n    isInvalid = false,\n    menuPlacement = \"bottom\",\n    className,\n    disabled,\n    onClick,\n    onKeyDown,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState(defaultValue ?? \"\");\n  const current = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(0);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const listId = useId();\n  const effectiveDisabled = isDisabled || disabled;\n  const isVisible = isOpen && !effectiveDisabled;\n\n  const selected = options.find((option) => option.value === current);\n  const enabled = options.filter((option) => !option.isDisabled);\n\n  const commit = useCallback(\n    (next: string) => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, value],\n  );\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n    setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n    };\n    document.addEventListener(\"mousedown\", onPointerDown);\n    return () => document.removeEventListener(\"mousedown\", onPointerDown);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isVisible]);\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n    activeOption?.scrollIntoView({ block: \"nearest\" });\n  }, [activeIndex, isVisible]);\n\n  const step = (delta: number) => {\n    const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n    if (order.length === 0) return;\n    const at = order.findIndex((o) => o.index === activeIndex);\n    const next = order[(at + delta + order.length) % order.length]!;\n    setActiveIndex(next.index);\n  };\n\n  const handleListKeyDown = (event: React.KeyboardEvent) => {\n    switch (event.key) {\n      case \"Escape\":\n        // Claims Escape so an enclosing Drawer stays open.\n        event.preventDefault();\n        setOpen(false);\n        triggerRef.current?.focus();\n        break;\n      case \"Tab\":\n        setOpen(false);\n        break;\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        event.preventDefault();\n        step(event.key === \"ArrowDown\" ? 1 : -1);\n        break;\n      case \"Home\":\n      case \"End\": {\n        event.preventDefault();\n        const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n        if (pick) setActiveIndex(options.indexOf(pick));\n        break;\n      }\n      case \"Enter\":\n      case \" \": {\n        event.preventDefault();\n        const option = options[activeIndex];\n        if (option && !option.isDisabled) commit(option.value);\n        break;\n      }\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (effectiveDisabled) return;\n    if (isVisible) {\n      handleListKeyDown(event);\n    } else if ([\"ArrowDown\", \"ArrowUp\", \"Enter\", \" \"].includes(event.key)) {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  return (\n    <div className=\"ds-select-root\" ref={rootRef}>\n      <Button\n        ref={(node) => {\n          triggerRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        size={size}\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={isVisible}\n        aria-controls={isVisible ? listId : undefined}\n        aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n        aria-invalid={isInvalid || undefined}\n        isDisabled={effectiveDisabled}\n        data-placeholder={selected ? undefined : \"\"}\n        className={cx(\"ds-field-skin\", \"ds-select\", className)}\n        onClick={(event) => {\n          onClick?.(event);\n          if (!event.defaultPrevented) setOpen((open) => !open);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown?.(event);\n          if (!event.defaultPrevented) handleKeyDown(event);\n        }}\n        {...rest}\n      >\n        <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n        <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n      </Button>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isVisible}\n        placement={menuPlacement}\n        matchAnchorWidth\n        panelRef={listRef}\n        id={listId}\n        role=\"listbox\"\n        aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n        aria-labelledby={rest[\"aria-labelledby\"]}\n        className=\"ds-surface-raised ds-select__menu\"\n      >\n        <div onKeyDown={handleKeyDown} onPointerDown={(event) => event.preventDefault()}>\n          {options.map((option, index) => (\n            <Button\n              key={option.value}\n              variant={index === activeIndex ? \"active\" : \"simple\"}\n              size=\"sm\"\n              isDisabled={option.isDisabled}\n              tabIndex={-1}\n              id={`${listId}-option-${index}`}\n              role=\"option\"\n              aria-selected={option.value === current}\n              aria-disabled={option.isDisabled || undefined}\n              data-active={index === activeIndex || undefined}\n              className=\"ds-select__option\"\n              onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n              onClick={() => {\n                if (!option.isDisabled) {\n                  commit(option.value);\n                  triggerRef.current?.focus();\n                }\n              }}\n            >\n              <span className=\"ds-select__option-body\">\n                <span className=\"ds-select__option-label\">{option.label}</span>\n                {option.description && (\n                  <span className=\"ds-select__option-description\">{option.description}</span>\n                )}\n              </span>\n              {option.value === current && <Icon name=\"check\" size={16} />}\n            </Button>\n          ))}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n"],"mappings":"A,+RAgBA,SAASa,EAAG,GAAGC,EAAuC,CACpD,OAAOA,EAAM,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,CACvC,CA6BA,IAAaC,GAAA,EAASf,EAAAA,WAAAA,CAA2C,SAC/D,CACE,UACA,QACA,eACA,gBACA,cAAc,mBACd,OAAO,KACP,aAAa,GACb,YAAY,GACZ,gBAAgB,SAChB,YACA,WACA,UACA,YACA,GAAGgB,GAEL,EACA,CACA,GAAM,CAACC,EAAUC,IAAA,EAAejB,EAAAA,SAAAA,CAASkB,GAAgB,EAAE,EACrDC,EAAUC,GAASJ,EACnB,CAACK,EAAQC,IAAA,EAAWtB,EAAAA,SAAAA,CAAS,EAAK,EAClC,CAACuB,EAAaC,IAAA,EAAkBxB,EAAAA,SAAAA,CAAS,CAAC,EAC1CyB,GAAA,EAAUxB,EAAAA,OAAAA,CAA8B,IAAI,EAC5CyB,GAAA,EAAazB,EAAAA,OAAAA,CAAiC,IAAI,EAClD0B,GAAA,EAAU1B,EAAAA,OAAAA,CAA8B,IAAI,EAC5C2B,GAAA,EAAS1B,EAAAA,MAAAA,CAAM,EACf2B,EAAoBC,GAAcC,EAClCC,EAAYX,GAAU,CAACQ,EAEvBI,EAAWC,EAAQ,KAAM,GAAWC,EAAO,QAAUhB,CAAO,EAC5DiB,EAAUF,EAAQ,OAAQ,GAAW,CAACC,EAAO,UAAU,EAEvDE,GAAA,EAASlC,EAAAA,YAAAA,CACZ,GAAiB,CACZiB,IAAU,IAAA,IAAWH,EAAYqB,CAAI,EACzCC,IAAgBD,CAAI,EACpBhB,EAAQ,EAAK,CACf,EACA,CAACiB,EAAenB,CAAK,CACvB,GAEA,EAAAV,EAAA,UAAA,KAAgB,CACd,GAAI,CAACsB,EAAW,OAChB,IAAMQ,EAAQN,EAAQ,UAAW,GAAWC,EAAO,QAAUhB,GAAW,CAACgB,EAAO,UAAU,EAC1FX,EAAegB,EAAQ,EAAIN,EAAQ,QAAQE,EAAQ,EAAG,EAAII,CAAK,EAC/D,IAAMC,EAAiB,GAAsB,CAC3C,IAAMC,EAASC,EAAM,OACjB,CAAClB,EAAQ,SAAS,SAASiB,CAAM,GAAK,CAACf,EAAQ,SAAS,SAASe,CAAM,GAAGpB,EAAQ,EAAK,CAC7F,EAEA,OADA,SAAS,iBAAiB,YAAamB,CAAa,MACvC,SAAS,oBAAoB,YAAaA,CAAa,CAEtE,EAAG,CAACT,CAAS,CAAC,GAEd,EAAAtB,EAAA,UAAA,KAAgB,CACTsB,IACgBL,EAAQ,SAAS,iBAA8B,iBAAiB,CAAC,CAACJ,GAAA,EACzE,eAAe,CAAE,MAAO,SAAU,CAAC,CACnD,EAAG,CAACA,EAAaS,CAAS,CAAC,EAE3B,IAAMY,EAAQ,GAAkB,CAC9B,IAAMC,EAAQX,EAAQ,KAAK,EAAQ,KAAW,CAAE,SAAQ,OAAM,EAAE,CAAC,CAAC,OAAQ,GAAM,CAACY,EAAE,OAAO,UAAU,EACpG,GAAID,EAAM,SAAW,EAAG,OAExB,IAAMP,EAAOO,GADFA,EAAM,UAAW,GAAMC,EAAE,QAAUvB,CAC1B,EAAKwB,EAAQF,EAAM,QAAUA,EAAM,QACvDrB,EAAec,EAAK,KAAK,CAC3B,EAEMU,EAAqB,GAA+B,CACxD,OAAQL,EAAM,IAAd,CACE,IAAK,SAEHA,EAAM,eAAe,EACrBrB,EAAQ,EAAK,EACbI,EAAW,SAAS,MAAM,EAC1B,MACF,IAAK,MACHJ,EAAQ,EAAK,EACb,MACF,IAAK,YACL,IAAK,UACHqB,EAAM,eAAe,EACrBC,EAAKD,EAAM,MAAQ,YAAc,EAAI,EAAE,EACvC,MACF,IAAK,OACL,IAAK,MAAO,CACVA,EAAM,eAAe,EACrB,IAAMM,EAAON,EAAM,MAAQ,OAASP,EAAQ,GAAKA,EAAQA,EAAQ,OAAS,GACtEa,GAAMzB,EAAeU,EAAQ,QAAQe,CAAI,CAAC,EAC9C,KACF,CACA,IAAK,QACL,IAAK,IAAK,CACRN,EAAM,eAAe,EACrB,IAAMR,EAASD,EAAQX,GACnBY,GAAU,CAACA,EAAO,YAAYE,EAAOF,EAAO,KAAK,EACrD,KACF,CACF,CACF,EAEMe,EAAiB,GAA+B,CAChDrB,IACAG,EACFgB,EAAkBL,CAAK,EACd,CAAC,YAAa,UAAW,QAAS,GAAG,CAAC,CAAC,SAASA,EAAM,GAAG,IAClEA,EAAM,eAAe,EACrBrB,EAAQ,EAAI,GAEhB,EAEA,OACE,EAAAX,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,iBAAiB,IAAKc,EAArC,SAAA,EACE,EAAAd,EAAA,KAAA,CAACP,EAAAA,OAAD,CACE,IAAM,GAAS,CACb,EAAW,QAAU+C,EACjB,OAAOC,GAAQ,WAAYA,EAAID,CAAI,EAC9BC,IAAK,EAAI,QAAUD,EAC9B,EACM,OACN,KAAK,WACL,gBAAc,UACd,gBAAenB,EACf,gBAAeA,EAAYJ,EAAS,IAAA,GACpC,wBAAuBI,GAAaE,EAAQX,IAAgB,CAACW,EAAQX,EAAY,CAAC,WAAa,GAAGK,EAAO,UAAUL,IAAgB,IAAA,GACnI,eAAc8B,GAAa,IAAA,GAC3B,WAAYxB,EACZ,mBAAkBI,EAAW,IAAA,GAAY,GACzC,UAAWrB,EAAG,gBAAiB,YAAa0C,CAAS,EACrD,QAAU,GAAU,CAClBC,IAAUZ,CAAK,EACVA,EAAM,kBAAkBrB,EAAS,GAAS,CAACkC,CAAI,CACtD,EACA,UAAY,GAAU,CACpBC,IAAYd,CAAK,EACZA,EAAM,kBAAkBO,EAAcP,CAAK,CAClD,EACA,GAAI5B,EAxBN,SAAA,EA0BE,EAAAJ,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,mBAAoB,SAAAsB,EAAWA,EAAS,MAAQyB,CAAkB,CAAA,GAClF,EAAA/C,EAAA,IAAA,CAACN,EAAAA,EAAD,CAAM,KAAK,eAAe,KAAM,GAAI,UAAU,oBAAsB,CAAA,CAC9D,CACR,CAAA,GAAA,EAAAM,EAAA,IAAA,CAACL,EAAAA,QAAD,CACE,UAAWoB,EACX,OAAQM,EACR,UAAW2B,EACX,iBAAA,GACA,SAAUhC,EACV,GAAIC,EACJ,KAAK,UACL,aAAYb,EAAK,mBAAqB,IAAA,GAAYA,EAAK,eAAiB2C,EACxE,kBAAiB3C,EAAK,mBACtB,UAAU,oCAEV,UAAA,EAAAJ,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWuC,EAAe,cAAgB,GAAUP,EAAM,eAAe,EAC3E,SAAAT,EAAQ,KAAK,EAAQ,KACpB,EAAAvB,EAAA,KAAA,CAACP,EAAAA,OAAD,CAEE,QAASoC,IAAUjB,EAAc,SAAW,SAC5C,KAAK,KACL,WAAYY,EAAO,WACnB,SAAU,GACV,GAAI,GAAGP,EAAO,UAAUY,IACxB,KAAK,SACL,gBAAeL,EAAO,QAAUhB,EAChC,gBAAegB,EAAO,YAAc,IAAA,GACpC,cAAaK,IAAUjB,GAAe,IAAA,GACtC,UAAU,oBACV,iBAAoB,CAACY,EAAO,YAAcX,EAAegB,CAAK,EAC9D,YAAe,CACRL,EAAO,aACVE,EAAOF,EAAO,KAAK,EACnBT,EAAW,SAAS,MAAM,EAE9B,EAlBF,SAAA,EAoBE,EAAAf,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,yBAAhB,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,0BAA2B,SAAAwB,EAAO,KAAY,CAAA,EAC7DA,EAAO,cACN,EAAAxB,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,gCAAiC,SAAAwB,EAAO,WAAkB,CAAA,CAExE,CACL,CAAA,EAAAA,EAAO,QAAUhB,IAAW,EAAAR,EAAA,IAAA,CAACN,EAAAA,EAAD,CAAM,KAAK,QAAQ,KAAM,EAAK,CAAA,CACrD,CA1BD,EAAA8B,EAAO,KA0BN,CACT,CACE,CAAA,CACE,CAAA,CACN,C,EAET,CAAC,E"}

package/dist/components/Select/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAEf,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC5F,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gEAAgE;IAChE,aAAa,CAAC,EAAE,gBAAgB,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,2GA+KjB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAGf,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC5F,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gEAAgE;IAChE,aAAa,CAAC,EAAE,gBAAgB,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,2GA8LjB,CAAC"}

package/dist/components/Select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAEf,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC5F,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gEAAgE;IAChE,aAAa,CAAC,EAAE,gBAAgB,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,2GA+KjB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAGf,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC;IAC5F,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gEAAgE;IAChE,aAAa,CAAC,EAAE,gBAAgB,CAAC;CAClC;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,2GA8LjB,CAAC"}

package/dist/components/Select/index.js

@@ -1,131 +1,152 @@
 import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
+import { Button as t } from "../Button/index.js";
 /* empty css                          */
-import { Popover as t } from "../Popover/index.js";
-import { forwardRef as n, useCallback as r, useEffect as i, useId as a, useRef as o, useState as s } from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Popover as n } from "../Popover/index.js";
+import { forwardRef as r, useCallback as i, useEffect as a, useId as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/Select/index.tsx
-function u(...e) {
+function d(...e) {
 	return e.filter(Boolean).join(" ");
 }
-var d = n(function({ options: n, value: d, defaultValue: f, onValueChange: p, placeholder: m = "Select an option", size: h = "md", isDisabled: g = !1, isInvalid: _ = !1, menuPlacement: v = "bottom", className: y, disabled: b, onClick: x, onKeyDown: S, ...C }, w) {
-	let [T, E] = s(f ?? ""), D = d ?? T, [O, k] = s(!1), [A, j] = s(0), M = o(null), N = o(null), P = o(null), F = a(), I = g || b, L = O && !I, R = n.find((e) => e.value === D), z = n.filter((e) => !e.isDisabled), B = r((e) => {
-		d === void 0 && E(e), p?.(e), k(!1);
-	}, [p, d]);
-	i(() => {
-		if (!L) return;
-		let e = n.findIndex((e) => e.value === D && !e.isDisabled);
-		j(e < 0 ? n.indexOf(z[0]) : e);
+var f = r(function({ options: r, value: f, defaultValue: p, onValueChange: m, placeholder: h = "Select an option", size: g = "md", isDisabled: _ = !1, isInvalid: v = !1, menuPlacement: y = "bottom", className: b, disabled: x, onClick: S, onKeyDown: C, ...w }, T) {
+	let [E, D] = c(p ?? ""), O = f ?? E, [k, A] = c(!1), [j, M] = c(0), N = s(null), P = s(null), F = s(null), I = o(), L = _ || x, R = k && !L, z = r.find((e) => e.value === O), B = r.filter((e) => !e.isDisabled), V = i((e) => {
+		f === void 0 && D(e), m?.(e), A(!1);
+	}, [m, f]);
+	a(() => {
+		if (!R) return;
+		let e = r.findIndex((e) => e.value === O && !e.isDisabled);
+		M(e < 0 ? r.indexOf(B[0]) : e);
 		let t = (e) => {
 			let t = e.target;
-			!M.current?.contains(t) && !P.current?.contains(t) && k(!1);
+			!N.current?.contains(t) && !F.current?.contains(t) && A(!1);
 		};
 		return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
-	}, [L]), i(() => {
-		L && (P.current?.querySelectorAll("[role='option']")[A])?.scrollIntoView({ block: "nearest" });
-	}, [A, L]);
-	let V = (e) => {
-		let t = n.map((e, t) => ({
+	}, [R]), a(() => {
+		R && (F.current?.querySelectorAll("[role='option']")[j])?.scrollIntoView({ block: "nearest" });
+	}, [j, R]);
+	let H = (e) => {
+		let t = r.map((e, t) => ({
 			option: e,
 			index: t
 		})).filter((e) => !e.option.isDisabled);
 		if (t.length === 0) return;
-		let r = t[(t.findIndex((e) => e.index === A) + e + t.length) % t.length];
-		j(r.index);
-	}, H = (e) => {
-		if (!I) {
-			if (e.key === "Escape") k(!1), N.current?.focus();
-			else if (!L && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter" || e.key === " ")) e.preventDefault(), k(!0);
-			else if (L) {
-				if (e.key === "Tab") k(!1);
-				else if (e.key === "ArrowDown" || e.key === "ArrowUp") e.preventDefault(), V(e.key === "ArrowDown" ? 1 : -1);
-				else if (e.key === "Home" || e.key === "End") {
-					e.preventDefault();
-					let t = e.key === "Home" ? z[0] : z[z.length - 1];
-					t && j(n.indexOf(t));
-				} else if (e.key === "Enter" || e.key === " ") {
-					e.preventDefault();
-					let t = n[A];
-					t && !t.isDisabled && B(t.value);
-				}
+		let n = t[(t.findIndex((e) => e.index === j) + e + t.length) % t.length];
+		M(n.index);
+	}, U = (e) => {
+		switch (e.key) {
+			case "Escape":
+				e.preventDefault(), A(!1), P.current?.focus();
+				break;
+			case "Tab":
+				A(!1);
+				break;
+			case "ArrowDown":
+			case "ArrowUp":
+				e.preventDefault(), H(e.key === "ArrowDown" ? 1 : -1);
+				break;
+			case "Home":
+			case "End": {
+				e.preventDefault();
+				let t = e.key === "Home" ? B[0] : B[B.length - 1];
+				t && M(r.indexOf(t));
+				break;
+			}
+			case "Enter":
+			case " ": {
+				e.preventDefault();
+				let t = r[j];
+				t && !t.isDisabled && V(t.value);
+				break;
 			}
 		}
+	}, W = (e) => {
+		L || (R ? U(e) : [
+			"ArrowDown",
+			"ArrowUp",
+			"Enter",
+			" "
+		].includes(e.key) && (e.preventDefault(), A(!0)));
 	};
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ u("div", {
 		className: "ds-select-root",
-		ref: M,
-		children: [/* @__PURE__ */ l("button", {
+		ref: N,
+		children: [/* @__PURE__ */ u(t, {
 			ref: (e) => {
-				N.current = e, typeof w == "function" ? w(e) : w && (w.current = e);
+				P.current = e, typeof T == "function" ? T(e) : T && (T.current = e);
 			},
-			type: "button",
+			size: g,
 			role: "combobox",
 			"aria-haspopup": "listbox",
-			"aria-expanded": L,
-			"aria-controls": L ? F : void 0,
-			"aria-activedescendant": L && n[A] && !n[A].isDisabled ? `${F}-option-${A}` : void 0,
-			"aria-invalid": _ || void 0,
-			disabled: I,
-			"data-size": h,
-			"data-placeholder": R ? void 0 : "",
-			className: u("ds-field-skin", "ds-select", y),
+			"aria-expanded": R,
+			"aria-controls": R ? I : void 0,
+			"aria-activedescendant": R && r[j] && !r[j].isDisabled ? `${I}-option-${j}` : void 0,
+			"aria-invalid": v || void 0,
+			isDisabled: L,
+			"data-placeholder": z ? void 0 : "",
+			className: d("ds-field-skin", "ds-select", b),
 			onClick: (e) => {
-				x?.(e), e.defaultPrevented || k((e) => !e);
+				S?.(e), e.defaultPrevented || A((e) => !e);
 			},
 			onKeyDown: (e) => {
-				S?.(e), e.defaultPrevented || H(e);
+				C?.(e), e.defaultPrevented || W(e);
 			},
-			...C,
-			children: [/* @__PURE__ */ c("span", {
+			...w,
+			children: [/* @__PURE__ */ l("span", {
 				className: "ds-select__value",
-				children: R ? R.label : m
-			}), /* @__PURE__ */ c(e, {
+				children: z ? z.label : h
+			}), /* @__PURE__ */ l(e, {
 				name: "chevron-down",
 				size: 16,
 				className: "ds-select__chevron"
 			})]
-		}), /* @__PURE__ */ c(t, {
-			anchorRef: N,
-			isOpen: L,
-			placement: v,
+		}), /* @__PURE__ */ l(n, {
+			anchorRef: P,
+			isOpen: R,
+			placement: y,
 			matchAnchorWidth: !0,
-			panelRef: P,
-			id: F,
+			panelRef: F,
+			id: I,
 			role: "listbox",
-			"aria-label": C["aria-labelledby"] ? void 0 : C["aria-label"] ?? m,
-			"aria-labelledby": C["aria-labelledby"],
+			"aria-label": w["aria-labelledby"] ? void 0 : w["aria-label"] ?? h,
+			"aria-labelledby": w["aria-labelledby"],
 			className: "ds-surface-raised ds-select__menu",
-			children: /* @__PURE__ */ c("div", {
-				onKeyDown: H,
-				children: n.map((t, n) => /* @__PURE__ */ l("div", {
-					id: `${F}-option-${n}`,
+			children: /* @__PURE__ */ l("div", {
+				onKeyDown: W,
+				onPointerDown: (e) => e.preventDefault(),
+				children: r.map((n, r) => /* @__PURE__ */ u(t, {
+					variant: r === j ? "active" : "simple",
+					size: "sm",
+					isDisabled: n.isDisabled,
+					tabIndex: -1,
+					id: `${I}-option-${r}`,
 					role: "option",
-					"aria-selected": t.value === D,
-					"aria-disabled": t.isDisabled || void 0,
-					"data-active": n === A || void 0,
+					"aria-selected": n.value === O,
+					"aria-disabled": n.isDisabled || void 0,
+					"data-active": r === j || void 0,
 					className: "ds-select__option",
-					onMouseEnter: () => !t.isDisabled && j(n),
+					onMouseEnter: () => !n.isDisabled && M(r),
 					onClick: () => {
-						t.isDisabled || (B(t.value), N.current?.focus());
+						n.isDisabled || (V(n.value), P.current?.focus());
 					},
-					children: [/* @__PURE__ */ l("span", {
+					children: [/* @__PURE__ */ u("span", {
 						className: "ds-select__option-body",
-						children: [/* @__PURE__ */ c("span", {
+						children: [/* @__PURE__ */ l("span", {
 							className: "ds-select__option-label",
-							children: t.label
-						}), t.description && /* @__PURE__ */ c("span", {
+							children: n.label
+						}), n.description && /* @__PURE__ */ l("span", {
 							className: "ds-select__option-description",
-							children: t.description
+							children: n.description
 						})]
-					}), t.value === D && /* @__PURE__ */ c(e, {
+					}), n.value === O && /* @__PURE__ */ l(e, {
 						name: "check",
 						size: 16
 					})]
-				}, t.value))
+				}, n.value))
 			})
 		})]
 	});
 });
 //#endregion
-export { d as Select };
+export { f as Select };
 
 //# sourceMappingURL=index.js.map

package/dist/components/Select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Icon","cx","parts","Select","forwardRef","rest","internal","setInternal","useState","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","useRef","triggerRef","listRef","listId","useId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","useCallback","next","onValueChange","useEffect","index","onPointerDown","target","event","step","order","o","delta","handleKeyDown","pick","node","ref","isInvalid","size","className","onClick","open","onKeyDown","placeholder","Popover","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n  value: string;\n  label: string;\n  /** Secondary line under the label. */\n  description?: string;\n  isDisabled?: boolean;\n}\n\nexport interface SelectProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n  options: SelectOption[];\n  /** Controlled value. Leave undefined to let the select hold its own. */\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  placeholder?: string;\n  size?: FieldSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Preferred side of the menu; flips when space requires it. */\n  menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n  {\n    options,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder = \"Select an option\",\n    size = \"md\",\n    isDisabled = false,\n    isInvalid = false,\n    menuPlacement = \"bottom\",\n    className,\n    disabled,\n    onClick,\n    onKeyDown,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState(defaultValue ?? \"\");\n  const current = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(0);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const listId = useId();\n  const effectiveDisabled = isDisabled || disabled;\n  const isVisible = isOpen && !effectiveDisabled;\n\n  const selected = options.find((option) => option.value === current);\n  const enabled = options.filter((option) => !option.isDisabled);\n\n  const commit = useCallback(\n    (next: string) => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, value],\n  );\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n    setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n    };\n    document.addEventListener(\"mousedown\", onPointerDown);\n    return () => document.removeEventListener(\"mousedown\", onPointerDown);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isVisible]);\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n    activeOption?.scrollIntoView({ block: \"nearest\" });\n  }, [activeIndex, isVisible]);\n\n  const step = (delta: number) => {\n    const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n    if (order.length === 0) return;\n    const at = order.findIndex((o) => o.index === activeIndex);\n    const next = order[(at + delta + order.length) % order.length]!;\n    setActiveIndex(next.index);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (effectiveDisabled) return;\n    if (event.key === \"Escape\") {\n      setOpen(false);\n      triggerRef.current?.focus();\n      return;\n    }\n    if (!isVisible && (event.key === \"ArrowDown\" || event.key === \"ArrowUp\" || event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      setOpen(true);\n      return;\n    }\n    if (!isVisible) return;\n    if (event.key === \"Tab\") {\n      setOpen(false);\n      return;\n    }\n    if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n      event.preventDefault();\n      step(event.key === \"ArrowDown\" ? 1 : -1);\n    } else if (event.key === \"Home\" || event.key === \"End\") {\n      event.preventDefault();\n      const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n      if (pick) setActiveIndex(options.indexOf(pick));\n    } else if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      const option = options[activeIndex];\n      if (option && !option.isDisabled) commit(option.value);\n    }\n  };\n\n  return (\n    <div className=\"ds-select-root\" ref={rootRef}>\n      <button\n        ref={(node) => {\n          triggerRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        type=\"button\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={isVisible}\n        aria-controls={isVisible ? listId : undefined}\n        aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n        aria-invalid={isInvalid || undefined}\n        disabled={effectiveDisabled}\n        data-size={size}\n        data-placeholder={selected ? undefined : \"\"}\n        className={cx(\"ds-field-skin\", \"ds-select\", className)}\n        onClick={(event) => {\n          onClick?.(event);\n          if (!event.defaultPrevented) setOpen((open) => !open);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown?.(event);\n          if (!event.defaultPrevented) handleKeyDown(event);\n        }}\n        {...rest}\n      >\n        <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n        <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n      </button>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isVisible}\n        placement={menuPlacement}\n        matchAnchorWidth\n        panelRef={listRef}\n        id={listId}\n        role=\"listbox\"\n        aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n        aria-labelledby={rest[\"aria-labelledby\"]}\n        className=\"ds-surface-raised ds-select__menu\"\n      >\n        <div onKeyDown={handleKeyDown}>\n          {options.map((option, index) => (\n            <div\n              key={option.value}\n              id={`${listId}-option-${index}`}\n              role=\"option\"\n              aria-selected={option.value === current}\n              aria-disabled={option.isDisabled || undefined}\n              data-active={index === activeIndex || undefined}\n              className=\"ds-select__option\"\n              onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n              onClick={() => {\n                if (!option.isDisabled) {\n                  commit(option.value);\n                  triggerRef.current?.focus();\n                }\n              }}\n            >\n              <span className=\"ds-select__option-body\">\n                <span className=\"ds-select__option-label\">{option.label}</span>\n                {option.description && (\n                  <span className=\"ds-select__option-description\">{option.description}</span>\n                )}\n              </span>\n              {option.value === current && <Icon name=\"check\" size={16} />}\n            </div>\n          ))}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Icon","cx","parts","Select","forwardRef","rest","internal","setInternal","useState","defaultValue","current","value","isOpen","setOpen","activeIndex","setActiveIndex","rootRef","useRef","triggerRef","listRef","listId","useId","effectiveDisabled","isDisabled","disabled","isVisible","selected","options","option","enabled","commit","useCallback","next","onValueChange","useEffect","index","onPointerDown","target","event","step","order","o","delta","handleListKeyDown","pick","handleKeyDown","Button","node","ref","isInvalid","className","onClick","open","onKeyDown","placeholder","Popover","menuPlacement"],"sources":["../../../src/components/Select/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport { Popover, type PopoverPlacement } from \"../Popover\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface SelectOption {\n  value: string;\n  label: string;\n  /** Secondary line under the label. */\n  description?: string;\n  isDisabled?: boolean;\n}\n\nexport interface SelectProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"value\" | \"defaultValue\" | \"onChange\"> {\n  options: SelectOption[];\n  /** Controlled value. Leave undefined to let the select hold its own. */\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n  placeholder?: string;\n  size?: FieldSize;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Preferred side of the menu; flips when space requires it. */\n  menuPlacement?: PopoverPlacement;\n}\n\n/**\n * One value out of a known list. Wears the field skin, opens a listbox: arrows\n * walk the options, Enter commits, Escape closes without changing anything.\n */\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n  {\n    options,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder = \"Select an option\",\n    size = \"md\",\n    isDisabled = false,\n    isInvalid = false,\n    menuPlacement = \"bottom\",\n    className,\n    disabled,\n    onClick,\n    onKeyDown,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState(defaultValue ?? \"\");\n  const current = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(0);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLButtonElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const listId = useId();\n  const effectiveDisabled = isDisabled || disabled;\n  const isVisible = isOpen && !effectiveDisabled;\n\n  const selected = options.find((option) => option.value === current);\n  const enabled = options.filter((option) => !option.isDisabled);\n\n  const commit = useCallback(\n    (next: string) => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, value],\n  );\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const index = options.findIndex((option) => option.value === current && !option.isDisabled);\n    setActiveIndex(index < 0 ? options.indexOf(enabled[0]!) : index);\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) setOpen(false);\n    };\n    document.addEventListener(\"mousedown\", onPointerDown);\n    return () => document.removeEventListener(\"mousedown\", onPointerDown);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isVisible]);\n\n  useEffect(() => {\n    if (!isVisible) return;\n    const activeOption = listRef.current?.querySelectorAll<HTMLElement>(\"[role='option']\")[activeIndex];\n    activeOption?.scrollIntoView({ block: \"nearest\" });\n  }, [activeIndex, isVisible]);\n\n  const step = (delta: number) => {\n    const order = options.map((option, index) => ({ option, index })).filter((o) => !o.option.isDisabled);\n    if (order.length === 0) return;\n    const at = order.findIndex((o) => o.index === activeIndex);\n    const next = order[(at + delta + order.length) % order.length]!;\n    setActiveIndex(next.index);\n  };\n\n  const handleListKeyDown = (event: React.KeyboardEvent) => {\n    switch (event.key) {\n      case \"Escape\":\n        // Claims Escape so an enclosing Drawer stays open.\n        event.preventDefault();\n        setOpen(false);\n        triggerRef.current?.focus();\n        break;\n      case \"Tab\":\n        setOpen(false);\n        break;\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        event.preventDefault();\n        step(event.key === \"ArrowDown\" ? 1 : -1);\n        break;\n      case \"Home\":\n      case \"End\": {\n        event.preventDefault();\n        const pick = event.key === \"Home\" ? enabled[0] : enabled[enabled.length - 1];\n        if (pick) setActiveIndex(options.indexOf(pick));\n        break;\n      }\n      case \"Enter\":\n      case \" \": {\n        event.preventDefault();\n        const option = options[activeIndex];\n        if (option && !option.isDisabled) commit(option.value);\n        break;\n      }\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (effectiveDisabled) return;\n    if (isVisible) {\n      handleListKeyDown(event);\n    } else if ([\"ArrowDown\", \"ArrowUp\", \"Enter\", \" \"].includes(event.key)) {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  return (\n    <div className=\"ds-select-root\" ref={rootRef}>\n      <Button\n        ref={(node) => {\n          triggerRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        size={size}\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={isVisible}\n        aria-controls={isVisible ? listId : undefined}\n        aria-activedescendant={isVisible && options[activeIndex] && !options[activeIndex].isDisabled ? `${listId}-option-${activeIndex}` : undefined}\n        aria-invalid={isInvalid || undefined}\n        isDisabled={effectiveDisabled}\n        data-placeholder={selected ? undefined : \"\"}\n        className={cx(\"ds-field-skin\", \"ds-select\", className)}\n        onClick={(event) => {\n          onClick?.(event);\n          if (!event.defaultPrevented) setOpen((open) => !open);\n        }}\n        onKeyDown={(event) => {\n          onKeyDown?.(event);\n          if (!event.defaultPrevented) handleKeyDown(event);\n        }}\n        {...rest}\n      >\n        <span className=\"ds-select__value\">{selected ? selected.label : placeholder}</span>\n        <Icon name=\"chevron-down\" size={16} className=\"ds-select__chevron\" />\n      </Button>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isVisible}\n        placement={menuPlacement}\n        matchAnchorWidth\n        panelRef={listRef}\n        id={listId}\n        role=\"listbox\"\n        aria-label={rest[\"aria-labelledby\"] ? undefined : rest[\"aria-label\"] ?? placeholder}\n        aria-labelledby={rest[\"aria-labelledby\"]}\n        className=\"ds-surface-raised ds-select__menu\"\n      >\n        <div onKeyDown={handleKeyDown} onPointerDown={(event) => event.preventDefault()}>\n          {options.map((option, index) => (\n            <Button\n              key={option.value}\n              variant={index === activeIndex ? \"active\" : \"simple\"}\n              size=\"sm\"\n              isDisabled={option.isDisabled}\n              tabIndex={-1}\n              id={`${listId}-option-${index}`}\n              role=\"option\"\n              aria-selected={option.value === current}\n              aria-disabled={option.isDisabled || undefined}\n              data-active={index === activeIndex || undefined}\n              className=\"ds-select__option\"\n              onMouseEnter={() => !option.isDisabled && setActiveIndex(index)}\n              onClick={() => {\n                if (!option.isDisabled) {\n                  commit(option.value);\n                  triggerRef.current?.focus();\n                }\n              }}\n            >\n              <span className=\"ds-select__option-body\">\n                <span className=\"ds-select__option-label\">{option.label}</span>\n                {option.description && (\n                  <span className=\"ds-select__option-description\">{option.description}</span>\n                )}\n              </span>\n              {option.value === current && <Icon name=\"check\" size={16} />}\n            </Button>\n          ))}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n"],"mappings":"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"}

package/dist/components/Select/style.css

@@ -9,26 +9,10 @@
     align-items: center;
     justify-content: space-between;
     gap: var(--space-2);
-    padding: 0 10px;
     text-align: start;
     cursor: pointer;
   }
 
-  .ds-select[data-size="sm"] {
-    block-size: var(--field-height-sm);
-    font-size: var(--field-font-size-sm);
-  }
-
-  .ds-select[data-size="md"] {
-    block-size: var(--field-height-md);
-    font-size: var(--field-font-size-md);
-  }
-
-  .ds-select[data-size="lg"] {
-    block-size: var(--field-height-lg);
-    font-size: var(--field-font-size-md);
-  }
-
   .ds-select[data-placeholder] .ds-select__value {
     color: var(--color-text-muted);
   }
@@ -49,28 +33,11 @@
     padding: var(--space-1);
   }
 
-  .ds-select__option {
-    display: flex;
-    align-items: center;
-    gap: var(--space-2);
-    padding: var(--space-2) var(--space-3);
-    border-radius: var(--radius-sm);
-    color: var(--color-text);
-    font-size: var(--font-size-sm);
-    cursor: pointer;
-  }
-
-  .ds-select__option[data-active] {
-    background: var(--field-hover);
-  }
-
-  .ds-select__option[aria-selected="true"] {
-    font-weight: var(--font-weight-semibold);
-  }
-
-  .ds-select__option[aria-disabled="true"] {
-    opacity: 45%;
-    cursor: not-allowed;
+  .ds-select__option.ds-button {
+    inline-size: 100%;
+    height: auto;
+    min-block-size: var(--field-height-sm);
+    text-align: start;
   }
 
   .ds-select__option-body {

package/dist/components/SideNav/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(0,t.createContext)({isCollapsed:!1});function i(){return(0,t.useContext)(r).isCollapsed}var a=(0,t.forwardRef)(function({isCollapsed:e,defaultCollapsed:i=!1,onCollapsedChange:a,label:s=`Main`,className:c,children:l,...u},d){let[f,p]=(0,t.useState)(i),m=e??f,h=(0,t.useCallback)(()=>{let t=!m;e===void 0&&p(t),a?.(t)},[e,m,a]),g=(0,t.useMemo)(()=>({isCollapsed:m}),[m]);return(0,n.jsx)(r.Provider,{value:g,children:(0,n.jsx)(o.Provider,{value:h,children:(0,n.jsx)(`nav`,{ref:d,"aria-label":s,"data-collapsed":m||void 0,className:[`ds-sidenav`,c].filter(Boolean).join(` `),...u,children:l})})})}),o=(0,t.createContext)(()=>{}),s=(0,t.forwardRef)(function({title:i,mark:a,isCollapsible:s=!0,className:c,children:l,...u},d){let{isCollapsed:f}=(0,t.useContext)(r),p=(0,t.useContext)(o);return(0,n.jsxs)(`div`,{ref:d,className:[`ds-sidenav__header`,c].filter(Boolean).join(` `),...u,children:[a&&(0,n.jsx)(`span`,{className:`ds-sidenav__mark`,children:a}),!f&&(i||l)&&(0,n.jsx)(`span`,{className:`ds-sidenav__title`,children:i??l}),s&&(0,n.jsx)(`button`,{type:`button`,className:`ds-sidenav__toggle`,"aria-label":f?`Expand navigation`:`Collapse navigation`,"aria-expanded":!f,title:f?`Expand navigation`:`Collapse navigation`,onClick:p,children:(0,n.jsx)(e.t,{name:f?`chevrons-right`:`chevrons-left`})})]})}),c=(0,t.forwardRef)(function({label:e,className:i,children:a,...o},s){let{isCollapsed:c}=(0,t.useContext)(r);return(0,n.jsxs)(`div`,{ref:s,className:[`ds-sidenav__section`,i].filter(Boolean).join(` `),"aria-label":e,role:e?`group`:void 0,...o,children:[e&&!c&&(0,n.jsx)(`span`,{className:`ds-sidenav__section-label`,children:e}),(0,n.jsx)(`ul`,{className:`ds-sidenav__list`,children:a})]})}),l=(0,t.forwardRef)(function({icon:i,label:a,isActive:o,badge:s,className:c,...l},u){let{isCollapsed:d}=(0,t.useContext)(r);return(0,n.jsx)(`li`,{className:`ds-sidenav__row`,children:(0,n.jsxs)(`a`,{ref:u,className:[`ds-sidenav__item`,c].filter(Boolean).join(` `),"data-active":o||void 0,"aria-current":o?`page`:void 0,title:d?a:void 0,...l,children:[(0,n.jsx)(e.t,{name:i}),!d&&(0,n.jsx)(`span`,{className:`ds-sidenav__label`,children:a}),!d&&s&&(0,n.jsx)(`span`,{className:`ds-sidenav__badge`,children:s}),d&&(0,n.jsx)(`span`,{className:`ds-sidenav__sr`,children:a})]})})}),u=(0,t.forwardRef)(function({className:e,children:t,...r},i){return(0,n.jsx)(`div`,{ref:i,className:[`ds-sidenav__footer`,e].filter(Boolean).join(` `),...r,children:t})});exports.SideNav=a,exports.SideNavFooter=u,exports.SideNavHeader=s,exports.SideNavItem=l,exports.SideNavSection=c,exports.useSideNavCollapsed=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.createContext)({isCollapsed:!1});function a(){return(0,n.useContext)(i).isCollapsed}var o=(0,n.forwardRef)(function({isCollapsed:e,defaultCollapsed:t=!1,onCollapsedChange:a,label:o=`Main`,className:c,children:l,...u},d){let[f,p]=(0,n.useState)(t),m=e??f,h=(0,n.useCallback)(()=>{let t=!m;e===void 0&&p(t),a?.(t)},[e,m,a]),g=(0,n.useMemo)(()=>({isCollapsed:m}),[m]);return(0,r.jsx)(i.Provider,{value:g,children:(0,r.jsx)(s.Provider,{value:h,children:(0,r.jsx)(`nav`,{ref:d,"aria-label":o,"data-collapsed":m||void 0,className:[`ds-sidenav`,c].filter(Boolean).join(` `),...u,children:l})})})}),s=(0,n.createContext)(()=>{}),c=(0,n.forwardRef)(function({title:e,mark:a,isCollapsible:o=!0,className:c,children:l,...u},d){let{isCollapsed:f}=(0,n.useContext)(i),p=(0,n.useContext)(s);return(0,r.jsxs)(`div`,{ref:d,className:[`ds-sidenav__header`,c].filter(Boolean).join(` `),...u,children:[a&&(0,r.jsx)(`span`,{className:`ds-sidenav__mark`,children:a}),!f&&(e||l)&&(0,r.jsx)(`span`,{className:`ds-sidenav__title`,children:e??l}),o&&(0,r.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:f?`chevrons-right`:`chevrons-left`,className:`ds-sidenav__toggle`,"aria-label":f?`Expand navigation`:`Collapse navigation`,"aria-expanded":!f,title:f?`Expand navigation`:`Collapse navigation`,onClick:p})]})}),l=(0,n.forwardRef)(function({label:e,className:t,children:a,...o},s){let{isCollapsed:c}=(0,n.useContext)(i);return(0,r.jsxs)(`div`,{ref:s,className:[`ds-sidenav__section`,t].filter(Boolean).join(` `),"aria-label":e,role:e?`group`:void 0,...o,children:[e&&!c&&(0,r.jsx)(`span`,{className:`ds-sidenav__section-label`,children:e}),(0,r.jsx)(`ul`,{className:`ds-sidenav__list`,children:a})]})}),u=(0,n.forwardRef)(function({icon:t,label:a,isActive:o,badge:s,className:c,...l},u){let{isCollapsed:d}=(0,n.useContext)(i);return(0,r.jsx)(`li`,{className:`ds-sidenav__row`,children:(0,r.jsxs)(`a`,{ref:u,className:[`ds-sidenav__item`,c].filter(Boolean).join(` `),"data-active":o||void 0,"aria-current":o?`page`:void 0,title:d?a:void 0,...l,children:[(0,r.jsx)(e.t,{name:t}),!d&&(0,r.jsx)(`span`,{className:`ds-sidenav__label`,children:a}),!d&&s&&(0,r.jsx)(`span`,{className:`ds-sidenav__badge`,children:s}),d&&(0,r.jsx)(`span`,{className:`ds-sidenav__sr`,children:a})]})})}),d=(0,n.forwardRef)(function({className:e,children:t,...n},i){return(0,r.jsx)(`div`,{ref:i,className:[`ds-sidenav__footer`,e].filter(Boolean).join(` `),...n,children:t})});exports.SideNav=o,exports.SideNavFooter=d,exports.SideNavHeader=c,exports.SideNavItem=u,exports.SideNavSection=l,exports.useSideNavCollapsed=a;
 //# sourceMappingURL=index.cjs.map

package/dist/components/SideNav/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["createContext","useContext","forwardRef","useState","useCallback","useMemo","Icon","require_Icon","react","react_jsx_runtime","SideNavContext","useSideNavCollapsed","SideNav","controlled","rest","uncontrolled","setUncontrolled","defaultCollapsed","isCollapsed","toggle","next","onCollapsedChange","value","SideNavToggleContext","label","className","SideNavHeader","mark","title","children","isCollapsible","SideNavSection","SideNavItem","isActive","icon","badge","SideNavFooter"],"sources":["../../../src/components/SideNav/index.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type AnchorHTMLAttributes,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\ninterface SideNavContextValue {\n  isCollapsed: boolean;\n}\n\nconst SideNavContext = createContext<SideNavContextValue>({ isCollapsed: false });\n\n/** Read the rail's collapsed state from anything rendered inside it. */\nexport function useSideNavCollapsed(): boolean {\n  return useContext(SideNavContext).isCollapsed;\n}\n\nexport interface SideNavProps extends HTMLAttributes<HTMLElement> {\n  /** Controlled collapsed state. Omit to let the rail own it. */\n  isCollapsed?: boolean;\n  /** Initial state when uncontrolled. */\n  defaultCollapsed?: boolean;\n  /** Fired by the header's collapse toggle. */\n  onCollapsedChange?: (isCollapsed: boolean) => void;\n  /** Accessible name for the landmark. */\n  label?: string;\n  children?: ReactNode;\n}\n\n/**\n * The primary rail: one heavy edge against the page, hairline rules between\n * sections. Collapsed it keeps the icons and drops the words — the width is a\n * token, so every rail in the product collapses to the same measure.\n */\nexport const SideNav = forwardRef<HTMLElement, SideNavProps>(function SideNav(\n  {\n    isCollapsed: controlled,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    label = \"Main\",\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n  const isCollapsed = controlled ?? uncontrolled;\n\n  const toggle = useCallback(() => {\n    const next = !isCollapsed;\n    if (controlled === undefined) setUncontrolled(next);\n    onCollapsedChange?.(next);\n  }, [controlled, isCollapsed, onCollapsedChange]);\n\n  const value = useMemo(() => ({ isCollapsed }), [isCollapsed]);\n\n  return (\n    <SideNavContext.Provider value={value}>\n      <SideNavToggleContext.Provider value={toggle}>\n        <nav\n          ref={ref}\n          aria-label={label}\n          data-collapsed={isCollapsed || undefined}\n          className={[\"ds-sidenav\", className].filter(Boolean).join(\" \")}\n          {...rest}\n        >\n          {children}\n        </nav>\n      </SideNavToggleContext.Provider>\n    </SideNavContext.Provider>\n  );\n});\n\nconst SideNavToggleContext = createContext<() => void>(() => {});\n\nexport interface SideNavHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Shown when the rail is open; hidden when it collapses. */\n  title?: ReactNode;\n  /** A mark that survives the collapse — a logo, a monogram. */\n  mark?: ReactNode;\n  /** Set false when the rail is permanently open. */\n  isCollapsible?: boolean;\n  children?: ReactNode;\n}\n\n/** Brand block plus the collapse toggle, above the first hairline rule. */\nexport const SideNavHeader = forwardRef<HTMLDivElement, SideNavHeaderProps>(\n  function SideNavHeader({ title, mark, isCollapsible = true, className, children, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n    const toggle = useContext(SideNavToggleContext);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__header\", className].filter(Boolean).join(\" \")}\n        {...rest}\n      >\n        {mark && <span className=\"ds-sidenav__mark\">{mark}</span>}\n        {!isCollapsed && (title || children) && (\n          <span className=\"ds-sidenav__title\">{title ?? children}</span>\n        )}\n        {isCollapsible && (\n          <button\n            type=\"button\"\n            className=\"ds-sidenav__toggle\"\n            aria-label={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n            aria-expanded={!isCollapsed}\n            title={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n            onClick={toggle}\n          >\n            <Icon name={isCollapsed ? \"chevrons-right\" : \"chevrons-left\"} />\n          </button>\n        )}\n      </div>\n    );\n  },\n);\n\nexport interface SideNavSectionProps extends HTMLAttributes<HTMLDivElement> {\n  /** Section label. Hidden — but still announced — when collapsed. */\n  label?: string;\n  children?: ReactNode;\n}\n\n/** A group of items under one label, separated by a hairline rule. */\nexport const SideNavSection = forwardRef<HTMLDivElement, SideNavSectionProps>(\n  function SideNavSection({ label, className, children, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__section\", className].filter(Boolean).join(\" \")}\n        aria-label={label}\n        role={label ? \"group\" : undefined}\n        {...rest}\n      >\n        {label && !isCollapsed && <span className=\"ds-sidenav__section-label\">{label}</span>}\n        <ul className=\"ds-sidenav__list\">{children}</ul>\n      </div>\n    );\n  },\n);\n\nexport interface SideNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  icon: IconName;\n  /** The words. Kept in the accessible name even when the rail is collapsed. */\n  label: string;\n  isActive?: boolean;\n  /** A count or status pill at the end of the row. Hidden when collapsed. */\n  badge?: ReactNode;\n}\n\n/**\n * One destination. The active row carries the solid rail on its leading edge —\n * the same rail as a selected table row, so selection reads the same anywhere.\n */\nexport const SideNavItem = forwardRef<HTMLAnchorElement, SideNavItemProps>(\n  function SideNavItem({ icon, label, isActive, badge, className, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n\n    return (\n      <li className=\"ds-sidenav__row\">\n        <a\n          ref={ref}\n          className={[\"ds-sidenav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-current={isActive ? \"page\" : undefined}\n          title={isCollapsed ? label : undefined}\n          {...rest}\n        >\n          <Icon name={icon} />\n          {!isCollapsed && <span className=\"ds-sidenav__label\">{label}</span>}\n          {!isCollapsed && badge && <span className=\"ds-sidenav__badge\">{badge}</span>}\n          {isCollapsed && <span className=\"ds-sidenav__sr\">{label}</span>}\n        </a>\n      </li>\n    );\n  },\n);\n\nexport interface SideNavFooterProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n}\n\n/** The bottom band — account, theme, help. Above the page edge, under a rule. */\nexport const SideNavFooter = forwardRef<HTMLDivElement, SideNavFooterProps>(\n  function SideNavFooter({ className, children, ...rest }, ref) {\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__footer\", className].filter(Boolean).join(\" \")}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["createContext","useContext","forwardRef","useState","useCallback","useMemo","Button","Icon","require_Icon","require_components_Button_index","react","react_jsx_runtime","SideNavContext","useSideNavCollapsed","SideNav","controlled","rest","uncontrolled","setUncontrolled","defaultCollapsed","isCollapsed","toggle","next","onCollapsedChange","value","SideNavToggleContext","label","className","SideNavHeader","mark","title","children","isCollapsible","SideNavSection","SideNavItem","isActive","icon","badge","SideNavFooter"],"sources":["../../../src/components/SideNav/index.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type AnchorHTMLAttributes,\n  type HTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\ninterface SideNavContextValue {\n  isCollapsed: boolean;\n}\n\nconst SideNavContext = createContext<SideNavContextValue>({ isCollapsed: false });\n\n/** Read the rail's collapsed state from anything rendered inside it. */\nexport function useSideNavCollapsed(): boolean {\n  return useContext(SideNavContext).isCollapsed;\n}\n\nexport interface SideNavProps extends HTMLAttributes<HTMLElement> {\n  /** Controlled collapsed state. Omit to let the rail own it. */\n  isCollapsed?: boolean;\n  /** Initial state when uncontrolled. */\n  defaultCollapsed?: boolean;\n  /** Fired by the header's collapse toggle. */\n  onCollapsedChange?: (isCollapsed: boolean) => void;\n  /** Accessible name for the landmark. */\n  label?: string;\n  children?: ReactNode;\n}\n\n/**\n * The primary rail: one heavy edge against the page, hairline rules between\n * sections. Collapsed it keeps the icons and drops the words — the width is a\n * token, so every rail in the product collapses to the same measure.\n */\nexport const SideNav = forwardRef<HTMLElement, SideNavProps>(function SideNav(\n  {\n    isCollapsed: controlled,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    label = \"Main\",\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n  const isCollapsed = controlled ?? uncontrolled;\n\n  const toggle = useCallback(() => {\n    const next = !isCollapsed;\n    if (controlled === undefined) setUncontrolled(next);\n    onCollapsedChange?.(next);\n  }, [controlled, isCollapsed, onCollapsedChange]);\n\n  const value = useMemo(() => ({ isCollapsed }), [isCollapsed]);\n\n  return (\n    <SideNavContext.Provider value={value}>\n      <SideNavToggleContext.Provider value={toggle}>\n        <nav\n          ref={ref}\n          aria-label={label}\n          data-collapsed={isCollapsed || undefined}\n          className={[\"ds-sidenav\", className].filter(Boolean).join(\" \")}\n          {...rest}\n        >\n          {children}\n        </nav>\n      </SideNavToggleContext.Provider>\n    </SideNavContext.Provider>\n  );\n});\n\nconst SideNavToggleContext = createContext<() => void>(() => {});\n\nexport interface SideNavHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Shown when the rail is open; hidden when it collapses. */\n  title?: ReactNode;\n  /** A mark that survives the collapse — a logo, a monogram. */\n  mark?: ReactNode;\n  /** Set false when the rail is permanently open. */\n  isCollapsible?: boolean;\n  children?: ReactNode;\n}\n\n/** Brand block plus the collapse toggle, above the first hairline rule. */\nexport const SideNavHeader = forwardRef<HTMLDivElement, SideNavHeaderProps>(\n  function SideNavHeader({ title, mark, isCollapsible = true, className, children, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n    const toggle = useContext(SideNavToggleContext);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__header\", className].filter(Boolean).join(\" \")}\n        {...rest}\n      >\n        {mark && <span className=\"ds-sidenav__mark\">{mark}</span>}\n        {!isCollapsed && (title || children) && (\n          <span className=\"ds-sidenav__title\">{title ?? children}</span>\n        )}\n        {isCollapsible && (\n          <Button\n            variant=\"simple\"\n            size=\"sm\"\n            isIconOnly\n            iconStart={isCollapsed ? \"chevrons-right\" : \"chevrons-left\"}\n            className=\"ds-sidenav__toggle\"\n            aria-label={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n            aria-expanded={!isCollapsed}\n            title={isCollapsed ? \"Expand navigation\" : \"Collapse navigation\"}\n            onClick={toggle}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nexport interface SideNavSectionProps extends HTMLAttributes<HTMLDivElement> {\n  /** Section label. Hidden — but still announced — when collapsed. */\n  label?: string;\n  children?: ReactNode;\n}\n\n/** A group of items under one label, separated by a hairline rule. */\nexport const SideNavSection = forwardRef<HTMLDivElement, SideNavSectionProps>(\n  function SideNavSection({ label, className, children, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__section\", className].filter(Boolean).join(\" \")}\n        aria-label={label}\n        role={label ? \"group\" : undefined}\n        {...rest}\n      >\n        {label && !isCollapsed && <span className=\"ds-sidenav__section-label\">{label}</span>}\n        <ul className=\"ds-sidenav__list\">{children}</ul>\n      </div>\n    );\n  },\n);\n\nexport interface SideNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  icon: IconName;\n  /** The words. Kept in the accessible name even when the rail is collapsed. */\n  label: string;\n  isActive?: boolean;\n  /** A count or status pill at the end of the row. Hidden when collapsed. */\n  badge?: ReactNode;\n}\n\n/**\n * One destination. The active row carries the solid rail on its leading edge —\n * the same rail as a selected table row, so selection reads the same anywhere.\n */\nexport const SideNavItem = forwardRef<HTMLAnchorElement, SideNavItemProps>(\n  function SideNavItem({ icon, label, isActive, badge, className, ...rest }, ref) {\n    const { isCollapsed } = useContext(SideNavContext);\n\n    return (\n      <li className=\"ds-sidenav__row\">\n        <a\n          ref={ref}\n          className={[\"ds-sidenav__item\", className].filter(Boolean).join(\" \")}\n          data-active={isActive || undefined}\n          aria-current={isActive ? \"page\" : undefined}\n          title={isCollapsed ? label : undefined}\n          {...rest}\n        >\n          <Icon name={icon} />\n          {!isCollapsed && <span className=\"ds-sidenav__label\">{label}</span>}\n          {!isCollapsed && badge && <span className=\"ds-sidenav__badge\">{badge}</span>}\n          {isCollapsed && <span className=\"ds-sidenav__sr\">{label}</span>}\n        </a>\n      </li>\n    );\n  },\n);\n\nexport interface SideNavFooterProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n}\n\n/** The bottom band — account, theme, help. Above the page edge, under a rule. */\nexport const SideNavFooter = forwardRef<HTMLDivElement, SideNavFooterProps>(\n  function SideNavFooter({ className, children, ...rest }, ref) {\n    return (\n      <div\n        ref={ref}\n        className={[\"ds-sidenav__footer\", className].filter(Boolean).join(\" \")}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/components/SideNav/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA8BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA+BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}

package/dist/components/SideNav/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA8BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SideNav/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAQrB,wEAAwE;AACxE,wBAAgB,mBAAmB,IAAI,OAAO,CAE7C;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D,+DAA+D;IAC/D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,sGAsClB,CAAC;AAIH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACvF,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,+GA+BzB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,sEAAsE;AACtE,eAAO,MAAM,cAAc,gHAiB1B,CAAC;AAEF,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC/E,IAAI,EAAE,QAAQ,CAAC;IACf,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,gHAsBvB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,eAAO,MAAM,aAAa,+GAYzB,CAAC"}