@protonradio/proton-ui 0.11.5-beta.2 → 0.11.5

package/dist/components/Modal/Modal.es.js

@@ -1,122 +0,0 @@
-import { j as o } from "../../node_modules/react/jsx-runtime.es.js";
-import { useButton as $ } from "../../node_modules/@react-aria/button/dist/useButton.es.js";
-import { useDialog as _ } from "../../node_modules/@react-aria/dialog/dist/useDialog.es.js";
-import { FocusScope as x } from "../../node_modules/@react-aria/focus/dist/FocusScope.es.js";
-import { mergeProps as h } from "@react-aria/utils";
-import { usePreventScroll as g } from "../../node_modules/@react-aria/overlays/dist/usePreventScroll.es.js";
-import { useModalOverlay as v } from "../../node_modules/@react-aria/overlays/dist/useModalOverlay.es.js";
-import { useRef as f } from "react";
-import { useOverlayTriggerState as C } from "../../node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js";
-import { useIsClosing as N } from "../../hooks/useIsClosing.es.js";
-import { Button as B } from "../Button/Button.es.js";
-/* empty css             */
-import { ScreenOverlay as P } from "../ScreenOverlay/ScreenOverlay.es.js";
-import { useBreakpoint as S } from "../../hooks/useBreakpoint.es.js";
-import { BREAKPOINTS as y } from "../../constants/breakpoint.es.js";
-import { csx as O } from "../../utils/string.es.js";
-const b = ({ children: t }) => /* @__PURE__ */ o.jsx("h2", { className: "proton-Modal__title", children: t }), M = ({ children: t }) => /* @__PURE__ */ o.jsx("h3", { className: "proton-Modal__subtitle", children: t }), j = ({ children: t }) => /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__body", children: t }), A = (t) => /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__action", children: /* @__PURE__ */ o.jsx(B, { ...t }) }), R = ({ children: t }) => /* @__PURE__ */ o.jsx(x, { autoFocus: !0, children: /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__actions", children: t }) }), F = ({
-  title: t,
-  subtitle: s,
-  body: r,
-  onClose: a,
-  children: d,
-  isClosing: m,
-  "data-testid": p
-}) => {
-  const e = f(null), n = C({ isOpen: !0, onOpenChange: a }), { modalProps: u } = v(
-    {
-      isDismissable: !1
-      //handle dismiss behavior in useIsClosing
-    },
-    n,
-    e
-  ), { dialogProps: l } = _({ role: "dialog" }, e);
-  g();
-  const c = f(null), { buttonProps: i } = $(
-    {
-      onPress: a,
-      "aria-label": "Close"
-    },
-    c
-  );
-  return /* @__PURE__ */ o.jsx(x, { contain: !0, restoreFocus: !0, autoFocus: !0, children: /* @__PURE__ */ o.jsxs(
-    "div",
-    {
-      "data-testid": p,
-      className: O("proton-Modal", m && "proton-Modal--closing"),
-      ...h(u, l),
-      ref: e,
-      children: [
-        /* @__PURE__ */ o.jsx(
-          "button",
-          {
-            name: "Close",
-            className: "proton-Modal__close-button",
-            ...i,
-            ref: c,
-            children: "×"
-          }
-        ),
-        t && /* @__PURE__ */ o.jsx(b, { children: t }),
-        s && /* @__PURE__ */ o.jsx(M, { children: s }),
-        r && /* @__PURE__ */ o.jsx(j, { children: r }),
-        /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__content", children: d })
-      ]
-    }
-  ) });
-}, I = ({
-  isOpen: t,
-  onClose: s,
-  title: r,
-  subtitle: a,
-  body: d,
-  children: m,
-  isOverlay: p = !0,
-  "data-testid": e
-}) => {
-  const n = f(null), { isClosing: u, handleClose: l } = N({
-    onClose: s,
-    overlayRef: n
-  }), c = S(y.MEDIUM);
-  if (!t) return null;
-  const i = /* @__PURE__ */ o.jsx(
-    F,
-    {
-      isOpen: t,
-      title: r,
-      subtitle: a,
-      body: d,
-      onClose: l,
-      isClosing: u,
-      "data-testid": e,
-      children: m
-    }
-  );
-  return p || c ? /* @__PURE__ */ o.jsx(P, { fadeIn: !0, ref: n, onClose: l, children: i }) : i;
-}, X = Object.assign(I, {
-  /**
-   * Renders a h2 styled title
-   * */
-  Title: b,
-  /**
-   * Renders a h3 styled subtitle
-   * */
-  Subtitle: M,
-  /**
-   * Renders a div styled body
-   * */
-  Body: j,
-  /**
-   * Renders a Proton Button action
-   * - @prop buttonProps {@link ButtonProps}
-   * */
-  Action: A,
-  /**
-   * Renders a group of Proton Buttons
-   * */
-  Actions: R
-});
-export {
-  X as Modal
-};
-//# sourceMappingURL=Modal.es.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Modal.es.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useDialog } from \"@react-aria/dialog\";\r\nimport { FocusScope } from \"@react-aria/focus\";\r\nimport { useModalOverlay, usePreventScroll } from \"@react-aria/overlays\";\r\nimport { mergeProps } from \"@react-aria/utils\";\r\nimport { useRef } from \"react\";\r\nimport { useOverlayTriggerState } from \"@react-stately/overlays\";\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks\";\r\nimport { useIsClosing } from \"../../hooks/useIsClosing\";\r\nimport { csx } from \"../../utils\";\r\nimport { Button, ButtonProps } from \"../Button/Button\";\r\nimport \"./Modal.css\";\r\nimport { ScreenOverlay } from \"../ScreenOverlay/ScreenOverlay\";\r\n\r\nconst ModalTitle = ({ children }: { children: React.ReactNode }) => {\r\n  return <h2 className=\"proton-Modal__title\">{children}</h2>;\r\n};\r\n\r\nconst ModalSubtitle = ({ children }: { children: React.ReactNode }) => {\r\n  return <h3 className=\"proton-Modal__subtitle\">{children}</h3>;\r\n};\r\n\r\nconst ModalBody = ({ children }: { children: React.ReactNode }) => {\r\n  return <div className=\"proton-Modal__body\">{children}</div>;\r\n};\r\n\r\nconst ModalAction = (buttonProps: ButtonProps) => {\r\n  return (\r\n    <div className=\"proton-Modal__action\">\r\n      <Button {...buttonProps} />\r\n    </div>\r\n  );\r\n};\r\n\r\nconst ModalActions = ({ children }: { children: React.ReactNode }) => {\r\n  return (\r\n    <FocusScope autoFocus>\r\n      <div className=\"proton-Modal__actions\">{children}</div>\r\n    </FocusScope>\r\n  );\r\n};\r\n\r\nconst ModalContent = ({\r\n  title,\r\n  subtitle,\r\n  body,\r\n  onClose,\r\n  children,\r\n  isClosing,\r\n  \"data-testid\": dataTestId,\r\n}: ModalProps & {\r\n  isClosing: boolean;\r\n}) => {\r\n  const ref = useRef<HTMLDivElement>(null);\r\n  const state = useOverlayTriggerState({ isOpen: true, onOpenChange: onClose });\r\n  const { modalProps } = useModalOverlay(\r\n    {\r\n      isDismissable: false, //handle dismiss behavior in useIsClosing\r\n    },\r\n    state,\r\n    ref\r\n  );\r\n\r\n  const { dialogProps } = useDialog({ role: \"dialog\" }, ref);\r\n  usePreventScroll();\r\n\r\n  const closeButtonRef = useRef<HTMLButtonElement>(null);\r\n  const { buttonProps: closeButtonProps } = useButton(\r\n    {\r\n      onPress: onClose,\r\n      \"aria-label\": \"Close\",\r\n    },\r\n    closeButtonRef\r\n  );\r\n\r\n  return (\r\n    <FocusScope contain restoreFocus autoFocus>\r\n      <div\r\n        data-testid={dataTestId}\r\n        className={csx(\"proton-Modal\", isClosing && \"proton-Modal--closing\")}\r\n        {...mergeProps(modalProps, dialogProps)}\r\n        ref={ref}\r\n      >\r\n        <button\r\n          name=\"Close\"\r\n          className=\"proton-Modal__close-button\"\r\n          {...closeButtonProps}\r\n          ref={closeButtonRef}\r\n        >\r\n          ×\r\n        </button>\r\n        {title && <ModalTitle>{title}</ModalTitle>}\r\n        {subtitle && <ModalSubtitle>{subtitle}</ModalSubtitle>}\r\n        {body && <ModalBody>{body}</ModalBody>}\r\n        <div className=\"proton-Modal__content\">{children}</div>\r\n      </div>\r\n    </FocusScope>\r\n  );\r\n};\r\n\r\nexport interface ModalProps {\r\n  /**\r\n   * Optional body text content for the modal\r\n   * */\r\n  body?: string;\r\n  /**\r\n   * Content to render inside the modal\r\n   * */\r\n  children: React.ReactNode;\r\n  /**\r\n   * data-testid for the modal\r\n   * */\r\n  \"data-testid\"?: string;\r\n  /**\r\n   * Controls the visibility of the modal\r\n   * */\r\n  isOpen: boolean;\r\n  /**\r\n   * Whether to show the modal with an overlay background.\r\n   * @default true\r\n   * */\r\n  isOverlay?: boolean;\r\n  /**\r\n   * Callback function when modal is closed\r\n   * */\r\n  onClose?: () => void;\r\n  /**\r\n   * Optional subtitle text below the modal title\r\n   * */\r\n  subtitle?: string;\r\n  /**\r\n   * Optional title text for the modal header\r\n   * */\r\n  title?: string;\r\n}\r\n\r\n/**\r\n * Modal component with overlay support and responsive behavior.\r\n *\r\n * API:\r\n *  - {@link ModalProps}\r\n */\r\nconst ModalWrapper = ({\r\n  isOpen,\r\n  onClose,\r\n  title,\r\n  subtitle,\r\n  body,\r\n  children,\r\n  isOverlay = true,\r\n  \"data-testid\": dataTestId,\r\n}: ModalProps) => {\r\n  const overlayRef = useRef<HTMLDivElement>(null);\r\n  const { isClosing, handleClose } = useIsClosing({\r\n    onClose,\r\n    overlayRef,\r\n  });\r\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\r\n\r\n  if (!isOpen) return null;\r\n\r\n  const modalContent = (\r\n    <ModalContent\r\n      isOpen={isOpen}\r\n      title={title}\r\n      subtitle={subtitle}\r\n      body={body}\r\n      onClose={handleClose}\r\n      isClosing={isClosing}\r\n      data-testid={dataTestId}\r\n    >\r\n      {children}\r\n    </ModalContent>\r\n  );\r\n\r\n  return isOverlay || isMobile ? (\r\n    <ScreenOverlay fadeIn ref={overlayRef} onClose={handleClose}>\r\n      {modalContent}\r\n    </ScreenOverlay>\r\n  ) : (\r\n    modalContent\r\n  );\r\n};\r\n\r\nexport const Modal = Object.assign(ModalWrapper, {\r\n  /**\r\n   * Renders a h2 styled title\r\n   * */\r\n  Title: ModalTitle,\r\n  /**\r\n   * Renders a h3 styled subtitle\r\n   * */\r\n  Subtitle: ModalSubtitle,\r\n  /**\r\n   * Renders a div styled body\r\n   * */\r\n  Body: ModalBody,\r\n  /**\r\n   * Renders a Proton Button action\r\n   * - @prop buttonProps {@link ButtonProps}\r\n   * */\r\n  Action: ModalAction,\r\n  /**\r\n   * Renders a group of Proton Buttons\r\n   * */\r\n  Actions: ModalActions,\r\n});\r\n"],"names":["ModalTitle","children","jsx","ModalSubtitle","ModalBody","ModalAction","buttonProps","Button","ModalActions","FocusScope","ModalContent","title","subtitle","body","onClose","isClosing","dataTestId","ref","useRef","state","useOverlayTriggerState","modalProps","useModalOverlay","dialogProps","useDialog","usePreventScroll","closeButtonRef","closeButtonProps","useButton","jsxs","csx","mergeProps","ModalWrapper","isOpen","isOverlay","overlayRef","handleClose","useIsClosing","isMobile","useBreakpoint","BREAKPOINTS","modalContent","ScreenOverlay","Modal"],"mappings":"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"}

