@protonradio/proton-ui 0.11.10 → 0.11.11

package/dist/components/ActionMenu/ActionMenu.es.js

@@ -0,0 +1,277 @@
+import { j as e } from "../../node_modules/react/jsx-runtime.es.js";
+import { useState as $, useRef as b, useEffect as F, createElement as I } from "react";
+import { useIsClosing as z } from "../../hooks/useIsClosing.es.js";
+import { useLockBodyScroll as L } from "../../hooks/useLockBodyScroll.es.js";
+import { Button as T } from "../Button/Button.es.js";
+import { ScreenOverlay as q } from "../ScreenOverlay/ScreenOverlay.es.js";
+import { DropdownMenu as i } from "radix-ui";
+import { Icon as H } from "../Icon/Icon.es.js";
+/* empty css                  */
+import { isUrlExternal as U, handleInternalNavigation as V } from "../../utils/navigation.es.js";
+const on = ({
+  isOpen: n,
+  actions: s = [],
+  children: o,
+  showCancel: l = !0,
+  cancelButtonText: x = "Cancel",
+  selectionMode: m = "single",
+  selectedKeys: u,
+  disabledKeys: f = [],
+  onSelectionChange: p,
+  onClose: k,
+  title: h,
+  "data-testid": r
+}) => {
+  var E;
+  L(n);
+  const [a, c] = $(0), [t, d] = $([]), [g, C] = $({
+    title: h,
+    actions: s,
+    key: null,
+    previousKey: null
+  }), M = b(null), D = b(null), S = b(null), { isClosing: v, handleClose: N } = z({ onClose: k, overlayRef: S }), y = g.actions || [], R = y && y.length > 0, w = o || R || l, B = t.length > 0;
+  function G(j) {
+    const _ = y.find((A) => A.key === j);
+    if (!_) {
+      console.error(`Action with key ${j} not found`);
+      return;
+    }
+    d((A) => [
+      ...A,
+      g
+    ]), C((A) => ({
+      title: _.label,
+      actions: _.children,
+      key: _.key,
+      previousKey: A.key
+    }));
+  }
+  function P() {
+    if (t.length > 0) {
+      const j = t[t.length - 1];
+      C(j), d(t.slice(0, -1));
+    }
+  }
+  return F(() => {
+    n && requestAnimationFrame(() => {
+      M.current && c(M.current.scrollHeight + 12);
+    });
+  }, [n, t, w]), F(() => {
+    (!n || v) && c(0);
+  }, [n, v]), !n && !v ? null : /* @__PURE__ */ e.jsx(q, { fadeIn: !0, ref: S, children: /* @__PURE__ */ e.jsxs(
+    i.Root,
+    {
+      modal: !0,
+      open: n,
+      onOpenChange: (j) => {
+        j || N();
+      },
+      children: [
+        /* @__PURE__ */ e.jsx(i.Trigger, { asChild: !0, children: /* @__PURE__ */ e.jsx("div", { children: "" }) }),
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "proton-ActionMenu__background-wrapper",
+            style: { opacity: v ? 0 : 1 },
+            children: /* @__PURE__ */ e.jsx(
+              "div",
+              {
+                "data-testid": r || "ActionMenu-wrapper",
+                className: "proton-ActionMenu__wrapper",
+                children: /* @__PURE__ */ e.jsx(
+                  "div",
+                  {
+                    className: "proton-ActionMenu__card",
+                    "data-testid": "ActionMenu-content",
+                    style: { height: `${a}px` },
+                    children: /* @__PURE__ */ e.jsx("div", { ref: D, className: "proton-ActionMenu__menu", children: /* @__PURE__ */ e.jsx(i.Content, { loop: !0, sideOffset: 8, ref: M, children: w && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                      o && /* @__PURE__ */ e.jsx("div", { className: "proton-ActionMenu__content", children: typeof o == "function" ? o({ close: N }) : o }),
+                      R && /* @__PURE__ */ e.jsx(
+                        W,
+                        {
+                          actions: y,
+                          selectionMode: m,
+                          selectedKeys: u,
+                          onSelectionChange: p,
+                          disabledKeys: f,
+                          handleSubmenuOpen: G,
+                          title: g.title,
+                          isInSubmenu: B,
+                          handleBack: P,
+                          previousMenuTitle: (E = t[t.length - 1]) == null ? void 0 : E.title
+                        }
+                      ),
+                      l && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                        /* @__PURE__ */ e.jsx(i.Separator, {}),
+                        /* @__PURE__ */ e.jsx(i.Item, { className: "proton-ActionMenu__cancel-button", children: /* @__PURE__ */ e.jsx(
+                          T,
+                          {
+                            "data-testid": "ActionMenuItem-cancel",
+                            onPress: N,
+                            fullWidth: !0,
+                            variant: "secondary",
+                            children: x
+                          }
+                        ) })
+                      ] })
+                    ] }) }) })
+                  }
+                )
+              }
+            )
+          }
+        )
+      ]
+    }
+  ) });
+}, W = ({
+  actions: n,
+  selectionMode: s,
+  selectedKeys: o = [],
+  onSelectionChange: l,
+  disabledKeys: x = [],
+  handleSubmenuOpen: m,
+  title: u,
+  isInSubmenu: f = !1,
+  handleBack: p,
+  previousMenuTitle: k
+}) => {
+  const h = () => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    f && p && /* @__PURE__ */ e.jsxs("div", { className: "proton-ActionMenu__back-button-container", children: [
+      /* @__PURE__ */ e.jsx(
+        i.Item,
+        {
+          className: "proton-ActionMenu__back-button",
+          onSelect: (r) => {
+            r.preventDefault(), p();
+          },
+          "aria-label": `Go back to ${k || "previous menu"}`,
+          children: /* @__PURE__ */ e.jsx(H, { id: "chevron-left", size: 16, "aria-hidden": "true" })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        "div",
+        {
+          className: "proton-ActionMenu__title",
+          role: "banner",
+          "aria-label": f ? `Submenu: ${u}` : `Menu: ${u}`,
+          children: /* @__PURE__ */ e.jsx("span", { children: u })
+        }
+      ),
+      /* @__PURE__ */ e.jsx(i.Separator, {})
+    ] }),
+    n.map((r, a) => {
+      var t;
+      const c = n[a];
+      return /* @__PURE__ */ e.jsx(
+        J,
+        {
+          item: r,
+          isSubmenu: !!((t = c.children) != null && t.length),
+          selectionMode: s,
+          onSelectionChange: l,
+          selectedKeys: o,
+          disabledKeys: x,
+          handleSubmenuOpen: m
+        },
+        r.key
+      );
+    })
+  ] });
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      "aria-disabled": s === "none",
+      className: "proton-ActionMenu__list",
+      role: "menu",
+      "aria-label": u ? `${f ? "Submenu" : "Menu"}: ${u}` : "Action menu",
+      "aria-orientation": "vertical",
+      children: s === "single" ? /* @__PURE__ */ e.jsx(
+        i.RadioGroup,
+        {
+          value: (o == null ? void 0 : o[0]) || "",
+          onValueChange: (r) => {
+            var c;
+            const a = n.find((t) => t.key === r);
+            (c = a == null ? void 0 : a.children) != null && c.length || l && l(/* @__PURE__ */ new Set([r]));
+          },
+          children: /* @__PURE__ */ e.jsx(h, {})
+        }
+      ) : /* @__PURE__ */ e.jsx(i.Group, { children: /* @__PURE__ */ e.jsx(h, {}) })
+    }
+  );
+}, J = ({
+  item: n,
+  isSubmenu: s,
+  selectionMode: o,
+  onSelectionChange: l,
+  selectedKeys: x = [],
+  disabledKeys: m = [],
+  handleSubmenuOpen: u
+}) => {
+  const f = b(null), p = n.to && U(n.to), k = m.includes(n.key), h = x.includes(n.key), r = {
+    className: "proton-ActionMenu__item",
+    "aria-label": n.label ? `${n.label}${n.description ? `, ${n.description}` : ""}` : `ActionMenu-Item-${n.key}`,
+    role: "menuitem",
+    disabled: k,
+    ref: f
+  }, a = (t) => {
+    var d;
+    if ((d = n == null ? void 0 : n.children) != null && d.length) {
+      t.preventDefault(), u(n.key);
+      return;
+    }
+    n.onAction && n.onAction(n.key);
+  }, c = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "proton-ActionMenu__item-content", children: [
+      /* @__PURE__ */ e.jsx("div", { className: "proton-ActionMenu__item-label", children: n.label }),
+      n.description && /* @__PURE__ */ e.jsx("div", { className: "proton-ActionMenu__description", children: n.description })
+    ] }),
+    s && /* @__PURE__ */ e.jsx(H, { id: "chevron-right", size: 16, "aria-hidden": "true" })
+  ] });
+  return n.to ? /* @__PURE__ */ I(i.Item, { ...r, key: n.key, asChild: !0 }, /* @__PURE__ */ e.jsx(
+    "a",
+    {
+      "aria-label": n.label ? `${n.label}${n.description ? `, ${n.description}` : ""}` : `ActionMenu-Item-${n.key}`,
+      "aria-disabled": k,
+      "aria-checked": h,
+      "aria-expanded": s ? !1 : void 0,
+      href: n.to,
+      target: p ? "_blank" : void 0,
+      rel: p ? "noopener noreferrer" : void 0,
+      onClick: (t) => {
+        p || !n.to || V(t, n.to);
+      },
+      children: c
+    }
+  )) : o === "multiple" ? /* @__PURE__ */ I(
+    i.CheckboxItem,
+    {
+      ...r,
+      key: n.key,
+      checked: h,
+      onSelect: a,
+      onCheckedChange: (t) => {
+        if (!l) return;
+        const d = new Set(x);
+        t ? d.add(n.key) : d.delete(n.key), l(d);
+      }
+    },
+    c
+  ) : /* @__PURE__ */ I(
+    i.RadioItem,
+    {
+      ...r,
+      value: n.key,
+      key: n.key,
+      "aria-checked": h,
+      "aria-expanded": s ? !1 : void 0,
+      onSelect: a
+    },
+    c
+  );
+};
+export {
+  on as ActionMenu
+};
+//# sourceMappingURL=ActionMenu.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ActionMenu.es.js","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode, useEffect, useRef, useState } from \"react\";\r\nimport type { Selection } from \"@react-types/shared\";\r\n\r\nimport { useIsClosing } from \"../../hooks/useIsClosing\";\r\nimport { useLockBodyScroll } from \"../../hooks/useLockBodyScroll\";\r\nimport { handleInternalNavigation, isUrlExternal } from \"../../utils\";\r\n\r\nimport { Button } from \"../Button/Button\";\r\nimport { ScreenOverlay } from \"../ScreenOverlay/ScreenOverlay\";\r\nimport { DropdownMenu } from \"radix-ui\";\r\nimport { Icon } from \"../Icon/Icon\";\r\n\r\nimport \"./ActionMenu.css\";\r\n\r\nexport interface ActionMenuAction {\r\n  key: string;\r\n  label?: ReactNode;\r\n  description?: ReactNode;\r\n  to?: string;\r\n  onAction?: (key: string) => void;\r\n  children?: ActionMenuAction[];\r\n}\r\n\r\nexport type ActionMenuSelectionMode = \"single\" | \"multiple\" | \"none\";\r\n\r\nexport interface ActionMenuProps {\r\n  /** The actions of the menu\r\n   * - type {@link ActionMenuAction}[]\r\n   */\r\n  actions?: ActionMenuAction[];\r\n\r\n  /** The text of the cancel button */\r\n  cancelButtonText?: string;\r\n\r\n  /** The children of the menu */\r\n  children?: ReactNode | ((props: { close: () => void }) => ReactNode);\r\n\r\n  /** The test id of the menu */\r\n  \"data-testid\"?: string;\r\n\r\n  /** The keys of the disabled items\r\n   * @default []\r\n   */\r\n  disabledKeys?: string[];\r\n\r\n  /** Whether the menu is open\r\n   * @default false\r\n   */\r\n  isOpen: boolean;\r\n\r\n  /** The callback function to close the menu */\r\n  onClose?: () => void;\r\n\r\n  /** The callback function to change the selection\r\n   * - type {@link Selection}\r\n   */\r\n  onSelectionChange?: (keys: Selection) => void;\r\n\r\n  /** The selection mode of the menu\r\n   * @default \"single\"\r\n   */\r\n  selectionMode?: ActionMenuSelectionMode;\r\n\r\n  /** The keys of the selected items */\r\n  selectedKeys?: string[];\r\n\r\n  /** Whether to show the cancel button */\r\n  showCancel?: boolean;\r\n\r\n  /** The title of the menu */\r\n  title?: string;\r\n}\r\n\r\ntype ActionStack = {\r\n  title: ReactNode | null;\r\n  actions: ActionMenuAction[];\r\n  key: string | null;\r\n  previousKey: string | null;\r\n};\r\n\r\n/**\r\n * A controlled ActionMenu to display a menu of actions.\r\n * Renders a list of actions as a focusable menu, or non-focusable children.\r\n *\r\n * API:\r\n *  - {@link ActionMenuProps}\r\n */\r\nexport const ActionMenu = ({\r\n  isOpen,\r\n  actions = [],\r\n  children,\r\n  showCancel = true,\r\n  cancelButtonText = \"Cancel\",\r\n  selectionMode = \"single\",\r\n  selectedKeys,\r\n  disabledKeys = [],\r\n  onSelectionChange,\r\n  onClose,\r\n  title,\r\n  \"data-testid\": testId,\r\n}: ActionMenuProps) => {\r\n  useLockBodyScroll(isOpen);\r\n  const [contentHeight, setContentHeight] = useState<number>(0);\r\n  const [stackHistory, setStackHistory] = useState<ActionStack[]>([]);\r\n  const [currentActionStack, setCurrentActionStack] = useState<ActionStack>({\r\n    title,\r\n    actions,\r\n    key: null,\r\n    previousKey: null,\r\n  });\r\n  const contentRef = useRef<HTMLDivElement>(null);\r\n  const menuRef = useRef<HTMLDivElement>(null);\r\n  const overlayRef = useRef<HTMLDivElement>(null);\r\n  const { isClosing, handleClose } = useIsClosing({ onClose, overlayRef });\r\n\r\n  const currentActions = currentActionStack.actions || [];\r\n  const hasActions = currentActions && currentActions.length > 0;\r\n  const hasContent = children || hasActions || showCancel;\r\n  const isInSubmenu = stackHistory.length > 0;\r\n\r\n  function handleSubmenuOpen(key: string) {\r\n    const action = currentActions.find((action) => action.key === key);\r\n    if (!action) {\r\n      console.error(`Action with key ${key} not found`);\r\n      return;\r\n    }\r\n\r\n    setStackHistory((prevStackHistory) => [\r\n      ...prevStackHistory,\r\n      currentActionStack,\r\n    ]);\r\n    setCurrentActionStack((prevStack) => ({\r\n      title: action.label,\r\n      actions: action.children,\r\n      key: action.key,\r\n      previousKey: prevStack.key,\r\n    }));\r\n  }\r\n\r\n  function handleBack() {\r\n    if (stackHistory.length > 0) {\r\n      const previousStack = stackHistory[stackHistory.length - 1];\r\n      setCurrentActionStack(previousStack);\r\n      setStackHistory(stackHistory.slice(0, -1));\r\n    }\r\n  }\r\n\r\n  // Re-measure the open menu's content height when stack history changes\r\n  useEffect(() => {\r\n    if (!isOpen) return;\r\n\r\n    requestAnimationFrame(() => {\r\n      if (contentRef.current) {\r\n        setContentHeight(contentRef.current.scrollHeight + 12);\r\n      }\r\n    });\r\n  }, [isOpen, stackHistory, hasContent]);\r\n\r\n  // Reset content height when menu closes or is closing\r\n  useEffect(() => {\r\n    if (!isOpen || isClosing) {\r\n      setContentHeight(0);\r\n    }\r\n  }, [isOpen, isClosing]);\r\n\r\n  if (!isOpen && !isClosing) return null;\r\n\r\n  return (\r\n    <ScreenOverlay fadeIn ref={overlayRef}>\r\n      <DropdownMenu.Root\r\n        modal\r\n        open={isOpen}\r\n        onOpenChange={(open) => {\r\n          if (!open) handleClose();\r\n        }}\r\n      >\r\n        <DropdownMenu.Trigger asChild>\r\n          {/* No visible trigger, menu is controlled by isOpen */}\r\n          <div>{\"\"}</div>\r\n        </DropdownMenu.Trigger>\r\n\r\n        <div\r\n          className=\"proton-ActionMenu__background-wrapper\"\r\n          style={{ opacity: isClosing ? 0 : 1 }}\r\n        >\r\n          <div\r\n            data-testid={testId || \"ActionMenu-wrapper\"}\r\n            className=\"proton-ActionMenu__wrapper\"\r\n          >\r\n            <div\r\n              className=\"proton-ActionMenu__card\"\r\n              data-testid=\"ActionMenu-content\"\r\n              style={{ height: `${contentHeight}px` }}\r\n            >\r\n              <div ref={menuRef} className=\"proton-ActionMenu__menu\">\r\n                <DropdownMenu.Content loop sideOffset={8} ref={contentRef}>\r\n                  {hasContent && (\r\n                    <>\r\n                      {children && (\r\n                        <div className=\"proton-ActionMenu__content\">\r\n                          {typeof children === \"function\"\r\n                            ? children({ close: handleClose })\r\n                            : children}\r\n                        </div>\r\n                      )}\r\n\r\n                      {hasActions && (\r\n                        <ActionMenuList\r\n                          actions={currentActions}\r\n                          selectionMode={selectionMode}\r\n                          selectedKeys={selectedKeys}\r\n                          onSelectionChange={onSelectionChange}\r\n                          disabledKeys={disabledKeys}\r\n                          handleSubmenuOpen={handleSubmenuOpen}\r\n                          title={currentActionStack.title}\r\n                          isInSubmenu={isInSubmenu}\r\n                          handleBack={handleBack}\r\n                          previousMenuTitle={\r\n                            stackHistory[stackHistory.length - 1]?.title\r\n                          }\r\n                        />\r\n                      )}\r\n\r\n                      {showCancel && (\r\n                        <>\r\n                          <DropdownMenu.Separator />\r\n                          <DropdownMenu.Item className=\"proton-ActionMenu__cancel-button\">\r\n                            <Button\r\n                              data-testid=\"ActionMenuItem-cancel\"\r\n                              onPress={handleClose}\r\n                              fullWidth\r\n                              variant=\"secondary\"\r\n                            >\r\n                              {cancelButtonText}\r\n                            </Button>\r\n                          </DropdownMenu.Item>\r\n                        </>\r\n                      )}\r\n                    </>\r\n                  )}\r\n                </DropdownMenu.Content>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </DropdownMenu.Root>\r\n    </ScreenOverlay>\r\n  );\r\n};\r\n\r\ninterface ActionMenuListProps {\r\n  actions: ActionMenuAction[];\r\n  selectionMode: ActionMenuSelectionMode;\r\n  selectedKeys?: string[];\r\n  onSelectionChange?: (keys: Selection) => void;\r\n  disabledKeys?: string[];\r\n  handleSubmenuOpen: (key: string) => void;\r\n  title?: ReactNode;\r\n  isInSubmenu?: boolean;\r\n  handleBack?: () => void;\r\n  previousMenuTitle?: ReactNode;\r\n}\r\n\r\nconst ActionMenuList = ({\r\n  actions,\r\n  selectionMode,\r\n  selectedKeys = [],\r\n  onSelectionChange,\r\n  disabledKeys = [],\r\n  handleSubmenuOpen,\r\n  title,\r\n  isInSubmenu = false,\r\n  handleBack,\r\n  previousMenuTitle,\r\n}: ActionMenuListProps) => {\r\n  const ActionMenuItemMap = () => (\r\n    <>\r\n      {isInSubmenu && handleBack && (\r\n        <div className=\"proton-ActionMenu__back-button-container\">\r\n          <DropdownMenu.Item\r\n            className=\"proton-ActionMenu__back-button\"\r\n            onSelect={(event) => {\r\n              event.preventDefault();\r\n              handleBack();\r\n            }}\r\n            aria-label={`Go back to ${previousMenuTitle || \"previous menu\"}`}\r\n          >\r\n            <Icon id=\"chevron-left\" size={16} aria-hidden=\"true\" />\r\n          </DropdownMenu.Item>\r\n          <div\r\n            className=\"proton-ActionMenu__title\"\r\n            role=\"banner\"\r\n            aria-label={isInSubmenu ? `Submenu: ${title}` : `Menu: ${title}`}\r\n          >\r\n            <span>{title}</span>\r\n          </div>\r\n          <DropdownMenu.Separator />\r\n        </div>\r\n      )}\r\n\r\n      {actions.map((action, i) => {\r\n        const itemProps = actions[i];\r\n        return (\r\n          <ActionMenuItem\r\n            key={action.key}\r\n            item={action}\r\n            isSubmenu={Boolean(itemProps.children?.length)}\r\n            selectionMode={selectionMode}\r\n            onSelectionChange={onSelectionChange}\r\n            selectedKeys={selectedKeys}\r\n            disabledKeys={disabledKeys}\r\n            handleSubmenuOpen={handleSubmenuOpen}\r\n          />\r\n        );\r\n      })}\r\n    </>\r\n  );\r\n\r\n  return (\r\n    <div\r\n      aria-disabled={selectionMode === \"none\"}\r\n      className=\"proton-ActionMenu__list\"\r\n      role=\"menu\"\r\n      aria-label={\r\n        title ? `${isInSubmenu ? \"Submenu\" : \"Menu\"}: ${title}` : \"Action menu\"\r\n      }\r\n      aria-orientation=\"vertical\"\r\n    >\r\n      {selectionMode === \"single\" ? (\r\n        <DropdownMenu.RadioGroup\r\n          value={selectedKeys?.[0] || \"\"}\r\n          onValueChange={(value) => {\r\n            // Check if this is a submenu item - if so, don't trigger selection change\r\n            const action = actions.find((action) => action.key === value);\r\n            if (action?.children?.length) {\r\n              return;\r\n            }\r\n\r\n            if (onSelectionChange) {\r\n              onSelectionChange(new Set([value]));\r\n            }\r\n          }}\r\n        >\r\n          <ActionMenuItemMap />\r\n        </DropdownMenu.RadioGroup>\r\n      ) : (\r\n        <DropdownMenu.Group>\r\n          <ActionMenuItemMap />\r\n        </DropdownMenu.Group>\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n\r\ninterface ActionMenuItemProps {\r\n  to?: string;\r\n  item: ActionMenuAction;\r\n  isSubmenu?: boolean;\r\n  selectionMode: ActionMenuSelectionMode;\r\n  onSelectionChange?: (keys: Selection) => void;\r\n  selectedKeys?: string[];\r\n  disabledKeys?: string[];\r\n  handleSubmenuOpen: (key: string) => void;\r\n}\r\n\r\nconst ActionMenuItem = ({\r\n  item,\r\n  isSubmenu,\r\n  selectionMode,\r\n  onSelectionChange,\r\n  selectedKeys = [],\r\n  disabledKeys = [],\r\n  handleSubmenuOpen,\r\n}: ActionMenuItemProps) => {\r\n  const ref = useRef(null);\r\n  const isExternal = item.to && isUrlExternal(item.to);\r\n  const isDisabled = disabledKeys.includes(item.key);\r\n  const isSelected = selectedKeys.includes(item.key);\r\n\r\n  const radixItemProps = {\r\n    className: \"proton-ActionMenu__item\",\r\n    \"aria-label\": item.label\r\n      ? `${item.label}${item.description ? `, ${item.description}` : \"\"}`\r\n      : `ActionMenu-Item-${item.key}`,\r\n    role: \"menuitem\",\r\n    disabled: isDisabled,\r\n    ref,\r\n  };\r\n\r\n  const onSelect = (event: Event) => {\r\n    if (item?.children?.length) {\r\n      event.preventDefault();\r\n      handleSubmenuOpen(item.key);\r\n      return;\r\n    }\r\n    if (item.onAction) {\r\n      item.onAction(item.key);\r\n    }\r\n  };\r\n\r\n  const content = (\r\n    <>\r\n      <div className=\"proton-ActionMenu__item-content\">\r\n        <div className=\"proton-ActionMenu__item-label\">{item.label}</div>\r\n        {item.description && (\r\n          <div className=\"proton-ActionMenu__description\">\r\n            {item.description}\r\n          </div>\r\n        )}\r\n      </div>\r\n      {isSubmenu && <Icon id=\"chevron-right\" size={16} aria-hidden=\"true\" />}\r\n    </>\r\n  );\r\n\r\n  if (item.to) {\r\n    return (\r\n      <DropdownMenu.Item {...radixItemProps} key={item.key} asChild>\r\n        <a\r\n          aria-label={\r\n            item.label\r\n              ? `${item.label}${item.description ? `, ${item.description}` : \"\"}`\r\n              : `ActionMenu-Item-${item.key}`\r\n          }\r\n          aria-disabled={isDisabled}\r\n          aria-checked={isSelected}\r\n          aria-expanded={isSubmenu ? false : undefined}\r\n          href={item.to}\r\n          target={isExternal ? \"_blank\" : undefined}\r\n          rel={isExternal ? \"noopener noreferrer\" : undefined}\r\n          onClick={(e: React.MouseEvent<HTMLAnchorElement>) => {\r\n            if (isExternal || !item.to) {\r\n              return;\r\n            }\r\n            handleInternalNavigation(e, item.to);\r\n          }}\r\n        >\r\n          {content}\r\n        </a>\r\n      </DropdownMenu.Item>\r\n    );\r\n  }\r\n\r\n  if (selectionMode === \"multiple\") {\r\n    return (\r\n      <DropdownMenu.CheckboxItem\r\n        {...radixItemProps}\r\n        key={item.key}\r\n        checked={isSelected}\r\n        onSelect={onSelect}\r\n        onCheckedChange={(checked: boolean) => {\r\n          if (!onSelectionChange) return;\r\n\r\n          const currentKeys = new Set(selectedKeys);\r\n          if (checked) {\r\n            currentKeys.add(item.key);\r\n          } else {\r\n            currentKeys.delete(item.key);\r\n          }\r\n          onSelectionChange(currentKeys);\r\n        }}\r\n      >\r\n        {content}\r\n      </DropdownMenu.CheckboxItem>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <DropdownMenu.RadioItem\r\n      {...radixItemProps}\r\n      value={item.key}\r\n      key={item.key}\r\n      aria-checked={isSelected}\r\n      aria-expanded={isSubmenu ? false : undefined}\r\n      onSelect={onSelect}\r\n    >\r\n      {content}\r\n    </DropdownMenu.RadioItem>\r\n  );\r\n};\r\n"],"names":["ActionMenu","isOpen","actions","children","showCancel","cancelButtonText","selectionMode","selectedKeys","disabledKeys","onSelectionChange","onClose","title","testId","useLockBodyScroll","contentHeight","setContentHeight","useState","stackHistory","setStackHistory","currentActionStack","setCurrentActionStack","contentRef","useRef","menuRef","overlayRef","isClosing","handleClose","useIsClosing","currentActions","hasActions","hasContent","isInSubmenu","handleSubmenuOpen","key","action","prevStackHistory","prevStack","handleBack","previousStack","useEffect","jsx","ScreenOverlay","jsxs","DropdownMenu","open","Fragment","ActionMenuList","_a","Button","previousMenuTitle","ActionMenuItemMap","event","Icon","i","itemProps","ActionMenuItem","value","item","isSubmenu","ref","isExternal","isUrlExternal","isDisabled","isSelected","radixItemProps","onSelect","content","createElement","e","handleInternalNavigation","checked","currentKeys"],"mappings":"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"}

