@protonradio/proton-ui 0.11.5 → 0.11.7

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"}

package/dist/components/Button/Button.es.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.es.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","handleInternalNavigation"],"mappings":";;;;;AAuBO,MAAMA,IAAuD;AAAA,EAClE,SAAS;AAAA,EACT,WAAW;AAAA,EACX,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AACf,GAIaC,IAA8C;AAAA,EACzD,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AACb,GAkDaC,IAASC;AAAA,EAIpB,CACE;AAAA,IACE,SAAAC,IAAU;AAAA,IACV,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAY;AAAA,IACZ,MAAAC;AAAA,IACA,IAAAC;AAAA,IACA,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,YAAAC;AAAA,IACA,eAAeC;AAAA,IACf,UAAAC;AAAA,KAEFC,MACG;AACG,UAAAC,IAAaR,KAAMS,EAAcT,CAAE,GACnCU,IAAYC,EAA8C,IAAI;AAEpE,IAAAC,EAAgB,MAAM;AAChB,MAAA,OAAOL,KAAQ,aACjBA,EAAIG,EAAU,OAAO,IACZH,MACTA,EAAI,UAAUG,EAAU;AAAA,IAC1B,GACC,CAACH,CAAG,CAAC;AAER,UAAMM,IAAc;AAAA,MAClB,WAAWC;AAAA,QACT;AAAA,QACA,kBAAkBlB,CAAO;AAAA,QACzBE,KAAa;AAAA,QACbM,KAAc;AAAA,QACdP,KAAQ,kBAAkBA,CAAI;AAAA,MAChC;AAAA,MACA,eAAeQ;AAAA,MACf,GAAIL,KAAM,EAAE,iBAAiBI,EAAW;AAAA,MACxC,GAAIA,KAAc,EAAE,UAAU,GAAG;AAAA,IAAA,GAG7BW,IAEDC,gBAAAA,EAAAA,KAAAC,EAAA,UAAA,EAAA,UAAA;AAAA,MACClB,KAAAmB,gBAAAA,EAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWJ;AAAA,YACT;AAAA,YACAhB,KAAa;AAAA,UACf;AAAA,UAEC,UAAAC;AAAA,QAAA;AAAA,MACH;AAAA,MAEDO,KAAYY,gBAAAA,EAAA,IAAC,OAAI,EAAA,WAAU,uBAAuB,UAAAZ,GAAS;AAAA,IAC9D,EAAA,CAAA;AAGF,WAAIN,IAEAkB,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGL;AAAA,QACJ,MAAMb;AAAA,QACN,QAAQC,MAAWO,IAAa,WAAW;AAAA,QAC3C,KACEA,KAAcP,MAAW,WACrB,wBACA;AAAA,QAEN,KAAAM;AAAA,QACA,SAAS,CAAC,MAAM;AACd,cAAIH,GAAY;AACd,cAAE,eAAe;AACjB;AAAA,UACF;AAEI,UAAA,CAACI,KAAc,CAACP,KAClBkB,EAAyB,GAAGnB,CAAE,GAGhCE,KAAA,QAAAA,EAAU;AAAA,QACZ;AAAA,QACA,MAAK;AAAA,QAEJ,UAAAa;AAAA,MAAA;AAAA,IAAA,IAMLG,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGL;AAAA,QACJ,MAAAV;AAAA,QACA,UAAUC;AAAA,QACV,KAAAG;AAAA,QACA,SAAS,CAAC,MAAM;AACV,UAAA,CAACH,KAAcF,KACjBA,EAAQ,CAAC;AAAA,QAEb;AAAA,QAEC,UAAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEArB,EAAO,cAAc;"}