package/dist/components/Popover/Popover.cjs.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),c=require("react"),m=require("../../node_modules/@react-aria/overlays/dist/useOverlayTrigger.cjs.js"),j=require("../../node_modules/@react-aria/overlays/dist/DismissButton.cjs.js"),P=require("../../node_modules/@react-aria/overlays/dist/usePopover.cjs.js"),y=require("../../node_modules/@react-aria/overlays/dist/Overlay.cjs.js"),R=require("../../node_modules/@react-aria/button/dist/useButton.cjs.js"),f=require("../../node_modules/@react-stately/overlays/dist/useOverlayTriggerState.cjs.js"),q=require("../ThemeProvider.cjs.js");;/* empty css                 */const T=require("../../utils/string.cjs.js");function h(o){const r=c.useRef(null),t=f.useOverlayTriggerState(o||{}),{triggerProps:i,overlayProps:s}=m.useOverlayTrigger({type:"dialog"},t,r),{buttonProps:n}=R.useButton(i,r);return{buttonProps:n,overlayProps:s,buttonRef:r,state:t}}function p({children:o,state:r,arrow:t=!1,offset:i,...s}){const n=c.useRef(null),{popoverRef:u=n}=s,{className:x,style:d}=q.useTheme();let{popoverProps:a,underlayProps:v,arrowProps:g,placement:l}=P.usePopover({...s,offset:i,popoverRef:u},r);return e.jsxRuntimeExports.jsxs(y.Overlay,{children:[e.jsxRuntimeExports.jsx("div",{...v,style:{position:"fixed",inset:0}}),e.jsxRuntimeExports.jsxs("div",{...a,ref:u,className:T.csx("proton-Popover",x),style:{...a.style,...d},"data-testid":s["data-testid"]||void 0,"data-placement":l,"data-entering":!0,children:[e.jsxRuntimeExports.jsx(j.DismissButton,{onDismiss:r.close}),t&&e.jsxRuntimeExports.jsxs("svg",{...g,className:"arrow","data-placement":l,viewBox:"0 0 12 12",children:[e.jsxRuntimeExports.jsx("title",{children:"arrow"}),e.jsxRuntimeExports.jsx("path",{d:"M0 0 L6 6 L12 0"})]}),o]})]})}exports.Popover=p;exports.default=p;exports.usePopoverTrigger=h;
-//# sourceMappingURL=Popover.cjs.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Popover.cjs.js","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { useRef } from \"react\";\r\nimport type { AriaPopoverProps } from \"@react-aria/overlays\";\r\nimport { DismissButton, Overlay, usePopover } from \"@react-aria/overlays\";\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useOverlayTrigger } from \"@react-aria/overlays\";\r\nimport {\r\n  OverlayTriggerProps,\r\n  useOverlayTriggerState,\r\n  type OverlayTriggerState,\r\n} from \"@react-stately/overlays\";\r\nimport { csx } from \"../../utils\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\n\r\nimport \"./Popover.css\";\r\n\r\n/**\r\n * Hook for creating a popover trigger. This hook manages the state and events for the popover\r\n * and popover trigger. For examples see Popover.stories.tsx.\r\n *\r\n * API:\r\n *  - {@link OverlayTriggerProps}\r\n *\r\n * @example\r\n * ```tsx\r\n * let { buttonProps, overlayProps, buttonRef, state } = usePopoverTrigger();\r\n *\r\n * return (\r\n *   <div>\r\n *     <button {...buttonProps} ref={buttonRef}>\r\n *       Trigger\r\n *     </button>\r\n *\r\n *     {state.isOpen && (\r\n *       <Popover\r\n *         state={state}\r\n *         triggerRef={buttonRef}\r\n *         arrow={props.arrow}\r\n *         offset={props.offset}\r\n *         placement={props.placement}\r\n *       >\r\n *         <Dialog {...overlayProps} title=\"Popover\">\r\n *           Here is some popover content\r\n *         </Dialog>\r\n *       </Popover>\r\n *     )}\r\n *   </div>\r\n * );\r\n * ```\r\n */\r\nexport function usePopoverTrigger(props?: OverlayTriggerProps) {\r\n  const triggerRef = useRef<HTMLButtonElement>(null);\r\n\r\n  const state = useOverlayTriggerState(props || {});\r\n  const { triggerProps, overlayProps } = useOverlayTrigger(\r\n    { type: \"dialog\" },\r\n    state,\r\n    triggerRef\r\n  );\r\n  const { buttonProps } = useButton(triggerProps, triggerRef);\r\n\r\n  return { buttonProps, overlayProps, buttonRef: triggerRef, state };\r\n}\r\n\r\ninterface PopoverProps extends Omit<AriaPopoverProps, \"popoverRef\"> {\r\n  /**\r\n   * Whether to show an arrow on the popover.\r\n   */\r\n  arrow?: boolean;\r\n  /**\r\n   * Content to display within the popover.\r\n   */\r\n  children: React.ReactNode;\r\n  /**\r\n   * Can optionally forward the ref to the popover.\r\n   */\r\n  popoverRef?: React.RefObject<HTMLDivElement>;\r\n  /**\r\n   * The `isOpen` state of the popover and the methods to toggle it.\r\n   * - type {@link OverlayTriggerState}\r\n   */\r\n  state: OverlayTriggerState;\r\n}\r\n\r\n/**\r\n * Popover is an unstyled popover component that handles positioning. It should be used\r\n * with the Dialog component to provide a styled popover.\r\n *\r\n * A popover displays interactive content in context with a trigger element.\r\n * A tooltip displays a description of an element on hover or focus.\r\n *\r\n * @see {@link usePopoverTrigger} for a complete usage example\r\n *\r\n * API:\r\n *  - {@link PopoverProps}\r\n *  - extends {@link AriaPopoverProps}\r\n */\r\nexport function Popover({\r\n  children,\r\n  state,\r\n  arrow = false,\r\n  offset,\r\n  ...props\r\n}: PopoverProps) {\r\n  const ref = useRef<HTMLDivElement>(null);\r\n  const { popoverRef = ref } = props;\r\n  const { className, style } = useTheme();\r\n\r\n  let { popoverProps, underlayProps, arrowProps, placement } = usePopover(\r\n    {\r\n      ...props,\r\n      offset,\r\n      popoverRef,\r\n    },\r\n    state\r\n  );\r\n\r\n  return (\r\n    <Overlay>\r\n      <div {...underlayProps} style={{ position: \"fixed\", inset: 0 }} />\r\n      <div\r\n        {...popoverProps}\r\n        ref={popoverRef}\r\n        className={csx(\"proton-Popover\", className)}\r\n        style={{ ...popoverProps.style, ...style }}\r\n        data-testid={props[\"data-testid\"] || undefined}\r\n        data-placement={placement}\r\n        data-entering={true}\r\n      >\r\n        <DismissButton onDismiss={state.close} />\r\n        {arrow && (\r\n          <svg\r\n            {...arrowProps}\r\n            className=\"arrow\"\r\n            data-placement={placement}\r\n            viewBox=\"0 0 12 12\"\r\n          >\r\n            <title>arrow</title>\r\n            <path d=\"M0 0 L6 6 L12 0\" />\r\n          </svg>\r\n        )}\r\n        {children}\r\n      </div>\r\n    </Overlay>\r\n  );\r\n}\r\n\r\nexport default Popover;\r\n"],"names":["usePopoverTrigger","props","triggerRef","useRef","state","useOverlayTriggerState","triggerProps","overlayProps","useOverlayTrigger","buttonProps","useButton","Popover","children","arrow","offset","ref","popoverRef","className","style","useTheme","popoverProps","underlayProps","arrowProps","placement","usePopover","Overlay","jsx","jsxs","csx","DismissButton"],"mappings":"2wBAmDO,SAASA,EAAkBC,EAA6B,CACvD,MAAAC,EAAaC,SAA0B,IAAI,EAE3CC,EAAQC,EAAAA,uBAAuBJ,GAAS,CAAE,CAAA,EAC1C,CAAE,aAAAK,EAAc,aAAAC,CAAA,EAAiBC,EAAA,kBACrC,CAAE,KAAM,QAAS,EACjBJ,EACAF,CAAA,EAEI,CAAE,YAAAO,CAAgB,EAAAC,EAAA,UAAUJ,EAAcJ,CAAU,EAE1D,MAAO,CAAE,YAAAO,EAAa,aAAAF,EAAc,UAAWL,EAAY,MAAAE,CAAM,CACnE,CAmCO,SAASO,EAAQ,CACtB,SAAAC,EACA,MAAAR,EACA,MAAAS,EAAQ,GACR,OAAAC,EACA,GAAGb,CACL,EAAiB,CACT,MAAAc,EAAMZ,SAAuB,IAAI,EACjC,CAAE,WAAAa,EAAaD,CAAQ,EAAAd,EACvB,CAAE,UAAAgB,EAAW,MAAAC,CAAM,EAAIC,EAAS,SAAA,EAEtC,GAAI,CAAE,aAAAC,EAAc,cAAAC,EAAe,WAAAC,EAAY,UAAAC,CAAc,EAAAC,EAAA,WAC3D,CACE,GAAGvB,EACH,OAAAa,EACA,WAAAE,CACF,EACAZ,CAAA,EAGF,gCACGqB,UACC,CAAA,SAAA,CAACC,EAAAA,kBAAAA,IAAA,MAAA,CAAK,GAAGL,EAAe,MAAO,CAAE,SAAU,QAAS,MAAO,CAAA,EAAK,EAChEM,EAAA,kBAAA,KAAC,MAAA,CACE,GAAGP,EACJ,IAAKJ,EACL,UAAWY,EAAAA,IAAI,iBAAkBX,CAAS,EAC1C,MAAO,CAAE,GAAGG,EAAa,MAAO,GAAGF,CAAM,EACzC,cAAajB,EAAM,aAAa,GAAK,OACrC,iBAAgBsB,EAChB,gBAAe,GAEf,SAAA,CAACG,EAAAA,kBAAAA,IAAAG,EAAAA,cAAA,CAAc,UAAWzB,EAAM,KAAO,CAAA,EACtCS,GACCc,EAAA,kBAAA,KAAC,MAAA,CACE,GAAGL,EACJ,UAAU,QACV,iBAAgBC,EAChB,QAAQ,YAER,SAAA,CAAAG,EAAAA,kBAAAA,IAAC,SAAM,SAAK,OAAA,CAAA,EACZA,EAAAA,kBAAAA,IAAC,OAAK,CAAA,EAAE,iBAAkB,CAAA,CAAA,CAAA,CAC5B,EAEDd,CAAA,CAAA,CACH,CACF,CAAA,CAAA,CAEJ"}