package/dist/components/Badge/Badge.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../node_modules/react/jsx-runtime.cjs.js");;/* empty css               */const s=require("../../utils/string.cjs.js"),n={primary:"primary",secondary:"secondary",transparent:"transparent",success:"success",warning:"warning",danger:"danger"},i=({variant:e,children:r,...a})=>t.jsxRuntimeExports.jsx("div",{role:"status","aria-live":"polite","data-testid":a["data-testid"],className:s.csx("proton-Badge",e&&`proton-Badge--${e}`),children:r});exports.Badge=i;exports.BadgeVariants=n;
+//# sourceMappingURL=Badge.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.cjs.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode } from \"react\";\r\nimport { csx } from \"../../utils\";\r\n\r\nimport \"./Badge.css\";\r\n\r\nexport type BadgeVariant =\r\n  | \"primary\"\r\n  | \"secondary\"\r\n  | \"transparent\"\r\n  | \"success\"\r\n  | \"warning\"\r\n  | \"danger\";\r\n\r\nexport const BadgeVariants: Record<BadgeVariant, BadgeVariant> = {\r\n  primary: \"primary\",\r\n  secondary: \"secondary\",\r\n  transparent: \"transparent\",\r\n  success: \"success\",\r\n  warning: \"warning\",\r\n  danger: \"danger\",\r\n};\r\n\r\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /**\r\n   * The content to display within the badge.\r\n   */\r\n  children: ReactNode;\r\n  /**\r\n   * The badge's visual aesthetic.\r\n   * - type {@link BadgeVariant}\r\n   */\r\n  variant?: BadgeVariant;\r\n}\r\n\r\n/**\r\n * A badge component for displaying status, categories, or counts with various visual styles.\r\n *\r\n * API:\r\n *  - {@link BadgeProps}\r\n *  - extends {@link React.HTMLAttributes}\r\n */\r\nexport const Badge = ({ variant, children, ...props }: BadgeProps) => {\r\n  return (\r\n    <div\r\n      role=\"status\"\r\n      aria-live=\"polite\"\r\n      data-testid={props[\"data-testid\"]}\r\n      className={csx(\"proton-Badge\", variant && `proton-Badge--${variant}`)}\r\n    >\r\n      {children}\r\n    </div>\r\n  );\r\n};\r\n"],"names":["BadgeVariants","Badge","variant","children","props","jsx","csx"],"mappings":"0NAeaA,EAAoD,CAC/D,QAAS,UACT,UAAW,YACX,YAAa,cACb,QAAS,UACT,QAAS,UACT,OAAQ,QACV,EAqBaC,EAAQ,CAAC,CAAE,QAAAC,EAAS,SAAAC,EAAU,GAAGC,KAE1CC,EAAA,kBAAA,IAAC,MAAA,CACC,KAAK,SACL,YAAU,SACV,cAAaD,EAAM,aAAa,EAChC,UAAWE,EAAI,IAAA,eAAgBJ,GAAW,iBAAiBA,CAAO,EAAE,EAEnE,SAAAC,CAAA,CAAA"}