package/dist/components/ButtonGroup/ButtonGroup.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../node_modules/react/jsx-runtime.cjs.js"),u=require("react"),c=require("../../node_modules/@react-aria/radio/dist/useRadio.cjs.js"),p=require("../../node_modules/@react-aria/radio/dist/useRadioGroup.cjs.js"),x=require("../../node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.cjs.js"),R=require("../../node_modules/@react-stately/radio/dist/useRadioGroupState.cjs.js");;/* empty css                     */const G=require("../../utils/string.cjs.js");let a=u.createContext(null);function s(i){let t={...i,"data-testid":void 0},e=R.useRadioGroupState(t),{radioGroupProps:r}=p.useRadioGroup(t,e);return o.jsxRuntimeExports.jsx("div",{...r,className:"proton-ButtonGroup","data-value":e.selectedValue,"data-testid":i["data-testid"]||void 0,children:o.jsxRuntimeExports.jsx(a.Provider,{value:e,children:i.children})})}s.displayName="ProtonUIButtonGroup";s.Option=function(t){let e={...t,"data-testid":void 0},r=u.useContext(a),n=u.useRef(null),{inputProps:l,isSelected:d}=c.useRadio(e,r,n);return o.jsxRuntimeExports.jsxs("label",{className:G.csx("proton-ButtonGroup__option",d&&"proton-ButtonGroup__option--selected"),"data-selected":d||void 0,"data-testid":t["data-testid"]||void 0,children:[o.jsxRuntimeExports.jsx(x.VisuallyHidden,{children:o.jsxRuntimeExports.jsx("input",{...l,ref:n})}),t.children]})};exports.ButtonGroup=s;
+//# sourceMappingURL=ButtonGroup.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.cjs.js","sources":["../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { createContext, useContext, useRef } from \"react\";\r\nimport { useRadio, useRadioGroup } from \"@react-aria/radio\";\r\nimport { VisuallyHidden } from \"@react-aria/visually-hidden\";\r\nimport { useRadioGroupState } from \"@react-stately/radio\";\r\nimport { csx } from \"../../utils\";\r\n\r\nimport \"./ButtonGroup.css\";\r\n\r\nexport interface ButtonGroupProps {\r\n  /**\r\n   * The value of the currently selected option in the ButtonGroup. Providing\r\n   * this prop causes the component to become controlled.\r\n   */\r\n  value?: string;\r\n\r\n  /**\r\n   * The initially selected value of the ButtonGroup.\r\n   */\r\n  defaultValue?: string;\r\n\r\n  /**\r\n   * Called when the ButtonGroup's selected value changes.\r\n   */\r\n  onChange?: (value: string) => void;\r\n\r\n  /**\r\n   * The ButtonGroup.Option elements to be rendered as the selectable values.\r\n   */\r\n  children?: React.ReactNode;\r\n}\r\n\r\nlet ButtonGroupContext = createContext(null);\r\n\r\n/**\r\n * A radio button group component that allows selection of a single option from multiple choices.\r\n *\r\n * API:\r\n *  - {@link ButtonGroupProps}\r\n */\r\nexport function ButtonGroup(props: ButtonGroupProps) {\r\n  let sanitizedProps = {\r\n    ...props,\r\n    \"data-testid\": undefined,\r\n  };\r\n\r\n  let state = useRadioGroupState(sanitizedProps);\r\n  let { radioGroupProps } = useRadioGroup(sanitizedProps, state);\r\n\r\n  return (\r\n    <div\r\n      {...radioGroupProps}\r\n      className=\"proton-ButtonGroup\"\r\n      data-value={state.selectedValue}\r\n      data-testid={props[\"data-testid\"] || undefined}\r\n    >\r\n      <ButtonGroupContext.Provider value={state}>\r\n        {props.children}\r\n      </ButtonGroupContext.Provider>\r\n    </div>\r\n  );\r\n}\r\n\r\nButtonGroup.displayName = \"ProtonUIButtonGroup\";\r\n\r\nexport interface ButtonGroupOptionProps {\r\n  /**\r\n   * The value of this option. When this option is selected, this value will\r\n   * become the ButtonGroup's new `selectedValue`.\r\n   */\r\n  value: string;\r\n\r\n  /**\r\n   * The text or component to be rendered as this option's content.\r\n   */\r\n  children: React.ReactNode;\r\n}\r\n\r\nButtonGroup.Option = function ButtonGroupOption(props: ButtonGroupOptionProps) {\r\n  let sanitizedProps = {\r\n    ...props,\r\n    \"data-testid\": undefined,\r\n  };\r\n\r\n  let state = useContext(ButtonGroupContext);\r\n  let ref = useRef(null);\r\n  let { inputProps, isSelected } = useRadio(sanitizedProps, state, ref);\r\n\r\n  return (\r\n    <label\r\n      className={csx(\r\n        \"proton-ButtonGroup__option\",\r\n        isSelected && \"proton-ButtonGroup__option--selected\"\r\n      )}\r\n      data-selected={isSelected || undefined}\r\n      data-testid={props[\"data-testid\"] || undefined}\r\n    >\r\n      <VisuallyHidden>\r\n        <input {...inputProps} ref={ref} />\r\n      </VisuallyHidden>\r\n      {props.children}\r\n    </label>\r\n  );\r\n};\r\n"],"names":["ButtonGroupContext","createContext","ButtonGroup","props","sanitizedProps","state","useRadioGroupState","radioGroupProps","useRadioGroup","jsx","useContext","ref","useRef","inputProps","isSelected","useRadio","jsxs","csx","VisuallyHidden"],"mappings":"ijBAiCA,IAAIA,EAAqBC,EAAAA,cAAc,IAAI,EAQpC,SAASC,EAAYC,EAAyB,CACnD,IAAIC,EAAiB,CACnB,GAAGD,EACH,cAAe,MAAA,EAGbE,EAAQC,qBAAmBF,CAAc,EACzC,CAAE,gBAAAG,CAAoB,EAAAC,EAAA,cAAcJ,EAAgBC,CAAK,EAG3D,OAAAI,EAAA,kBAAA,IAAC,MAAA,CACE,GAAGF,EACJ,UAAU,qBACV,aAAYF,EAAM,cAClB,cAAaF,EAAM,aAAa,GAAK,OAErC,iCAACH,EAAmB,SAAnB,CAA4B,MAAOK,EACjC,WAAM,SACT,CAAA,CAAA,CAGN,CAEAH,EAAY,YAAc,sBAe1BA,EAAY,OAAS,SAA2BC,EAA+B,CAC7E,IAAIC,EAAiB,CACnB,GAAGD,EACH,cAAe,MAAA,EAGbE,EAAQK,aAAWV,CAAkB,EACrCW,EAAMC,SAAO,IAAI,EACjB,CAAE,WAAAC,EAAY,WAAAC,GAAeC,EAAS,SAAAX,EAAgBC,EAAOM,CAAG,EAGlE,OAAAK,EAAA,kBAAA,KAAC,QAAA,CACC,UAAWC,EAAA,IACT,6BACAH,GAAc,sCAChB,EACA,gBAAeA,GAAc,OAC7B,cAAaX,EAAM,aAAa,GAAK,OAErC,SAAA,CAAAM,wBAACS,EAAAA,gBACC,SAACT,EAAA,kBAAA,IAAA,QAAA,CAAO,GAAGI,EAAY,IAAAF,CAAU,CAAA,EACnC,EACCR,EAAM,QAAA,CAAA,CAAA,CAGb"}

package/dist/components/ButtonGroup/ButtonGroup.es.js