package/dist/components/Popover/Popover.es.js

@@ -1,74 +0,0 @@
-import { j as e } from "../../node_modules/react/jsx-runtime.es.js";
-import { useRef as f } from "react";
-import { useOverlayTrigger as x } from "../../node_modules/@react-aria/overlays/dist/useOverlayTrigger.es.js";
-import { DismissButton as $ } from "../../node_modules/@react-aria/overlays/dist/DismissButton.es.js";
-import { usePopover as v } from "../../node_modules/@react-aria/overlays/dist/usePopover.es.js";
-import { Overlay as b } from "../../node_modules/@react-aria/overlays/dist/Overlay.es.js";
-import { useButton as g } from "../../node_modules/@react-aria/button/dist/useButton.es.js";
-import { useOverlayTriggerState as y } from "../../node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js";
-import { useTheme as P } from "../ThemeProvider.es.js";
-/* empty css               */
-import { csx as j } from "../../utils/string.es.js";
-function S(s) {
-  const r = f(null), t = y(s || {}), { triggerProps: a, overlayProps: o } = x(
-    { type: "dialog" },
-    t,
-    r
-  ), { buttonProps: i } = g(a, r);
-  return { buttonProps: i, overlayProps: o, buttonRef: r, state: t };
-}
-function k({
-  children: s,
-  state: r,
-  arrow: t = !1,
-  offset: a,
-  ...o
-}) {
-  const i = f(null), { popoverRef: p = i } = o, { className: m, style: d } = P();
-  let { popoverProps: n, underlayProps: l, arrowProps: u, placement: c } = v(
-    {
-      ...o,
-      offset: a,
-      popoverRef: p
-    },
-    r
-  );
-  return /* @__PURE__ */ e.jsxs(b, { children: [
-    /* @__PURE__ */ e.jsx("div", { ...l, style: { position: "fixed", inset: 0 } }),
-    /* @__PURE__ */ e.jsxs(
-      "div",
-      {
-        ...n,
-        ref: p,
-        className: j("proton-Popover", m),
-        style: { ...n.style, ...d },
-        "data-testid": o["data-testid"] || void 0,
-        "data-placement": c,
-        "data-entering": !0,
-        children: [
-          /* @__PURE__ */ e.jsx($, { onDismiss: r.close }),
-          t && /* @__PURE__ */ e.jsxs(
-            "svg",
-            {
-              ...u,
-              className: "arrow",
-              "data-placement": c,
-              viewBox: "0 0 12 12",
-              children: [
-                /* @__PURE__ */ e.jsx("title", { children: "arrow" }),
-                /* @__PURE__ */ e.jsx("path", { d: "M0 0 L6 6 L12 0" })
-              ]
-            }
-          ),
-          s
-        ]
-      }
-    )
-  ] });
-}
-export {
-  k as Popover,
-  k as default,
-  S as usePopoverTrigger
-};
-//# sourceMappingURL=Popover.es.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Popover.es.js","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { useRef } from \"react\";\r\nimport type { AriaPopoverProps } from \"@react-aria/overlays\";\r\nimport { DismissButton, Overlay, usePopover } from \"@react-aria/overlays\";\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useOverlayTrigger } from \"@react-aria/overlays\";\r\nimport {\r\n  OverlayTriggerProps,\r\n  useOverlayTriggerState,\r\n  type OverlayTriggerState,\r\n} from \"@react-stately/overlays\";\r\nimport { csx } from \"../../utils\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\n\r\nimport \"./Popover.css\";\r\n\r\n/**\r\n * Hook for creating a popover trigger. This hook manages the state and events for the popover\r\n * and popover trigger. For examples see Popover.stories.tsx.\r\n *\r\n * API:\r\n *  - {@link OverlayTriggerProps}\r\n *\r\n * @example\r\n * ```tsx\r\n * let { buttonProps, overlayProps, buttonRef, state } = usePopoverTrigger();\r\n *\r\n * return (\r\n *   <div>\r\n *     <button {...buttonProps} ref={buttonRef}>\r\n *       Trigger\r\n *     </button>\r\n *\r\n *     {state.isOpen && (\r\n *       <Popover\r\n *         state={state}\r\n *         triggerRef={buttonRef}\r\n *         arrow={props.arrow}\r\n *         offset={props.offset}\r\n *         placement={props.placement}\r\n *       >\r\n *         <Dialog {...overlayProps} title=\"Popover\">\r\n *           Here is some popover content\r\n *         </Dialog>\r\n *       </Popover>\r\n *     )}\r\n *   </div>\r\n * );\r\n * ```\r\n */\r\nexport function usePopoverTrigger(props?: OverlayTriggerProps) {\r\n  const triggerRef = useRef<HTMLButtonElement>(null);\r\n\r\n  const state = useOverlayTriggerState(props || {});\r\n  const { triggerProps, overlayProps } = useOverlayTrigger(\r\n    { type: \"dialog\" },\r\n    state,\r\n    triggerRef\r\n  );\r\n  const { buttonProps } = useButton(triggerProps, triggerRef);\r\n\r\n  return { buttonProps, overlayProps, buttonRef: triggerRef, state };\r\n}\r\n\r\ninterface PopoverProps extends Omit<AriaPopoverProps, \"popoverRef\"> {\r\n  /**\r\n   * Whether to show an arrow on the popover.\r\n   */\r\n  arrow?: boolean;\r\n  /**\r\n   * Content to display within the popover.\r\n   */\r\n  children: React.ReactNode;\r\n  /**\r\n   * Can optionally forward the ref to the popover.\r\n   */\r\n  popoverRef?: React.RefObject<HTMLDivElement>;\r\n  /**\r\n   * The `isOpen` state of the popover and the methods to toggle it.\r\n   * - type {@link OverlayTriggerState}\r\n   */\r\n  state: OverlayTriggerState;\r\n}\r\n\r\n/**\r\n * Popover is an unstyled popover component that handles positioning. It should be used\r\n * with the Dialog component to provide a styled popover.\r\n *\r\n * A popover displays interactive content in context with a trigger element.\r\n * A tooltip displays a description of an element on hover or focus.\r\n *\r\n * @see {@link usePopoverTrigger} for a complete usage example\r\n *\r\n * API:\r\n *  - {@link PopoverProps}\r\n *  - extends {@link AriaPopoverProps}\r\n */\r\nexport function Popover({\r\n  children,\r\n  state,\r\n  arrow = false,\r\n  offset,\r\n  ...props\r\n}: PopoverProps) {\r\n  const ref = useRef<HTMLDivElement>(null);\r\n  const { popoverRef = ref } = props;\r\n  const { className, style } = useTheme();\r\n\r\n  let { popoverProps, underlayProps, arrowProps, placement } = usePopover(\r\n    {\r\n      ...props,\r\n      offset,\r\n      popoverRef,\r\n    },\r\n    state\r\n  );\r\n\r\n  return (\r\n    <Overlay>\r\n      <div {...underlayProps} style={{ position: \"fixed\", inset: 0 }} />\r\n      <div\r\n        {...popoverProps}\r\n        ref={popoverRef}\r\n        className={csx(\"proton-Popover\", className)}\r\n        style={{ ...popoverProps.style, ...style }}\r\n        data-testid={props[\"data-testid\"] || undefined}\r\n        data-placement={placement}\r\n        data-entering={true}\r\n      >\r\n        <DismissButton onDismiss={state.close} />\r\n        {arrow && (\r\n          <svg\r\n            {...arrowProps}\r\n            className=\"arrow\"\r\n            data-placement={placement}\r\n            viewBox=\"0 0 12 12\"\r\n          >\r\n            <title>arrow</title>\r\n            <path d=\"M0 0 L6 6 L12 0\" />\r\n          </svg>\r\n        )}\r\n        {children}\r\n      </div>\r\n    </Overlay>\r\n  );\r\n}\r\n\r\nexport default Popover;\r\n"],"names":["usePopoverTrigger","props","triggerRef","useRef","state","useOverlayTriggerState","triggerProps","overlayProps","useOverlayTrigger","buttonProps","useButton","Popover","children","arrow","offset","ref","popoverRef","className","style","useTheme","popoverProps","underlayProps","arrowProps","placement","usePopover","Overlay","jsx","jsxs","csx","DismissButton"],"mappings":";;;;;;;;;;;AAmDO,SAASA,EAAkBC,GAA6B;AACvD,QAAAC,IAAaC,EAA0B,IAAI,GAE3CC,IAAQC,EAAuBJ,KAAS,CAAE,CAAA,GAC1C,EAAE,cAAAK,GAAc,cAAAC,EAAA,IAAiBC;AAAAA,IACrC,EAAE,MAAM,SAAS;AAAA,IACjBJ;AAAA,IACAF;AAAA,EAAA,GAEI,EAAE,aAAAO,EAAgB,IAAAC,EAAUJ,GAAcJ,CAAU;AAE1D,SAAO,EAAE,aAAAO,GAAa,cAAAF,GAAc,WAAWL,GAAY,OAAAE,EAAM;AACnE;AAmCO,SAASO,EAAQ;AAAA,EACtB,UAAAC;AAAA,EACA,OAAAR;AAAA,EACA,OAAAS,IAAQ;AAAA,EACR,QAAAC;AAAA,EACA,GAAGb;AACL,GAAiB;AACT,QAAAc,IAAMZ,EAAuB,IAAI,GACjC,EAAE,YAAAa,IAAaD,EAAQ,IAAAd,GACvB,EAAE,WAAAgB,GAAW,OAAAC,EAAM,IAAIC,EAAS;AAEtC,MAAI,EAAE,cAAAC,GAAc,eAAAC,GAAe,YAAAC,GAAY,WAAAC,EAAc,IAAAC;AAAAA,IAC3D;AAAA,MACE,GAAGvB;AAAA,MACH,QAAAa;AAAA,MACA,YAAAE;AAAA,IACF;AAAA,IACAZ;AAAA,EAAA;AAGF,gCACGqB,GACC,EAAA,UAAA;AAAA,IAACC,gBAAAA,EAAAA,IAAA,OAAA,EAAK,GAAGL,GAAe,OAAO,EAAE,UAAU,SAAS,OAAO,EAAA,GAAK;AAAA,IAChEM,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGP;AAAA,QACJ,KAAKJ;AAAA,QACL,WAAWY,EAAI,kBAAkBX,CAAS;AAAA,QAC1C,OAAO,EAAE,GAAGG,EAAa,OAAO,GAAGF,EAAM;AAAA,QACzC,eAAajB,EAAM,aAAa,KAAK;AAAA,QACrC,kBAAgBsB;AAAA,QAChB,iBAAe;AAAA,QAEf,UAAA;AAAA,UAACG,gBAAAA,EAAAA,IAAAG,GAAA,EAAc,WAAWzB,EAAM,MAAO,CAAA;AAAA,UACtCS,KACCc,gBAAAA,EAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACE,GAAGL;AAAA,cACJ,WAAU;AAAA,cACV,kBAAgBC;AAAA,cAChB,SAAQ;AAAA,cAER,UAAA;AAAA,gBAAAG,gBAAAA,EAAAA,IAAC,WAAM,UAAK,QAAA,CAAA;AAAA,gBACZA,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,kBAAkB,CAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5B;AAAA,UAEDd;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/components/ScreenOverlay/ScreenOverlay.cjs.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../node_modules/react/jsx-runtime.cjs.js"),n=require("react");;/* empty css                       */const m=require("radix-ui"),a=require("../ThemeProvider.cjs.js"),y=require("../../utils/string.cjs.js"),i=n.forwardRef(({fadeIn:o=!1,onClose:e,children:c},s)=>{const{theme:d,palette:u}=a.useTheme();return n.useEffect(()=>{if(!e)return;const r=l=>{l.key==="Escape"&&e()};return document.addEventListener("keydown",r),()=>{document.removeEventListener("keydown",r)}},[e]),t.jsxRuntimeExports.jsx(m.Portal.Root,{children:t.jsxRuntimeExports.jsx(a.ThemeProvider,{theme:d,palette:u,children:t.jsxRuntimeExports.jsx("div",{ref:s,id:"background","aria-label":"Background overlay",role:"dialog","aria-modal":"true","data-testid":"screen-overlay",className:y.csx("proton-ScreenOverlay__background","proton-ScreenOverlay__z-index",o&&"proton-ScreenOverlay__fade-in"),onClick:r=>{e&&r.target===r.currentTarget&&e()},children:c})})})});i.displayName="ProtonUIScreenOverlay";exports.ScreenOverlay=i;
-//# sourceMappingURL=ScreenOverlay.cjs.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ScreenOverlay.cjs.js","sources":["../../../src/components/ScreenOverlay/ScreenOverlay.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { forwardRef, useEffect } from \"react\";\r\nimport \"./ScreenOverlay.css\";\r\nimport { csx } from \"../../utils\";\r\nimport { Portal } from \"radix-ui\";\r\nimport { useTheme, ThemeProvider } from \"../ThemeProvider\";\r\n\r\ninterface ScreenOverlayProps {\r\n  /**\r\n   * Children to render inside the overlay.\r\n   */\r\n  children?: React.ReactNode;\r\n\r\n  /**\r\n   * Whether to fade in the overlay.\r\n   */\r\n  fadeIn?: boolean;\r\n\r\n  /**\r\n   * Callback function to handle events (click or ESC key).\r\n   */\r\n  onClose?: () => void;\r\n\r\n  /**\r\n   * Ref to the overlay element.\r\n   */\r\n  ref?: React.RefObject<HTMLDivElement>;\r\n}\r\n\r\n/**\r\n * Base Overlay component for creating modal-like backgrounds.\r\n *\r\n * API:\r\n *  - {@link ScreenOverlayProps}\r\n */\r\nexport const ScreenOverlay = forwardRef<HTMLDivElement, ScreenOverlayProps>(\r\n  ({ fadeIn = false, onClose, children }, ref) => {\r\n    const { theme, palette } = useTheme();\r\n\r\n    useEffect(() => {\r\n      if (!onClose) return;\r\n\r\n      const handleEscKey = (event: KeyboardEvent) => {\r\n        if (event.key === \"Escape\") onClose();\r\n      };\r\n\r\n      document.addEventListener(\"keydown\", handleEscKey);\r\n      return () => {\r\n        document.removeEventListener(\"keydown\", handleEscKey);\r\n      };\r\n    }, [onClose]);\r\n\r\n    return (\r\n      <Portal.Root>\r\n        <ThemeProvider theme={theme} palette={palette}>\r\n          <div\r\n            ref={ref}\r\n            id=\"background\"\r\n            aria-label=\"Background overlay\"\r\n            role=\"dialog\"\r\n            aria-modal=\"true\"\r\n            data-testid=\"screen-overlay\"\r\n            className={csx(\r\n              \"proton-ScreenOverlay__background\",\r\n              \"proton-ScreenOverlay__z-index\",\r\n              fadeIn && \"proton-ScreenOverlay__fade-in\"\r\n            )}\r\n            onClick={(event: React.MouseEvent) => {\r\n              if (!onClose) return;\r\n\r\n              // Only trigger onClose if the click was directly on the background element\r\n              if (event.target === event.currentTarget) {\r\n                onClose();\r\n              }\r\n            }}\r\n          >\r\n            {children}\r\n          </div>\r\n        </ThemeProvider>\r\n      </Portal.Root>\r\n    );\r\n  }\r\n);\r\n\r\nScreenOverlay.displayName = \"ProtonUIScreenOverlay\";\r\n"],"names":["ScreenOverlay","forwardRef","fadeIn","onClose","children","ref","theme","palette","useTheme","useEffect","handleEscKey","event","Portal","jsx","ThemeProvider","csx"],"mappings":"gTAoCaA,EAAgBC,EAAA,WAC3B,CAAC,CAAE,OAAAC,EAAS,GAAO,QAAAC,EAAS,SAAAC,CAAA,EAAYC,IAAQ,CAC9C,KAAM,CAAE,MAAAC,EAAO,QAAAC,CAAQ,EAAIC,EAAS,SAAA,EAEpCC,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAI,CAACN,EAAS,OAER,MAAAO,EAAgBC,GAAyB,CACzCA,EAAM,MAAQ,UAAkBR,EAAA,CAAA,EAG7B,gBAAA,iBAAiB,UAAWO,CAAY,EAC1C,IAAM,CACF,SAAA,oBAAoB,UAAWA,CAAY,CAAA,CACtD,EACC,CAACP,CAAO,CAAC,0BAGTS,EAAAA,OAAO,KAAP,CACC,SAACC,wBAAAC,EAAAA,cAAA,CAAc,MAAAR,EAAc,QAAAC,EAC3B,SAAAM,EAAA,kBAAA,IAAC,MAAA,CACC,IAAAR,EACA,GAAG,aACH,aAAW,qBACX,KAAK,SACL,aAAW,OACX,cAAY,iBACZ,UAAWU,EAAA,IACT,mCACA,gCACAb,GAAU,+BACZ,EACA,QAAUS,GAA4B,CAC/BR,GAGDQ,EAAM,SAAWA,EAAM,eACjBR,GAEZ,EAEC,SAAAC,CAAA,CAAA,CAEL,CAAA,CACF,CAAA,CAEJ,CACF,EAEAJ,EAAc,YAAc"}