package/dist/components/Badge/Badge.es.js

@@ -0,0 +1,25 @@
+import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
+/* empty css             */
+import { csx as e } from "../../utils/string.es.js";
+const d = {
+  primary: "primary",
+  secondary: "secondary",
+  transparent: "transparent",
+  success: "success",
+  warning: "warning",
+  danger: "danger"
+}, p = ({ variant: r, children: a, ...s }) => /* @__PURE__ */ t.jsx(
+  "div",
+  {
+    role: "status",
+    "aria-live": "polite",
+    "data-testid": s["data-testid"],
+    className: e("proton-Badge", r && `proton-Badge--${r}`),
+    children: a
+  }
+);
+export {
+  p as Badge,
+  d as BadgeVariants
+};
+//# sourceMappingURL=Badge.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.es.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode } from \"react\";\r\nimport { csx } from \"../../utils\";\r\n\r\nimport \"./Badge.css\";\r\n\r\nexport type BadgeVariant =\r\n  | \"primary\"\r\n  | \"secondary\"\r\n  | \"transparent\"\r\n  | \"success\"\r\n  | \"warning\"\r\n  | \"danger\";\r\n\r\nexport const BadgeVariants: Record<BadgeVariant, BadgeVariant> = {\r\n  primary: \"primary\",\r\n  secondary: \"secondary\",\r\n  transparent: \"transparent\",\r\n  success: \"success\",\r\n  warning: \"warning\",\r\n  danger: \"danger\",\r\n};\r\n\r\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /**\r\n   * The content to display within the badge.\r\n   */\r\n  children: ReactNode;\r\n  /**\r\n   * The badge's visual aesthetic.\r\n   * - type {@link BadgeVariant}\r\n   */\r\n  variant?: BadgeVariant;\r\n}\r\n\r\n/**\r\n * A badge component for displaying status, categories, or counts with various visual styles.\r\n *\r\n * API:\r\n *  - {@link BadgeProps}\r\n *  - extends {@link React.HTMLAttributes}\r\n */\r\nexport const Badge = ({ variant, children, ...props }: BadgeProps) => {\r\n  return (\r\n    <div\r\n      role=\"status\"\r\n      aria-live=\"polite\"\r\n      data-testid={props[\"data-testid\"]}\r\n      className={csx(\"proton-Badge\", variant && `proton-Badge--${variant}`)}\r\n    >\r\n      {children}\r\n    </div>\r\n  );\r\n};\r\n"],"names":["BadgeVariants","Badge","variant","children","props","jsx","csx"],"mappings":";;;AAeO,MAAMA,IAAoD;AAAA,EAC/D,SAAS;AAAA,EACT,WAAW;AAAA,EACX,aAAa;AAAA,EACb,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV,GAqBaC,IAAQ,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,GAAGC,QAE1CC,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,aAAU;AAAA,IACV,eAAaD,EAAM,aAAa;AAAA,IAChC,WAAWE,EAAI,gBAAgBJ,KAAW,iBAAiBA,CAAO,EAAE;AAAA,IAEnE,UAAAC;AAAA,EAAA;AAAA;"}