@@ -0,0 +1,51 @@
+import { j as o } from "../../node_modules/react/jsx-runtime.es.js";
+import { createContext as l, useContext as p, useRef as c } from "react";
+import { useRadio as f } from "../../node_modules/@react-aria/radio/dist/useRadio.es.js";
+import { useRadioGroup as m } from "../../node_modules/@react-aria/radio/dist/useRadioGroup.es.js";
+import { VisuallyHidden as x } from "../../node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.es.js";
+import { useRadioGroupState as $ } from "../../node_modules/@react-stately/radio/dist/useRadioGroupState.es.js";
+/* empty css                   */
+import { csx as G } from "../../utils/string.es.js";
+let s = l(null);
+function n(r) {
+  let t = {
+    ...r,
+    "data-testid": void 0
+  }, e = $(t), { radioGroupProps: a } = m(t, e);
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      ...a,
+      className: "proton-ButtonGroup",
+      "data-value": e.selectedValue,
+      "data-testid": r["data-testid"] || void 0,
+      children: /* @__PURE__ */ o.jsx(s.Provider, { value: e, children: r.children })
+    }
+  );
+}
+n.displayName = "ProtonUIButtonGroup";
+n.Option = function(t) {
+  let e = {
+    ...t,
+    "data-testid": void 0
+  }, a = p(s), d = c(null), { inputProps: u, isSelected: i } = f(e, a, d);
+  return /* @__PURE__ */ o.jsxs(
+    "label",
+    {
+      className: G(
+        "proton-ButtonGroup__option",
+        i && "proton-ButtonGroup__option--selected"
+      ),
+      "data-selected": i || void 0,
+      "data-testid": t["data-testid"] || void 0,
+      children: [
+        /* @__PURE__ */ o.jsx(x, { children: /* @__PURE__ */ o.jsx("input", { ...u, ref: d }) }),
+        t.children
+      ]
+    }
+  );
+};
+export {
+  n as ButtonGroup
+};
+//# sourceMappingURL=ButtonGroup.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.es.js","sources":["../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { createContext, useContext, useRef } from \"react\";\r\nimport { useRadio, useRadioGroup } from \"@react-aria/radio\";\r\nimport { VisuallyHidden } from \"@react-aria/visually-hidden\";\r\nimport { useRadioGroupState } from \"@react-stately/radio\";\r\nimport { csx } from \"../../utils\";\r\n\r\nimport \"./ButtonGroup.css\";\r\n\r\nexport interface ButtonGroupProps {\r\n  /**\r\n   * The value of the currently selected option in the ButtonGroup. Providing\r\n   * this prop causes the component to become controlled.\r\n   */\r\n  value?: string;\r\n\r\n  /**\r\n   * The initially selected value of the ButtonGroup.\r\n   */\r\n  defaultValue?: string;\r\n\r\n  /**\r\n   * Called when the ButtonGroup's selected value changes.\r\n   */\r\n  onChange?: (value: string) => void;\r\n\r\n  /**\r\n   * The ButtonGroup.Option elements to be rendered as the selectable values.\r\n   */\r\n  children?: React.ReactNode;\r\n}\r\n\r\nlet ButtonGroupContext = createContext(null);\r\n\r\n/**\r\n * A radio button group component that allows selection of a single option from multiple choices.\r\n *\r\n * API:\r\n *  - {@link ButtonGroupProps}\r\n */\r\nexport function ButtonGroup(props: ButtonGroupProps) {\r\n  let sanitizedProps = {\r\n    ...props,\r\n    \"data-testid\": undefined,\r\n  };\r\n\r\n  let state = useRadioGroupState(sanitizedProps);\r\n  let { radioGroupProps } = useRadioGroup(sanitizedProps, state);\r\n\r\n  return (\r\n    <div\r\n      {...radioGroupProps}\r\n      className=\"proton-ButtonGroup\"\r\n      data-value={state.selectedValue}\r\n      data-testid={props[\"data-testid\"] || undefined}\r\n    >\r\n      <ButtonGroupContext.Provider value={state}>\r\n        {props.children}\r\n      </ButtonGroupContext.Provider>\r\n    </div>\r\n  );\r\n}\r\n\r\nButtonGroup.displayName = \"ProtonUIButtonGroup\";\r\n\r\nexport interface ButtonGroupOptionProps {\r\n  /**\r\n   * The value of this option. When this option is selected, this value will\r\n   * become the ButtonGroup's new `selectedValue`.\r\n   */\r\n  value: string;\r\n\r\n  /**\r\n   * The text or component to be rendered as this option's content.\r\n   */\r\n  children: React.ReactNode;\r\n}\r\n\r\nButtonGroup.Option = function ButtonGroupOption(props: ButtonGroupOptionProps) {\r\n  let sanitizedProps = {\r\n    ...props,\r\n    \"data-testid\": undefined,\r\n  };\r\n\r\n  let state = useContext(ButtonGroupContext);\r\n  let ref = useRef(null);\r\n  let { inputProps, isSelected } = useRadio(sanitizedProps, state, ref);\r\n\r\n  return (\r\n    <label\r\n      className={csx(\r\n        \"proton-ButtonGroup__option\",\r\n        isSelected && \"proton-ButtonGroup__option--selected\"\r\n      )}\r\n      data-selected={isSelected || undefined}\r\n      data-testid={props[\"data-testid\"] || undefined}\r\n    >\r\n      <VisuallyHidden>\r\n        <input {...inputProps} ref={ref} />\r\n      </VisuallyHidden>\r\n      {props.children}\r\n    </label>\r\n  );\r\n};\r\n"],"names":["ButtonGroupContext","createContext","ButtonGroup","props","sanitizedProps","state","useRadioGroupState","radioGroupProps","useRadioGroup","jsx","useContext","ref","useRef","inputProps","isSelected","useRadio","jsxs","csx","VisuallyHidden"],"mappings":";;;;;;;;AAiCA,IAAIA,IAAqBC,EAAc,IAAI;AAQpC,SAASC,EAAYC,GAAyB;AACnD,MAAIC,IAAiB;AAAA,IACnB,GAAGD;AAAA,IACH,eAAe;AAAA,EAAA,GAGbE,IAAQC,EAAmBF,CAAc,GACzC,EAAE,iBAAAG,EAAoB,IAAAC,EAAcJ,GAAgBC,CAAK;AAG3D,SAAAI,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,WAAU;AAAA,MACV,cAAYF,EAAM;AAAA,MAClB,eAAaF,EAAM,aAAa,KAAK;AAAA,MAErC,gCAACH,EAAmB,UAAnB,EAA4B,OAAOK,GACjC,YAAM,UACT;AAAA,IAAA;AAAA,EAAA;AAGN;AAEAH,EAAY,cAAc;AAe1BA,EAAY,SAAS,SAA2BC,GAA+B;AAC7E,MAAIC,IAAiB;AAAA,IACnB,GAAGD;AAAA,IACH,eAAe;AAAA,EAAA,GAGbE,IAAQK,EAAWV,CAAkB,GACrCW,IAAMC,EAAO,IAAI,GACjB,EAAE,YAAAC,GAAY,YAAAC,MAAeC,EAASX,GAAgBC,GAAOM,CAAG;AAGlE,SAAAK,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAH,KAAc;AAAA,MAChB;AAAA,MACA,iBAAeA,KAAc;AAAA,MAC7B,eAAaX,EAAM,aAAa,KAAK;AAAA,MAErC,UAAA;AAAA,QAAAM,gBAAAA,MAACS,KACC,UAACT,gBAAAA,EAAA,IAAA,SAAA,EAAO,GAAGI,GAAY,KAAAF,EAAU,CAAA,GACnC;AAAA,QACCR,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGb;"}

