@protonradio/proton-ui 0.12.14 → 0.13.1

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

@@ -1 +1 @@
-{"version":3,"file":"Select.cjs.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type CSSProperties,\n} from \"react\";\nimport { Select as RadixSelect } from \"radix-ui\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\nimport { BREAKPOINTS } from \"../../constants\";\nimport { csx } from \"../../utils\";\n\nimport { ActionMenu, type ActionMenuAction } from \"../ActionMenu/ActionMenu\";\nimport { CaretDown as CaretDownIcon } from \"../Icon\";\n\nimport \"./Select.css\";\nimport \"../Menu/Menu.css\";\nimport \"../Elevation/Elevation.css\";\n\ninterface SelectButtonProps {\n  disabled?: boolean;\n  isOpen?: boolean;\n  selectedItem?: SelectItem;\n  onClick?: () => void;\n  isRounded?: boolean;\n  ariaLabel?: string;\n  \"data-testid\"?: string;\n}\n\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\n  (\n    {\n      disabled,\n      isOpen,\n      onClick,\n      isRounded,\n      selectedItem,\n      ariaLabel,\n      \"data-testid\": testId,\n    },\n    ref: ForwardedRef<HTMLButtonElement>,\n  ) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        role=\"combobox\"\n        aria-label={ariaLabel}\n        aria-expanded={isOpen}\n        aria-autocomplete=\"none\"\n        data-state={isOpen ? \"open\" : \"closed\"}\n        data-testid={testId}\n        disabled={disabled}\n        onClick={onClick}\n        className={csx(\n          \"proton-Select__trigger\",\n          \"proton-Elevation--glass\",\n          disabled && \"proton-Select__trigger--disabled\",\n          !isOpen && \"proton-Select__trigger--closed\",\n          isOpen && \"proton-Select__trigger--opened\",\n          isRounded && \"proton-Select__trigger--rounded\",\n        )}\n      >\n        <span className=\"proton-Select__value\">\n          {selectedItem ? selectedItem.label : \"Select an option\"}\n        </span>\n        <span\n          className={csx(\n            \"proton-Select__trigger_icon\",\n            isOpen && \"proton-Select__trigger_icon--flipped\",\n          )}\n        >\n          <CaretDownIcon size={16} />\n        </span>\n      </button>\n    );\n  },\n);\n\nSelectButton.displayName = \"ProtonUISelectButton\";\n\nexport interface SelectItem {\n  /** The label to display for the item */\n  label: string;\n\n  /** The key of the item */\n  key: string;\n\n  /** The URL to navigate to when the item is clicked, turns item into an a tag */\n  to?: string;\n}\n\nexport interface SelectProps {\n  /** Array of keys that should be disabled\n   * @example [\"Thing 1\", \"Thing 2\"]\n   */\n  disabledKeys?: string[];\n\n  /** The key of the default selected item */\n  defaultSelectedKey?: string;\n\n  /** Test ID for the select */\n  \"data-testid\"?: string;\n\n  /** Whether the select is disabled */\n  isDisabled?: boolean;\n\n  /** Array of items to display\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\n   * @see {@link SelectItem}\n   */\n  items: SelectItem[];\n\n  /** Whether the select button is rounded\n   * @default false\n   */\n  isRounded?: boolean;\n\n  /** Label to display above the select\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\n   */\n  label?: string;\n\n  /** The name of the select field */\n  name: string;\n\n  /** Callback fired when the menu closes */\n  onClose?: () => void;\n\n  /** Callback fired when the menu opens */\n  onOpen?: () => void;\n\n  /** Callback fired when selection changes */\n  onSelectionChange?: (key: string) => void;\n\n  /** Currently selected key */\n  selectedKey?: string;\n}\n\n/**\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile/touch devices.\n * Supports controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SelectProps}\n */\nexport function Select({\n  label,\n  name,\n  isDisabled,\n  disabledKeys,\n  selectedKey,\n  onSelectionChange,\n  defaultSelectedKey,\n  onOpen,\n  onClose,\n  items,\n  isRounded = false,\n  \"data-testid\": testId,\n}: SelectProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const isControlled = selectedKey !== undefined;\n  const [internalSelectedKey, setInternalSelectedKey] = useState(\n    defaultSelectedKey ?? \"\",\n  );\n  const { className: themeClass, style: themeStyle } = useTheme();\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const hiddenInputRef = useRef<HTMLInputElement>(null);\n\n  // Handle controlled vs uncontrolled state\n  const currentSelectedKey = isControlled\n    ? (selectedKey as string)\n    : internalSelectedKey;\n  const selectedItem = items.find((item) => item.key === currentSelectedKey);\n\n  const handleValueChange = (value: string) => {\n    if (!isControlled) {\n      setInternalSelectedKey(value);\n    }\n    onSelectionChange?.(value);\n\n    // Update hidden input for form submission\n    if (hiddenInputRef.current) {\n      hiddenInputRef.current.value = value;\n      hiddenInputRef.current.dispatchEvent(\n        new Event(\"change\", { bubbles: true }),\n      );\n    }\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    if (open) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  };\n\n  // Update internal state when controlled selectedKey changes\n  useEffect(() => {\n    if (isControlled) {\n      setInternalSelectedKey(selectedKey);\n    }\n  }, [isControlled]);\n\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\n    key: item.key,\n    label: item.label,\n    to: item.to,\n    onAction: () => {\n      handleValueChange(item.key);\n      setIsOpen(false);\n    },\n  }));\n\n  if (isMobile) {\n    return (\n      <div\n        className=\"proton-Select\"\n        aria-label={label || name}\n        aria-disabled={isDisabled}\n      >\n        {label && (\n          <div className=\"proton-Select__label\" data-testid=\"select-label\">\n            {label}\n          </div>\n        )}\n\n        {/* Hidden input for form submission */}\n        <input\n          ref={hiddenInputRef}\n          type=\"hidden\"\n          name={name}\n          value={currentSelectedKey}\n          data-testid=\"hidden-select-container\"\n        />\n\n        <SelectButton\n          isOpen={isOpen}\n          isRounded={isRounded}\n          ref={triggerRef}\n          disabled={isDisabled}\n          ariaLabel={label || name}\n          data-testid={testId}\n          onClick={() => setIsOpen(true)}\n          selectedItem={selectedItem}\n        />\n\n        <ActionMenu\n          isOpen={isOpen}\n          onClose={() => setIsOpen(false)}\n          actions={actionItems}\n          selectedKeys={[currentSelectedKey]}\n          disabledKeys={disabledKeys}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"proton-Select\"\n      aria-label={label || name}\n      aria-disabled={isDisabled}\n    >\n      {label && (\n        <div className=\"proton-Select__label\" data-testid=\"select-label\">\n          {label}\n        </div>\n      )}\n\n      {/* Hidden input for form submission */}\n      <input\n        ref={hiddenInputRef}\n        type=\"hidden\"\n        name={name}\n        value={currentSelectedKey}\n        data-testid=\"hidden-select-container\"\n      />\n\n      <RadixSelect.Root\n        value={currentSelectedKey}\n        onValueChange={handleValueChange}\n        onOpenChange={handleOpenChange}\n        disabled={isDisabled}\n      >\n        <RadixSelect.Trigger asChild>\n          <SelectButton\n            isRounded={isRounded}\n            isOpen={isOpen}\n            ref={triggerRef}\n            disabled={isDisabled}\n            ariaLabel={label || name}\n            data-testid={testId}\n            selectedItem={selectedItem}\n          />\n        </RadixSelect.Trigger>\n\n        <RadixSelect.Portal>\n          <RadixSelect.Content\n            className={csx(\n              \"proton-Menu\",\n              \"proton-MenuTrigger__menu\",\n              \"proton-Elevation--glass\",\n              themeClass,\n            )}\n            style={themeStyle as CSSProperties}\n            position=\"popper\"\n          >\n            <RadixSelect.Viewport>\n              {items.map((item) => (\n                <RadixSelect.Item\n                  key={item.key}\n                  value={item.key}\n                  disabled={disabledKeys?.includes(item.key)}\n                  className=\"proton-Menu__item\"\n                >\n                  <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                </RadixSelect.Item>\n              ))}\n            </RadixSelect.Viewport>\n          </RadixSelect.Content>\n        </RadixSelect.Portal>\n      </RadixSelect.Root>\n    </div>\n  );\n}\n\nSelect.displayName = \"ProtonUISelect\";\n"],"names":["SelectButton","forwardRef","disabled","isOpen","onClick","isRounded","selectedItem","ariaLabel","testId","ref","jsxs","csx","jsx","CaretDownIcon","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","setIsOpen","useState","isControlled","internalSelectedKey","setInternalSelectedKey","themeClass","themeStyle","useTheme","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","hiddenInputRef","currentSelectedKey","item","handleValueChange","value","handleOpenChange","open","useEffect","actionItems","ActionMenu","RadixSelect"],"mappings":"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"}
+{"version":3,"file":"Select.cjs.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type CSSProperties,\n} from \"react\";\nimport { Select as RadixSelect } from \"radix-ui\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\nimport { BREAKPOINTS } from \"../../constants\";\nimport { csx } from \"../../utils\";\n\nimport { ActionMenu, type ActionMenuAction } from \"../ActionMenu/ActionMenu\";\nimport { CaretDown as CaretDownIcon } from \"../Icon\";\n\nimport \"./Select.css\";\nimport \"../Menu/Menu.css\";\nimport \"../Elevation/Elevation.css\";\n\ninterface SelectButtonProps {\n  disabled?: boolean;\n  isOpen?: boolean;\n  selectedItem?: SelectItem;\n  onClick?: () => void;\n  isRounded?: boolean;\n  ariaLabel?: string;\n  \"data-testid\"?: string;\n}\n\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\n  (\n    {\n      disabled,\n      isOpen,\n      onClick,\n      isRounded,\n      selectedItem,\n      ariaLabel,\n      \"data-testid\": testId,\n    },\n    ref: ForwardedRef<HTMLButtonElement>,\n  ) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        role=\"combobox\"\n        aria-label={ariaLabel}\n        aria-expanded={isOpen}\n        aria-autocomplete=\"none\"\n        data-state={isOpen ? \"open\" : \"closed\"}\n        data-testid={testId}\n        disabled={disabled}\n        onClick={onClick}\n        className={csx(\n          \"proton-Select__trigger\",\n          \"proton-Elevation--glass\",\n          disabled && \"proton-Select__trigger--disabled\",\n          !isOpen && \"proton-Select__trigger--closed\",\n          isOpen && \"proton-Select__trigger--opened\",\n          isRounded && \"proton-Select__trigger--rounded\",\n        )}\n      >\n        <span className=\"proton-Select__value\">\n          {selectedItem ? selectedItem.label : \"Select an option\"}\n        </span>\n        <span\n          className={csx(\n            \"proton-Select__trigger_icon\",\n            isOpen && \"proton-Select__trigger_icon--flipped\",\n          )}\n        >\n          <CaretDownIcon size={16} />\n        </span>\n      </button>\n    );\n  },\n);\n\nSelectButton.displayName = \"ProtonUISelectButton\";\n\nexport interface SelectItem {\n  /** The label to display for the item */\n  label: string;\n\n  /** The key of the item */\n  key: string;\n\n  /** The URL to navigate to when the item is clicked, turns item into an a tag */\n  to?: string;\n}\n\nexport interface SelectProps {\n  /** Array of keys that should be disabled\n   * @example [\"Thing 1\", \"Thing 2\"]\n   */\n  disabledKeys?: string[];\n\n  /** The key of the default selected item */\n  defaultSelectedKey?: string;\n\n  /** Test ID for the select */\n  \"data-testid\"?: string;\n\n  /** Whether the select is disabled */\n  isDisabled?: boolean;\n\n  /** Array of items to display\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\n   * @see {@link SelectItem}\n   */\n  items: SelectItem[];\n\n  /** Whether the select button is rounded\n   * @default false\n   */\n  isRounded?: boolean;\n\n  /** Label to display above the select\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\n   */\n  label?: string;\n\n  /** The name of the select field */\n  name: string;\n\n  /** Callback fired when the menu closes */\n  onClose?: () => void;\n\n  /** Callback fired when the menu opens */\n  onOpen?: () => void;\n\n  /** Callback fired when selection changes */\n  onSelectionChange?: (key: string) => void;\n\n  /** Currently selected key */\n  selectedKey?: string;\n}\n\n/**\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile/touch devices.\n * Supports controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SelectProps}\n */\nexport function Select({\n  label,\n  name,\n  isDisabled,\n  disabledKeys,\n  selectedKey,\n  onSelectionChange,\n  defaultSelectedKey,\n  onOpen,\n  onClose,\n  items,\n  isRounded = false,\n  \"data-testid\": testId,\n}: SelectProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const isControlled = selectedKey !== undefined;\n  const [internalSelectedKey, setInternalSelectedKey] = useState(\n    defaultSelectedKey ?? \"\",\n  );\n  const { className: themeClass, style: themeStyle } = useTheme();\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const hiddenInputRef = useRef<HTMLInputElement>(null);\n\n  // Handle controlled vs uncontrolled state\n  const currentSelectedKey = isControlled\n    ? (selectedKey as string)\n    : internalSelectedKey;\n  const selectedItem = items.find((item) => item.key === currentSelectedKey);\n\n  const handleValueChange = (value: string) => {\n    if (!isControlled) {\n      setInternalSelectedKey(value);\n    }\n    onSelectionChange?.(value);\n\n    // Update hidden input for form submission\n    if (hiddenInputRef.current) {\n      hiddenInputRef.current.value = value;\n      hiddenInputRef.current.dispatchEvent(\n        new Event(\"change\", { bubbles: true }),\n      );\n    }\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    if (open) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  };\n\n  // Update internal state when controlled selectedKey changes\n  useEffect(() => {\n    if (isControlled) {\n      setInternalSelectedKey(selectedKey);\n    }\n  }, [isControlled]);\n\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\n    key: item.key,\n    label: item.label,\n    to: item.to,\n    onAction: () => {\n      handleValueChange(item.key);\n      setIsOpen(false);\n    },\n  }));\n\n  if (isMobile) {\n    return (\n      <div\n        className=\"proton-Select\"\n        aria-label={label || name}\n        aria-disabled={isDisabled}\n      >\n        {label && (\n          <div className=\"proton-Select__label\" data-testid=\"select-label\">\n            {label}\n          </div>\n        )}\n\n        {/* Hidden input for form submission */}\n        <input\n          ref={hiddenInputRef}\n          type=\"hidden\"\n          name={name}\n          value={currentSelectedKey}\n          data-testid=\"hidden-select-container\"\n        />\n\n        <SelectButton\n          isOpen={isOpen}\n          isRounded={isRounded}\n          ref={triggerRef}\n          disabled={isDisabled}\n          ariaLabel={label || name}\n          data-testid={testId}\n          onClick={() => setIsOpen(true)}\n          selectedItem={selectedItem}\n        />\n\n        <ActionMenu\n          isOpen={isOpen}\n          onClose={() => setIsOpen(false)}\n          actions={actionItems}\n          selectedKeys={[currentSelectedKey]}\n          disabledKeys={disabledKeys}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"proton-Select\"\n      aria-label={label || name}\n      aria-disabled={isDisabled}\n    >\n      {label && (\n        <div className=\"proton-Select__label\" data-testid=\"select-label\">\n          {label}\n        </div>\n      )}\n\n      {/* Hidden input for form submission */}\n      <input\n        ref={hiddenInputRef}\n        type=\"hidden\"\n        name={name}\n        value={currentSelectedKey}\n        data-testid=\"hidden-select-container\"\n      />\n\n      <RadixSelect.Root\n        value={currentSelectedKey}\n        onValueChange={handleValueChange}\n        onOpenChange={handleOpenChange}\n        disabled={isDisabled}\n      >\n        <RadixSelect.Trigger asChild>\n          <SelectButton\n            isRounded={isRounded}\n            isOpen={isOpen}\n            ref={triggerRef}\n            disabled={isDisabled}\n            ariaLabel={label || name}\n            data-testid={testId}\n            selectedItem={selectedItem}\n          />\n        </RadixSelect.Trigger>\n\n        <RadixSelect.Portal>\n          <RadixSelect.Content\n            className={csx(\n              \"proton-Menu\",\n              \"proton-MenuTrigger__menu\",\n              \"proton-Elevation--glass\",\n              themeClass,\n            )}\n            style={themeStyle as CSSProperties}\n            position=\"popper\"\n          >\n            <RadixSelect.Viewport>\n              {items.map((item) => (\n                <RadixSelect.Item\n                  key={item.key}\n                  value={item.key}\n                  disabled={disabledKeys?.includes(item.key)}\n                  className=\"proton-Menu__item\"\n                >\n                  <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                </RadixSelect.Item>\n              ))}\n            </RadixSelect.Viewport>\n          </RadixSelect.Content>\n        </RadixSelect.Portal>\n      </RadixSelect.Root>\n    </div>\n  );\n}\n\nSelect.displayName = \"ProtonUISelect\";\n"],"names":["SelectButton","forwardRef","disabled","isOpen","onClick","isRounded","selectedItem","ariaLabel","testId","ref","jsxs","csx","jsx","CaretDownIcon","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","setIsOpen","useState","isControlled","internalSelectedKey","setInternalSelectedKey","themeClass","themeStyle","useTheme","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","hiddenInputRef","currentSelectedKey","item","handleValueChange","value","handleOpenChange","open","useEffect","actionItems","ActionMenu","RadixSelect"],"mappings":"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"}