package/dist/components/Banner/Banner.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../node_modules/react/jsx-runtime.cjs.js"),o=require("react"),h=require("../Button/Button.cjs.js");;/* empty css                */const a=require("../../utils/string.cjs.js"),d={success:n.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 20 20",height:"18",width:"18",children:n.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"})}),warning:n.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 56 56",height:"17",width:"17",children:n.jsxRuntimeExports.jsx("path",{d:"M9.59 50.207h36.82c3.516 0 5.719-2.531 5.719-5.719a5.56 5.56 0 0 0-.75-2.812l-18.445-33c-1.055-1.899-2.977-2.883-4.922-2.883c-1.922 0-3.89.984-4.946 2.883L4.645 41.699c-.516.89-.774 1.828-.774 2.79c0 3.187 2.227 5.718 5.719 5.718m18.422-16.055c-1.242 0-1.922-.703-1.969-1.968l-.328-11.578c-.047-1.266.937-2.204 2.273-2.204c1.313 0 2.344.961 2.297 2.227l-.351 11.555c-.047 1.289-.727 1.968-1.922 1.968m0 8.649c-1.36 0-2.625-1.078-2.625-2.532s1.242-2.53 2.625-2.53s2.625 1.054 2.625 2.53c0 1.477-1.266 2.532-2.625 2.532"})}),danger:n.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 20 20",height:"18",width:"18",children:n.jsxRuntimeExports.jsx("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"})})},R={default:"default",success:"success",warning:"warning",danger:"danger"},c=o.createContext(void 0),s=({variant:t="default",rounded:e=!0,icon:r=!1,compact:i=!0,children:m,"data-testid":j})=>n.jsxRuntimeExports.jsx(c.Provider,{value:t,children:n.jsxRuntimeExports.jsx("div",{role:"status","aria-live":"polite",className:a.csx("proton-Banner",`proton-Banner--${t}`,e&&"proton-Banner--rounded"),"data-testid":j,children:n.jsxRuntimeExports.jsxs("div",{className:a.csx("proton-Banner__wrapper",i&&"proton-Banner__wrapper--compact"),children:[n.jsxRuntimeExports.jsx(s.Icon,{icon:r}),n.jsxRuntimeExports.jsx("div",{className:"proton-Banner__content-wrapper",children:n.jsxRuntimeExports.jsx("div",{className:"proton-Banner__container",children:m})})]})})});s.displayName="Banner";const x=({children:t,"data-testid":e})=>{const r=o.useContext(c);if(!r)throw new Error("BannerTitle must be used within a Banner");return n.jsxRuntimeExports.jsx("h3",{className:a.csx("proton-Banner__title",`proton-Banner--${r}__title`),"data-testid":e,children:t})};x.displayName="Banner.Title";const u=({children:t,"data-testid":e})=>{const r=o.useContext(c);if(!r)throw new Error("BannerContent must be used within a Banner");return n.jsxRuntimeExports.jsx("p",{className:a.csx("proton-Banner__content",`proton-Banner--${r}__content`),"data-testid":e,children:t})};u.displayName="Banner.Content";function N(t,e){return o.isValidElement(t)?t:t?d[e]:null}const l=({icon:t,"data-testid":e})=>{const r=o.useContext(c);if(!r)throw new Error("BannerIcon must be used within a Banner");const i=N(t,r);return i?n.jsxRuntimeExports.jsx("div",{"aria-hidden":"true","data-testid":e,className:a.csx("proton-Banner__icon",`proton-Banner--${r}__icon`),children:i}):null};l.displayName="Banner.Icon";const p=({children:t,...e})=>n.jsxRuntimeExports.jsx(h.Button,{...e,children:t});p.displayName="Banner.Action";const B=({children:t})=>n.jsxRuntimeExports.jsx("div",{className:"proton-Banner__actions",children:t});B.displayName="Banner.Actions";s.Title=x;s.Content=u;s.Icon=l;s.Action=p;s.Actions=B;exports.BANNER_ICONS=d;exports.BANNER_VARIANTS=R;exports.Banner=s;
+//# sourceMappingURL=Banner.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.cjs.js","sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode, createContext, isValidElement, useContext } from \"react\";\r\nimport { csx } from \"../../utils\";\r\nimport { Button, type ButtonProps } from \"../Button/Button\";\r\n\r\nimport \"./Banner.css\";\r\n\r\n//TODO: move svgs to lib and use Icon component\r\nexport const BANNER_ICONS = {\r\n  success: (\r\n    <svg viewBox=\"0 0 20 20\" height=\"18\" width=\"18\">\r\n      <path\r\n        fillRule=\"evenodd\"\r\n        d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z\"\r\n      ></path>\r\n    </svg>\r\n  ),\r\n  warning: (\r\n    <svg viewBox=\"0 0 56 56\" height=\"17\" width=\"17\">\r\n      <path d=\"M9.59 50.207h36.82c3.516 0 5.719-2.531 5.719-5.719a5.56 5.56 0 0 0-.75-2.812l-18.445-33c-1.055-1.899-2.977-2.883-4.922-2.883c-1.922 0-3.89.984-4.946 2.883L4.645 41.699c-.516.89-.774 1.828-.774 2.79c0 3.187 2.227 5.718 5.719 5.718m18.422-16.055c-1.242 0-1.922-.703-1.969-1.968l-.328-11.578c-.047-1.266.937-2.204 2.273-2.204c1.313 0 2.344.961 2.297 2.227l-.351 11.555c-.047 1.289-.727 1.968-1.922 1.968m0 8.649c-1.36 0-2.625-1.078-2.625-2.532s1.242-2.53 2.625-2.53s2.625 1.054 2.625 2.53c0 1.477-1.266 2.532-2.625 2.532\" />\r\n    </svg>\r\n  ),\r\n  danger: (\r\n    <svg viewBox=\"0 0 20 20\" height=\"18\" width=\"18\">\r\n      <path\r\n        fillRule=\"evenodd\"\r\n        d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z\"\r\n      ></path>\r\n    </svg>\r\n  ),\r\n};\r\n\r\nexport const BANNER_VARIANTS = {\r\n  default: \"default\",\r\n  success: \"success\",\r\n  warning: \"warning\",\r\n  danger: \"danger\",\r\n} as const;\r\nexport type BannerVariant = \"default\" | \"success\" | \"warning\" | \"danger\";\r\n\r\nconst BannerContext = createContext<BannerVariant | undefined>(undefined);\r\n\r\ninterface BannerIconProps {\r\n  /**\r\n   * Optional custom icon or children for the icon area.\r\n   */\r\n  children?: ReactNode;\r\n  /**\r\n   * The icon to display in the banner.\r\n   * Can be a boolean to conditionally show or hide, or a ReactNode to provide a custom icon.\r\n   */\r\n  icon?: boolean | ReactNode;\r\n  /**\r\n   * The data-testid to display within the banner.\r\n   */\r\n  \"data-testid\"?: string;\r\n}\r\n\r\ninterface BannerProps extends BannerIconProps {\r\n  /**\r\n   * Compact padding around the content of the banner.\r\n   * @default true\r\n   */\r\n  compact?: boolean;\r\n  /**\r\n   * The content to display within the banner.\r\n   */\r\n  children: ReactNode;\r\n  /**\r\n   * The data-testid to display within the banner.\r\n   */\r\n  \"data-testid\"?: string;\r\n  /**\r\n   * Round the corners of the banner.\r\n   * @default true\r\n   */\r\n  rounded?: boolean;\r\n  /**\r\n   * The banner's visual aesthetic.\r\n   * - type {@link BannerVariant}\r\n   */\r\n  variant?: BannerVariant;\r\n}\r\n\r\n/**\r\n * A banner used to display a success, warning, or error message.\r\n *\r\n * API:\r\n *  - {@link BannerProps}\r\n *  - extends {@link BannerIconProps}\r\n */\r\nconst Banner = ({\r\n  variant = \"default\",\r\n  rounded = true,\r\n  icon = false,\r\n  compact = true,\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: BannerProps) => {\r\n  return (\r\n    <BannerContext.Provider value={variant}>\r\n      <div\r\n        role=\"status\"\r\n        aria-live=\"polite\"\r\n        className={csx(\r\n          \"proton-Banner\",\r\n          `proton-Banner--${variant}`,\r\n          rounded && \"proton-Banner--rounded\"\r\n        )}\r\n        data-testid={dataTestId}\r\n      >\r\n        <div\r\n          className={csx(\r\n            \"proton-Banner__wrapper\",\r\n            compact && \"proton-Banner__wrapper--compact\"\r\n          )}\r\n        >\r\n          <Banner.Icon icon={icon} />\r\n          <div className=\"proton-Banner__content-wrapper\">\r\n            <div className=\"proton-Banner__container\">{children}</div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </BannerContext.Provider>\r\n  );\r\n};\r\n\r\nBanner.displayName = \"Banner\";\r\n\r\nconst BannerTitle = ({\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: {\r\n  children: ReactNode;\r\n  \"data-testid\"?: string;\r\n}) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerTitle must be used within a Banner\");\r\n\r\n  return (\r\n    <h3\r\n      className={csx(\r\n        \"proton-Banner__title\",\r\n        `proton-Banner--${variant}__title`\r\n      )}\r\n      data-testid={dataTestId}\r\n    >\r\n      {children}\r\n    </h3>\r\n  );\r\n};\r\n\r\nBannerTitle.displayName = \"Banner.Title\";\r\n\r\nconst BannerContent = ({\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: {\r\n  children: ReactNode;\r\n  \"data-testid\"?: string;\r\n}) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerContent must be used within a Banner\");\r\n\r\n  return (\r\n    <p\r\n      className={csx(\r\n        \"proton-Banner__content\",\r\n        `proton-Banner--${variant}__content`\r\n      )}\r\n      data-testid={dataTestId}\r\n    >\r\n      {children}\r\n    </p>\r\n  );\r\n};\r\n\r\nBannerContent.displayName = \"Banner.Content\";\r\n\r\nfunction getIconContent(icon: ReactNode, variant: BannerVariant) {\r\n  if (isValidElement(icon)) return icon;\r\n  if (icon) return BANNER_ICONS[variant];\r\n  return null;\r\n}\r\n\r\nconst BannerIcon = ({ icon, \"data-testid\": dataTestId }: BannerIconProps) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerIcon must be used within a Banner\");\r\n\r\n  const iconContent = getIconContent(icon, variant);\r\n  if (!iconContent) return null;\r\n\r\n  return (\r\n    <div\r\n      aria-hidden=\"true\"\r\n      data-testid={dataTestId}\r\n      className={csx(\"proton-Banner__icon\", `proton-Banner--${variant}__icon`)}\r\n    >\r\n      {iconContent}\r\n    </div>\r\n  );\r\n};\r\n\r\nBannerIcon.displayName = \"Banner.Icon\";\r\n\r\nconst BannerAction = ({ children, ...buttonProps }: ButtonProps) => {\r\n  return <Button {...buttonProps}>{children}</Button>;\r\n};\r\n\r\nBannerAction.displayName = \"Banner.Action\";\r\n\r\nconst BannerActions = ({ children }: { children: ReactNode }) => {\r\n  return <div className=\"proton-Banner__actions\">{children}</div>;\r\n};\r\n\r\nBannerActions.displayName = \"Banner.Actions\";\r\n\r\n/**\r\n * Renders an h3 styled banner.\r\n */\r\nBanner.Title = BannerTitle;\r\n\r\n/**\r\n * Renders a p styled banner.\r\n */\r\nBanner.Content = BannerContent;\r\n\r\n/**\r\n * Renders an icon inline with the banner title.\r\n *\r\n * API:\r\n *  - {@link BannerIconProps}\r\n */\r\nBanner.Icon = BannerIcon;\r\n\r\n/**\r\n * Renders a Proton Button.\r\n * - @prop buttonProps {@link ButtonProps}\r\n */\r\nBanner.Action = BannerAction;\r\n\r\n/**\r\n * Renders Proton Buttons in a responsive actions grid.\r\n */\r\nBanner.Actions = BannerActions;\r\n\r\nexport { Banner };\r\n"],"names":["BANNER_ICONS","jsx","BANNER_VARIANTS","BannerContext","createContext","Banner","variant","rounded","icon","compact","children","dataTestId","csx","jsxs","BannerTitle","useContext","BannerContent","getIconContent","isValidElement","BannerIcon","iconContent","BannerAction","buttonProps","Button","BannerActions"],"mappings":"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"}