package/dist/components/ButtonWithSelect/ButtonWithSelect.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"),R=require("react"),o=require("../Button/Button.cjs.js"),S=require("../Icon/Icon.cjs.js"),E=require("../Menu/MenuTrigger.cjs.js");;/* empty css                          */const u=44;function c({items:e,defaultValue:s,children:l,onSelectionChange:d,disabledKeys:a,selectedKey:g,icon:j,variant:i,fullWidth:r,onPress:h,...n}){const m=r?u/2:0;return t.jsxRuntimeExports.jsxs("div",{className:"proton-ButtonWithSelect",children:[t.jsxRuntimeExports.jsx("div",{className:"proton-ButtonWithSelect__button",style:{"--proton-button-text-shift":`${m}px`,"--flex":r?1:0},children:t.jsxRuntimeExports.jsx(o.Button,{...n,onPress:h,icon:j,fullWidth:r,variant:i,"data-testid":"ButtonWithSelect-Button",children:l})}),t.jsxRuntimeExports.jsx(E.MenuTrigger,{items:e,disabled:n.isDisabled,disabledKeys:a,onSelectionChange:d,selectedKey:g,renderTrigger:({isOpen:p,setIsOpen:B})=>t.jsxRuntimeExports.jsx(x,{...n,variant:i,onPress:()=>B(!p)})})]})}c.displayName="ProtonUIButtonWithSelect";const x=R.forwardRef((e,s)=>t.jsxRuntimeExports.jsx("div",{className:"proton-ButtonWithSelect__trigger",style:{"--trigger-width":`${u}px`},children:t.jsxRuntimeExports.jsx(o.Button,{...e,"data-testid":"ButtonWithSelect-Trigger",ref:s,children:t.jsxRuntimeExports.jsx("div",{className:"proton-ButtonWithSelect__trigger-content",children:t.jsxRuntimeExports.jsx(S.Icon,{id:"chevron-down",size:16})})})}));x.displayName="ProtonUIButtonWithSelectTrigger";exports.ButtonWithSelect=c;
+//# sourceMappingURL=ButtonWithSelect.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonWithSelect.cjs.js","sources":["../../../src/components/ButtonWithSelect/ButtonWithSelect.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { Button, type ButtonProps } from \"../Button/Button\";\r\nimport { Icon } from \"../Icon/Icon\";\r\nimport { MenuTrigger } from \"../Menu/MenuTrigger\";\r\nimport type { ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\n\r\nimport \"./ButtonWithSelect.css\";\r\n\r\nconst FIXED_TRIGGER_WIDTH = 44;\r\n\r\ninterface ButtonWithSelectProps extends ButtonProps {\r\n  /**\r\n   * The default value of the select menu.\r\n   */\r\n  defaultValue?: string;\r\n  /**\r\n   * The keys of the disabled items.\r\n   */\r\n  disabledKeys?: string[];\r\n  /**\r\n   * The items to display in the select menu.\r\n   * - type {@link ActionMenuAction}\r\n   */\r\n  items: ActionMenuAction[];\r\n  /**\r\n   * The callback function to call when the selection changes.\r\n   */\r\n  onSelectionChange?: (key: string) => void;\r\n  /**\r\n   * The key of the selected item.\r\n   */\r\n  selectedKey?: string;\r\n}\r\n\r\n/**\r\n * A button with a select menu.\r\n *\r\n * API:\r\n *  - {@link ButtonWithSelectProps}\r\n *  - extends {@link ButtonProps}\r\n */\r\nexport function ButtonWithSelect({\r\n  items,\r\n  defaultValue,\r\n  children,\r\n  onSelectionChange,\r\n  disabledKeys,\r\n  selectedKey,\r\n  icon,\r\n  variant,\r\n  fullWidth,\r\n  onPress,\r\n  ...buttonProps\r\n}: ButtonWithSelectProps) {\r\n  const textShift = fullWidth ? FIXED_TRIGGER_WIDTH / 2 : 0;\r\n\r\n  return (\r\n    <div className=\"proton-ButtonWithSelect\">\r\n      <div\r\n        className=\"proton-ButtonWithSelect__button\"\r\n        style={\r\n          {\r\n            \"--proton-button-text-shift\": `${textShift}px`,\r\n            \"--flex\": fullWidth ? 1 : 0,\r\n          } as React.CSSProperties\r\n        }\r\n      >\r\n        <Button\r\n          {...buttonProps}\r\n          onPress={onPress}\r\n          icon={icon}\r\n          fullWidth={fullWidth}\r\n          variant={variant}\r\n          data-testid=\"ButtonWithSelect-Button\"\r\n        >\r\n          {children}\r\n        </Button>\r\n      </div>\r\n\r\n      <MenuTrigger\r\n        items={items}\r\n        disabled={buttonProps.isDisabled}\r\n        disabledKeys={disabledKeys}\r\n        onSelectionChange={onSelectionChange}\r\n        selectedKey={selectedKey}\r\n        renderTrigger={({ isOpen, setIsOpen }) => {\r\n          return (\r\n            <TriggerButton\r\n              {...buttonProps}\r\n              variant={variant}\r\n              onPress={() => setIsOpen(!isOpen)}\r\n            />\r\n          );\r\n        }}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\nButtonWithSelect.displayName = \"ProtonUIButtonWithSelect\";\r\n\r\nconst TriggerButton = React.forwardRef<\r\n  HTMLButtonElement | HTMLAnchorElement,\r\n  ButtonProps\r\n>((props, ref) => {\r\n  return (\r\n    <div\r\n      className=\"proton-ButtonWithSelect__trigger\"\r\n      style={\r\n        {\r\n          \"--trigger-width\": `${FIXED_TRIGGER_WIDTH}px`,\r\n        } as React.CSSProperties\r\n      }\r\n    >\r\n      <Button {...props} data-testid=\"ButtonWithSelect-Trigger\" ref={ref}>\r\n        <div className=\"proton-ButtonWithSelect__trigger-content\">\r\n          <Icon id=\"chevron-down\" size={16} />\r\n        </div>\r\n      </Button>\r\n    </div>\r\n  );\r\n});\r\n\r\nTriggerButton.displayName = \"ProtonUIButtonWithSelectTrigger\";\r\n"],"names":["FIXED_TRIGGER_WIDTH","ButtonWithSelect","items","defaultValue","children","onSelectionChange","disabledKeys","selectedKey","icon","variant","fullWidth","onPress","buttonProps","textShift","jsxs","jsx","Button","MenuTrigger","isOpen","setIsOpen","TriggerButton","React","props","ref","Icon"],"mappings":"yTAQA,MAAMA,EAAsB,GAiCrB,SAASC,EAAiB,CAC/B,MAAAC,EACA,aAAAC,EACA,SAAAC,EACA,kBAAAC,EACA,aAAAC,EACA,YAAAC,EACA,KAAAC,EACA,QAAAC,EACA,UAAAC,EACA,QAAAC,EACA,GAAGC,CACL,EAA0B,CAClB,MAAAC,EAAYH,EAAYV,EAAsB,EAAI,EAGtD,OAAAc,EAAA,kBAAA,KAAC,MAAI,CAAA,UAAU,0BACb,SAAA,CAAAC,EAAA,kBAAA,IAAC,MAAA,CACC,UAAU,kCACV,MACE,CACE,6BAA8B,GAAGF,CAAS,KAC1C,SAAUH,EAAY,EAAI,CAC5B,EAGF,SAAAK,EAAA,kBAAA,IAACC,EAAA,OAAA,CACE,GAAGJ,EACJ,QAAAD,EACA,KAAAH,EACA,UAAAE,EACA,QAAAD,EACA,cAAY,0BAEX,SAAAL,CAAA,CACH,CAAA,CACF,EAEAW,EAAA,kBAAA,IAACE,EAAA,YAAA,CACC,MAAAf,EACA,SAAUU,EAAY,WACtB,aAAAN,EACA,kBAAAD,EACA,YAAAE,EACA,cAAe,CAAC,CAAE,OAAAW,EAAQ,UAAAC,KAEtBJ,EAAA,kBAAA,IAACK,EAAA,CACE,GAAGR,EACJ,QAAAH,EACA,QAAS,IAAMU,EAAU,CAACD,CAAM,CAAA,CAAA,CAGtC,CACF,CACF,CAAA,CAAA,CAEJ,CAEAjB,EAAiB,YAAc,2BAE/B,MAAMmB,EAAgBC,EAAM,WAG1B,CAACC,EAAOC,IAENR,EAAA,kBAAA,IAAC,MAAA,CACC,UAAU,mCACV,MACE,CACE,kBAAmB,GAAGf,CAAmB,IAC3C,EAGF,iCAACgB,SAAQ,CAAA,GAAGM,EAAO,cAAY,2BAA2B,IAAAC,EACxD,SAACR,EAAAA,kBAAAA,IAAA,MAAA,CAAI,UAAU,2CACb,iCAACS,EAAAA,KAAK,CAAA,GAAG,eAAe,KAAM,GAAI,EACpC,CACF,CAAA,CAAA,CAAA,CAGL,EAEDJ,EAAc,YAAc"}