package/dist/components/ScreenOverlay/ScreenOverlay.es.js

@@ -1,44 +0,0 @@
-import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
-import { forwardRef as m, useEffect as s } from "react";
-/* empty css                     */
-import { Portal as l } from "radix-ui";
-import { useTheme as f, ThemeProvider as p } from "../ThemeProvider.es.js";
-import { csx as u } from "../../utils/string.es.js";
-const y = m(
-  ({ fadeIn: o = !1, onClose: e, children: a }, n) => {
-    const { theme: i, palette: c } = f();
-    return s(() => {
-      if (!e) return;
-      const r = (d) => {
-        d.key === "Escape" && e();
-      };
-      return document.addEventListener("keydown", r), () => {
-        document.removeEventListener("keydown", r);
-      };
-    }, [e]), /* @__PURE__ */ t.jsx(l.Root, { children: /* @__PURE__ */ t.jsx(p, { theme: i, palette: c, children: /* @__PURE__ */ t.jsx(
-      "div",
-      {
-        ref: n,
-        id: "background",
-        "aria-label": "Background overlay",
-        role: "dialog",
-        "aria-modal": "true",
-        "data-testid": "screen-overlay",
-        className: u(
-          "proton-ScreenOverlay__background",
-          "proton-ScreenOverlay__z-index",
-          o && "proton-ScreenOverlay__fade-in"
-        ),
-        onClick: (r) => {
-          e && r.target === r.currentTarget && e();
-        },
-        children: a
-      }
-    ) }) });
-  }
-);
-y.displayName = "ProtonUIScreenOverlay";
-export {
-  y as ScreenOverlay
-};
-//# sourceMappingURL=ScreenOverlay.es.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ScreenOverlay.es.js","sources":["../../../src/components/ScreenOverlay/ScreenOverlay.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { forwardRef, useEffect } from \"react\";\r\nimport \"./ScreenOverlay.css\";\r\nimport { csx } from \"../../utils\";\r\nimport { Portal } from \"radix-ui\";\r\nimport { useTheme, ThemeProvider } from \"../ThemeProvider\";\r\n\r\ninterface ScreenOverlayProps {\r\n  /**\r\n   * Children to render inside the overlay.\r\n   */\r\n  children?: React.ReactNode;\r\n\r\n  /**\r\n   * Whether to fade in the overlay.\r\n   */\r\n  fadeIn?: boolean;\r\n\r\n  /**\r\n   * Callback function to handle events (click or ESC key).\r\n   */\r\n  onClose?: () => void;\r\n\r\n  /**\r\n   * Ref to the overlay element.\r\n   */\r\n  ref?: React.RefObject<HTMLDivElement>;\r\n}\r\n\r\n/**\r\n * Base Overlay component for creating modal-like backgrounds.\r\n *\r\n * API:\r\n *  - {@link ScreenOverlayProps}\r\n */\r\nexport const ScreenOverlay = forwardRef<HTMLDivElement, ScreenOverlayProps>(\r\n  ({ fadeIn = false, onClose, children }, ref) => {\r\n    const { theme, palette } = useTheme();\r\n\r\n    useEffect(() => {\r\n      if (!onClose) return;\r\n\r\n      const handleEscKey = (event: KeyboardEvent) => {\r\n        if (event.key === \"Escape\") onClose();\r\n      };\r\n\r\n      document.addEventListener(\"keydown\", handleEscKey);\r\n      return () => {\r\n        document.removeEventListener(\"keydown\", handleEscKey);\r\n      };\r\n    }, [onClose]);\r\n\r\n    return (\r\n      <Portal.Root>\r\n        <ThemeProvider theme={theme} palette={palette}>\r\n          <div\r\n            ref={ref}\r\n            id=\"background\"\r\n            aria-label=\"Background overlay\"\r\n            role=\"dialog\"\r\n            aria-modal=\"true\"\r\n            data-testid=\"screen-overlay\"\r\n            className={csx(\r\n              \"proton-ScreenOverlay__background\",\r\n              \"proton-ScreenOverlay__z-index\",\r\n              fadeIn && \"proton-ScreenOverlay__fade-in\"\r\n            )}\r\n            onClick={(event: React.MouseEvent) => {\r\n              if (!onClose) return;\r\n\r\n              // Only trigger onClose if the click was directly on the background element\r\n              if (event.target === event.currentTarget) {\r\n                onClose();\r\n              }\r\n            }}\r\n          >\r\n            {children}\r\n          </div>\r\n        </ThemeProvider>\r\n      </Portal.Root>\r\n    );\r\n  }\r\n);\r\n\r\nScreenOverlay.displayName = \"ProtonUIScreenOverlay\";\r\n"],"names":["ScreenOverlay","forwardRef","fadeIn","onClose","children","ref","theme","palette","useTheme","useEffect","handleEscKey","event","Portal","jsx","ThemeProvider","csx"],"mappings":";;;;;;AAoCO,MAAMA,IAAgBC;AAAA,EAC3B,CAAC,EAAE,QAAAC,IAAS,IAAO,SAAAC,GAAS,UAAAC,EAAA,GAAYC,MAAQ;AAC9C,UAAM,EAAE,OAAAC,GAAO,SAAAC,EAAQ,IAAIC,EAAS;AAEpC,WAAAC,EAAU,MAAM;AACd,UAAI,CAACN,EAAS;AAER,YAAAO,IAAe,CAACC,MAAyB;AACzC,QAAAA,EAAM,QAAQ,YAAkBR,EAAA;AAAA,MAAA;AAG7B,sBAAA,iBAAiB,WAAWO,CAAY,GAC1C,MAAM;AACF,iBAAA,oBAAoB,WAAWA,CAAY;AAAA,MAAA;AAAA,IACtD,GACC,CAACP,CAAO,CAAC,yBAGTS,EAAO,MAAP,EACC,UAACC,gBAAAA,MAAAC,GAAA,EAAc,OAAAR,GAAc,SAAAC,GAC3B,UAAAM,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAR;AAAA,QACA,IAAG;AAAA,QACH,cAAW;AAAA,QACX,MAAK;AAAA,QACL,cAAW;AAAA,QACX,eAAY;AAAA,QACZ,WAAWU;AAAA,UACT;AAAA,UACA;AAAA,UACAb,KAAU;AAAA,QACZ;AAAA,QACA,SAAS,CAACS,MAA4B;AACpC,UAAKR,KAGDQ,EAAM,WAAWA,EAAM,iBACjBR;QAEZ;AAAA,QAEC,UAAAC;AAAA,MAAA;AAAA,IAAA,EAEL,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;AAEAJ,EAAc,cAAc;"}

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

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),l=require("react"),P=require("../../node_modules/@react-aria/select/dist/useSelect.cjs.js"),B=require("../../node_modules/@react-aria/select/dist/HiddenSelect.cjs.js"),O=require("../../node_modules/@react-aria/button/dist/useButton.cjs.js"),N=require("../../node_modules/@react-stately/select/dist/useSelectState.cjs.js"),I=require("../../node_modules/@react-stately/collections/dist/Item.cjs.js"),k=require("../../hooks/useBreakpoint.cjs.js"),M=require("../ActionMenu/ActionMenu.cjs.js"),w=require("../ListBox/ListBox.cjs.js"),A=require("../Popover/Popover.cjs.js");;/* empty css                */const S=require("../../utils/string.cjs.js"),L=require("../../constants/breakpoint.cjs.js"),R=l.forwardRef((s,n)=>{let{buttonProps:i}=O.useButton({...s,isDisabled:s.disabled},n);return e.jsxRuntimeExports.jsx("button",{...i,ref:n,className:S.csx("proton-Select__trigger",s.disabled&&"proton-Select__trigger--disabled",!s.isOpen&&"proton-Select__trigger--closed",s.isOpen&&"proton-Select__trigger--opened"),children:s.children})});R.displayName="ProtonUISelectButton";function g({label:s,name:n,isDisabled:i,disabledKeys:a,selectedKey:h,onSelectionChange:E,defaultSelectedKey:_,onOpen:u,onClose:d,items:x,"data-testid":p}){const j={label:s,isDisabled:i,disabledKeys:a,selectedKey:h,defaultSelectedKey:_,onSelectionChange:E,onOpenChange:r=>{r?u==null||u():d==null||d()},"data-testid":p,children:x.map(r=>e.jsxRuntimeExports.jsx(I.Item,{textValue:r.label,children:r.label},r.key))},t=N.useSelectState(j),f=k.useBreakpoint(L.BREAKPOINTS.MEDIUM),o=l.useRef(null),c=l.useRef(null),{labelProps:m,triggerProps:v,valueProps:b,menuProps:q}=P.useSelect({...j,label:s||n},t,o);l.useEffect(()=>{t.isOpen&&c.current&&o.current&&!c.current.style.minWidth&&(c.current.style.minWidth=`${o.current.offsetWidth}px`)},[t.isOpen]);const y=x.map(r=>({key:r.key,label:r.label,to:r.to,onAction:()=>{t.setSelectedKey(r.key),t.close()}}));return e.jsxRuntimeExports.jsxs("div",{className:"proton-Select","aria-label":s||n,"aria-disabled":i,children:[s?e.jsxRuntimeExports.jsx("div",{...m,className:"proton-Select__label","data-testid":"select-label",children:s}):e.jsxRuntimeExports.jsx("div",{...m}),e.jsxRuntimeExports.jsx(B.HiddenSelect,{isDisabled:i,state:t,triggerRef:o,label:s||n,name:n,"data-testid":"hidden-select-container"}),e.jsxRuntimeExports.jsxs(R,{...v,isOpen:t.isOpen,ref:o,disabled:i,"data-testid":p,children:[e.jsxRuntimeExports.jsx("div",{...b,className:"proton-Select__value",children:t.selectedItem?t.selectedItem.rendered:"Select an option"}),e.jsxRuntimeExports.jsx("div",{className:S.csx("proton-Select__trigger_icon",t.isOpen&&"proton-Select__trigger_icon--flipped"),"aria-hidden":"true",children:e.jsxRuntimeExports.jsxs("svg",{id:"caret-down",viewBox:"0 0 512 512",children:[e.jsxRuntimeExports.jsx("title",{children:t.isOpen?"caret down":"caret up"}),e.jsxRuntimeExports.jsx("path",{fill:"currentColor",d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7L86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})]})})]}),t.isOpen&&e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:f?e.jsxRuntimeExports.jsx(M.ActionMenu,{isOpen:t.isOpen,onClose:()=>t.close(),actions:y,selectedKeys:[t.selectedKey.toString()],disabledKeys:a}):e.jsxRuntimeExports.jsx("div",{className:"proton-Select__popover",children:e.jsxRuntimeExports.jsx(A.Popover,{state:t,triggerRef:o,popoverRef:c,placement:"bottom start","data-testid":"select-popover",children:e.jsxRuntimeExports.jsx(w.ListBox,{...q,state:t})})})})]})}g.displayName="ProtonUISelect";exports.Select=g;
-//# sourceMappingURL=Select.cjs.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Select.cjs.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { forwardRef, ReactNode, RefObject, useEffect, useRef } from \"react\";\r\nimport { HiddenSelect, useSelect } from \"@react-aria/select\";\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useSelectState } from \"@react-stately/select\";\r\nimport { Item } from \"@react-stately/collections\";\r\n\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\r\nimport { csx } from \"../../utils\";\r\nimport { ActionMenu, ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\nimport { ListBox } from \"../ListBox/ListBox\";\r\nimport { Popover } from \"../Popover/Popover\";\r\n\r\nimport \"./Select.css\";\r\n\r\ninterface SelectButtonProps {\r\n  disabled?: boolean;\r\n  isOpen?: boolean;\r\n  children?: ReactNode;\r\n}\r\n\r\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\r\n  (props, ref: RefObject<HTMLButtonElement>) => {\r\n    let { buttonProps } = useButton(\r\n      {\r\n        ...props,\r\n        isDisabled: props.disabled,\r\n      },\r\n      ref\r\n    );\r\n\r\n    return (\r\n      <button\r\n        {...buttonProps}\r\n        ref={ref}\r\n        className={csx(\r\n          \"proton-Select__trigger\",\r\n          props.disabled && \"proton-Select__trigger--disabled\",\r\n          !props.isOpen && \"proton-Select__trigger--closed\",\r\n          props.isOpen && \"proton-Select__trigger--opened\"\r\n        )}\r\n      >\r\n        {props.children}\r\n      </button>\r\n    );\r\n  }\r\n);\r\nSelectButton.displayName = \"ProtonUISelectButton\";\r\n\r\ninterface SelectItem {\r\n  label: string;\r\n  key: string;\r\n  to?: string;\r\n}\r\n\r\nexport interface SelectProps {\r\n  /** Array of keys that should be disabled\r\n   * @example [\"Thing 1\", \"Thing 2\"]\r\n   */\r\n  disabledKeys?: string[];\r\n\r\n  /** The key of the default selected item */\r\n  defaultSelectedKey?: string;\r\n\r\n  /** Test ID for the select */\r\n  \"data-testid\"?: string;\r\n\r\n  /** Whether the select is disabled */\r\n  isDisabled?: boolean;\r\n\r\n  /** Array of items to display\r\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\r\n   */\r\n  items: SelectItem[];\r\n\r\n  /** Label to display above the select\r\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\r\n   */\r\n  label?: string;\r\n\r\n  /** The name of the select field */\r\n  name: string;\r\n\r\n  /** Callback fired when the menu closes */\r\n  onClose?: () => void;\r\n\r\n  /** Callback fired when the menu opens */\r\n  onOpen?: () => void;\r\n\r\n  /** Callback fired when selection changes */\r\n  onSelectionChange?: (key: string) => void;\r\n\r\n  /** Currently selected key */\r\n  selectedKey?: string;\r\n}\r\n\r\n/**\r\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile.\r\n * Supports controlled and uncontrolled modes.\r\n *\r\n * API:\r\n *  - {@link SelectProps}\r\n */\r\nexport function Select({\r\n  label,\r\n  name,\r\n  isDisabled,\r\n  disabledKeys,\r\n  selectedKey,\r\n  onSelectionChange,\r\n  defaultSelectedKey,\r\n  onOpen,\r\n  onClose,\r\n  items,\r\n  \"data-testid\": testId,\r\n}: SelectProps) {\r\n  const selectProps = {\r\n    label,\r\n    isDisabled,\r\n    disabledKeys,\r\n    selectedKey,\r\n    defaultSelectedKey,\r\n    onSelectionChange,\r\n    onOpenChange: (isOpen: boolean) => {\r\n      if (isOpen) {\r\n        onOpen?.();\r\n      } else {\r\n        onClose?.();\r\n      }\r\n    },\r\n    \"data-testid\": testId,\r\n    children: items.map((item) => (\r\n      <Item key={item.key} textValue={item.label}>\r\n        {item.label}\r\n      </Item>\r\n    )),\r\n  };\r\n\r\n  const state = useSelectState(selectProps);\r\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\r\n  const triggerRef = useRef<HTMLButtonElement>(null);\r\n  const popoverRef = useRef<HTMLDivElement>(null);\r\n  const { labelProps, triggerProps, valueProps, menuProps } = useSelect(\r\n    { ...selectProps, label: label || name },\r\n    state,\r\n    triggerRef\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (\r\n      state.isOpen &&\r\n      popoverRef.current &&\r\n      triggerRef.current &&\r\n      !popoverRef.current.style.minWidth\r\n    ) {\r\n      // Adjust the popover width to be at least the width of the trigger\r\n      popoverRef.current.style.minWidth = `${triggerRef.current.offsetWidth}px`;\r\n    }\r\n  }, [state.isOpen]);\r\n\r\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\r\n    key: item.key,\r\n    label: item.label,\r\n    to: item.to,\r\n    onAction: () => {\r\n      state.setSelectedKey(item.key);\r\n      state.close();\r\n    },\r\n  }));\r\n\r\n  return (\r\n    <div\r\n      className=\"proton-Select\"\r\n      aria-label={label || name}\r\n      aria-disabled={isDisabled}\r\n    >\r\n      {label ? (\r\n        <div\r\n          {...labelProps}\r\n          className=\"proton-Select__label\"\r\n          data-testid=\"select-label\"\r\n        >\r\n          {label}\r\n        </div>\r\n      ) : (\r\n        // If no label is provided, render an invisible label for a11y\r\n        <div {...labelProps} />\r\n      )}\r\n\r\n      <HiddenSelect\r\n        isDisabled={isDisabled}\r\n        state={state}\r\n        triggerRef={triggerRef}\r\n        label={label || name}\r\n        name={name}\r\n        data-testid=\"hidden-select-container\"\r\n      />\r\n\r\n      <SelectButton\r\n        {...triggerProps}\r\n        isOpen={state.isOpen}\r\n        ref={triggerRef}\r\n        disabled={isDisabled}\r\n        data-testid={testId}\r\n      >\r\n        <div {...valueProps} className=\"proton-Select__value\">\r\n          {state.selectedItem\r\n            ? state.selectedItem.rendered\r\n            : \"Select an option\"}\r\n        </div>\r\n        <div\r\n          className={csx(\r\n            \"proton-Select__trigger_icon\",\r\n            state.isOpen && \"proton-Select__trigger_icon--flipped\"\r\n          )}\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg id=\"caret-down\" viewBox=\"0 0 512 512\">\r\n            <title>{state.isOpen ? \"caret down\" : \"caret up\"}</title>\r\n            <path\r\n              fill=\"currentColor\"\r\n              d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7L86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\"\r\n            />\r\n          </svg>\r\n        </div>\r\n      </SelectButton>\r\n\r\n      {state.isOpen && (\r\n        <>\r\n          {!isMobile ? (\r\n            <div className=\"proton-Select__popover\">\r\n              <Popover\r\n                state={state}\r\n                triggerRef={triggerRef}\r\n                popoverRef={popoverRef}\r\n                placement=\"bottom start\"\r\n                data-testid=\"select-popover\"\r\n              >\r\n                <ListBox {...menuProps} state={state} />\r\n              </Popover>\r\n            </div>\r\n          ) : (\r\n            <ActionMenu\r\n              isOpen={state.isOpen}\r\n              onClose={() => state.close()}\r\n              actions={actionItems}\r\n              selectedKeys={[state.selectedKey.toString()]}\r\n              disabledKeys={disabledKeys}\r\n            />\r\n          )}\r\n        </>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nSelect.displayName = \"ProtonUISelect\";\r\n"],"names":["SelectButton","forwardRef","props","ref","buttonProps","useButton","jsx","csx","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","testId","selectProps","isOpen","item","Item","state","useSelectState","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","popoverRef","labelProps","triggerProps","valueProps","menuProps","useSelect","useEffect","actionItems","jsxs","HiddenSelect","Fragment","ActionMenu","Popover","ListBox"],"mappings":"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"}

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