package/dist/components/Banner/Banner.es.js

@@ -0,0 +1,131 @@
+import { j as n } from "../../node_modules/react/jsx-runtime.es.js";
+import { createContext as x, useContext as c, isValidElement as _ } from "react";
+import { Button as w } from "../Button/Button.es.js";
+/* empty css              */
+import { csx as o } from "../../utils/string.es.js";
+const v = {
+  success: /* @__PURE__ */ n.jsx("svg", { viewBox: "0 0 20 20", height: "18", width: "18", children: /* @__PURE__ */ n.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"
+    }
+  ) }),
+  warning: /* @__PURE__ */ n.jsx("svg", { viewBox: "0 0 56 56", height: "17", width: "17", children: /* @__PURE__ */ n.jsx("path", { d: "M9.59 50.207h36.82c3.516 0 5.719-2.531 5.719-5.719a5.56 5.56 0 0 0-.75-2.812l-18.445-33c-1.055-1.899-2.977-2.883-4.922-2.883c-1.922 0-3.89.984-4.946 2.883L4.645 41.699c-.516.89-.774 1.828-.774 2.79c0 3.187 2.227 5.718 5.719 5.718m18.422-16.055c-1.242 0-1.922-.703-1.969-1.968l-.328-11.578c-.047-1.266.937-2.204 2.273-2.204c1.313 0 2.344.961 2.297 2.227l-.351 11.555c-.047 1.289-.727 1.968-1.922 1.968m0 8.649c-1.36 0-2.625-1.078-2.625-2.532s1.242-2.53 2.625-2.53s2.625 1.054 2.625 2.53c0 1.477-1.266 2.532-2.625 2.532" }) }),
+  danger: /* @__PURE__ */ n.jsx("svg", { viewBox: "0 0 20 20", height: "18", width: "18", children: /* @__PURE__ */ n.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"
+    }
+  ) })
+}, I = {
+  default: "default",
+  success: "success",
+  warning: "warning",
+  danger: "danger"
+}, i = x(void 0), a = ({
+  variant: t = "default",
+  rounded: e = !0,
+  icon: r = !1,
+  compact: s = !0,
+  children: m,
+  "data-testid": h
+}) => /* @__PURE__ */ n.jsx(i.Provider, { value: t, children: /* @__PURE__ */ n.jsx(
+  "div",
+  {
+    role: "status",
+    "aria-live": "polite",
+    className: o(
+      "proton-Banner",
+      `proton-Banner--${t}`,
+      e && "proton-Banner--rounded"
+    ),
+    "data-testid": h,
+    children: /* @__PURE__ */ n.jsxs(
+      "div",
+      {
+        className: o(
+          "proton-Banner__wrapper",
+          s && "proton-Banner__wrapper--compact"
+        ),
+        children: [
+          /* @__PURE__ */ n.jsx(a.Icon, { icon: r }),
+          /* @__PURE__ */ n.jsx("div", { className: "proton-Banner__content-wrapper", children: /* @__PURE__ */ n.jsx("div", { className: "proton-Banner__container", children: m }) })
+        ]
+      }
+    )
+  }
+) });
+a.displayName = "Banner";
+const d = ({
+  children: t,
+  "data-testid": e
+}) => {
+  const r = c(i);
+  if (!r) throw new Error("BannerTitle must be used within a Banner");
+  return /* @__PURE__ */ n.jsx(
+    "h3",
+    {
+      className: o(
+        "proton-Banner__title",
+        `proton-Banner--${r}__title`
+      ),
+      "data-testid": e,
+      children: t
+    }
+  );
+};
+d.displayName = "Banner.Title";
+const l = ({
+  children: t,
+  "data-testid": e
+}) => {
+  const r = c(i);
+  if (!r) throw new Error("BannerContent must be used within a Banner");
+  return /* @__PURE__ */ n.jsx(
+    "p",
+    {
+      className: o(
+        "proton-Banner__content",
+        `proton-Banner--${r}__content`
+      ),
+      "data-testid": e,
+      children: t
+    }
+  );
+};
+l.displayName = "Banner.Content";
+function N(t, e) {
+  return _(t) ? t : t ? v[e] : null;
+}
+const p = ({ icon: t, "data-testid": e }) => {
+  const r = c(i);
+  if (!r) throw new Error("BannerIcon must be used within a Banner");
+  const s = N(t, r);
+  return s ? /* @__PURE__ */ n.jsx(
+    "div",
+    {
+      "aria-hidden": "true",
+      "data-testid": e,
+      className: o("proton-Banner__icon", `proton-Banner--${r}__icon`),
+      children: s
+    }
+  ) : null;
+};
+p.displayName = "Banner.Icon";
+const B = ({ children: t, ...e }) => /* @__PURE__ */ n.jsx(w, { ...e, children: t });
+B.displayName = "Banner.Action";
+const u = ({ children: t }) => /* @__PURE__ */ n.jsx("div", { className: "proton-Banner__actions", children: t });
+u.displayName = "Banner.Actions";
+a.Title = d;
+a.Content = l;
+a.Icon = p;
+a.Action = B;
+a.Actions = u;
+export {
+  v as BANNER_ICONS,
+  I as BANNER_VARIANTS,
+  a as Banner
+};
+//# sourceMappingURL=Banner.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.es.js","sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode, createContext, isValidElement, useContext } from \"react\";\r\nimport { csx } from \"../../utils\";\r\nimport { Button, type ButtonProps } from \"../Button/Button\";\r\n\r\nimport \"./Banner.css\";\r\n\r\n//TODO: move svgs to lib and use Icon component\r\nexport const BANNER_ICONS = {\r\n  success: (\r\n    <svg viewBox=\"0 0 20 20\" height=\"18\" width=\"18\">\r\n      <path\r\n        fillRule=\"evenodd\"\r\n        d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z\"\r\n      ></path>\r\n    </svg>\r\n  ),\r\n  warning: (\r\n    <svg viewBox=\"0 0 56 56\" height=\"17\" width=\"17\">\r\n      <path d=\"M9.59 50.207h36.82c3.516 0 5.719-2.531 5.719-5.719a5.56 5.56 0 0 0-.75-2.812l-18.445-33c-1.055-1.899-2.977-2.883-4.922-2.883c-1.922 0-3.89.984-4.946 2.883L4.645 41.699c-.516.89-.774 1.828-.774 2.79c0 3.187 2.227 5.718 5.719 5.718m18.422-16.055c-1.242 0-1.922-.703-1.969-1.968l-.328-11.578c-.047-1.266.937-2.204 2.273-2.204c1.313 0 2.344.961 2.297 2.227l-.351 11.555c-.047 1.289-.727 1.968-1.922 1.968m0 8.649c-1.36 0-2.625-1.078-2.625-2.532s1.242-2.53 2.625-2.53s2.625 1.054 2.625 2.53c0 1.477-1.266 2.532-2.625 2.532\" />\r\n    </svg>\r\n  ),\r\n  danger: (\r\n    <svg viewBox=\"0 0 20 20\" height=\"18\" width=\"18\">\r\n      <path\r\n        fillRule=\"evenodd\"\r\n        d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z\"\r\n      ></path>\r\n    </svg>\r\n  ),\r\n};\r\n\r\nexport const BANNER_VARIANTS = {\r\n  default: \"default\",\r\n  success: \"success\",\r\n  warning: \"warning\",\r\n  danger: \"danger\",\r\n} as const;\r\nexport type BannerVariant = \"default\" | \"success\" | \"warning\" | \"danger\";\r\n\r\nconst BannerContext = createContext<BannerVariant | undefined>(undefined);\r\n\r\ninterface BannerIconProps {\r\n  /**\r\n   * Optional custom icon or children for the icon area.\r\n   */\r\n  children?: ReactNode;\r\n  /**\r\n   * The icon to display in the banner.\r\n   * Can be a boolean to conditionally show or hide, or a ReactNode to provide a custom icon.\r\n   */\r\n  icon?: boolean | ReactNode;\r\n  /**\r\n   * The data-testid to display within the banner.\r\n   */\r\n  \"data-testid\"?: string;\r\n}\r\n\r\ninterface BannerProps extends BannerIconProps {\r\n  /**\r\n   * Compact padding around the content of the banner.\r\n   * @default true\r\n   */\r\n  compact?: boolean;\r\n  /**\r\n   * The content to display within the banner.\r\n   */\r\n  children: ReactNode;\r\n  /**\r\n   * The data-testid to display within the banner.\r\n   */\r\n  \"data-testid\"?: string;\r\n  /**\r\n   * Round the corners of the banner.\r\n   * @default true\r\n   */\r\n  rounded?: boolean;\r\n  /**\r\n   * The banner's visual aesthetic.\r\n   * - type {@link BannerVariant}\r\n   */\r\n  variant?: BannerVariant;\r\n}\r\n\r\n/**\r\n * A banner used to display a success, warning, or error message.\r\n *\r\n * API:\r\n *  - {@link BannerProps}\r\n *  - extends {@link BannerIconProps}\r\n */\r\nconst Banner = ({\r\n  variant = \"default\",\r\n  rounded = true,\r\n  icon = false,\r\n  compact = true,\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: BannerProps) => {\r\n  return (\r\n    <BannerContext.Provider value={variant}>\r\n      <div\r\n        role=\"status\"\r\n        aria-live=\"polite\"\r\n        className={csx(\r\n          \"proton-Banner\",\r\n          `proton-Banner--${variant}`,\r\n          rounded && \"proton-Banner--rounded\"\r\n        )}\r\n        data-testid={dataTestId}\r\n      >\r\n        <div\r\n          className={csx(\r\n            \"proton-Banner__wrapper\",\r\n            compact && \"proton-Banner__wrapper--compact\"\r\n          )}\r\n        >\r\n          <Banner.Icon icon={icon} />\r\n          <div className=\"proton-Banner__content-wrapper\">\r\n            <div className=\"proton-Banner__container\">{children}</div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </BannerContext.Provider>\r\n  );\r\n};\r\n\r\nBanner.displayName = \"Banner\";\r\n\r\nconst BannerTitle = ({\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: {\r\n  children: ReactNode;\r\n  \"data-testid\"?: string;\r\n}) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerTitle must be used within a Banner\");\r\n\r\n  return (\r\n    <h3\r\n      className={csx(\r\n        \"proton-Banner__title\",\r\n        `proton-Banner--${variant}__title`\r\n      )}\r\n      data-testid={dataTestId}\r\n    >\r\n      {children}\r\n    </h3>\r\n  );\r\n};\r\n\r\nBannerTitle.displayName = \"Banner.Title\";\r\n\r\nconst BannerContent = ({\r\n  children,\r\n  \"data-testid\": dataTestId,\r\n}: {\r\n  children: ReactNode;\r\n  \"data-testid\"?: string;\r\n}) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerContent must be used within a Banner\");\r\n\r\n  return (\r\n    <p\r\n      className={csx(\r\n        \"proton-Banner__content\",\r\n        `proton-Banner--${variant}__content`\r\n      )}\r\n      data-testid={dataTestId}\r\n    >\r\n      {children}\r\n    </p>\r\n  );\r\n};\r\n\r\nBannerContent.displayName = \"Banner.Content\";\r\n\r\nfunction getIconContent(icon: ReactNode, variant: BannerVariant) {\r\n  if (isValidElement(icon)) return icon;\r\n  if (icon) return BANNER_ICONS[variant];\r\n  return null;\r\n}\r\n\r\nconst BannerIcon = ({ icon, \"data-testid\": dataTestId }: BannerIconProps) => {\r\n  const variant = useContext(BannerContext);\r\n  if (!variant) throw new Error(\"BannerIcon must be used within a Banner\");\r\n\r\n  const iconContent = getIconContent(icon, variant);\r\n  if (!iconContent) return null;\r\n\r\n  return (\r\n    <div\r\n      aria-hidden=\"true\"\r\n      data-testid={dataTestId}\r\n      className={csx(\"proton-Banner__icon\", `proton-Banner--${variant}__icon`)}\r\n    >\r\n      {iconContent}\r\n    </div>\r\n  );\r\n};\r\n\r\nBannerIcon.displayName = \"Banner.Icon\";\r\n\r\nconst BannerAction = ({ children, ...buttonProps }: ButtonProps) => {\r\n  return <Button {...buttonProps}>{children}</Button>;\r\n};\r\n\r\nBannerAction.displayName = \"Banner.Action\";\r\n\r\nconst BannerActions = ({ children }: { children: ReactNode }) => {\r\n  return <div className=\"proton-Banner__actions\">{children}</div>;\r\n};\r\n\r\nBannerActions.displayName = \"Banner.Actions\";\r\n\r\n/**\r\n * Renders an h3 styled banner.\r\n */\r\nBanner.Title = BannerTitle;\r\n\r\n/**\r\n * Renders a p styled banner.\r\n */\r\nBanner.Content = BannerContent;\r\n\r\n/**\r\n * Renders an icon inline with the banner title.\r\n *\r\n * API:\r\n *  - {@link BannerIconProps}\r\n */\r\nBanner.Icon = BannerIcon;\r\n\r\n/**\r\n * Renders a Proton Button.\r\n * - @prop buttonProps {@link ButtonProps}\r\n */\r\nBanner.Action = BannerAction;\r\n\r\n/**\r\n * Renders Proton Buttons in a responsive actions grid.\r\n */\r\nBanner.Actions = BannerActions;\r\n\r\nexport { Banner };\r\n"],"names":["BANNER_ICONS","jsx","BANNER_VARIANTS","BannerContext","createContext","Banner","variant","rounded","icon","compact","children","dataTestId","csx","jsxs","BannerTitle","useContext","BannerContent","getIconContent","isValidElement","BannerIcon","iconContent","BannerAction","buttonProps","Button","BannerActions"],"mappings":"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"}