package/dist/components/ButtonWithSelect/ButtonWithSelect.es.js

@@ -0,0 +1,80 @@
+import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
+import j from "react";
+import { Button as s } from "../Button/Button.es.js";
+import { Icon as S } from "../Icon/Icon.es.js";
+import { MenuTrigger as f } from "../Menu/MenuTrigger.es.js";
+/* empty css                        */
+const c = 44;
+function W({
+  items: e,
+  defaultValue: i,
+  children: l,
+  onSelectionChange: a,
+  disabledKeys: m,
+  selectedKey: u,
+  icon: x,
+  variant: n,
+  fullWidth: r,
+  onPress: g,
+  ...o
+}) {
+  const h = r ? c / 2 : 0;
+  return /* @__PURE__ */ t.jsxs("div", { className: "proton-ButtonWithSelect", children: [
+    /* @__PURE__ */ t.jsx(
+      "div",
+      {
+        className: "proton-ButtonWithSelect__button",
+        style: {
+          "--proton-button-text-shift": `${h}px`,
+          "--flex": r ? 1 : 0
+        },
+        children: /* @__PURE__ */ t.jsx(
+          s,
+          {
+            ...o,
+            onPress: g,
+            icon: x,
+            fullWidth: r,
+            variant: n,
+            "data-testid": "ButtonWithSelect-Button",
+            children: l
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ t.jsx(
+      f,
+      {
+        items: e,
+        disabled: o.isDisabled,
+        disabledKeys: m,
+        onSelectionChange: a,
+        selectedKey: u,
+        renderTrigger: ({ isOpen: p, setIsOpen: B }) => /* @__PURE__ */ t.jsx(
+          d,
+          {
+            ...o,
+            variant: n,
+            onPress: () => B(!p)
+          }
+        )
+      }
+    )
+  ] });
+}
+W.displayName = "ProtonUIButtonWithSelect";
+const d = j.forwardRef((e, i) => /* @__PURE__ */ t.jsx(
+  "div",
+  {
+    className: "proton-ButtonWithSelect__trigger",
+    style: {
+      "--trigger-width": `${c}px`
+    },
+    children: /* @__PURE__ */ t.jsx(s, { ...e, "data-testid": "ButtonWithSelect-Trigger", ref: i, children: /* @__PURE__ */ t.jsx("div", { className: "proton-ButtonWithSelect__trigger-content", children: /* @__PURE__ */ t.jsx(S, { id: "chevron-down", size: 16 }) }) })
+  }
+));
+d.displayName = "ProtonUIButtonWithSelectTrigger";
+export {
+  W as ButtonWithSelect
+};
+//# sourceMappingURL=ButtonWithSelect.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonWithSelect.es.js","sources":["../../../src/components/ButtonWithSelect/ButtonWithSelect.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { Button, type ButtonProps } from \"../Button/Button\";\r\nimport { Icon } from \"../Icon/Icon\";\r\nimport { MenuTrigger } from \"../Menu/MenuTrigger\";\r\nimport type { ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\n\r\nimport \"./ButtonWithSelect.css\";\r\n\r\nconst FIXED_TRIGGER_WIDTH = 44;\r\n\r\ninterface ButtonWithSelectProps extends ButtonProps {\r\n  /**\r\n   * The default value of the select menu.\r\n   */\r\n  defaultValue?: string;\r\n  /**\r\n   * The keys of the disabled items.\r\n   */\r\n  disabledKeys?: string[];\r\n  /**\r\n   * The items to display in the select menu.\r\n   * - type {@link ActionMenuAction}\r\n   */\r\n  items: ActionMenuAction[];\r\n  /**\r\n   * The callback function to call when the selection changes.\r\n   */\r\n  onSelectionChange?: (key: string) => void;\r\n  /**\r\n   * The key of the selected item.\r\n   */\r\n  selectedKey?: string;\r\n}\r\n\r\n/**\r\n * A button with a select menu.\r\n *\r\n * API:\r\n *  - {@link ButtonWithSelectProps}\r\n *  - extends {@link ButtonProps}\r\n */\r\nexport function ButtonWithSelect({\r\n  items,\r\n  defaultValue,\r\n  children,\r\n  onSelectionChange,\r\n  disabledKeys,\r\n  selectedKey,\r\n  icon,\r\n  variant,\r\n  fullWidth,\r\n  onPress,\r\n  ...buttonProps\r\n}: ButtonWithSelectProps) {\r\n  const textShift = fullWidth ? FIXED_TRIGGER_WIDTH / 2 : 0;\r\n\r\n  return (\r\n    <div className=\"proton-ButtonWithSelect\">\r\n      <div\r\n        className=\"proton-ButtonWithSelect__button\"\r\n        style={\r\n          {\r\n            \"--proton-button-text-shift\": `${textShift}px`,\r\n            \"--flex\": fullWidth ? 1 : 0,\r\n          } as React.CSSProperties\r\n        }\r\n      >\r\n        <Button\r\n          {...buttonProps}\r\n          onPress={onPress}\r\n          icon={icon}\r\n          fullWidth={fullWidth}\r\n          variant={variant}\r\n          data-testid=\"ButtonWithSelect-Button\"\r\n        >\r\n          {children}\r\n        </Button>\r\n      </div>\r\n\r\n      <MenuTrigger\r\n        items={items}\r\n        disabled={buttonProps.isDisabled}\r\n        disabledKeys={disabledKeys}\r\n        onSelectionChange={onSelectionChange}\r\n        selectedKey={selectedKey}\r\n        renderTrigger={({ isOpen, setIsOpen }) => {\r\n          return (\r\n            <TriggerButton\r\n              {...buttonProps}\r\n              variant={variant}\r\n              onPress={() => setIsOpen(!isOpen)}\r\n            />\r\n          );\r\n        }}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\nButtonWithSelect.displayName = \"ProtonUIButtonWithSelect\";\r\n\r\nconst TriggerButton = React.forwardRef<\r\n  HTMLButtonElement | HTMLAnchorElement,\r\n  ButtonProps\r\n>((props, ref) => {\r\n  return (\r\n    <div\r\n      className=\"proton-ButtonWithSelect__trigger\"\r\n      style={\r\n        {\r\n          \"--trigger-width\": `${FIXED_TRIGGER_WIDTH}px`,\r\n        } as React.CSSProperties\r\n      }\r\n    >\r\n      <Button {...props} data-testid=\"ButtonWithSelect-Trigger\" ref={ref}>\r\n        <div className=\"proton-ButtonWithSelect__trigger-content\">\r\n          <Icon id=\"chevron-down\" size={16} />\r\n        </div>\r\n      </Button>\r\n    </div>\r\n  );\r\n});\r\n\r\nTriggerButton.displayName = \"ProtonUIButtonWithSelectTrigger\";\r\n"],"names":["FIXED_TRIGGER_WIDTH","ButtonWithSelect","items","defaultValue","children","onSelectionChange","disabledKeys","selectedKey","icon","variant","fullWidth","onPress","buttonProps","textShift","jsxs","jsx","Button","MenuTrigger","isOpen","setIsOpen","TriggerButton","React","props","ref","Icon"],"mappings":";;;;;;AAQA,MAAMA,IAAsB;AAiCrB,SAASC,EAAiB;AAAA,EAC/B,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAA0B;AAClB,QAAAC,IAAYH,IAAYV,IAAsB,IAAI;AAGtD,SAAAc,gBAAAA,EAAA,KAAC,OAAI,EAAA,WAAU,2BACb,UAAA;AAAA,IAAAC,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OACE;AAAA,UACE,8BAA8B,GAAGF,CAAS;AAAA,UAC1C,UAAUH,IAAY,IAAI;AAAA,QAC5B;AAAA,QAGF,UAAAK,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACE,GAAGJ;AAAA,YACJ,SAAAD;AAAA,YACA,MAAAH;AAAA,YACA,WAAAE;AAAA,YACA,SAAAD;AAAA,YACA,eAAY;AAAA,YAEX,UAAAL;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IACF;AAAA,IAEAW,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,OAAAf;AAAA,QACA,UAAUU,EAAY;AAAA,QACtB,cAAAN;AAAA,QACA,mBAAAD;AAAA,QACA,aAAAE;AAAA,QACA,eAAe,CAAC,EAAE,QAAAW,GAAQ,WAAAC,QAEtBJ,gBAAAA,EAAA;AAAA,UAACK;AAAA,UAAA;AAAA,YACE,GAAGR;AAAA,YACJ,SAAAH;AAAA,YACA,SAAS,MAAMU,EAAU,CAACD,CAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MAGtC;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;AAEAjB,EAAiB,cAAc;AAE/B,MAAMmB,IAAgBC,EAAM,WAG1B,CAACC,GAAOC,MAENR,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,OACE;AAAA,MACE,mBAAmB,GAAGf,CAAmB;AAAA,IAC3C;AAAA,IAGF,gCAACgB,GAAQ,EAAA,GAAGM,GAAO,eAAY,4BAA2B,KAAAC,GACxD,UAACR,gBAAAA,EAAAA,IAAA,OAAA,EAAI,WAAU,4CACb,gCAACS,GAAK,EAAA,IAAG,gBAAe,MAAM,IAAI,GACpC,EACF,CAAA;AAAA,EAAA;AAAA,CAGL;AAEDJ,EAAc,cAAc;"}

package/dist/components/DataTable/DataTable.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"),D=require("react"),s=require("../Table/Table.cjs.js"),f=require("../Elevation/Elevation.cjs.js"),_=require("../Tombstone/Tombstone.cjs.js"),q=require("../Icon/Icon.cjs.js");;/* empty css                   */function N(r){const{columns:x,data:l=[],loading:j=!1,tombstoneComponent:u,error:a=!1,name:d,onRowClick:m,emptyMessage:T="Data Unavailable",errorMessage:C,loadingRows:y=5,"data-testid":c}=r,g="sortableColumns"in r?r.sortableColumns:[],b="sortedBy"in r?r.sortedBy:void 0,p="sortDirection"in r?r.sortDirection:void 0,h="onSort"in r?r.onSort:void 0,o=D.useMemo(()=>x.filter(e=>!e.hidden),[x]),S=e=>{if(!h)return;const n=b===e.id&&p==="ASC"?"DESC":"ASC";h(e.id,n)},v=e=>b!==e?"none":p==="ASC"?"ascending":"descending";if(a){const e=typeof a=="string"?a:C||"An error occurred";return t.jsxRuntimeExports.jsx(E,{columns:o,message:e,name:d,testId:c,isError:!0})}return j?t.jsxRuntimeExports.jsx("div",{className:"proton-DataTable","data-testid":c,"aria-busy":"true","aria-label":`Loading ${d}...`,children:t.jsxRuntimeExports.jsxs(s.Table,{name:d,children:[t.jsxRuntimeExports.jsx(s.Table.Header,{children:o.map(e=>t.jsxRuntimeExports.jsx(s.Table.Column,{id:e.id,children:e.header},e.id))}),t.jsxRuntimeExports.jsx(s.Table.Body,{children:Array.from({length:y}).map((e,i)=>t.jsxRuntimeExports.jsx(s.Table.Row,{children:o.map(n=>t.jsxRuntimeExports.jsx(s.Table.Cell,{children:u||t.jsxRuntimeExports.jsx(_.Tombstone,{height:"1rem",width:i%3===0?"80%":i%3===1?"60%":"90%"})},n.id))},`loading-${i}`))})]})}):!l||l.length===0?t.jsxRuntimeExports.jsx(E,{columns:o,message:T,name:d,testId:c}):t.jsxRuntimeExports.jsx("div",{className:"proton-DataTable","data-testid":c,children:t.jsxRuntimeExports.jsxs(s.Table,{name:d,children:[t.jsxRuntimeExports.jsx(s.Table.Header,{children:o.map(e=>{const i=g.includes(e.id),n=v(e.id);return t.jsxRuntimeExports.jsx(s.Table.Column,{id:e.id,...i&&{"aria-sort":n},children:t.jsxRuntimeExports.jsxs("span",{className:"proton-DataTable__header-content",children:[e.header,i&&t.jsxRuntimeExports.jsx("button",{className:"proton-DataTable__sort-button",onClick:()=>S(e),"aria-label":`Sort by ${e.header}: ${n}`,type:"button",children:t.jsxRuntimeExports.jsx(q.Icon,{id:"chevron-up",size:12,color:n==="ascending"?"var(--proton-color__primary)":"currentColor"})})]})},e.id)})}),t.jsxRuntimeExports.jsx(s.Table.Body,{children:l.map((e,i)=>{const n=((e==null?void 0:e.id)||(e==null?void 0:e.key))??i;return t.jsxRuntimeExports.jsx(s.Table.Row,{onClick:m?()=>m(e):void 0,children:o.map(R=>t.jsxRuntimeExports.jsx(s.Table.Cell,{children:R.cell(e)},R.id))},n)})})]})})}const E=({columns:r,message:x,name:l,testId:j,isError:u=!1})=>t.jsxRuntimeExports.jsx("div",{className:"proton-DataTable","data-testid":j,children:t.jsxRuntimeExports.jsxs(s.Table,{name:l,children:[t.jsxRuntimeExports.jsx(s.Table.Header,{children:r==null?void 0:r.map(a=>t.jsxRuntimeExports.jsx(s.Table.Column,{id:a.id,children:a.header},a.id))}),t.jsxRuntimeExports.jsx(s.Table.Body,{children:t.jsxRuntimeExports.jsx(s.Table.Row,{children:t.jsxRuntimeExports.jsx(s.Table.Cell,{colSpan:(r==null?void 0:r.length)||1,children:t.jsxRuntimeExports.jsx("div",{className:"proton-DataTable__message-cell",role:u?"alert":"status","aria-live":"polite",children:t.jsxRuntimeExports.jsx(f.Elevation,{children:t.jsxRuntimeExports.jsx("div",{className:"proton-DataTable__empty-cell",children:x})})})})})})]})});exports.DataTable=N;
+//# sourceMappingURL=DataTable.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.cjs.js","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { AriaAttributes, ReactNode, useMemo } from \"react\";\r\nimport { Table } from \"../Table/Table\";\r\nimport { Elevation } from \"../Elevation/Elevation\";\r\nimport { Tombstone } from \"../Tombstone/Tombstone\";\r\nimport { Icon } from \"../Icon/Icon\";\r\nimport \"./DataTable.css\";\r\n\r\nexport type SortDirection = \"ASC\" | \"DESC\";\r\n\r\ntype SortingConfig<T> =\r\n  | {\r\n      /** When sorting is enabled, all these props must be provided together. */\r\n      sortableColumns: string[];\r\n      sortedBy: string;\r\n      sortDirection: SortDirection;\r\n      onSort: (columnId: string, direction: SortDirection) => void;\r\n    }\r\n  | {\r\n      /** When no sorting is needed, none of these props should be provided */\r\n      sortableColumns?: never;\r\n      sortedBy?: never;\r\n      sortDirection?: never;\r\n      onSort?: never;\r\n    };\r\n\r\nexport interface DataTableColumn<T> {\r\n  /** id for the column */\r\n  id: string;\r\n  /** Header text or component */\r\n  header: ReactNode;\r\n  /** Function to render cell content from row data */\r\n  cell: (row: T) => ReactNode;\r\n  /** Whether this column should be hidden */\r\n  hidden?: boolean;\r\n}\r\n\r\ninterface BaseDataTableProps<T = any> {\r\n  /** Array of column definitions\r\n   * - {@link DataTableColumn}\r\n   */\r\n  columns: DataTableColumn<T>[];\r\n  /** Array of data objects to display. Can be empty array for loading/empty states */\r\n  data?: T[] | null;\r\n  /** Loading state */\r\n  loading?: boolean;\r\n  /** Tombstone component to use when loading */\r\n  tombstoneComponent?: ReactNode;\r\n  /** Error state */\r\n  error?: boolean | string;\r\n  /** Table name/caption for accessibility. This provides essential context for screen readers. */\r\n  name: string;\r\n  /** Callback when a row is clicked */\r\n  onRowClick?: (row: T) => void;\r\n  /** Custom empty state message */\r\n  emptyMessage?: string;\r\n  /** Custom error message */\r\n  errorMessage?: string;\r\n  /** Number of skeleton rows to show in loading state */\r\n  loadingRows?: number;\r\n  /** Test ID for testing purposes */\r\n  \"data-testid\"?: string;\r\n}\r\n\r\nexport type DataTableProps<T = any> = BaseDataTableProps<T> & SortingConfig<T>;\r\n\r\n/**\r\n * DataTable is a declarative wrapper around the base Table component that provides:\r\n *\r\n * API:\r\n *  - {@link DataTableProps}\r\n *  - {@link SortingConfig}\r\n */\r\nexport function DataTable<T = any>(props: DataTableProps<T>) {\r\n  const {\r\n    columns,\r\n    data = [],\r\n    loading = false,\r\n    tombstoneComponent,\r\n    error = false,\r\n    name,\r\n    onRowClick,\r\n    emptyMessage = \"Data Unavailable\",\r\n    errorMessage,\r\n    loadingRows = 5,\r\n    \"data-testid\": testId,\r\n  } = props;\r\n\r\n  const sortableColumns =\r\n    \"sortableColumns\" in props ? props.sortableColumns : [];\r\n  const sortedBy = \"sortedBy\" in props ? props.sortedBy : undefined;\r\n  const sortDirection =\r\n    \"sortDirection\" in props ? props.sortDirection : undefined;\r\n  const onSort = \"onSort\" in props ? props.onSort : undefined;\r\n\r\n  const visibleColumns = useMemo(\r\n    () => columns.filter((col) => !col.hidden),\r\n    [columns]\r\n  );\r\n\r\n  const handleSortClick = (column: DataTableColumn<T>) => {\r\n    if (!onSort) return;\r\n\r\n    const isCurrentlySorted = sortedBy === column.id;\r\n    const newDirection =\r\n      isCurrentlySorted && sortDirection === \"ASC\" ? \"DESC\" : \"ASC\";\r\n\r\n    onSort(column.id, newDirection);\r\n  };\r\n\r\n  const getSortState = (columnId: string): AriaAttributes[\"aria-sort\"] => {\r\n    if (sortedBy !== columnId) return \"none\";\r\n    return sortDirection === \"ASC\" ? \"ascending\" : \"descending\";\r\n  };\r\n\r\n  if (error) {\r\n    const message =\r\n      typeof error === \"string\" ? error : errorMessage || \"An error occurred\";\r\n    return (\r\n      <EmptyState\r\n        columns={visibleColumns}\r\n        message={message}\r\n        name={name}\r\n        testId={testId}\r\n        isError\r\n      />\r\n    );\r\n  }\r\n\r\n  if (loading) {\r\n    return (\r\n      <div\r\n        className=\"proton-DataTable\"\r\n        data-testid={testId}\r\n        aria-busy=\"true\"\r\n        aria-label={`Loading ${name}...`}\r\n      >\r\n        <Table name={name}>\r\n          <Table.Header>\r\n            {visibleColumns.map((column) => (\r\n              <Table.Column key={column.id} id={column.id}>\r\n                {column.header}\r\n              </Table.Column>\r\n            ))}\r\n          </Table.Header>\r\n          <Table.Body>\r\n            {Array.from({ length: loadingRows }).map((_, index) => (\r\n              <Table.Row key={`loading-${index}`}>\r\n                {visibleColumns.map((column) => (\r\n                  <Table.Cell key={column.id}>\r\n                    {tombstoneComponent || (\r\n                      <Tombstone\r\n                        height=\"1rem\"\r\n                        width={\r\n                          // cascading tombstone widths\r\n                          index % 3 === 0\r\n                            ? \"80%\"\r\n                            : index % 3 === 1\r\n                              ? \"60%\"\r\n                              : \"90%\"\r\n                        }\r\n                      />\r\n                    )}\r\n                  </Table.Cell>\r\n                ))}\r\n              </Table.Row>\r\n            ))}\r\n          </Table.Body>\r\n        </Table>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  if (!data || data.length === 0) {\r\n    return (\r\n      <EmptyState\r\n        columns={visibleColumns}\r\n        message={emptyMessage}\r\n        name={name}\r\n        testId={testId}\r\n      />\r\n    );\r\n  }\r\n\r\n  return (\r\n    <div className=\"proton-DataTable\" data-testid={testId}>\r\n      <Table name={name}>\r\n        <Table.Header>\r\n          {visibleColumns.map((column) => {\r\n            const isSortable = sortableColumns.includes(column.id);\r\n            const sortState = getSortState(column.id);\r\n\r\n            return (\r\n              <Table.Column\r\n                key={column.id}\r\n                id={column.id}\r\n                {...(isSortable && { \"aria-sort\": sortState })}\r\n              >\r\n                <span className=\"proton-DataTable__header-content\">\r\n                  {column.header}\r\n                  {isSortable && (\r\n                    <button\r\n                      className=\"proton-DataTable__sort-button\"\r\n                      onClick={() => handleSortClick(column)}\r\n                      aria-label={`Sort by ${column.header}: ${sortState}`}\r\n                      type=\"button\"\r\n                    >\r\n                      <Icon\r\n                        id={\"chevron-up\"}\r\n                        size={12}\r\n                        color={\r\n                          sortState === \"ascending\"\r\n                            ? \"var(--proton-color__primary)\"\r\n                            : \"currentColor\"\r\n                        }\r\n                      />\r\n                    </button>\r\n                  )}\r\n                </span>\r\n              </Table.Column>\r\n            );\r\n          })}\r\n        </Table.Header>\r\n        <Table.Body>\r\n          {data.map((row, index) => {\r\n            // Generate a key from the row data or use index as fallback\r\n            const rowKey = ((row as any)?.id || (row as any)?.key) ?? index;\r\n\r\n            return (\r\n              <Table.Row\r\n                key={rowKey}\r\n                onClick={onRowClick ? () => onRowClick(row) : undefined}\r\n              >\r\n                {visibleColumns.map((column) => (\r\n                  <Table.Cell key={column.id}>{column.cell(row)}</Table.Cell>\r\n                ))}\r\n              </Table.Row>\r\n            );\r\n          })}\r\n        </Table.Body>\r\n      </Table>\r\n    </div>\r\n  );\r\n}\r\n\r\nconst EmptyState = ({\r\n  columns,\r\n  message,\r\n  name,\r\n  testId,\r\n  isError = false,\r\n}: Partial<DataTableProps> & {\r\n  testId?: string;\r\n  message: string;\r\n  isError?: boolean;\r\n}) => {\r\n  return (\r\n    <div className=\"proton-DataTable\" data-testid={testId}>\r\n      <Table name={name}>\r\n        <Table.Header>\r\n          {columns?.map((column) => (\r\n            <Table.Column key={column.id} id={column.id}>\r\n              {column.header}\r\n            </Table.Column>\r\n          ))}\r\n        </Table.Header>\r\n        <Table.Body>\r\n          <Table.Row>\r\n            <Table.Cell colSpan={columns?.length || 1}>\r\n              <div\r\n                className=\"proton-DataTable__message-cell\"\r\n                role={isError ? \"alert\" : \"status\"}\r\n                aria-live=\"polite\"\r\n              >\r\n                <Elevation>\r\n                  <div className=\"proton-DataTable__empty-cell\">{message}</div>\r\n                </Elevation>\r\n              </div>\r\n            </Table.Cell>\r\n          </Table.Row>\r\n        </Table.Body>\r\n      </Table>\r\n    </div>\r\n  );\r\n};\r\n"],"names":["DataTable","props","columns","data","loading","tombstoneComponent","error","name","onRowClick","emptyMessage","errorMessage","loadingRows","testId","sortableColumns","sortedBy","sortDirection","onSort","visibleColumns","useMemo","col","handleSortClick","column","newDirection","getSortState","columnId","message","jsx","EmptyState","jsxs","Table","_","index","Tombstone","isSortable","sortState","Icon","row","rowKey","isError","Elevation"],"mappings":"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"}