@@ -1,173 +0,0 @@
-import { j as e } from "../../node_modules/react/jsx-runtime.es.js";
-import { forwardRef as N, useRef as x, useEffect as O } from "react";
-import { useSelect as B } from "../../node_modules/@react-aria/select/dist/useSelect.es.js";
-import { HiddenSelect as I } from "../../node_modules/@react-aria/select/dist/HiddenSelect.es.js";
-import { useButton as R } from "../../node_modules/@react-aria/button/dist/useButton.es.js";
-import { useSelectState as k } from "../../node_modules/@react-stately/select/dist/useSelectState.es.js";
-import { Item as M } from "../../node_modules/@react-stately/collections/dist/Item.es.js";
-import { useBreakpoint as w } from "../../hooks/useBreakpoint.es.js";
-import { ActionMenu as E } from "../ActionMenu/ActionMenu.es.js";
-import { ListBox as A } from "../ListBox/ListBox.es.js";
-import { Popover as K } from "../Popover/Popover.es.js";
-/* empty css              */
-import { csx as S } from "../../utils/string.es.js";
-import { BREAKPOINTS as L } from "../../constants/breakpoint.es.js";
-const b = N(
-  (r, s) => {
-    let { buttonProps: c } = R(
-      {
-        ...r,
-        isDisabled: r.disabled
-      },
-      s
-    );
-    return /* @__PURE__ */ e.jsx(
-      "button",
-      {
-        ...c,
-        ref: s,
-        className: S(
-          "proton-Select__trigger",
-          r.disabled && "proton-Select__trigger--disabled",
-          !r.isOpen && "proton-Select__trigger--closed",
-          r.isOpen && "proton-Select__trigger--opened"
-        ),
-        children: r.children
-      }
-    );
-  }
-);
-b.displayName = "ProtonUISelectButton";
-function U({
-  label: r,
-  name: s,
-  isDisabled: c,
-  disabledKeys: d,
-  selectedKey: h,
-  onSelectionChange: g,
-  defaultSelectedKey: _,
-  onOpen: n,
-  onClose: a,
-  items: p,
-  "data-testid": m
-}) {
-  const f = {
-    label: r,
-    isDisabled: c,
-    disabledKeys: d,
-    selectedKey: h,
-    defaultSelectedKey: _,
-    onSelectionChange: g,
-    onOpenChange: (o) => {
-      o ? n == null || n() : a == null || a();
-    },
-    "data-testid": m,
-    children: p.map((o) => /* @__PURE__ */ e.jsx(M, { textValue: o.label, children: o.label }, o.key))
-  }, t = k(f), j = w(L.MEDIUM), i = x(null), l = x(null), { labelProps: u, triggerProps: $, valueProps: v, menuProps: y } = B(
-    { ...f, label: r || s },
-    t,
-    i
-  );
-  O(() => {
-    t.isOpen && l.current && i.current && !l.current.style.minWidth && (l.current.style.minWidth = `${i.current.offsetWidth}px`);
-  }, [t.isOpen]);
-  const P = p.map((o) => ({
-    key: o.key,
-    label: o.label,
-    to: o.to,
-    onAction: () => {
-      t.setSelectedKey(o.key), t.close();
-    }
-  }));
-  return /* @__PURE__ */ e.jsxs(
-    "div",
-    {
-      className: "proton-Select",
-      "aria-label": r || s,
-      "aria-disabled": c,
-      children: [
-        r ? /* @__PURE__ */ e.jsx(
-          "div",
-          {
-            ...u,
-            className: "proton-Select__label",
-            "data-testid": "select-label",
-            children: r
-          }
-        ) : (
-          // If no label is provided, render an invisible label for a11y
-          /* @__PURE__ */ e.jsx("div", { ...u })
-        ),
-        /* @__PURE__ */ e.jsx(
-          I,
-          {
-            isDisabled: c,
-            state: t,
-            triggerRef: i,
-            label: r || s,
-            name: s,
-            "data-testid": "hidden-select-container"
-          }
-        ),
-        /* @__PURE__ */ e.jsxs(
-          b,
-          {
-            ...$,
-            isOpen: t.isOpen,
-            ref: i,
-            disabled: c,
-            "data-testid": m,
-            children: [
-              /* @__PURE__ */ e.jsx("div", { ...v, className: "proton-Select__value", children: t.selectedItem ? t.selectedItem.rendered : "Select an option" }),
-              /* @__PURE__ */ e.jsx(
-                "div",
-                {
-                  className: S(
-                    "proton-Select__trigger_icon",
-                    t.isOpen && "proton-Select__trigger_icon--flipped"
-                  ),
-                  "aria-hidden": "true",
-                  children: /* @__PURE__ */ e.jsxs("svg", { id: "caret-down", viewBox: "0 0 512 512", children: [
-                    /* @__PURE__ */ e.jsx("title", { children: t.isOpen ? "caret down" : "caret up" }),
-                    /* @__PURE__ */ e.jsx(
-                      "path",
-                      {
-                        fill: "currentColor",
-                        d: "M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7L86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"
-                      }
-                    )
-                  ] })
-                }
-              )
-            ]
-          }
-        ),
-        t.isOpen && /* @__PURE__ */ e.jsx(e.Fragment, { children: j ? /* @__PURE__ */ e.jsx(
-          E,
-          {
-            isOpen: t.isOpen,
-            onClose: () => t.close(),
-            actions: P,
-            selectedKeys: [t.selectedKey.toString()],
-            disabledKeys: d
-          }
-        ) : /* @__PURE__ */ e.jsx("div", { className: "proton-Select__popover", children: /* @__PURE__ */ e.jsx(
-          K,
-          {
-            state: t,
-            triggerRef: i,
-            popoverRef: l,
-            placement: "bottom start",
-            "data-testid": "select-popover",
-            children: /* @__PURE__ */ e.jsx(A, { ...y, state: t })
-          }
-        ) }) })
-      ]
-    }
-  );
-}
-U.displayName = "ProtonUISelect";
-export {
-  U as Select
-};
-//# sourceMappingURL=Select.es.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Select.es.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { forwardRef, ReactNode, RefObject, useEffect, useRef } from \"react\";\r\nimport { HiddenSelect, useSelect } from \"@react-aria/select\";\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useSelectState } from \"@react-stately/select\";\r\nimport { Item } from \"@react-stately/collections\";\r\n\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\r\nimport { csx } from \"../../utils\";\r\nimport { ActionMenu, ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\nimport { ListBox } from \"../ListBox/ListBox\";\r\nimport { Popover } from \"../Popover/Popover\";\r\n\r\nimport \"./Select.css\";\r\n\r\ninterface SelectButtonProps {\r\n  disabled?: boolean;\r\n  isOpen?: boolean;\r\n  children?: ReactNode;\r\n}\r\n\r\nconst SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>(\r\n  (props, ref: RefObject<HTMLButtonElement>) => {\r\n    let { buttonProps } = useButton(\r\n      {\r\n        ...props,\r\n        isDisabled: props.disabled,\r\n      },\r\n      ref\r\n    );\r\n\r\n    return (\r\n      <button\r\n        {...buttonProps}\r\n        ref={ref}\r\n        className={csx(\r\n          \"proton-Select__trigger\",\r\n          props.disabled && \"proton-Select__trigger--disabled\",\r\n          !props.isOpen && \"proton-Select__trigger--closed\",\r\n          props.isOpen && \"proton-Select__trigger--opened\"\r\n        )}\r\n      >\r\n        {props.children}\r\n      </button>\r\n    );\r\n  }\r\n);\r\nSelectButton.displayName = \"ProtonUISelectButton\";\r\n\r\ninterface SelectItem {\r\n  label: string;\r\n  key: string;\r\n  to?: string;\r\n}\r\n\r\nexport interface SelectProps {\r\n  /** Array of keys that should be disabled\r\n   * @example [\"Thing 1\", \"Thing 2\"]\r\n   */\r\n  disabledKeys?: string[];\r\n\r\n  /** The key of the default selected item */\r\n  defaultSelectedKey?: string;\r\n\r\n  /** Test ID for the select */\r\n  \"data-testid\"?: string;\r\n\r\n  /** Whether the select is disabled */\r\n  isDisabled?: boolean;\r\n\r\n  /** Array of items to display\r\n   * @example [{ key: \"thing-1\", label: \"Thing 1\" }, { key: \"thing-2\", label: \"Thing 2\" }]\r\n   */\r\n  items: SelectItem[];\r\n\r\n  /** Label to display above the select\r\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#text\r\n   */\r\n  label?: string;\r\n\r\n  /** The name of the select field */\r\n  name: string;\r\n\r\n  /** Callback fired when the menu closes */\r\n  onClose?: () => void;\r\n\r\n  /** Callback fired when the menu opens */\r\n  onOpen?: () => void;\r\n\r\n  /** Callback fired when selection changes */\r\n  onSelectionChange?: (key: string) => void;\r\n\r\n  /** Currently selected key */\r\n  selectedKey?: string;\r\n}\r\n\r\n/**\r\n * A dropdown select menu that opens a popover on desktop and an action menu on mobile.\r\n * Supports controlled and uncontrolled modes.\r\n *\r\n * API:\r\n *  - {@link SelectProps}\r\n */\r\nexport function Select({\r\n  label,\r\n  name,\r\n  isDisabled,\r\n  disabledKeys,\r\n  selectedKey,\r\n  onSelectionChange,\r\n  defaultSelectedKey,\r\n  onOpen,\r\n  onClose,\r\n  items,\r\n  \"data-testid\": testId,\r\n}: SelectProps) {\r\n  const selectProps = {\r\n    label,\r\n    isDisabled,\r\n    disabledKeys,\r\n    selectedKey,\r\n    defaultSelectedKey,\r\n    onSelectionChange,\r\n    onOpenChange: (isOpen: boolean) => {\r\n      if (isOpen) {\r\n        onOpen?.();\r\n      } else {\r\n        onClose?.();\r\n      }\r\n    },\r\n    \"data-testid\": testId,\r\n    children: items.map((item) => (\r\n      <Item key={item.key} textValue={item.label}>\r\n        {item.label}\r\n      </Item>\r\n    )),\r\n  };\r\n\r\n  const state = useSelectState(selectProps);\r\n  const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\r\n  const triggerRef = useRef<HTMLButtonElement>(null);\r\n  const popoverRef = useRef<HTMLDivElement>(null);\r\n  const { labelProps, triggerProps, valueProps, menuProps } = useSelect(\r\n    { ...selectProps, label: label || name },\r\n    state,\r\n    triggerRef\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (\r\n      state.isOpen &&\r\n      popoverRef.current &&\r\n      triggerRef.current &&\r\n      !popoverRef.current.style.minWidth\r\n    ) {\r\n      // Adjust the popover width to be at least the width of the trigger\r\n      popoverRef.current.style.minWidth = `${triggerRef.current.offsetWidth}px`;\r\n    }\r\n  }, [state.isOpen]);\r\n\r\n  const actionItems: ActionMenuAction[] = items.map((item) => ({\r\n    key: item.key,\r\n    label: item.label,\r\n    to: item.to,\r\n    onAction: () => {\r\n      state.setSelectedKey(item.key);\r\n      state.close();\r\n    },\r\n  }));\r\n\r\n  return (\r\n    <div\r\n      className=\"proton-Select\"\r\n      aria-label={label || name}\r\n      aria-disabled={isDisabled}\r\n    >\r\n      {label ? (\r\n        <div\r\n          {...labelProps}\r\n          className=\"proton-Select__label\"\r\n          data-testid=\"select-label\"\r\n        >\r\n          {label}\r\n        </div>\r\n      ) : (\r\n        // If no label is provided, render an invisible label for a11y\r\n        <div {...labelProps} />\r\n      )}\r\n\r\n      <HiddenSelect\r\n        isDisabled={isDisabled}\r\n        state={state}\r\n        triggerRef={triggerRef}\r\n        label={label || name}\r\n        name={name}\r\n        data-testid=\"hidden-select-container\"\r\n      />\r\n\r\n      <SelectButton\r\n        {...triggerProps}\r\n        isOpen={state.isOpen}\r\n        ref={triggerRef}\r\n        disabled={isDisabled}\r\n        data-testid={testId}\r\n      >\r\n        <div {...valueProps} className=\"proton-Select__value\">\r\n          {state.selectedItem\r\n            ? state.selectedItem.rendered\r\n            : \"Select an option\"}\r\n        </div>\r\n        <div\r\n          className={csx(\r\n            \"proton-Select__trigger_icon\",\r\n            state.isOpen && \"proton-Select__trigger_icon--flipped\"\r\n          )}\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg id=\"caret-down\" viewBox=\"0 0 512 512\">\r\n            <title>{state.isOpen ? \"caret down\" : \"caret up\"}</title>\r\n            <path\r\n              fill=\"currentColor\"\r\n              d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7L86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\"\r\n            />\r\n          </svg>\r\n        </div>\r\n      </SelectButton>\r\n\r\n      {state.isOpen && (\r\n        <>\r\n          {!isMobile ? (\r\n            <div className=\"proton-Select__popover\">\r\n              <Popover\r\n                state={state}\r\n                triggerRef={triggerRef}\r\n                popoverRef={popoverRef}\r\n                placement=\"bottom start\"\r\n                data-testid=\"select-popover\"\r\n              >\r\n                <ListBox {...menuProps} state={state} />\r\n              </Popover>\r\n            </div>\r\n          ) : (\r\n            <ActionMenu\r\n              isOpen={state.isOpen}\r\n              onClose={() => state.close()}\r\n              actions={actionItems}\r\n              selectedKeys={[state.selectedKey.toString()]}\r\n              disabledKeys={disabledKeys}\r\n            />\r\n          )}\r\n        </>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nSelect.displayName = \"ProtonUISelect\";\r\n"],"names":["SelectButton","forwardRef","props","ref","buttonProps","useButton","jsx","csx","Select","label","name","isDisabled","disabledKeys","selectedKey","onSelectionChange","defaultSelectedKey","onOpen","onClose","items","testId","selectProps","isOpen","item","Item","state","useSelectState","isMobile","useBreakpoint","BREAKPOINTS","triggerRef","useRef","popoverRef","labelProps","triggerProps","valueProps","menuProps","useSelect","useEffect","actionItems","jsxs","HiddenSelect","Fragment","ActionMenu","Popover","ListBox"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../node_modules/react/jsx-runtime.cjs.js"),a=require("react"),d=require("../../node_modules/@react-aria/switch/dist/useSwitch.cjs.js"),r=require("../../node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.cjs.js"),c=require("../../node_modules/@react-stately/toggle/dist/useToggleState.cjs.js");;/* empty css                */const o=require("../../utils/string.cjs.js");function u(e){let s={...e,isSelected:e.isOn,"data-testid":void 0},l=a.useRef(null),i=c.useToggleState(s),{inputProps:n}=d.useSwitch(s,i,l);return t.jsxRuntimeExports.jsxs("label",{className:o.csx("proton-Switch",e.isDisabled&&"proton-Switch--disabled",i.isSelected&&"proton-Switch--on"),"data-on":i.isSelected||void 0,"data-disabled":e.isDisabled||void 0,"data-testid":e["data-testid"]||void 0,"aria-label":e.label||void 0,children:[t.jsxRuntimeExports.jsx(r.VisuallyHidden,{children:t.jsxRuntimeExports.jsx("input",{...n,ref:l})}),e.label&&t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__label",children:e.label}),t.jsxRuntimeExports.jsxs("div",{className:"proton-Switch__wrapper",children:[t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__toggle",children:t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__slider"})}),e.children&&t.jsxRuntimeExports.jsx("div",{className:"proton-Switch__description",children:e.children})]})]})}exports.Switch=u;
-//# sourceMappingURL=Switch.cjs.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Switch.cjs.js","sources":["../../../src/components/Switch/Switch.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useRef } from \"react\";\r\nimport { useSwitch } from \"@react-aria/switch\";\r\nimport { VisuallyHidden } from \"@react-aria/visually-hidden\";\r\nimport { useToggleState } from \"@react-stately/toggle\";\r\n\r\nimport { csx } from \"../../utils\";\r\n\r\nimport \"./Switch.css\";\r\n\r\nexport interface SwitchProps {\r\n  /**\r\n   * Whether the Switch is in the 'on' state (uncontrolled).\r\n   */\r\n  defaultOn?: boolean;\r\n\r\n  /**\r\n   * Whether the Switch is in the 'on' state. Providing this prop causes the\r\n   * component to become controlled.\r\n   */\r\n  isOn?: boolean;\r\n\r\n  /**\r\n   * Should the input be non-interactive?\r\n   */\r\n  isDisabled?: boolean;\r\n\r\n  /**\r\n   * Called when the Switch's on state changes.\r\n   */\r\n  onChange?: (isOn: boolean) => void;\r\n\r\n  /**\r\n   * The string used for the input label. Forwarded to `aria-label`.\r\n   */\r\n  label?: string;\r\n\r\n  /**\r\n   * The text or component to be rendered as the Switch's description.\r\n   */\r\n  children?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * A toggle switch component for boolean state control with support for controlled and uncontrolled modes.\r\n *\r\n * API:\r\n *  - {@link SwitchProps}\r\n */\r\nexport function Switch(props: SwitchProps) {\r\n  let sanitizedProps = {\r\n    ...props,\r\n    isSelected: props.isOn,\r\n    \"data-testid\": undefined,\r\n  };\r\n\r\n  let ref = useRef(null);\r\n\r\n  let state = useToggleState(sanitizedProps);\r\n  let { inputProps } = useSwitch(sanitizedProps, state, ref);\r\n\r\n  return (\r\n    <label\r\n      className={csx(\r\n        \"proton-Switch\",\r\n        props.isDisabled && \"proton-Switch--disabled\",\r\n        state.isSelected && \"proton-Switch--on\"\r\n      )}\r\n      data-on={state.isSelected || undefined}\r\n      data-disabled={props.isDisabled || undefined}\r\n      data-testid={props[\"data-testid\"] || undefined}\r\n      aria-label={props.label || undefined}\r\n    >\r\n      <VisuallyHidden>\r\n        <input {...inputProps} ref={ref} />\r\n      </VisuallyHidden>\r\n      {props.label && <div className=\"proton-Switch__label\">{props.label}</div>}\r\n      <div className=\"proton-Switch__wrapper\">\r\n        <div className=\"proton-Switch__toggle\">\r\n          <div className=\"proton-Switch__slider\"></div>\r\n        </div>\r\n        {props.children && (\r\n          <div className=\"proton-Switch__description\">{props.children}</div>\r\n        )}\r\n      </div>\r\n    </label>\r\n  );\r\n}\r\n"],"names":["Switch","props","sanitizedProps","ref","useRef","state","useToggleState","inputProps","useSwitch","jsxs","csx","jsx","VisuallyHidden"],"mappings":"+dAkDO,SAASA,EAAOC,EAAoB,CACzC,IAAIC,EAAiB,CACnB,GAAGD,EACH,WAAYA,EAAM,KAClB,cAAe,MAAA,EAGbE,EAAMC,SAAO,IAAI,EAEjBC,EAAQC,iBAAeJ,CAAc,EACrC,CAAE,WAAAK,CAAW,EAAIC,EAAAA,UAAUN,EAAgBG,EAAOF,CAAG,EAGvD,OAAAM,EAAA,kBAAA,KAAC,QAAA,CACC,UAAWC,EAAA,IACT,gBACAT,EAAM,YAAc,0BACpBI,EAAM,YAAc,mBACtB,EACA,UAASA,EAAM,YAAc,OAC7B,gBAAeJ,EAAM,YAAc,OACnC,cAAaA,EAAM,aAAa,GAAK,OACrC,aAAYA,EAAM,OAAS,OAE3B,SAAA,CAAAU,wBAACC,EAAAA,gBACC,SAACD,EAAA,kBAAA,IAAA,QAAA,CAAO,GAAGJ,EAAY,IAAAJ,CAAU,CAAA,EACnC,EACCF,EAAM,OAASU,EAAA,kBAAA,IAAC,OAAI,UAAU,uBAAwB,WAAM,MAAM,EACnEF,EAAAA,kBAAAA,KAAC,MAAI,CAAA,UAAU,yBACb,SAAA,CAAAE,EAAAA,kBAAAA,IAAC,OAAI,UAAU,wBACb,iCAAC,MAAI,CAAA,UAAU,wBAAwB,CACzC,CAAA,EACCV,EAAM,UACLU,EAAA,kBAAA,IAAC,OAAI,UAAU,6BAA8B,WAAM,SAAS,CAAA,EAEhE,CAAA,CAAA,CAAA,CAGN"}