package/dist/components/Button/Button.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),i=require("react"),f=require("../../utils/string.cjs.js"),g=require("../../utils/navigation.cjs.js");;/* empty css                */const b={primary:"primary",secondary:"secondary",success:"success",danger:"danger",translucent:"translucent"},v={small:"small",medium:"medium",large:"large",xlarge:"xlarge","2xlarge":"2xlarge"},j=i.forwardRef(({variant:R="primary",size:c="medium",fullWidth:l=!1,icon:d,to:n,target:u,onPress:o,type:y="button",isDisabled:r,"data-testid":E,children:x},t)=>{const s=n&&g.isUrlExternal(n),m=i.useRef(null);i.useLayoutEffect(()=>{typeof t=="function"?t(m.current):t&&(t.current=m.current)},[t]);const p={className:f.csx("proton-Button",`proton-Button--${R}`,l&&"proton-Button--fullWidth",r&&"proton-Button--disabled",c&&`proton-Button--${c}`),"data-testid":E,...n&&{"aria-disabled":r},...r&&{tabIndex:-1}},B=e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[d&&e.jsxRuntimeExports.jsx("div",{className:f.csx("proton-Button__icon-decorator",l&&"proton-Button__icon-decorator--fullWidth"),children:d}),x&&e.jsxRuntimeExports.jsx("div",{className:"proton-Button__text",children:x})]});return n?e.jsxRuntimeExports.jsx("a",{...p,href:n,target:u||(s?"_blank":void 0),rel:s||u==="_blank"?"noopener noreferrer":void 0,ref:t,onClick:a=>{if(r){a.preventDefault();return}!s&&!u&&g.handleInternalNavigation(a,n),o==null||o(a)},role:"button",children:B}):e.jsxRuntimeExports.jsx("button",{...p,type:y,disabled:r,ref:t,onClick:a=>{!r&&o&&o(a)},children:B})});j.displayName="ProtonUIButton";exports.Button=j;exports.ButtonSizes=v;exports.ButtonVariants=b;
+//# sourceMappingURL=Button.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.cjs.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport {\r\n  forwardRef,\r\n  MouseEvent,\r\n  useLayoutEffect,\r\n  useRef,\r\n} from \"react\";\r\n\r\nimport { csx } from \"../../utils/string\";\r\nimport {\r\n  isUrlExternal,\r\n  handleInternalNavigation,\r\n} from \"../../utils/navigation\";\r\nimport \"./Button.css\";\r\n\r\nexport type ButtonVariant =\r\n  | \"primary\"\r\n  | \"secondary\"\r\n  | \"success\"\r\n  | \"danger\"\r\n  | \"translucent\";\r\n\r\nexport const ButtonVariants: Record<ButtonVariant, ButtonVariant> = {\r\n  primary: \"primary\",\r\n  secondary: \"secondary\",\r\n  success: \"success\",\r\n  danger: \"danger\",\r\n  translucent: \"translucent\",\r\n};\r\n\r\nexport type ButtonSize = \"small\" | \"medium\" | \"large\" | \"xlarge\" | \"2xlarge\";\r\n\r\nexport const ButtonSizes: Record<ButtonSize, ButtonSize> = {\r\n  small: \"small\",\r\n  medium: \"medium\",\r\n  large: \"large\",\r\n  xlarge: \"xlarge\",\r\n  \"2xlarge\": \"2xlarge\",\r\n};\r\n\r\nexport interface ButtonProps {\r\n  /** The button's visual aesthetic\r\n   * - type {@link ButtonVariant}\r\n   */\r\n  variant?: ButtonVariant;\r\n\r\n  /** The size of the button\r\n   * - type {@link ButtonSize}\r\n   * @default \"medium\"\r\n   */\r\n  size?: ButtonSize;\r\n\r\n  /** Should the button be full width?\r\n   * @default false\r\n   */\r\n  fullWidth?: boolean;\r\n\r\n  /** The prefix to display within the button */\r\n  icon?: React.ReactNode;\r\n\r\n  /** Should the button be non-interactive? */\r\n  isDisabled?: boolean;\r\n\r\n  /** The URL that the button should link to. Turns the element into an `a` tag. If the URL is external, you should pass the entire URL to the `to` prop (e.g. `https://example.com`). */\r\n  to?: string;\r\n\r\n  /** The target attribute for the link. Defaults to `_blank` if the URL is external. */\r\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\" | string;\r\n\r\n  /** Called when the button is pressed (on release, not keydown) */\r\n  onPress?: (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;\r\n\r\n  /** The type of button */\r\n  type?: \"button\" | \"submit\" | \"reset\";\r\n\r\n  /** The test ID for the button */\r\n  \"data-testid\"?: string;\r\n\r\n  /** The content to display within the button */\r\n  children?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * A customizable button component that can render as either a button or anchor element.\r\n *\r\n * API:\r\n *  - {@link ButtonProps}\r\n */\r\nexport const Button = forwardRef<\r\n  HTMLButtonElement | HTMLAnchorElement,\r\n  ButtonProps\r\n>(\r\n  (\r\n    {\r\n      variant = \"primary\",\r\n      size = \"medium\",\r\n      fullWidth = false,\r\n      icon,\r\n      to,\r\n      target,\r\n      onPress,\r\n      type = \"button\",\r\n      isDisabled,\r\n      \"data-testid\": testId,\r\n      children,\r\n    }: ButtonProps,\r\n    ref\r\n  ) => {\r\n    const isExternal = to && isUrlExternal(to);\r\n    const buttonRef = useRef<HTMLButtonElement | HTMLAnchorElement>(null);\r\n\r\n    useLayoutEffect(() => {\r\n      if (typeof ref === \"function\") {\r\n        ref(buttonRef.current);\r\n      } else if (ref) {\r\n        ref.current = buttonRef.current;\r\n      }\r\n    }, [ref]);\r\n\r\n    const commonProps = {\r\n      className: csx(\r\n        \"proton-Button\",\r\n        `proton-Button--${variant}`,\r\n        fullWidth && \"proton-Button--fullWidth\",\r\n        isDisabled && \"proton-Button--disabled\",\r\n        size && `proton-Button--${size}`\r\n      ),\r\n      \"data-testid\": testId,\r\n      ...(to && { \"aria-disabled\": isDisabled }),\r\n      ...(isDisabled && { tabIndex: -1 }),\r\n    };\r\n\r\n    const content = (\r\n      <>\r\n        {icon && (\r\n          <div\r\n            className={csx(\r\n              \"proton-Button__icon-decorator\",\r\n              fullWidth && \"proton-Button__icon-decorator--fullWidth\"\r\n            )}\r\n          >\r\n            {icon}\r\n          </div>\r\n        )}\r\n        {children && <div className=\"proton-Button__text\">{children}</div>}\r\n      </>\r\n    );\r\n\r\n    if (to) {\r\n      return (\r\n        <a\r\n          {...commonProps}\r\n          href={to}\r\n          target={target || (isExternal ? \"_blank\" : undefined)}\r\n          rel={\r\n            isExternal || target === \"_blank\"\r\n              ? \"noopener noreferrer\"\r\n              : undefined\r\n          }\r\n          ref={ref as React.RefObject<HTMLAnchorElement>}\r\n          onClick={(e) => {\r\n            if (isDisabled) {\r\n              e.preventDefault();\r\n              return;\r\n            }\r\n\r\n            if (!isExternal && !target) {\r\n              handleInternalNavigation(e, to);\r\n            }\r\n\r\n            onPress?.(e);\r\n          }}\r\n          role=\"button\"\r\n        >\r\n          {content}\r\n        </a>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <button\r\n        {...commonProps}\r\n        type={type}\r\n        disabled={isDisabled}\r\n        ref={ref as React.RefObject<HTMLButtonElement>}\r\n        onClick={(e) => {\r\n          if (!isDisabled && onPress) {\r\n            onPress(e);\r\n          }\r\n        }}\r\n      >\r\n        {content}\r\n      </button>\r\n    );\r\n  }\r\n);\r\n\r\nButton.displayName = \"ProtonUIButton\";\r\n"],"names":["ButtonVariants","ButtonSizes","Button","forwardRef","variant","size","fullWidth","icon","to","target","onPress","type","isDisabled","testId","children","ref","isExternal","isUrlExternal","buttonRef","useRef","useLayoutEffect","commonProps","csx","content","jsxs","Fragment","jsx","e","handleInternalNavigation"],"mappings":"mRAuBO,MAAMA,EAAuD,CAClE,QAAS,UACT,UAAW,YACX,QAAS,UACT,OAAQ,SACR,YAAa,aACf,EAIaC,EAA8C,CACzD,MAAO,QACP,OAAQ,SACR,MAAO,QACP,OAAQ,SACR,UAAW,SACb,EAkDaC,EAASC,EAAA,WAIpB,CACE,CACE,QAAAC,EAAU,UACV,KAAAC,EAAO,SACP,UAAAC,EAAY,GACZ,KAAAC,EACA,GAAAC,EACA,OAAAC,EACA,QAAAC,EACA,KAAAC,EAAO,SACP,WAAAC,EACA,cAAeC,EACf,SAAAC,GAEFC,IACG,CACG,MAAAC,EAAaR,GAAMS,EAAA,cAAcT,CAAE,EACnCU,EAAYC,SAA8C,IAAI,EAEpEC,EAAAA,gBAAgB,IAAM,CAChB,OAAOL,GAAQ,WACjBA,EAAIG,EAAU,OAAO,EACZH,IACTA,EAAI,QAAUG,EAAU,QAC1B,EACC,CAACH,CAAG,CAAC,EAER,MAAMM,EAAc,CAClB,UAAWC,EAAA,IACT,gBACA,kBAAkBlB,CAAO,GACzBE,GAAa,2BACbM,GAAc,0BACdP,GAAQ,kBAAkBA,CAAI,EAChC,EACA,cAAeQ,EACf,GAAIL,GAAM,CAAE,gBAAiBI,CAAW,EACxC,GAAIA,GAAc,CAAE,SAAU,EAAG,CAAA,EAG7BW,EAEDC,EAAAA,kBAAAA,KAAAC,EAAA,kBAAA,SAAA,CAAA,SAAA,CACClB,GAAAmB,EAAA,kBAAA,IAAC,MAAA,CACC,UAAWJ,EAAA,IACT,gCACAhB,GAAa,0CACf,EAEC,SAAAC,CAAA,CACH,EAEDO,GAAYY,EAAA,kBAAA,IAAC,MAAI,CAAA,UAAU,sBAAuB,SAAAZ,EAAS,CAC9D,CAAA,CAAA,EAGF,OAAIN,EAEAkB,EAAA,kBAAA,IAAC,IAAA,CACE,GAAGL,EACJ,KAAMb,EACN,OAAQC,IAAWO,EAAa,SAAW,QAC3C,IACEA,GAAcP,IAAW,SACrB,sBACA,OAEN,IAAAM,EACA,QAAUY,GAAM,CACd,GAAIf,EAAY,CACde,EAAE,eAAe,EACjB,MACF,CAEI,CAACX,GAAc,CAACP,GAClBmB,2BAAyBD,EAAGnB,CAAE,EAGhCE,GAAA,MAAAA,EAAUiB,EACZ,EACA,KAAK,SAEJ,SAAAJ,CAAA,CAAA,EAMLG,EAAA,kBAAA,IAAC,SAAA,CACE,GAAGL,EACJ,KAAAV,EACA,SAAUC,EACV,IAAAG,EACA,QAAUY,GAAM,CACV,CAACf,GAAcF,GACjBA,EAAQiB,CAAC,CAEb,EAEC,SAAAJ,CAAA,CAAA,CAGP,CACF,EAEArB,EAAO,YAAc"}