package/dist/components/Select/Select.es.js

@@ -1,38 +1,38 @@
-import { j as e } from "../../node_modules/react/jsx-runtime.es.js";
-import { useState as I, useRef as E, useEffect as A, forwardRef as C } from "react";
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { useState as M, useRef as R, useEffect as U, forwardRef as V } from "react";
 import { Select as n } from "radix-ui";
-import { useTheme as U } from "../ThemeProvider.es.js";
-import { useBreakpoint as V } from "../../hooks/useBreakpoint.es.js";
-import { ActionMenu as L } from "../ActionMenu/ActionMenu.es.js";
+import { useTheme as j } from "../ThemeProvider.es.js";
+import { useBreakpoint as L } from "../../hooks/useBreakpoint.es.js";
+import { ActionMenu as z } from "../ActionMenu/ActionMenu.es.js";
 /* empty css              */
 /* empty css                  */
 /* empty css                            */
-import { csx as g } from "../../utils/string.es.js";
-import { BREAKPOINTS as z } from "../../constants/breakpoint.es.js";
-import { CaretDown as $ } from "../Icon/IconComponents/CaretDown.es.js";
-const j = C(
+import { csx as v } from "../../utils/string.es.js";
+import { BREAKPOINTS as $ } from "../../constants/breakpoint.es.js";
+import { CaretDown as q } from "../Icon/IconComponents/CaretDown.es.js";
+const N = V(
   ({
     disabled: o,
     isOpen: r,
     onClick: a,
     isRounded: l,
-    selectedItem: s,
-    ariaLabel: c,
-    "data-testid": f
-  }, i) => /* @__PURE__ */ e.jsxs(
+    selectedItem: c,
+    ariaLabel: i,
+    "data-testid": h
+  }, s) => /* @__PURE__ */ m(
     "button",
     {
-      ref: i,
+      ref: s,
       type: "button",
       role: "combobox",
-      "aria-label": c,
+      "aria-label": i,
       "aria-expanded": r,
       "aria-autocomplete": "none",
       "data-state": r ? "open" : "closed",
-      "data-testid": f,
+      "data-testid": h,
       disabled: o,
       onClick: a,
-      className: g(
+      className: v(
         "proton-Select__trigger",
         "proton-Elevation--glass",
         o && "proton-Select__trigger--disabled",
@@ -41,65 +41,65 @@ const j = C(
         l && "proton-Select__trigger--rounded"
       ),
       children: [
-        /* @__PURE__ */ e.jsx("span", { className: "proton-Select__value", children: s ? s.label : "Select an option" }),
-        /* @__PURE__ */ e.jsx(
+        /* @__PURE__ */ t("span", { className: "proton-Select__value", children: c ? c.label : "Select an option" }),
+        /* @__PURE__ */ t(
           "span",
           {
-            className: g(
+            className: v(
               "proton-Select__trigger_icon",
               r && "proton-Select__trigger_icon--flipped"
             ),
-            children: /* @__PURE__ */ e.jsx($, { size: 16 })
+            children: /* @__PURE__ */ t(q, { size: 16 })
           }
         )
       ]
     }
   )
 );
-j.displayName = "ProtonUISelectButton";
-function q({
+N.displayName = "ProtonUISelectButton";
+function F({
   label: o,
   name: r,
   isDisabled: a,
   disabledKeys: l,
-  selectedKey: s,
-  onSelectionChange: c,
-  defaultSelectedKey: f,
-  onOpen: i,
-  onClose: h,
-  items: x,
-  isRounded: S = !1,
-  "data-testid": v
+  selectedKey: c,
+  onSelectionChange: i,
+  defaultSelectedKey: h,
+  onOpen: s,
+  onClose: _,
+  items: g,
+  isRounded: y = !1,
+  "data-testid": b
 }) {
-  const [_, u] = I(!1), m = s !== void 0, [M, N] = I(
-    f ?? ""
-  ), { className: R, style: T } = U(), w = V(z.MEDIUM), y = E(null), d = E(null), p = m ? s : M, b = x.find((t) => t.key === p), k = (t) => {
-    m || N(t), c == null || c(t), d.current && (d.current.value = t, d.current.dispatchEvent(
+  const [S, u] = M(!1), f = c !== void 0, [T, k] = M(
+    h ?? ""
+  ), { className: w, style: B } = j(), P = L($.MEDIUM), I = R(null), d = R(null), p = f ? c : T, x = g.find((e) => e.key === p), E = (e) => {
+    f || k(e), i == null || i(e), d.current && (d.current.value = e, d.current.dispatchEvent(
       new Event("change", { bubbles: !0 })
     ));
-  }, B = (t) => {
-    u(t), t ? i == null || i() : h == null || h();
+  }, A = (e) => {
+    u(e), e ? s == null || s() : _ == null || _();
   };
-  A(() => {
-    m && N(s);
-  }, [m]);
-  const P = x.map((t) => ({
-    key: t.key,
-    label: t.label,
-    to: t.to,
+  U(() => {
+    f && k(c);
+  }, [f]);
+  const C = g.map((e) => ({
+    key: e.key,
+    label: e.label,
+    to: e.to,
     onAction: () => {
-      k(t.key), u(!1);
+      E(e.key), u(!1);
     }
   }));
-  return w ? /* @__PURE__ */ e.jsxs(
+  return P ? /* @__PURE__ */ m(
     "div",
     {
       className: "proton-Select",
       "aria-label": o || r,
       "aria-disabled": a,
       children: [
-        o && /* @__PURE__ */ e.jsx("div", { className: "proton-Select__label", "data-testid": "select-label", children: o }),
-        /* @__PURE__ */ e.jsx(
+        o && /* @__PURE__ */ t("div", { className: "proton-Select__label", "data-testid": "select-label", children: o }),
+        /* @__PURE__ */ t(
           "input",
           {
             ref: d,
@@ -109,40 +109,40 @@ function q({
             "data-testid": "hidden-select-container"
           }
         ),
-        /* @__PURE__ */ e.jsx(
-          j,
+        /* @__PURE__ */ t(
+          N,
           {
-            isOpen: _,
-            isRounded: S,
-            ref: y,
+            isOpen: S,
+            isRounded: y,
+            ref: I,
             disabled: a,
             ariaLabel: o || r,
-            "data-testid": v,
+            "data-testid": b,
             onClick: () => u(!0),
-            selectedItem: b
+            selectedItem: x
           }
         ),
-        /* @__PURE__ */ e.jsx(
-          L,
+        /* @__PURE__ */ t(
+          z,
           {
-            isOpen: _,
+            isOpen: S,
             onClose: () => u(!1),
-            actions: P,
+            actions: C,
             selectedKeys: [p],
             disabledKeys: l
           }
         )
       ]
     }
-  ) : /* @__PURE__ */ e.jsxs(
+  ) : /* @__PURE__ */ m(
     "div",
     {
       className: "proton-Select",
       "aria-label": o || r,
       "aria-disabled": a,
       children: [
-        o && /* @__PURE__ */ e.jsx("div", { className: "proton-Select__label", "data-testid": "select-label", children: o }),
-        /* @__PURE__ */ e.jsx(
+        o && /* @__PURE__ */ t("div", { className: "proton-Select__label", "data-testid": "select-label", children: o }),
+        /* @__PURE__ */ t(
           "input",
           {
             ref: d,
@@ -152,46 +152,46 @@ function q({
             "data-testid": "hidden-select-container"
           }
         ),
-        /* @__PURE__ */ e.jsxs(
+        /* @__PURE__ */ m(
           n.Root,
           {
             value: p,
-            onValueChange: k,
-            onOpenChange: B,
+            onValueChange: E,
+            onOpenChange: A,
             disabled: a,
             children: [
-              /* @__PURE__ */ e.jsx(n.Trigger, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-                j,
+              /* @__PURE__ */ t(n.Trigger, { asChild: !0, children: /* @__PURE__ */ t(
+                N,
                 {
-                  isRounded: S,
-                  isOpen: _,
-                  ref: y,
+                  isRounded: y,
+                  isOpen: S,
+                  ref: I,
                   disabled: a,
                   ariaLabel: o || r,
-                  "data-testid": v,
-                  selectedItem: b
+                  "data-testid": b,
+                  selectedItem: x
                 }
               ) }),
-              /* @__PURE__ */ e.jsx(n.Portal, { children: /* @__PURE__ */ e.jsx(
+              /* @__PURE__ */ t(n.Portal, { children: /* @__PURE__ */ t(
                 n.Content,
                 {
-                  className: g(
+                  className: v(
                     "proton-Menu",
                     "proton-MenuTrigger__menu",
                     "proton-Elevation--glass",
-                    R
+                    w
                   ),
-                  style: T,
+                  style: B,
                   position: "popper",
-                  children: /* @__PURE__ */ e.jsx(n.Viewport, { children: x.map((t) => /* @__PURE__ */ e.jsx(
+                  children: /* @__PURE__ */ t(n.Viewport, { children: g.map((e) => /* @__PURE__ */ t(
                     n.Item,
                     {
-                      value: t.key,
-                      disabled: l == null ? void 0 : l.includes(t.key),
+                      value: e.key,
+                      disabled: l == null ? void 0 : l.includes(e.key),
                       className: "proton-Menu__item",
-                      children: /* @__PURE__ */ e.jsx(n.ItemText, { children: t.label })
+                      children: /* @__PURE__ */ t(n.ItemText, { children: e.label })
                     },
-                    t.key
+                    e.key
                   )) })
                 }
               ) })
@@ -202,8 +202,8 @@ function q({
     }
   );
 }
-q.displayName = "ProtonUISelect";
+F.displayName = "ProtonUISelect";
 export {
-  q as Select
+  F as Select
 };
 //# sourceMappingURL=Select.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Select.es.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type CSSProperties,\n} from \"react\";\nimport { Select as RadixSelect } from \"radix-ui\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\nimport { BREAKPOINTS } from \"../../constants\";\nimport { csx } from \"../../utils\";\n\nimport { ActionMenu, type ActionMenuAction } from \"../ActionMenu/ActionMenu\";\nimport { CaretDown as CaretDownIcon } from \"../Icon\";\n\nimport \"./Select.css\";\nimport \"../Menu/Menu.css\";\nimport \"../Elevation/Elevation.css\";\n\ninterface SelectButtonProps {\n  disabled?: boolean;\n  isOpen?: boolean;\n  selectedItem?: SelectItem;\n  onClick?: () => void;\n  isRounded?: boolean;\n  ariaLabel?: string;\n  \"data-testid\"?: string;\n}\n\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\n  (\n    {\n      disabled,\n      isOpen,\n      onClick,\n      isRounded,\n      selectedItem,\n      ariaLabel,\n      \"data-testid\": testId,\n    },\n    ref: ForwardedRef<HTMLButtonElement>,\n  ) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        role=\"combobox\"\n        aria-label={ariaLabel}\n        aria-expanded={isOpen}\n        aria-autocomplete=\"none\"\n        data-state={isOpen ? \"open\" : \"closed\"}\n        data-testid={testId}\n        disabled={disabled}\n        onClick={onClick}\n        className={csx(\n          \"proton-Select__trigger\",\n          \"proton-Elevation--glass\",\n          disabled && \"proton-Select__trigger--disabled\",\n          !isOpen && \"proton-Select__trigger--closed\",\n          isOpen && \"proton-Select__trigger--opened\",\n          isRounded && \"proton-Select__trigger--rounded\",\n        )}\n      >\n        <span className=\"proton-Select__value\">\n          {selectedItem ? selectedItem.label : \"Select an option\"}\n        </span>\n        <span\n          className={csx(\n            \"proton-Select__trigger_icon\",\n            isOpen && \"proton-Select__trigger_icon--flipped\",\n          )}\n        >\n          <CaretDownIcon size={16} />\n        </span>\n      </button>\n    );\n  },\n);\n\nSelectButton.displayName = \"ProtonUISelectButton\";\n\nexport interface SelectItem {\n  /** The label to display for the item */\n  label: string;\n\n  /** The key of the item */\n  key: string;\n\n  /** The URL to navigate to when the item is clicked, turns item into an a tag */\n  to?: string;\n}\n\nexport interface SelectProps {\n  /** Array of keys that should be disabled\n   * @example [\"Thing 1\", \"Thing 2\"]\n   */\n  disabledKeys?: string[];\n\n  /** The key of the default selected item */\n  defaultSelectedKey?: string;\n\n  /** Test ID for the select */\n  \"data-testid\"?: string;\n\n  /** Whether the select is disabled */\n  isDisabled?: boolean;\n\n  /** Array of items to display\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\n   * @see {@link SelectItem}\n   */\n  items: SelectItem[];\n\n  /** Whether the select button is rounded\n   * @default false\n   */\n  isRounded?: boolean;\n\n  /** Label to display above the select\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\n   */\n  label?: string;\n\n  /** The name of the select field */\n  name: string;\n\n  /** Callback fired when the menu closes */\n  onClose?: () => void;\n\n  /** Callback fired when the menu opens */\n  onOpen?: () => void;\n\n  /** Callback fired when selection changes */\n  onSelectionChange?: (key: string) => void;\n\n  /** Currently selected key */\n  selectedKey?: string;\n}\n\n/**\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile/touch devices.\n * Supports controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SelectProps}\n */\nexport function Select({\n  label,\n  name,\n  isDisabled,\n  disabledKeys,\n  selectedKey,\n  onSelectionChange,\n  defaultSelectedKey,\n  onOpen,\n  onClose,\n  items,\n  isRounded = false,\n  \"data-testid\": testId,\n}: SelectProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const isControlled = selectedKey !== undefined;\n  const [internalSelectedKey, setInternalSelectedKey] = useState(\n    defaultSelectedKey ?? \"\",\n  );\n  const { className: themeClass, style: themeStyle } = useTheme();\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const hiddenInputRef = useRef<HTMLInputElement>(null);\n\n  // Handle controlled vs uncontrolled state\n  const currentSelectedKey = isControlled\n    ? (selectedKey as string)\n    : internalSelectedKey;\n  const selectedItem = items.find((item) => item.key === currentSelectedKey);\n\n  const handleValueChange = (value: string) => {\n    if (!isControlled) {\n      setInternalSelectedKey(value);\n    }\n    onSelectionChange?.(value);\n\n    // Update hidden input for form submission\n    if (hiddenInputRef.current) {\n      hiddenInputRef.current.value = value;\n      hiddenInputRef.current.dispatchEvent(\n        new Event(\"change\", { bubbles: true }),\n      );\n    }\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    if (open) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  };\n\n  // Update internal state when controlled selectedKey changes\n  useEffect(() => {\n    if (isControlled) {\n      setInternalSelectedKey(selectedKey);\n    }\n  }, [isControlled]);\n\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\n    key: item.key,\n    label: item.label,\n    to: item.to,\n    onAction: () => {\n      handleValueChange(item.key);\n      setIsOpen(false);\n    },\n  }));\n\n  if (isMobile) {\n    return (\n      <div\n        className=\"proton-Select\"\n        aria-label={label || name}\n        aria-disabled={isDisabled}\n      >\n        {label && (\n          <div className=\"proton-Select__label\" data-testid=\"select-label\">\n            {label}\n          </div>\n        )}\n\n        {/* Hidden input for form submission */}\n        <input\n          ref={hiddenInputRef}\n          type=\"hidden\"\n          name={name}\n          value={currentSelectedKey}\n          data-testid=\"hidden-select-container\"\n        />\n\n        <SelectButton\n          isOpen={isOpen}\n          isRounded={isRounded}\n          ref={triggerRef}\n          disabled={isDisabled}\n          ariaLabel={label || name}\n          data-testid={testId}\n          onClick={() => setIsOpen(true)}\n          selectedItem={selectedItem}\n        />\n\n        <ActionMenu\n          isOpen={isOpen}\n          onClose={() => setIsOpen(false)}\n          actions={actionItems}\n          selectedKeys={[currentSelectedKey]}\n          disabledKeys={disabledKeys}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"proton-Select\"\n      aria-label={label || name}\n      aria-disabled={isDisabled}\n    >\n      {label && (\n        <div className=\"proton-Select__label\" data-testid=\"select-label\">\n          {label}\n        </div>\n      )}\n\n      {/* Hidden input for form submission */}\n      <input\n        ref={hiddenInputRef}\n        type=\"hidden\"\n        name={name}\n        value={currentSelectedKey}\n        data-testid=\"hidden-select-container\"\n      />\n\n      <RadixSelect.Root\n        value={currentSelectedKey}\n        onValueChange={handleValueChange}\n        onOpenChange={handleOpenChange}\n        disabled={isDisabled}\n      >\n        <RadixSelect.Trigger asChild>\n          <SelectButton\n            isRounded={isRounded}\n            isOpen={isOpen}\n            ref={triggerRef}\n            disabled={isDisabled}\n            ariaLabel={label || name}\n            data-testid={testId}\n            selectedItem={selectedItem}\n          />\n        </RadixSelect.Trigger>\n\n        <RadixSelect.Portal>\n          <RadixSelect.Content\n            className={csx(\n              \"proton-Menu\",\n              \"proton-MenuTrigger__menu\",\n              \"proton-Elevation--glass\",\n              themeClass,\n            )}\n            style={themeStyle as CSSProperties}\n            position=\"popper\"\n          >\n            <RadixSelect.Viewport>\n              {items.map((item) => (\n                <RadixSelect.Item\n                  key={item.key}\n                  value={item.key}\n                  disabled={disabledKeys?.includes(item.key)}\n                  className=\"proton-Menu__item\"\n                >\n                  <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                </RadixSelect.Item>\n              ))}\n            </RadixSelect.Viewport>\n          </RadixSelect.Content>\n        </RadixSelect.Portal>\n      </RadixSelect.Root>\n    </div>\n  );\n}\n\nSelect.displayName = \"ProtonUISelect\";\n"],"names":["SelectButton","forwardRef","disabled","isOpen","onClick","isRounded","selectedItem","ariaLabel","testId","ref","jsxs","csx","jsx","CaretDownIcon","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","setIsOpen","useState","isControlled","internalSelectedKey","setInternalSelectedKey","themeClass","themeStyle","useTheme","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","hiddenInputRef","currentSelectedKey","item","handleValueChange","value","handleOpenChange","open","useEffect","actionItems","ActionMenu","RadixSelect"],"mappings":"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"}
+{"version":3,"file":"Select.es.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ForwardedRef,\n  type CSSProperties,\n} from \"react\";\nimport { Select as RadixSelect } from \"radix-ui\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\nimport { BREAKPOINTS } from \"../../constants\";\nimport { csx } from \"../../utils\";\n\nimport { ActionMenu, type ActionMenuAction } from \"../ActionMenu/ActionMenu\";\nimport { CaretDown as CaretDownIcon } from \"../Icon\";\n\nimport \"./Select.css\";\nimport \"../Menu/Menu.css\";\nimport \"../Elevation/Elevation.css\";\n\ninterface SelectButtonProps {\n  disabled?: boolean;\n  isOpen?: boolean;\n  selectedItem?: SelectItem;\n  onClick?: () => void;\n  isRounded?: boolean;\n  ariaLabel?: string;\n  \"data-testid\"?: string;\n}\n\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\n  (\n    {\n      disabled,\n      isOpen,\n      onClick,\n      isRounded,\n      selectedItem,\n      ariaLabel,\n      \"data-testid\": testId,\n    },\n    ref: ForwardedRef<HTMLButtonElement>,\n  ) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        role=\"combobox\"\n        aria-label={ariaLabel}\n        aria-expanded={isOpen}\n        aria-autocomplete=\"none\"\n        data-state={isOpen ? \"open\" : \"closed\"}\n        data-testid={testId}\n        disabled={disabled}\n        onClick={onClick}\n        className={csx(\n          \"proton-Select__trigger\",\n          \"proton-Elevation--glass\",\n          disabled && \"proton-Select__trigger--disabled\",\n          !isOpen && \"proton-Select__trigger--closed\",\n          isOpen && \"proton-Select__trigger--opened\",\n          isRounded && \"proton-Select__trigger--rounded\",\n        )}\n      >\n        <span className=\"proton-Select__value\">\n          {selectedItem ? selectedItem.label : \"Select an option\"}\n        </span>\n        <span\n          className={csx(\n            \"proton-Select__trigger_icon\",\n            isOpen && \"proton-Select__trigger_icon--flipped\",\n          )}\n        >\n          <CaretDownIcon size={16} />\n        </span>\n      </button>\n    );\n  },\n);\n\nSelectButton.displayName = \"ProtonUISelectButton\";\n\nexport interface SelectItem {\n  /** The label to display for the item */\n  label: string;\n\n  /** The key of the item */\n  key: string;\n\n  /** The URL to navigate to when the item is clicked, turns item into an a tag */\n  to?: string;\n}\n\nexport interface SelectProps {\n  /** Array of keys that should be disabled\n   * @example [\"Thing 1\", \"Thing 2\"]\n   */\n  disabledKeys?: string[];\n\n  /** The key of the default selected item */\n  defaultSelectedKey?: string;\n\n  /** Test ID for the select */\n  \"data-testid\"?: string;\n\n  /** Whether the select is disabled */\n  isDisabled?: boolean;\n\n  /** Array of items to display\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\n   * @see {@link SelectItem}\n   */\n  items: SelectItem[];\n\n  /** Whether the select button is rounded\n   * @default false\n   */\n  isRounded?: boolean;\n\n  /** Label to display above the select\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\n   */\n  label?: string;\n\n  /** The name of the select field */\n  name: string;\n\n  /** Callback fired when the menu closes */\n  onClose?: () => void;\n\n  /** Callback fired when the menu opens */\n  onOpen?: () => void;\n\n  /** Callback fired when selection changes */\n  onSelectionChange?: (key: string) => void;\n\n  /** Currently selected key */\n  selectedKey?: string;\n}\n\n/**\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile/touch devices.\n * Supports controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SelectProps}\n */\nexport function Select({\n  label,\n  name,\n  isDisabled,\n  disabledKeys,\n  selectedKey,\n  onSelectionChange,\n  defaultSelectedKey,\n  onOpen,\n  onClose,\n  items,\n  isRounded = false,\n  \"data-testid\": testId,\n}: SelectProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const isControlled = selectedKey !== undefined;\n  const [internalSelectedKey, setInternalSelectedKey] = useState(\n    defaultSelectedKey ?? \"\",\n  );\n  const { className: themeClass, style: themeStyle } = useTheme();\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const hiddenInputRef = useRef<HTMLInputElement>(null);\n\n  // Handle controlled vs uncontrolled state\n  const currentSelectedKey = isControlled\n    ? (selectedKey as string)\n    : internalSelectedKey;\n  const selectedItem = items.find((item) => item.key === currentSelectedKey);\n\n  const handleValueChange = (value: string) => {\n    if (!isControlled) {\n      setInternalSelectedKey(value);\n    }\n    onSelectionChange?.(value);\n\n    // Update hidden input for form submission\n    if (hiddenInputRef.current) {\n      hiddenInputRef.current.value = value;\n      hiddenInputRef.current.dispatchEvent(\n        new Event(\"change\", { bubbles: true }),\n      );\n    }\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    setIsOpen(open);\n    if (open) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  };\n\n  // Update internal state when controlled selectedKey changes\n  useEffect(() => {\n    if (isControlled) {\n      setInternalSelectedKey(selectedKey);\n    }\n  }, [isControlled]);\n\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\n    key: item.key,\n    label: item.label,\n    to: item.to,\n    onAction: () => {\n      handleValueChange(item.key);\n      setIsOpen(false);\n    },\n  }));\n\n  if (isMobile) {\n    return (\n      <div\n        className=\"proton-Select\"\n        aria-label={label || name}\n        aria-disabled={isDisabled}\n      >\n        {label && (\n          <div className=\"proton-Select__label\" data-testid=\"select-label\">\n            {label}\n          </div>\n        )}\n\n        {/* Hidden input for form submission */}\n        <input\n          ref={hiddenInputRef}\n          type=\"hidden\"\n          name={name}\n          value={currentSelectedKey}\n          data-testid=\"hidden-select-container\"\n        />\n\n        <SelectButton\n          isOpen={isOpen}\n          isRounded={isRounded}\n          ref={triggerRef}\n          disabled={isDisabled}\n          ariaLabel={label || name}\n          data-testid={testId}\n          onClick={() => setIsOpen(true)}\n          selectedItem={selectedItem}\n        />\n\n        <ActionMenu\n          isOpen={isOpen}\n          onClose={() => setIsOpen(false)}\n          actions={actionItems}\n          selectedKeys={[currentSelectedKey]}\n          disabledKeys={disabledKeys}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"proton-Select\"\n      aria-label={label || name}\n      aria-disabled={isDisabled}\n    >\n      {label && (\n        <div className=\"proton-Select__label\" data-testid=\"select-label\">\n          {label}\n        </div>\n      )}\n\n      {/* Hidden input for form submission */}\n      <input\n        ref={hiddenInputRef}\n        type=\"hidden\"\n        name={name}\n        value={currentSelectedKey}\n        data-testid=\"hidden-select-container\"\n      />\n\n      <RadixSelect.Root\n        value={currentSelectedKey}\n        onValueChange={handleValueChange}\n        onOpenChange={handleOpenChange}\n        disabled={isDisabled}\n      >\n        <RadixSelect.Trigger asChild>\n          <SelectButton\n            isRounded={isRounded}\n            isOpen={isOpen}\n            ref={triggerRef}\n            disabled={isDisabled}\n            ariaLabel={label || name}\n            data-testid={testId}\n            selectedItem={selectedItem}\n          />\n        </RadixSelect.Trigger>\n\n        <RadixSelect.Portal>\n          <RadixSelect.Content\n            className={csx(\n              \"proton-Menu\",\n              \"proton-MenuTrigger__menu\",\n              \"proton-Elevation--glass\",\n              themeClass,\n            )}\n            style={themeStyle as CSSProperties}\n            position=\"popper\"\n          >\n            <RadixSelect.Viewport>\n              {items.map((item) => (\n                <RadixSelect.Item\n                  key={item.key}\n                  value={item.key}\n                  disabled={disabledKeys?.includes(item.key)}\n                  className=\"proton-Menu__item\"\n                >\n                  <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                </RadixSelect.Item>\n              ))}\n            </RadixSelect.Viewport>\n          </RadixSelect.Content>\n        </RadixSelect.Portal>\n      </RadixSelect.Root>\n    </div>\n  );\n}\n\nSelect.displayName = \"ProtonUISelect\";\n"],"names":["SelectButton","forwardRef","disabled","isOpen","onClick","isRounded","selectedItem","ariaLabel","testId","ref","jsxs","csx","jsx","CaretDownIcon","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","setIsOpen","useState","isControlled","internalSelectedKey","setInternalSelectedKey","themeClass","themeStyle","useTheme","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","hiddenInputRef","currentSelectedKey","item","handleValueChange","value","handleOpenChange","open","useEffect","actionItems","ActionMenu","RadixSelect"],"mappings":"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"}

package/dist/components/Switch/Switch.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../node_modules/react/jsx-runtime.cjs.js"),x=require("react"),S=require("radix-ui");;/* empty css                */const w=require("../../utils/string.cjs.js");function v({defaultOn:p,isOn:n,isDisabled:s,onChange:i,label:e,children:o,"data-testid":u}){const c=n!==void 0,[l,j]=x.useState(p||!1),r=c?!!n:l,d=x.useId(),m={type:"checkbox",role:"switch",checked:r,disabled:s,"aria-label":e||void 0,"aria-describedby":o?d:void 0,onChange:h=>{if(s)return;const a=h.target.checked;c||j(a),i==null||i(a)}};return t.jsxRuntimeExports.jsx("div",{className:w.csx("proton-Switch",s&&"proton-Switch--disabled",r&&"proton-Switch--on"),"data-on":r||void 0,"data-disabled":s||void 0,"data-testid":u||void 0,children:t.jsxRuntimeExports.jsxs("label",{className:"proton-Switch__control",children:[t.jsxRuntimeExports.jsx(S.VisuallyHidden.Root,{children:t.jsxRuntimeExports.jsx("input",{...m})}),e&&t.jsxRuntimeExports.jsx("span",{className:"proton-Switch__label",children:e}),t.jsxRuntimeExports.jsxs("div",{className:"proton-Switch__wrapper",children:[t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__toggle",children:t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__slider"})}),o&&t.jsxRuntimeExports.jsx("div",{id:d,className:"proton-Switch__description",children:o})]})]})})}exports.Switch=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),l=require("react"),v=require("radix-ui");;/* empty css                */const _=require("../../utils/string.cjs.js");function j({defaultOn:p,isOn:r,isDisabled:i,onChange:e,label:s,children:o,"data-testid":u}){const n=r!==void 0,[h,x]=l.useState(p||!1),c=n?!!r:h,d=l.useId(),S={type:"checkbox",role:"switch",checked:c,disabled:i,"aria-label":s||void 0,"aria-describedby":o?d:void 0,onChange:w=>{if(i)return;const a=w.target.checked;n||x(a),e==null||e(a)}};return t.jsx("div",{className:_.csx("proton-Switch",i&&"proton-Switch--disabled",c&&"proton-Switch--on"),"data-on":c||void 0,"data-disabled":i||void 0,"data-testid":u||void 0,children:t.jsxs("label",{className:"proton-Switch__control",children:[t.jsx(v.VisuallyHidden.Root,{children:t.jsx("input",{...S})}),s&&t.jsx("span",{className:"proton-Switch__label",children:s}),t.jsxs("div",{className:"proton-Switch__wrapper",children:[t.jsx("div",{className:"proton-Switch__toggle",children:t.jsx("div",{className:"proton-Switch__slider"})}),o&&t.jsx("div",{id:d,className:"proton-Switch__description",children:o})]})]})})}exports.Switch=j;
 //# sourceMappingURL=Switch.cjs.js.map

package/dist/components/Switch/Switch.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.cjs.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["\"use client\";\n\nimport { useId, useState, type ChangeEvent } from \"react\";\nimport { VisuallyHidden } from \"radix-ui\";\n\nimport { csx } from \"../../utils\";\n\nimport \"./Switch.css\";\n\nexport interface SwitchProps {\n  /**\n   * Whether the Switch is in the 'on' state (uncontrolled).\n   */\n  defaultOn?: boolean;\n  /**\n   * Whether the Switch is in the 'on' state. Providing this prop causes the\n   * component to become controlled.\n   */\n  isOn?: boolean;\n  /**\n   * Should the input be non-interactive?\n   */\n  isDisabled?: boolean;\n  /**\n   * Called when the Switch's on state changes.\n   */\n  onChange?: (isOn: boolean) => void;\n  /**\n   * The string used for the input label. Forwarded to `aria-label`.\n   */\n  label?: string;\n  /**\n   * The text or component to be rendered as the Switch's description.\n   */\n  children?: React.ReactNode;\n  /** The test ID for the switch. */\n  \"data-testid\"?: string;\n}\n\n/**\n * A toggle switch component for boolean state control with support for controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SwitchProps}\n */\nexport function Switch({\n  defaultOn,\n  isOn: controlledIsOn,\n  isDisabled,\n  onChange,\n  label,\n  children,\n  \"data-testid\": testId,\n}: SwitchProps) {\n  const isControlled = controlledIsOn !== undefined;\n  const [internalOn, setInternalOn] = useState(defaultOn || false);\n  const isOn = isControlled ? Boolean(controlledIsOn) : internalOn;\n  const descriptionId = useId();\n\n  const inputProps = {\n    type: \"checkbox\" as const,\n    role: \"switch\" as const,\n    checked: isOn,\n    disabled: isDisabled,\n    \"aria-label\": label || undefined,\n    \"aria-describedby\": children ? descriptionId : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (isDisabled) return;\n      const next = e.target.checked;\n      if (!isControlled) setInternalOn(next);\n      onChange?.(next);\n    },\n  };\n\n  return (\n    <div\n      className={csx(\n        \"proton-Switch\",\n        isDisabled && \"proton-Switch--disabled\",\n        isOn && \"proton-Switch--on\",\n      )}\n      data-on={isOn || undefined}\n      data-disabled={isDisabled || undefined}\n      data-testid={testId || undefined}\n    >\n      <label className=\"proton-Switch__control\">\n        <VisuallyHidden.Root>\n          <input {...inputProps} />\n        </VisuallyHidden.Root>\n        {label && <span className=\"proton-Switch__label\">{label}</span>}\n        <div className=\"proton-Switch__wrapper\">\n          <div className=\"proton-Switch__toggle\">\n            <div className=\"proton-Switch__slider\" />\n          </div>\n          {children && (\n            <div id={descriptionId} className=\"proton-Switch__description\">\n              {children}\n            </div>\n          )}\n        </div>\n      </label>\n    </div>\n  );\n}\n"],"names":["Switch","defaultOn","controlledIsOn","isDisabled","onChange","label","children","testId","isControlled","internalOn","setInternalOn","useState","isOn","descriptionId","useId","inputProps","e","next","jsx","csx","jsxs","VisuallyHidden"],"mappings":"oQA6CO,SAASA,EAAO,CACrB,UAAAC,EACA,KAAMC,EACN,WAAAC,EACA,SAAAC,EACA,MAAAC,EACA,SAAAC,EACA,cAAeC,CACjB,EAAgB,CACd,MAAMC,EAAeN,IAAmB,OAClC,CAACO,EAAYC,CAAa,EAAIC,EAAAA,SAASV,GAAa,EAAK,EACzDW,EAAOJ,EAAe,EAAQN,EAAkBO,EAChDI,EAAgBC,EAAAA,MAAA,EAEhBC,EAAa,CACjB,KAAM,WACN,KAAM,SACN,QAASH,EACT,SAAUT,EACV,aAAcE,GAAS,OACvB,mBAAoBC,EAAWO,EAAgB,OAC/C,SAAWG,GAAqC,CAC9C,GAAIb,EAAY,OAChB,MAAMc,EAAOD,EAAE,OAAO,QACjBR,GAAcE,EAAcO,CAAI,EACrCb,GAAA,MAAAA,EAAWa,EACb,CAAA,EAGF,OACEC,EAAAA,kBAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,IACT,gBACAhB,GAAc,0BACdS,GAAQ,mBAAA,EAEV,UAASA,GAAQ,OACjB,gBAAeT,GAAc,OAC7B,cAAaI,GAAU,OAEvB,SAAAa,EAAAA,kBAAAA,KAAC,QAAA,CAAM,UAAU,yBACf,SAAA,CAAAF,wBAACG,EAAAA,eAAe,KAAf,CACC,iCAAC,QAAA,CAAO,GAAGN,EAAY,EACzB,EACCV,GAASa,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,uBAAwB,SAAAb,EAAM,EACxDe,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,yBACb,SAAA,CAAAF,EAAAA,kBAAAA,IAAC,OAAI,UAAU,wBACb,iCAAC,MAAA,CAAI,UAAU,wBAAwB,CAAA,CACzC,EACCZ,GACCY,EAAAA,kBAAAA,IAAC,MAAA,CAAI,GAAIL,EAAe,UAAU,6BAC/B,SAAAP,CAAA,CACH,CAAA,CAAA,CAEJ,CAAA,CAAA,CACF,CAAA,CAAA,CAGN"}
+{"version":3,"file":"Switch.cjs.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["\"use client\";\n\nimport { useId, useState, type ChangeEvent } from \"react\";\nimport { VisuallyHidden } from \"radix-ui\";\n\nimport { csx } from \"../../utils\";\n\nimport \"./Switch.css\";\n\nexport interface SwitchProps {\n  /**\n   * Whether the Switch is in the 'on' state (uncontrolled).\n   */\n  defaultOn?: boolean;\n  /**\n   * Whether the Switch is in the 'on' state. Providing this prop causes the\n   * component to become controlled.\n   */\n  isOn?: boolean;\n  /**\n   * Should the input be non-interactive?\n   */\n  isDisabled?: boolean;\n  /**\n   * Called when the Switch's on state changes.\n   */\n  onChange?: (isOn: boolean) => void;\n  /**\n   * The string used for the input label. Forwarded to `aria-label`.\n   */\n  label?: string;\n  /**\n   * The text or component to be rendered as the Switch's description.\n   */\n  children?: React.ReactNode;\n  /** The test ID for the switch. */\n  \"data-testid\"?: string;\n}\n\n/**\n * A toggle switch component for boolean state control with support for controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SwitchProps}\n */\nexport function Switch({\n  defaultOn,\n  isOn: controlledIsOn,\n  isDisabled,\n  onChange,\n  label,\n  children,\n  \"data-testid\": testId,\n}: SwitchProps) {\n  const isControlled = controlledIsOn !== undefined;\n  const [internalOn, setInternalOn] = useState(defaultOn || false);\n  const isOn = isControlled ? Boolean(controlledIsOn) : internalOn;\n  const descriptionId = useId();\n\n  const inputProps = {\n    type: \"checkbox\" as const,\n    role: \"switch\" as const,\n    checked: isOn,\n    disabled: isDisabled,\n    \"aria-label\": label || undefined,\n    \"aria-describedby\": children ? descriptionId : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (isDisabled) return;\n      const next = e.target.checked;\n      if (!isControlled) setInternalOn(next);\n      onChange?.(next);\n    },\n  };\n\n  return (\n    <div\n      className={csx(\n        \"proton-Switch\",\n        isDisabled && \"proton-Switch--disabled\",\n        isOn && \"proton-Switch--on\",\n      )}\n      data-on={isOn || undefined}\n      data-disabled={isDisabled || undefined}\n      data-testid={testId || undefined}\n    >\n      <label className=\"proton-Switch__control\">\n        <VisuallyHidden.Root>\n          <input {...inputProps} />\n        </VisuallyHidden.Root>\n        {label && <span className=\"proton-Switch__label\">{label}</span>}\n        <div className=\"proton-Switch__wrapper\">\n          <div className=\"proton-Switch__toggle\">\n            <div className=\"proton-Switch__slider\" />\n          </div>\n          {children && (\n            <div id={descriptionId} className=\"proton-Switch__description\">\n              {children}\n            </div>\n          )}\n        </div>\n      </label>\n    </div>\n  );\n}\n"],"names":["Switch","defaultOn","controlledIsOn","isDisabled","onChange","label","children","testId","isControlled","internalOn","setInternalOn","useState","isOn","descriptionId","useId","inputProps","e","next","jsx","csx","jsxs","VisuallyHidden"],"mappings":"0OA6CO,SAASA,EAAO,CACrB,UAAAC,EACA,KAAMC,EACN,WAAAC,EACA,SAAAC,EACA,MAAAC,EACA,SAAAC,EACA,cAAeC,CACjB,EAAgB,CACd,MAAMC,EAAeN,IAAmB,OAClC,CAACO,EAAYC,CAAa,EAAIC,EAAAA,SAASV,GAAa,EAAK,EACzDW,EAAOJ,EAAe,EAAQN,EAAkBO,EAChDI,EAAgBC,EAAAA,MAAA,EAEhBC,EAAa,CACjB,KAAM,WACN,KAAM,SACN,QAASH,EACT,SAAUT,EACV,aAAcE,GAAS,OACvB,mBAAoBC,EAAWO,EAAgB,OAC/C,SAAWG,GAAqC,CAC9C,GAAIb,EAAY,OAChB,MAAMc,EAAOD,EAAE,OAAO,QACjBR,GAAcE,EAAcO,CAAI,EACrCb,GAAA,MAAAA,EAAWa,EACb,CAAA,EAGF,OACEC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,IACT,gBACAhB,GAAc,0BACdS,GAAQ,mBAAA,EAEV,UAASA,GAAQ,OACjB,gBAAeT,GAAc,OAC7B,cAAaI,GAAU,OAEvB,SAAAa,EAAAA,KAAC,QAAA,CAAM,UAAU,yBACf,SAAA,CAAAF,MAACG,EAAAA,eAAe,KAAf,CACC,eAAC,QAAA,CAAO,GAAGN,EAAY,EACzB,EACCV,GAASa,EAAAA,IAAC,OAAA,CAAK,UAAU,uBAAwB,SAAAb,EAAM,EACxDe,EAAAA,KAAC,MAAA,CAAI,UAAU,yBACb,SAAA,CAAAF,EAAAA,IAAC,OAAI,UAAU,wBACb,eAAC,MAAA,CAAI,UAAU,wBAAwB,CAAA,CACzC,EACCZ,GACCY,EAAAA,IAAC,MAAA,CAAI,GAAIL,EAAe,UAAU,6BAC/B,SAAAP,CAAA,CACH,CAAA,CAAA,CAEJ,CAAA,CAAA,CACF,CAAA,CAAA,CAGN"}

package/dist/components/Switch/Switch.es.js

@@ -1,53 +1,53 @@
-import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
-import { useState as _, useId as j } from "react";
-import { VisuallyHidden as v } from "radix-ui";
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import { useState as S, useId as f } from "react";
+import { VisuallyHidden as u } from "radix-ui";
 /* empty css              */
-import { csx as S } from "../../utils/string.es.js";
-function y({
-  defaultOn: p,
-  isOn: c,
+import { csx as N } from "../../utils/string.es.js";
+function j({
+  defaultOn: l,
+  isOn: s,
   isDisabled: o,
   onChange: i,
-  label: s,
-  children: r,
-  "data-testid": l
+  label: r,
+  children: c,
+  "data-testid": m
 }) {
-  const d = c !== void 0, [m, h] = _(p || !1), e = d ? !!c : m, n = j(), x = {
+  const d = s !== void 0, [h, w] = S(l || !1), e = d ? !!s : h, n = f(), _ = {
     type: "checkbox",
     role: "switch",
     checked: e,
     disabled: o,
-    "aria-label": s || void 0,
-    "aria-describedby": r ? n : void 0,
-    onChange: (w) => {
+    "aria-label": r || void 0,
+    "aria-describedby": c ? n : void 0,
+    onChange: (v) => {
       if (o) return;
-      const a = w.target.checked;
-      d || h(a), i == null || i(a);
+      const a = v.target.checked;
+      d || w(a), i == null || i(a);
     }
   };
-  return /* @__PURE__ */ t.jsx(
+  return /* @__PURE__ */ t(
     "div",
     {
-      className: S(
+      className: N(
         "proton-Switch",
         o && "proton-Switch--disabled",
         e && "proton-Switch--on"
       ),
       "data-on": e || void 0,
       "data-disabled": o || void 0,
-      "data-testid": l || void 0,
-      children: /* @__PURE__ */ t.jsxs("label", { className: "proton-Switch__control", children: [
-        /* @__PURE__ */ t.jsx(v.Root, { children: /* @__PURE__ */ t.jsx("input", { ...x }) }),
-        s && /* @__PURE__ */ t.jsx("span", { className: "proton-Switch__label", children: s }),
-        /* @__PURE__ */ t.jsxs("div", { className: "proton-Switch__wrapper", children: [
-          /* @__PURE__ */ t.jsx("div", { className: "proton-Switch__toggle", children: /* @__PURE__ */ t.jsx("div", { className: "proton-Switch__slider" }) }),
-          r && /* @__PURE__ */ t.jsx("div", { id: n, className: "proton-Switch__description", children: r })
+      "data-testid": m || void 0,
+      children: /* @__PURE__ */ p("label", { className: "proton-Switch__control", children: [
+        /* @__PURE__ */ t(u.Root, { children: /* @__PURE__ */ t("input", { ..._ }) }),
+        r && /* @__PURE__ */ t("span", { className: "proton-Switch__label", children: r }),
+        /* @__PURE__ */ p("div", { className: "proton-Switch__wrapper", children: [
+          /* @__PURE__ */ t("div", { className: "proton-Switch__toggle", children: /* @__PURE__ */ t("div", { className: "proton-Switch__slider" }) }),
+          c && /* @__PURE__ */ t("div", { id: n, className: "proton-Switch__description", children: c })
         ] })
       ] })
     }
   );
 }
 export {
-  y as Switch
+  j as Switch
 };
 //# sourceMappingURL=Switch.es.js.map

package/dist/components/Switch/Switch.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.es.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["\"use client\";\n\nimport { useId, useState, type ChangeEvent } from \"react\";\nimport { VisuallyHidden } from \"radix-ui\";\n\nimport { csx } from \"../../utils\";\n\nimport \"./Switch.css\";\n\nexport interface SwitchProps {\n  /**\n   * Whether the Switch is in the 'on' state (uncontrolled).\n   */\n  defaultOn?: boolean;\n  /**\n   * Whether the Switch is in the 'on' state. Providing this prop causes the\n   * component to become controlled.\n   */\n  isOn?: boolean;\n  /**\n   * Should the input be non-interactive?\n   */\n  isDisabled?: boolean;\n  /**\n   * Called when the Switch's on state changes.\n   */\n  onChange?: (isOn: boolean) => void;\n  /**\n   * The string used for the input label. Forwarded to `aria-label`.\n   */\n  label?: string;\n  /**\n   * The text or component to be rendered as the Switch's description.\n   */\n  children?: React.ReactNode;\n  /** The test ID for the switch. */\n  \"data-testid\"?: string;\n}\n\n/**\n * A toggle switch component for boolean state control with support for controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SwitchProps}\n */\nexport function Switch({\n  defaultOn,\n  isOn: controlledIsOn,\n  isDisabled,\n  onChange,\n  label,\n  children,\n  \"data-testid\": testId,\n}: SwitchProps) {\n  const isControlled = controlledIsOn !== undefined;\n  const [internalOn, setInternalOn] = useState(defaultOn || false);\n  const isOn = isControlled ? Boolean(controlledIsOn) : internalOn;\n  const descriptionId = useId();\n\n  const inputProps = {\n    type: \"checkbox\" as const,\n    role: \"switch\" as const,\n    checked: isOn,\n    disabled: isDisabled,\n    \"aria-label\": label || undefined,\n    \"aria-describedby\": children ? descriptionId : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (isDisabled) return;\n      const next = e.target.checked;\n      if (!isControlled) setInternalOn(next);\n      onChange?.(next);\n    },\n  };\n\n  return (\n    <div\n      className={csx(\n        \"proton-Switch\",\n        isDisabled && \"proton-Switch--disabled\",\n        isOn && \"proton-Switch--on\",\n      )}\n      data-on={isOn || undefined}\n      data-disabled={isDisabled || undefined}\n      data-testid={testId || undefined}\n    >\n      <label className=\"proton-Switch__control\">\n        <VisuallyHidden.Root>\n          <input {...inputProps} />\n        </VisuallyHidden.Root>\n        {label && <span className=\"proton-Switch__label\">{label}</span>}\n        <div className=\"proton-Switch__wrapper\">\n          <div className=\"proton-Switch__toggle\">\n            <div className=\"proton-Switch__slider\" />\n          </div>\n          {children && (\n            <div id={descriptionId} className=\"proton-Switch__description\">\n              {children}\n            </div>\n          )}\n        </div>\n      </label>\n    </div>\n  );\n}\n"],"names":["Switch","defaultOn","controlledIsOn","isDisabled","onChange","label","children","testId","isControlled","internalOn","setInternalOn","useState","isOn","descriptionId","useId","inputProps","e","next","jsx","csx","jsxs","VisuallyHidden"],"mappings":";;;;;AA6CO,SAASA,EAAO;AAAA,EACrB,WAAAC;AAAA,EACA,MAAMC;AAAA,EACN,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAeC;AACjB,GAAgB;AACd,QAAMC,IAAeN,MAAmB,QAClC,CAACO,GAAYC,CAAa,IAAIC,EAASV,KAAa,EAAK,GACzDW,IAAOJ,IAAe,EAAQN,IAAkBO,GAChDI,IAAgBC,EAAA,GAEhBC,IAAa;AAAA,IACjB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,SAASH;AAAA,IACT,UAAUT;AAAA,IACV,cAAcE,KAAS;AAAA,IACvB,oBAAoBC,IAAWO,IAAgB;AAAA,IAC/C,UAAU,CAACG,MAAqC;AAC9C,UAAIb,EAAY;AAChB,YAAMc,IAAOD,EAAE,OAAO;AACtB,MAAKR,KAAcE,EAAcO,CAAI,GACrCb,KAAA,QAAAA,EAAWa;AAAA,IACb;AAAA,EAAA;AAGF,SACEC,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAhB,KAAc;AAAA,QACdS,KAAQ;AAAA,MAAA;AAAA,MAEV,WAASA,KAAQ;AAAA,MACjB,iBAAeT,KAAc;AAAA,MAC7B,eAAaI,KAAU;AAAA,MAEvB,UAAAa,gBAAAA,EAAAA,KAAC,SAAA,EAAM,WAAU,0BACf,UAAA;AAAA,QAAAF,gBAAAA,MAACG,EAAe,MAAf,EACC,gCAAC,SAAA,EAAO,GAAGN,GAAY,GACzB;AAAA,QACCV,KAASa,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAU,wBAAwB,UAAAb,GAAM;AAAA,QACxDe,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,0BACb,UAAA;AAAA,UAAAF,gBAAAA,EAAAA,IAAC,SAAI,WAAU,yBACb,gCAAC,OAAA,EAAI,WAAU,yBAAwB,EAAA,CACzC;AAAA,UACCZ,KACCY,gBAAAA,EAAAA,IAAC,OAAA,EAAI,IAAIL,GAAe,WAAU,8BAC/B,UAAAP,EAAA,CACH;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"Switch.es.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["\"use client\";\n\nimport { useId, useState, type ChangeEvent } from \"react\";\nimport { VisuallyHidden } from \"radix-ui\";\n\nimport { csx } from \"../../utils\";\n\nimport \"./Switch.css\";\n\nexport interface SwitchProps {\n  /**\n   * Whether the Switch is in the 'on' state (uncontrolled).\n   */\n  defaultOn?: boolean;\n  /**\n   * Whether the Switch is in the 'on' state. Providing this prop causes the\n   * component to become controlled.\n   */\n  isOn?: boolean;\n  /**\n   * Should the input be non-interactive?\n   */\n  isDisabled?: boolean;\n  /**\n   * Called when the Switch's on state changes.\n   */\n  onChange?: (isOn: boolean) => void;\n  /**\n   * The string used for the input label. Forwarded to `aria-label`.\n   */\n  label?: string;\n  /**\n   * The text or component to be rendered as the Switch's description.\n   */\n  children?: React.ReactNode;\n  /** The test ID for the switch. */\n  \"data-testid\"?: string;\n}\n\n/**\n * A toggle switch component for boolean state control with support for controlled and uncontrolled modes.\n *\n * API:\n *  - {@link SwitchProps}\n */\nexport function Switch({\n  defaultOn,\n  isOn: controlledIsOn,\n  isDisabled,\n  onChange,\n  label,\n  children,\n  \"data-testid\": testId,\n}: SwitchProps) {\n  const isControlled = controlledIsOn !== undefined;\n  const [internalOn, setInternalOn] = useState(defaultOn || false);\n  const isOn = isControlled ? Boolean(controlledIsOn) : internalOn;\n  const descriptionId = useId();\n\n  const inputProps = {\n    type: \"checkbox\" as const,\n    role: \"switch\" as const,\n    checked: isOn,\n    disabled: isDisabled,\n    \"aria-label\": label || undefined,\n    \"aria-describedby\": children ? descriptionId : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (isDisabled) return;\n      const next = e.target.checked;\n      if (!isControlled) setInternalOn(next);\n      onChange?.(next);\n    },\n  };\n\n  return (\n    <div\n      className={csx(\n        \"proton-Switch\",\n        isDisabled && \"proton-Switch--disabled\",\n        isOn && \"proton-Switch--on\",\n      )}\n      data-on={isOn || undefined}\n      data-disabled={isDisabled || undefined}\n      data-testid={testId || undefined}\n    >\n      <label className=\"proton-Switch__control\">\n        <VisuallyHidden.Root>\n          <input {...inputProps} />\n        </VisuallyHidden.Root>\n        {label && <span className=\"proton-Switch__label\">{label}</span>}\n        <div className=\"proton-Switch__wrapper\">\n          <div className=\"proton-Switch__toggle\">\n            <div className=\"proton-Switch__slider\" />\n          </div>\n          {children && (\n            <div id={descriptionId} className=\"proton-Switch__description\">\n              {children}\n            </div>\n          )}\n        </div>\n      </label>\n    </div>\n  );\n}\n"],"names":["Switch","defaultOn","controlledIsOn","isDisabled","onChange","label","children","testId","isControlled","internalOn","setInternalOn","useState","isOn","descriptionId","useId","inputProps","e","next","jsx","csx","jsxs","VisuallyHidden"],"mappings":";;;;;AA6CO,SAASA,EAAO;AAAA,EACrB,WAAAC;AAAA,EACA,MAAMC;AAAA,EACN,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAeC;AACjB,GAAgB;AACd,QAAMC,IAAeN,MAAmB,QAClC,CAACO,GAAYC,CAAa,IAAIC,EAASV,KAAa,EAAK,GACzDW,IAAOJ,IAAe,EAAQN,IAAkBO,GAChDI,IAAgBC,EAAA,GAEhBC,IAAa;AAAA,IACjB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,SAASH;AAAA,IACT,UAAUT;AAAA,IACV,cAAcE,KAAS;AAAA,IACvB,oBAAoBC,IAAWO,IAAgB;AAAA,IAC/C,UAAU,CAACG,MAAqC;AAC9C,UAAIb,EAAY;AAChB,YAAMc,IAAOD,EAAE,OAAO;AACtB,MAAKR,KAAcE,EAAcO,CAAI,GACrCb,KAAA,QAAAA,EAAWa;AAAA,IACb;AAAA,EAAA;AAGF,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAhB,KAAc;AAAA,QACdS,KAAQ;AAAA,MAAA;AAAA,MAEV,WAASA,KAAQ;AAAA,MACjB,iBAAeT,KAAc;AAAA,MAC7B,eAAaI,KAAU;AAAA,MAEvB,UAAA,gBAAAa,EAAC,SAAA,EAAM,WAAU,0BACf,UAAA;AAAA,QAAA,gBAAAF,EAACG,EAAe,MAAf,EACC,4BAAC,SAAA,EAAO,GAAGN,GAAY,GACzB;AAAA,QACCV,KAAS,gBAAAa,EAAC,QAAA,EAAK,WAAU,wBAAwB,UAAAb,GAAM;AAAA,QACxD,gBAAAe,EAAC,OAAA,EAAI,WAAU,0BACb,UAAA;AAAA,UAAA,gBAAAF,EAAC,SAAI,WAAU,yBACb,4BAAC,OAAA,EAAI,WAAU,yBAAwB,EAAA,CACzC;AAAA,UACCZ,KACC,gBAAAY,EAAC,OAAA,EAAI,IAAIL,GAAe,WAAU,8BAC/B,UAAAP,EAAA,CACH;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Table/BaseTable/Collection/collectionParser.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),a=require("./CompoundComponents.cjs.js"),p=(t,l)=>t.type===l,h=(t,l)=>{const r=[],d=s.Children.toArray(t);for(const e of d)if(s.isValidElement(e)&&p(e,a.TableColumnCompound)){const o=e.props;r.push({key:o.id,header:o.children,isHidden:l,ariaSort:o["aria-sort"]})}return r},C=(t,l)=>{var o;const r=[],d=s.Children.toArray(t);let e=0;for(const i of d)if(s.isValidElement(i)&&p(i,a.TableCellCompound)){const n=i.props,c=n.columnKey??((o=l[e])==null?void 0:o.key);c&&r.push({columnKey:c,value:n.children,colSpan:n.colSpan,dataTestId:n["data-testid"],textAlign:n.textAlign}),e++}return r},m=t=>{const l=[],r=[],d=s.Children.toArray(t);for(const e of d)if(s.isValidElement(e)){if(p(e,a.TableHeaderCompound)){const o=e.props,i=h(o.children,o.isHidden||!1);l.push(...i);continue}if(p(e,a.TableBodyCompound)){const o=e.props,i=s.Children.toArray(o.children);for(const n of i)if(s.isValidElement(n))if(p(n,a.TableRowCompound)){const c=n.props,u=C(c.children,l);r.push({key:n.key??c.key??String(r.length),cells:u,onClick:c.onClick,dataTestId:c["data-testid"]})}else r.push(n)}}return{columns:l,rows:r}};exports.parseTableChildren=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),a=require("./CompoundComponents.cjs.js"),p=(t,l)=>t.type===l,h=(t,l)=>{const r=[],d=s.Children.toArray(t);for(const o of d)if(s.isValidElement(o)&&p(o,a.TableColumnCompound)){const e=o.props;r.push({key:e.id,header:e.children,isHidden:l,ariaSort:e["aria-sort"]})}return r},C=(t,l)=>{var e;const r=[],d=s.Children.toArray(t);let o=0;for(const i of d)if(s.isValidElement(i)&&p(i,a.TableCellCompound)){const n=i.props,c=n.columnKey??((e=l[o])==null?void 0:e.key);c&&r.push({columnKey:c,value:n.children,colSpan:n.colSpan,dataTestId:n["data-testid"],textAlign:n.textAlign}),o++}return r},m=t=>{const l=[],r=[],d=s.Children.toArray(t);for(const o of d)if(s.isValidElement(o)){if(p(o,a.TableHeaderCompound)){const e=o.props,i=h(e.children,e.isHidden||!1);l.push(...i);continue}if(p(o,a.TableBodyCompound)){const e=o.props,i=s.Children.toArray(e.children);for(const n of i)if(s.isValidElement(n))if(p(n,a.TableRowCompound)){const c=n.props,u=C(c.children,l);r.push({key:n.key??c.key??String(r.length),cells:u,onClick:c.onClick,dataTestId:c["data-testid"]})}else r.push(n)}}return{columns:l,rows:r}};exports.parseTableChildren=m;
 //# sourceMappingURL=collectionParser.cjs.js.map

package/dist/components/Table/BaseTable/Collection/useTableCollection.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),i=(e,l=!1)=>e+(l?1:2),r=e=>e+1,m=e=>!t.isValidElement(e)&&typeof e=="object"&&"cells"in e,w=e=>{var c;const l=e.rows.filter(m),s=e.rows.filter(t.isValidElement),o=((c=e.columns[0])==null?void 0:c.isHidden)||!1,a=(s.length>0?s.length:l.length)+(o?0:1),u=t.useMemo(()=>n=>i(n,o),[o]),d=t.useMemo(()=>n=>r(n),[]);return{columns:e.columns,rows:e.rows,isHeaderHidden:o,getTotalRowCount:a,getRowAriaIndex:u,getColumnAriaIndex:d}};exports.calculateAriaColumnIndex=r;exports.calculateAriaRowIndex=i;exports.useTableCollection=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),i=(e,l=!1)=>e+(l?1:2),a=e=>e+1,m=e=>!t.isValidElement(e)&&typeof e=="object"&&"cells"in e,w=e=>{var c;const l=e.rows.filter(m),s=e.rows.filter(t.isValidElement),o=((c=e.columns[0])==null?void 0:c.isHidden)||!1,r=(s.length>0?s.length:l.length)+(o?0:1),u=t.useMemo(()=>n=>i(n,o),[o]),d=t.useMemo(()=>n=>a(n),[]);return{columns:e.columns,rows:e.rows,isHeaderHidden:o,getTotalRowCount:r,getRowAriaIndex:u,getColumnAriaIndex:d}};exports.calculateAriaColumnIndex=a;exports.calculateAriaRowIndex=i;exports.useTableCollection=w;
 //# sourceMappingURL=useTableCollection.cjs.js.map

package/dist/components/Table/BaseTable/Table.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../node_modules/react/jsx-runtime.cjs.js"),x=require("react"),m=require("./Collection/collectionParser.cjs.js"),r=require("./Collection/CompoundComponents.cjs.js"),C=require("./Collection/useTableCollection.cjs.js"),p=require("./elements/TableRoot.cjs.js"),R=require("./elements/TableHeader.cjs.js"),j=require("./elements/TableHeaderRow.cjs.js"),q=require("./elements/TableHeaderCell.cjs.js"),y=require("./elements/TableBody.cjs.js"),H=require("./elements/TableRow.cjs.js"),I=require("./elements/TableCell.cjs.js");;/* empty css               */const i=({children:d,name:u})=>{const c=m.parseTableChildren(d),o=C.useTableCollection(c);return t.jsxRuntimeExports.jsxs(p.TableRoot,{name:u,rowCount:o.getTotalRowCount,colCount:o.columns.length,children:[t.jsxRuntimeExports.jsx(R.TableHeader,{isHidden:o.isHeaderHidden,children:t.jsxRuntimeExports.jsx(j.TableHeaderRow,{children:o.columns.map((n,l)=>t.jsxRuntimeExports.jsx(q.TableHeaderCell,{colIndex:o.getColumnAriaIndex(l),ariaSort:n.ariaSort,children:n.header},n.key))})}),t.jsxRuntimeExports.jsx(y.TableBody,{children:o.rows.map((n,l)=>{if(x.isValidElement(n))return n;const a=n;return t.jsxRuntimeExports.jsx(H.TableRow,{ariaRowIndex:o.getRowAriaIndex(l),onClick:a.onClick,dataTestId:a.dataTestId,children:o.columns.map((s,T)=>{const e=a.cells.find(b=>b.columnKey===s.key);return t.jsxRuntimeExports.jsx(I.TableCell,{columnIndex:o.getColumnAriaIndex(T),columnSpan:e==null?void 0:e.colSpan,dataTestId:e==null?void 0:e.dataTestId,textAlign:e==null?void 0:e.textAlign,children:(e==null?void 0:e.value)??""},s.key)})},a.key)})})]})};i.displayName="ProtonUITable";const g=Object.assign(i,{Header:r.TableHeaderCompound,Column:r.TableColumnCompound,Body:r.TableBodyCompound,Row:r.TableRowCompound,Cell:r.TableCellCompound});exports.Table=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),C=require("react"),m=require("./Collection/collectionParser.cjs.js"),r=require("./Collection/CompoundComponents.cjs.js"),p=require("./Collection/useTableCollection.cjs.js"),x=require("./elements/TableRoot.cjs.js"),R=require("./elements/TableHeader.cjs.js"),q=require("./elements/TableHeaderRow.cjs.js"),y=require("./elements/TableHeaderCell.cjs.js"),H=require("./elements/TableBody.cjs.js"),I=require("./elements/TableRow.cjs.js"),g=require("./elements/TableCell.cjs.js");;/* empty css               */const i=({children:s,name:u})=>{const c=m.parseTableChildren(s),o=p.useTableCollection(c);return a.jsxs(x.TableRoot,{name:u,rowCount:o.getTotalRowCount,colCount:o.columns.length,children:[a.jsx(R.TableHeader,{isHidden:o.isHeaderHidden,children:a.jsx(q.TableHeaderRow,{children:o.columns.map((n,t)=>a.jsx(y.TableHeaderCell,{colIndex:o.getColumnAriaIndex(t),ariaSort:n.ariaSort,children:n.header},n.key))})}),a.jsx(H.TableBody,{children:o.rows.map((n,t)=>{if(C.isValidElement(n))return n;const l=n;return a.jsx(I.TableRow,{ariaRowIndex:o.getRowAriaIndex(t),onClick:l.onClick,dataTestId:l.dataTestId,children:o.columns.map((d,T)=>{const e=l.cells.find(b=>b.columnKey===d.key);return a.jsx(g.TableCell,{columnIndex:o.getColumnAriaIndex(T),columnSpan:e==null?void 0:e.colSpan,dataTestId:e==null?void 0:e.dataTestId,textAlign:e==null?void 0:e.textAlign,children:(e==null?void 0:e.value)??""},d.key)})},l.key)})})]})};i.displayName="ProtonUITable";const h=Object.assign(i,{Header:r.TableHeaderCompound,Column:r.TableColumnCompound,Body:r.TableBodyCompound,Row:r.TableRowCompound,Cell:r.TableCellCompound});exports.Table=h;
 //# sourceMappingURL=Table.cjs.js.map