@inzumer/ui-library 1.4.0 → 1.5.0

package/dist/Select.styles-CeZROqOk.d.ts

@@ -0,0 +1,8 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+declare const selectStyles: (props?: ({
+    state?: "error" | "default" | null | undefined;
+    inputSize?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+export { selectStyles as s };

package/dist/{chunk-VGLFR5SB.js → chunk-42G4RRCZ.js}

@@ -1,7 +1,7 @@
 import { useFocusTrap } from './chunk-QT62VC36.js';
 import { useScrollLock } from './chunk-53YMHM24.js';
-import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { useDismissableLayer } from './chunk-JCJP427C.js';
+import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { Button } from './chunk-KL6I2JFC.js';
 import { useMergedRef } from './chunk-P4Z7HH66.js';
 import { RichText } from './chunk-P4CV2EPR.js';
@@ -138,5 +138,5 @@ var Drawer = forwardRef(
 Drawer.displayName = "Drawer";
 
 export { Drawer };
-//# sourceMappingURL=chunk-VGLFR5SB.js.map
-//# sourceMappingURL=chunk-VGLFR5SB.js.map
+//# sourceMappingURL=chunk-42G4RRCZ.js.map
+//# sourceMappingURL=chunk-42G4RRCZ.js.map

package/dist/{chunk-VGLFR5SB.js.map → chunk-42G4RRCZ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/molecules/Drawer/Drawer.styles.ts","../src/components/molecules/Drawer/Drawer.tsx"],"names":[],"mappings":"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","file":"chunk-VGLFR5SB.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const drawerOverlayStyles = cva(\n  'absolute inset-0 bg-[var(--surface-overlay)] transition-opacity duration-200 ease-out',\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const drawerPanelStyles = cva(\n  [\n    'absolute inset-y-0 flex w-full max-w-80 flex-col gap-6 overflow-y-auto',\n    'border-[var(--border-default)] bg-[var(--surface-primary)] p-6 shadow-xl',\n    'transition-transform duration-200 ease-out focus:outline-none',\n  ],\n  {\n    variants: {\n      side: {\n        left: 'left-0 border-r',\n        right: 'right-0 border-l',\n      },\n      visible: {\n        true: 'translate-x-0',\n        false: '',\n      },\n    },\n    compoundVariants: [\n      { side: 'left', visible: false, className: '-translate-x-full' },\n      { side: 'right', visible: false, className: 'translate-x-full' },\n    ],\n    defaultVariants: {\n      side: 'right',\n      visible: false,\n    },\n  },\n);\n\nexport const drawerHeaderStyles = 'flex items-center justify-between gap-4';\n\nexport const drawerTitleStyles = 'text-lg font-semibold text-[var(--text-primary)]';\n\nexport const drawerFooterStyles = 'mt-auto flex flex-col gap-4';\n","import { Button, RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport type { VariantProps } from 'class-variance-authority';\nimport { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport {\n  drawerFooterStyles,\n  drawerHeaderStyles,\n  drawerOverlayStyles,\n  drawerPanelStyles,\n  drawerTitleStyles,\n} from './Drawer.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type DrawerProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> &\n  Pick<VariantProps<typeof drawerPanelStyles>, 'side'> & {\n    open: boolean;\n    onClose: () => void;\n    title?: ReactNode;\n    /** Extra classes for the title (e.g. a display font). */\n    titleClassName?: string;\n    /** Accessible name of the close button; the button is only rendered when this is set. */\n    closeLabel?: string;\n    /** Pinned to the bottom of the panel (preferences, actions). */\n    footer?: ReactNode;\n    closeOnBackdropClick?: boolean;\n  };\n\n/**\n * A side panel (navigation menus, filters, settings) that slides in from the left or right.\n * Modal dialog semantics: focus moves inside and is trapped, Escape and backdrop clicks close it,\n * the page behind doesn't scroll, and focus returns to the trigger when it closes.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n  (\n    {\n      open,\n      onClose,\n      side,\n      title,\n      titleClassName,\n      closeLabel,\n      footer,\n      closeOnBackdropClick = true,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className=\"fixed inset-0 z-50\">\n        <div aria-hidden=\"true\" className={drawerOverlayStyles({ visible })} />\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(drawerPanelStyles({ side, visible }), className)}\n          {...props}\n        >\n          {(title || closeLabel) && (\n            <div className={drawerHeaderStyles}>\n              {title && (\n                <RichText\n                  as=\"h2\"\n                  id={titleId}\n                  variant=\"s1\"\n                  className={cn(drawerTitleStyles, titleClassName)}\n                >\n                  {title}\n                </RichText>\n              )}\n              {closeLabel && (\n                <Button\n                  variant=\"ghost\"\n                  size=\"icon\"\n                  aria-label={closeLabel}\n                  onClick={onClose}\n                  className=\"ml-auto size-11\"\n                >\n                  <svg\n                    aria-hidden\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth={2}\n                    strokeLinecap=\"round\"\n                    className=\"size-6\"\n                  >\n                    <path d=\"M6 6l12 12M18 6L6 18\" />\n                  </svg>\n                </Button>\n              )}\n            </div>\n          )}\n          {children}\n          {footer && <div className={drawerFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nDrawer.displayName = 'Drawer';\n"]}
+{"version":3,"sources":["../src/components/molecules/Drawer/Drawer.styles.ts","../src/components/molecules/Drawer/Drawer.tsx"],"names":[],"mappings":"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","file":"chunk-42G4RRCZ.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const drawerOverlayStyles = cva(\n  'absolute inset-0 bg-[var(--surface-overlay)] transition-opacity duration-200 ease-out',\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const drawerPanelStyles = cva(\n  [\n    'absolute inset-y-0 flex w-full max-w-80 flex-col gap-6 overflow-y-auto',\n    'border-[var(--border-default)] bg-[var(--surface-primary)] p-6 shadow-xl',\n    'transition-transform duration-200 ease-out focus:outline-none',\n  ],\n  {\n    variants: {\n      side: {\n        left: 'left-0 border-r',\n        right: 'right-0 border-l',\n      },\n      visible: {\n        true: 'translate-x-0',\n        false: '',\n      },\n    },\n    compoundVariants: [\n      { side: 'left', visible: false, className: '-translate-x-full' },\n      { side: 'right', visible: false, className: 'translate-x-full' },\n    ],\n    defaultVariants: {\n      side: 'right',\n      visible: false,\n    },\n  },\n);\n\nexport const drawerHeaderStyles = 'flex items-center justify-between gap-4';\n\nexport const drawerTitleStyles = 'text-lg font-semibold text-[var(--text-primary)]';\n\nexport const drawerFooterStyles = 'mt-auto flex flex-col gap-4';\n","import { Button, RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport type { VariantProps } from 'class-variance-authority';\nimport { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport {\n  drawerFooterStyles,\n  drawerHeaderStyles,\n  drawerOverlayStyles,\n  drawerPanelStyles,\n  drawerTitleStyles,\n} from './Drawer.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type DrawerProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> &\n  Pick<VariantProps<typeof drawerPanelStyles>, 'side'> & {\n    open: boolean;\n    onClose: () => void;\n    title?: ReactNode;\n    /** Extra classes for the title (e.g. a display font). */\n    titleClassName?: string;\n    /** Accessible name of the close button; the button is only rendered when this is set. */\n    closeLabel?: string;\n    /** Pinned to the bottom of the panel (preferences, actions). */\n    footer?: ReactNode;\n    closeOnBackdropClick?: boolean;\n  };\n\n/**\n * A side panel (navigation menus, filters, settings) that slides in from the left or right.\n * Modal dialog semantics: focus moves inside and is trapped, Escape and backdrop clicks close it,\n * the page behind doesn't scroll, and focus returns to the trigger when it closes.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n  (\n    {\n      open,\n      onClose,\n      side,\n      title,\n      titleClassName,\n      closeLabel,\n      footer,\n      closeOnBackdropClick = true,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className=\"fixed inset-0 z-50\">\n        <div aria-hidden=\"true\" className={drawerOverlayStyles({ visible })} />\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(drawerPanelStyles({ side, visible }), className)}\n          {...props}\n        >\n          {(title || closeLabel) && (\n            <div className={drawerHeaderStyles}>\n              {title && (\n                <RichText\n                  as=\"h2\"\n                  id={titleId}\n                  variant=\"s1\"\n                  className={cn(drawerTitleStyles, titleClassName)}\n                >\n                  {title}\n                </RichText>\n              )}\n              {closeLabel && (\n                <Button\n                  variant=\"ghost\"\n                  size=\"icon\"\n                  aria-label={closeLabel}\n                  onClick={onClose}\n                  className=\"ml-auto size-11\"\n                >\n                  <svg\n                    aria-hidden\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth={2}\n                    strokeLinecap=\"round\"\n                    className=\"size-6\"\n                  >\n                    <path d=\"M6 6l12 12M18 6L6 18\" />\n                  </svg>\n                </Button>\n              )}\n            </div>\n          )}\n          {children}\n          {footer && <div className={drawerFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nDrawer.displayName = 'Drawer';\n"]}

package/dist/{chunk-W3H7DYWX.js → chunk-4CY55XM3.js}

@@ -1,7 +1,7 @@
 import { useFocusTrap } from './chunk-QT62VC36.js';
 import { useScrollLock } from './chunk-53YMHM24.js';
-import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { useDismissableLayer } from './chunk-JCJP427C.js';
+import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { useMergedRef } from './chunk-P4Z7HH66.js';
 import { RichText } from './chunk-P4CV2EPR.js';
 import { cn } from './chunk-6LLGTBM6.js';
@@ -80,5 +80,5 @@ var Modal = forwardRef(
 Modal.displayName = "Modal";
 
 export { Modal };
-//# sourceMappingURL=chunk-W3H7DYWX.js.map
-//# sourceMappingURL=chunk-W3H7DYWX.js.map
+//# sourceMappingURL=chunk-4CY55XM3.js.map
+//# sourceMappingURL=chunk-4CY55XM3.js.map

package/dist/{chunk-W3H7DYWX.js.map → chunk-4CY55XM3.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/molecules/Modal/Modal.styles.ts","../src/components/molecules/Modal/Modal.tsx"],"names":[],"mappings":";;;;;;;;;;;AAEO,IAAM,kBAAA,GAAqB,GAAA;AAAA,EAChC;AAAA,IACE,qFAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,aAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,gBAAA,GAAmB,GAAA;AAAA,EAC9B;AAAA,IACE,8GAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,uBAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,gBAAA,GAAmB,uDAAA;AAEzB,IAAM,iBAAA,GAAoB,0CAAA;ACvBjC,IAAM,gBAAA,GAAmB,GAAA;AAUlB,IAAM,KAAA,GAAQ,UAAA;AAAA,EACnB,CACE,EAAE,IAAA,EAAM,OAAA,EAAS,KAAA,EAAO,MAAA,EAAQ,oBAAA,GAAuB,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,IACrF,GAAA,KACG;AACH,IAAA,MAAM,QAAA,GAAW,OAA8B,IAAI,CAAA;AACnD,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,GAAA,EAAK,QAAQ,CAAA;AAC9C,IAAA,MAAM,UAAU,KAAA,EAAM;AACtB,IAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAQ,GAAI,iBAAA,CAAkB,MAAM,gBAAgB,CAAA;AAErE,IAAA,mBAAA,CAAoB,IAAA,EAAM,OAAA,EAAS,QAAA,EAAU,oBAAoB,CAAA;AAEjE,IAAA,YAAA,CAAa,IAAA,IAAQ,SAAS,QAAQ,CAAA;AACtC,IAAA,aAAA,CAAc,IAAI,CAAA;AAElB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,mBAAmB,EAAE,OAAA,EAAS,CAAA,EAC5C,QAAA,kBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,WAAA;AAAA,QACL,IAAA,EAAK,QAAA;AAAA,QACL,YAAA,EAAW,MAAA;AAAA,QACX,iBAAA,EAAiB,QAAQ,OAAA,GAAU,MAAA;AAAA,QACnC,QAAA,EAAU,EAAA;AAAA,QACV,WAAW,EAAA,CAAG,gBAAA,CAAiB,EAAE,OAAA,EAAS,GAAG,SAAS,CAAA;AAAA,QACrD,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA,oBACC,GAAA,CAAC,QAAA,EAAA,EAAS,EAAA,EAAG,IAAA,EAAK,EAAA,EAAI,SAAS,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,gBAAA,EACpD,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAED,QAAA;AAAA,UACA,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,mBAAoB,QAAA,EAAA,MAAA,EAAO;AAAA;AAAA;AAAA,KACxD,EACF,CAAA;AAAA,EAEJ;AACF;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-W3H7DYWX.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const modalOverlayStyles = cva(\n  [\n    'fixed inset-0 z-50 flex items-center justify-center bg-[var(--surface-overlay)] p-4',\n    'transition-opacity duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const modalPanelStyles = cva(\n  [\n    'w-full max-w-md rounded-xl border border-[var(--border-default)] bg-[var(--surface-secondary)] p-6 shadow-lg',\n    'transition-all duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'scale-100 opacity-100',\n        false: 'scale-95 opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const modalTitleStyles = 'mb-4 text-lg font-semibold text-[var(--text-primary)]';\n\nexport const modalFooterStyles = 'mt-6 flex items-center justify-end gap-2';\n","import { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport {\n  modalFooterStyles,\n  modalOverlayStyles,\n  modalPanelStyles,\n  modalTitleStyles,\n} from './Modal.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type ModalProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n  open: boolean;\n  onClose: () => void;\n  title?: ReactNode;\n  footer?: ReactNode;\n  closeOnBackdropClick?: boolean;\n};\n\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(\n  (\n    { open, onClose, title, footer, closeOnBackdropClick = true, className, children, ...props },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className={modalOverlayStyles({ visible })}>\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(modalPanelStyles({ visible }), className)}\n          {...props}\n        >\n          {title && (\n            <RichText as=\"h2\" id={titleId} variant=\"s1\" className={modalTitleStyles}>\n              {title}\n            </RichText>\n          )}\n          {children}\n          {footer && <div className={modalFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nModal.displayName = 'Modal';\n"]}
+{"version":3,"sources":["../src/components/molecules/Modal/Modal.styles.ts","../src/components/molecules/Modal/Modal.tsx"],"names":[],"mappings":";;;;;;;;;;;AAEO,IAAM,kBAAA,GAAqB,GAAA;AAAA,EAChC;AAAA,IACE,qFAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,aAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,gBAAA,GAAmB,GAAA;AAAA,EAC9B;AAAA,IACE,8GAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,uBAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,gBAAA,GAAmB,uDAAA;AAEzB,IAAM,iBAAA,GAAoB,0CAAA;ACvBjC,IAAM,gBAAA,GAAmB,GAAA;AAUlB,IAAM,KAAA,GAAQ,UAAA;AAAA,EACnB,CACE,EAAE,IAAA,EAAM,OAAA,EAAS,KAAA,EAAO,MAAA,EAAQ,oBAAA,GAAuB,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,IACrF,GAAA,KACG;AACH,IAAA,MAAM,QAAA,GAAW,OAA8B,IAAI,CAAA;AACnD,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,GAAA,EAAK,QAAQ,CAAA;AAC9C,IAAA,MAAM,UAAU,KAAA,EAAM;AACtB,IAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAQ,GAAI,iBAAA,CAAkB,MAAM,gBAAgB,CAAA;AAErE,IAAA,mBAAA,CAAoB,IAAA,EAAM,OAAA,EAAS,QAAA,EAAU,oBAAoB,CAAA;AAEjE,IAAA,YAAA,CAAa,IAAA,IAAQ,SAAS,QAAQ,CAAA;AACtC,IAAA,aAAA,CAAc,IAAI,CAAA;AAElB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,mBAAmB,EAAE,OAAA,EAAS,CAAA,EAC5C,QAAA,kBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,WAAA;AAAA,QACL,IAAA,EAAK,QAAA;AAAA,QACL,YAAA,EAAW,MAAA;AAAA,QACX,iBAAA,EAAiB,QAAQ,OAAA,GAAU,MAAA;AAAA,QACnC,QAAA,EAAU,EAAA;AAAA,QACV,WAAW,EAAA,CAAG,gBAAA,CAAiB,EAAE,OAAA,EAAS,GAAG,SAAS,CAAA;AAAA,QACrD,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA,oBACC,GAAA,CAAC,QAAA,EAAA,EAAS,EAAA,EAAG,IAAA,EAAK,EAAA,EAAI,SAAS,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,gBAAA,EACpD,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAED,QAAA;AAAA,UACA,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,mBAAoB,QAAA,EAAA,MAAA,EAAO;AAAA;AAAA;AAAA,KACxD,EACF,CAAA;AAAA,EAEJ;AACF;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-4CY55XM3.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const modalOverlayStyles = cva(\n  [\n    'fixed inset-0 z-50 flex items-center justify-center bg-[var(--surface-overlay)] p-4',\n    'transition-opacity duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const modalPanelStyles = cva(\n  [\n    'w-full max-w-md rounded-xl border border-[var(--border-default)] bg-[var(--surface-secondary)] p-6 shadow-lg',\n    'transition-all duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'scale-100 opacity-100',\n        false: 'scale-95 opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const modalTitleStyles = 'mb-4 text-lg font-semibold text-[var(--text-primary)]';\n\nexport const modalFooterStyles = 'mt-6 flex items-center justify-end gap-2';\n","import { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport {\n  modalFooterStyles,\n  modalOverlayStyles,\n  modalPanelStyles,\n  modalTitleStyles,\n} from './Modal.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type ModalProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n  open: boolean;\n  onClose: () => void;\n  title?: ReactNode;\n  footer?: ReactNode;\n  closeOnBackdropClick?: boolean;\n};\n\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(\n  (\n    { open, onClose, title, footer, closeOnBackdropClick = true, className, children, ...props },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className={modalOverlayStyles({ visible })}>\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(modalPanelStyles({ visible }), className)}\n          {...props}\n        >\n          {title && (\n            <RichText as=\"h2\" id={titleId} variant=\"s1\" className={modalTitleStyles}>\n              {title}\n            </RichText>\n          )}\n          {children}\n          {footer && <div className={modalFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nModal.displayName = 'Modal';\n"]}

package/dist/chunk-4H6VER5P.js

@@ -0,0 +1,36 @@
+import { cva } from 'class-variance-authority';
+
+// src/components/atoms/Select/Select.styles.ts
+var selectStyles = cva(
+  [
+    "flex w-full appearance-none rounded-md bg-no-repeat pr-10",
+    "text-[var(--input-text)] bg-[var(--input-bg)]",
+    "border border-[var(--input-border)]",
+    "transition-colors duration-150 ease-in-out",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--border-focus)] focus-visible:ring-offset-0",
+    "focus-visible:border-[var(--input-border-focus)]",
+    "disabled:cursor-not-allowed disabled:opacity-50"
+  ],
+  {
+    variants: {
+      state: {
+        default: "",
+        error: "border-[var(--input-border-error)] focus-visible:ring-[var(--border-error)]"
+      },
+      inputSize: {
+        sm: "h-8 px-2 text-xs",
+        md: "h-10 px-3 text-sm",
+        lg: "h-12 px-4 text-base"
+      }
+    },
+    defaultVariants: {
+      state: "default",
+      inputSize: "md"
+    }
+  }
+);
+var selectChevronStyles = "pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[var(--text-secondary)]";
+
+export { selectChevronStyles, selectStyles };
+//# sourceMappingURL=chunk-4H6VER5P.js.map
+//# sourceMappingURL=chunk-4H6VER5P.js.map

package/dist/chunk-4H6VER5P.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/atoms/Select/Select.styles.ts"],"names":[],"mappings":";;;AAEO,IAAM,YAAA,GAAe,GAAA;AAAA,EAC1B;AAAA,IACE,2DAAA;AAAA,IACA,+CAAA;AAAA,IACA,qCAAA;AAAA,IACA,4CAAA;AAAA,IACA,sHAAA;AAAA,IACA,kDAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,KAAA,EAAO;AAAA,QACL,OAAA,EAAS,EAAA;AAAA,QACT,KAAA,EAAO;AAAA,OACT;AAAA,MACA,SAAA,EAAW;AAAA,QACT,EAAA,EAAI,kBAAA;AAAA,QACJ,EAAA,EAAI,mBAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,KAAA,EAAO,SAAA;AAAA,MACP,SAAA,EAAW;AAAA;AACb;AAEJ;AAGO,IAAM,mBAAA,GACX","file":"chunk-4H6VER5P.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const selectStyles = cva(\n  [\n    'flex w-full appearance-none rounded-md bg-no-repeat pr-10',\n    'text-[var(--input-text)] bg-[var(--input-bg)]',\n    'border border-[var(--input-border)]',\n    'transition-colors duration-150 ease-in-out',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--border-focus)] focus-visible:ring-offset-0',\n    'focus-visible:border-[var(--input-border-focus)]',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n  ],\n  {\n    variants: {\n      state: {\n        default: '',\n        error: 'border-[var(--input-border-error)] focus-visible:ring-[var(--border-error)]',\n      },\n      inputSize: {\n        sm: 'h-8 px-2 text-xs',\n        md: 'h-10 px-3 text-sm',\n        lg: 'h-12 px-4 text-base',\n      },\n    },\n    defaultVariants: {\n      state: 'default',\n      inputSize: 'md',\n    },\n  },\n);\n\n/** Chevron drawn with `currentColor`, positioned over the right padding of the select. */\nexport const selectChevronStyles =\n  'pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[var(--text-secondary)]';\n"]}

package/dist/chunk-BGUNAALU.js

@@ -0,0 +1,238 @@
+import { useDismissableLayer } from './chunk-JCJP427C.js';
+import { selectStyles, selectChevronStyles } from './chunk-4H6VER5P.js';
+import { inputLabelStyles, inputErrorStyles, inputHintStyles } from './chunk-FFKHEBQ7.js';
+import { RichText } from './chunk-P4CV2EPR.js';
+import { cn } from './chunk-6LLGTBM6.js';
+import { forwardRef, useId, useRef, useState, useCallback, useEffect } from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var dropdownTriggerStyles = "items-center text-left";
+var dropdownValueStyles = "truncate";
+var dropdownChevronStyles = "transition-transform duration-150 ease-out";
+var dropdownListStyles = [
+  "absolute left-0 right-0 top-full z-50 mt-1 max-h-60 overflow-y-auto p-1",
+  "rounded-md border border-[var(--input-border)] bg-[var(--input-bg)] shadow-lg",
+  "focus:outline-none"
+].join(" ");
+var dropdownOptionStyles = cva(
+  "flex min-h-10 cursor-pointer items-center justify-between gap-3 rounded px-3 text-[var(--input-text)]",
+  {
+    variants: {
+      active: {
+        true: "bg-[var(--btn-primary-bg)] text-[var(--btn-primary-text)]",
+        false: ""
+      },
+      selected: {
+        true: "font-semibold",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      active: false,
+      selected: false
+    }
+  }
+);
+var dropdownCheckStyles = "size-4 shrink-0";
+var Dropdown = forwardRef(
+  ({
+    label,
+    options,
+    value,
+    onChange,
+    hint,
+    error,
+    disabled,
+    id: idProp,
+    name,
+    inputSize,
+    state,
+    className
+  }, ref) => {
+    const generatedId = useId();
+    const id = idProp ?? generatedId;
+    const labelId = `${id}-label`;
+    const listId = `${id}-listbox`;
+    const containerRef = useRef(null);
+    const listRef = useRef(null);
+    const [open, setOpen] = useState(false);
+    const selectedIndex = Math.max(
+      0,
+      options.findIndex((option) => option.value === value)
+    );
+    const [activeIndex, setActiveIndex] = useState(selectedIndex);
+    const last = options.length - 1;
+    const resolvedState = error ? "error" : state;
+    const close = useCallback(() => setOpen(false), []);
+    useDismissableLayer(open, close, containerRef);
+    useEffect(() => {
+      if (open) {
+        listRef.current?.children[activeIndex]?.scrollIntoView?.({ block: "nearest" });
+      }
+    }, [open, activeIndex]);
+    const openAt = (index) => {
+      setActiveIndex(index);
+      setOpen(true);
+    };
+    const choose = (index) => {
+      const option = options[index];
+      if (option && option.value !== value) {
+        onChange(option.value);
+      }
+      setOpen(false);
+    };
+    const indexForLetter = (key) => {
+      const start = (open ? activeIndex : selectedIndex) + 1;
+      const ordered = [...options.slice(start), ...options.slice(0, start)];
+      const match = ordered.find(
+        (option) => option.label.toLowerCase().startsWith(key.toLowerCase())
+      );
+      return match ? options.indexOf(match) : -1;
+    };
+    const openKeys = {
+      ArrowDown: () => setActiveIndex((index) => Math.min(last, index + 1)),
+      ArrowUp: () => setActiveIndex((index) => Math.max(0, index - 1)),
+      Home: () => setActiveIndex(0),
+      End: () => setActiveIndex(last),
+      Enter: () => choose(activeIndex),
+      " ": () => choose(activeIndex),
+      Escape: close
+    };
+    const closedKeys = {
+      ArrowDown: () => openAt(selectedIndex),
+      ArrowUp: () => openAt(selectedIndex),
+      Home: () => openAt(0),
+      End: () => openAt(last),
+      Enter: () => openAt(selectedIndex),
+      " ": () => openAt(selectedIndex)
+    };
+    const handleKeyDown = (event) => {
+      if (event.key === "Tab") {
+        close();
+        return;
+      }
+      const action = (open ? openKeys : closedKeys)[event.key];
+      if (action) {
+        event.preventDefault();
+        action();
+        return;
+      }
+      if (event.key.length === 1 && event.key.trim() !== "") {
+        const index = indexForLetter(event.key);
+        if (index >= 0 && open) {
+          setActiveIndex(index);
+        } else if (index >= 0) {
+          choose(index);
+        }
+      }
+    };
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1.5", className), children: [
+      /* @__PURE__ */ jsx(RichText, { as: "span", id: labelId, variant: "p3", className: inputLabelStyles, children: label }),
+      /* @__PURE__ */ jsxs("div", { ref: containerRef, className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            ref,
+            id,
+            type: "button",
+            role: "combobox",
+            "aria-haspopup": "listbox",
+            "aria-expanded": open,
+            "aria-controls": listId,
+            "aria-labelledby": `${labelId} ${id}`,
+            "aria-activedescendant": open ? `${id}-option-${activeIndex}` : void 0,
+            "aria-describedby": error ? `${id}-error` : hint ? `${id}-hint` : void 0,
+            "aria-invalid": error ? "true" : void 0,
+            disabled,
+            onClick: () => open ? close() : openAt(selectedIndex),
+            onKeyDown: handleKeyDown,
+            className: cn(selectStyles({ state: resolvedState, inputSize }), dropdownTriggerStyles),
+            children: /* @__PURE__ */ jsx(RichText, { as: "span", variant: "s3", className: cn(dropdownValueStyles, "text-inherit"), children: options[selectedIndex]?.label })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            "aria-hidden": true,
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: 2,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            className: cn(selectChevronStyles, dropdownChevronStyles, open && "rotate-180"),
+            children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" })
+          }
+        ),
+        name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value }),
+        /* @__PURE__ */ jsx(
+          "ul",
+          {
+            ref: listRef,
+            id: listId,
+            role: "listbox",
+            "aria-labelledby": labelId,
+            tabIndex: -1,
+            hidden: !open,
+            className: dropdownListStyles,
+            children: options.map((option, index) => {
+              const selected = index === selectedIndex;
+              return (
+                // Options never take focus (APG select-only combobox): the trigger handles the keys.
+                // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+                /* @__PURE__ */ jsxs(
+                  "li",
+                  {
+                    id: `${id}-option-${index}`,
+                    role: "option",
+                    "aria-selected": selected,
+                    onPointerDown: (event) => event.preventDefault(),
+                    onPointerEnter: () => setActiveIndex(index),
+                    onClick: () => choose(index),
+                    className: dropdownOptionStyles({ active: index === activeIndex, selected }),
+                    children: [
+                      /* @__PURE__ */ jsx(RichText, { as: "span", variant: "s3", className: "text-inherit", children: option.label }),
+                      selected && /* @__PURE__ */ jsx(
+                        "svg",
+                        {
+                          "aria-hidden": true,
+                          viewBox: "0 0 24 24",
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: 2.5,
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          className: dropdownCheckStyles,
+                          children: /* @__PURE__ */ jsx("path", { d: "M5 12l5 5 9-10" })
+                        }
+                      )
+                    ]
+                  },
+                  option.value
+                )
+              );
+            })
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx(
+        RichText,
+        {
+          as: "p",
+          id: `${id}-error`,
+          role: "alert",
+          variant: "p4",
+          className: inputErrorStyles,
+          children: error
+        }
+      ),
+      !error && hint && /* @__PURE__ */ jsx(RichText, { as: "p", id: `${id}-hint`, variant: "p4", className: inputHintStyles, children: hint })
+    ] });
+  }
+);
+Dropdown.displayName = "Dropdown";
+
+export { Dropdown };
+//# sourceMappingURL=chunk-BGUNAALU.js.map
+//# sourceMappingURL=chunk-BGUNAALU.js.map

package/dist/chunk-BGUNAALU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/molecules/Dropdown/Dropdown.styles.ts","../src/components/molecules/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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","file":"chunk-BGUNAALU.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const dropdownTriggerStyles = 'items-center text-left';\n\nexport const dropdownValueStyles = 'truncate';\n\nexport const dropdownChevronStyles = 'transition-transform duration-150 ease-out';\n\nexport const dropdownListStyles = [\n  'absolute left-0 right-0 top-full z-50 mt-1 max-h-60 overflow-y-auto p-1',\n  'rounded-md border border-[var(--input-border)] bg-[var(--input-bg)] shadow-lg',\n  'focus:outline-none',\n].join(' ');\n\nexport const dropdownOptionStyles = cva(\n  'flex min-h-10 cursor-pointer items-center justify-between gap-3 rounded px-3 text-[var(--input-text)]',\n  {\n    variants: {\n      active: {\n        true: 'bg-[var(--btn-primary-bg)] text-[var(--btn-primary-text)]',\n        false: '',\n      },\n      selected: {\n        true: 'font-semibold',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      active: false,\n      selected: false,\n    },\n  },\n);\n\nexport const dropdownCheckStyles = 'size-4 shrink-0';\n","import { RichText } from '@components';\nimport { useDismissableLayer } from '@hooks';\nimport { cn } from '@utils';\nimport type { VariantProps } from 'class-variance-authority';\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type KeyboardEvent,\n} from 'react';\nimport {\n  inputErrorStyles,\n  inputHintStyles,\n  inputLabelStyles,\n} from '@components/atoms/Input/Input.styles';\nimport { selectChevronStyles, selectStyles } from '@components/atoms/Select/Select.styles';\nimport {\n  dropdownCheckStyles,\n  dropdownChevronStyles,\n  dropdownListStyles,\n  dropdownOptionStyles,\n  dropdownTriggerStyles,\n  dropdownValueStyles,\n} from './Dropdown.styles';\n\nexport interface DropdownOption {\n  value: string;\n  label: string;\n}\n\nexport type DropdownProps = VariantProps<typeof selectStyles> & {\n  label: string;\n  options: DropdownOption[];\n  value: string;\n  onChange: (value: string) => void;\n  hint?: string;\n  error?: string;\n  disabled?: boolean;\n  id?: string;\n  name?: string;\n  className?: string;\n};\n\n/**\n * A select whose list is drawn with the theme (a native `<select>` opens the platform picker).\n * WAI-ARIA \"select-only combobox\": focus stays on the trigger and the active option is announced\n * through `aria-activedescendant`; arrows, Home/End, Enter/Space, Escape and typing a letter behave\n * like a native select.\n */\nexport const Dropdown = forwardRef<HTMLButtonElement, DropdownProps>(\n  (\n    {\n      label,\n      options,\n      value,\n      onChange,\n      hint,\n      error,\n      disabled,\n      id: idProp,\n      name,\n      inputSize,\n      state,\n      className,\n    },\n    ref,\n  ) => {\n    const generatedId = useId();\n    const id = idProp ?? generatedId;\n    const labelId = `${id}-label`;\n    const listId = `${id}-listbox`;\n    const containerRef = useRef<HTMLDivElement>(null);\n    const listRef = useRef<HTMLUListElement>(null);\n    const [open, setOpen] = useState(false);\n    const selectedIndex = Math.max(\n      0,\n      options.findIndex((option) => option.value === value),\n    );\n    const [activeIndex, setActiveIndex] = useState(selectedIndex);\n    const last = options.length - 1;\n    const resolvedState = error ? 'error' : state;\n\n    const close = useCallback(() => setOpen(false), []);\n    useDismissableLayer(open, close, containerRef);\n\n    useEffect(() => {\n      if (open) {\n        listRef.current?.children[activeIndex]?.scrollIntoView?.({ block: 'nearest' });\n      }\n    }, [open, activeIndex]);\n\n    const openAt = (index: number) => {\n      setActiveIndex(index);\n      setOpen(true);\n    };\n\n    const choose = (index: number) => {\n      const option = options[index];\n      if (option && option.value !== value) {\n        onChange(option.value);\n      }\n      setOpen(false);\n    };\n\n    const indexForLetter = (key: string) => {\n      const start = (open ? activeIndex : selectedIndex) + 1;\n      const ordered = [...options.slice(start), ...options.slice(0, start)];\n      const match = ordered.find((option) =>\n        option.label.toLowerCase().startsWith(key.toLowerCase()),\n      );\n      return match ? options.indexOf(match) : -1;\n    };\n\n    const openKeys: Record<string, () => void> = {\n      ArrowDown: () => setActiveIndex((index) => Math.min(last, index + 1)),\n      ArrowUp: () => setActiveIndex((index) => Math.max(0, index - 1)),\n      Home: () => setActiveIndex(0),\n      End: () => setActiveIndex(last),\n      Enter: () => choose(activeIndex),\n      ' ': () => choose(activeIndex),\n      Escape: close,\n    };\n\n    const closedKeys: Record<string, () => void> = {\n      ArrowDown: () => openAt(selectedIndex),\n      ArrowUp: () => openAt(selectedIndex),\n      Home: () => openAt(0),\n      End: () => openAt(last),\n      Enter: () => openAt(selectedIndex),\n      ' ': () => openAt(selectedIndex),\n    };\n\n    const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n      if (event.key === 'Tab') {\n        close();\n        return;\n      }\n      const action = (open ? openKeys : closedKeys)[event.key];\n      if (action) {\n        event.preventDefault();\n        action();\n        return;\n      }\n      if (event.key.length === 1 && event.key.trim() !== '') {\n        const index = indexForLetter(event.key);\n        if (index >= 0 && open) {\n          setActiveIndex(index);\n        } else if (index >= 0) {\n          choose(index);\n        }\n      }\n    };\n\n    return (\n      <div className={cn('flex flex-col gap-1.5', className)}>\n        <RichText as=\"span\" id={labelId} variant=\"p3\" className={inputLabelStyles}>\n          {label}\n        </RichText>\n        <div ref={containerRef} className=\"relative\">\n          <button\n            ref={ref}\n            id={id}\n            type=\"button\"\n            role=\"combobox\"\n            aria-haspopup=\"listbox\"\n            aria-expanded={open}\n            aria-controls={listId}\n            aria-labelledby={`${labelId} ${id}`}\n            aria-activedescendant={open ? `${id}-option-${activeIndex}` : undefined}\n            aria-describedby={error ? `${id}-error` : hint ? `${id}-hint` : undefined}\n            aria-invalid={error ? 'true' : undefined}\n            disabled={disabled}\n            onClick={() => (open ? close() : openAt(selectedIndex))}\n            onKeyDown={handleKeyDown}\n            className={cn(selectStyles({ state: resolvedState, inputSize }), dropdownTriggerStyles)}\n          >\n            <RichText as=\"span\" variant=\"s3\" className={cn(dropdownValueStyles, 'text-inherit')}>\n              {options[selectedIndex]?.label}\n            </RichText>\n          </button>\n          <svg\n            aria-hidden\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={2}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            className={cn(selectChevronStyles, dropdownChevronStyles, open && 'rotate-180')}\n          >\n            <path d=\"m6 9 6 6 6-6\" />\n          </svg>\n          {name && <input type=\"hidden\" name={name} value={value} />}\n          <ul\n            ref={listRef}\n            id={listId}\n            role=\"listbox\"\n            aria-labelledby={labelId}\n            tabIndex={-1}\n            hidden={!open}\n            className={dropdownListStyles}\n          >\n            {options.map((option, index) => {\n              const selected = index === selectedIndex;\n              return (\n                // Options never take focus (APG select-only combobox): the trigger handles the keys.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n                <li\n                  key={option.value}\n                  id={`${id}-option-${index}`}\n                  role=\"option\"\n                  aria-selected={selected}\n                  onPointerDown={(event) => event.preventDefault()}\n                  onPointerEnter={() => setActiveIndex(index)}\n                  onClick={() => choose(index)}\n                  className={dropdownOptionStyles({ active: index === activeIndex, selected })}\n                >\n                  <RichText as=\"span\" variant=\"s3\" className=\"text-inherit\">\n                    {option.label}\n                  </RichText>\n                  {selected && (\n                    <svg\n                      aria-hidden\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      strokeWidth={2.5}\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      className={dropdownCheckStyles}\n                    >\n                      <path d=\"M5 12l5 5 9-10\" />\n                    </svg>\n                  )}\n                </li>\n              );\n            })}\n          </ul>\n        </div>\n        {error && (\n          <RichText\n            as=\"p\"\n            id={`${id}-error`}\n            role=\"alert\"\n            variant=\"p4\"\n            className={inputErrorStyles}\n          >\n            {error}\n          </RichText>\n        )}\n        {!error && hint && (\n          <RichText as=\"p\" id={`${id}-hint`} variant=\"p4\" className={inputHintStyles}>\n            {hint}\n          </RichText>\n        )}\n      </div>\n    );\n  },\n);\n\nDropdown.displayName = 'Dropdown';\n"]}

package/dist/{chunk-ULLCBART.js → chunk-L4BPQAXU.js}

@@ -1,7 +1,7 @@
 import { useFocusTrap } from './chunk-QT62VC36.js';
 import { useScrollLock } from './chunk-53YMHM24.js';
-import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { useDismissableLayer } from './chunk-JCJP427C.js';
+import { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import { useMergedRef } from './chunk-P4Z7HH66.js';
 import { RichText } from './chunk-P4CV2EPR.js';
 import { cn } from './chunk-6LLGTBM6.js';
@@ -83,5 +83,5 @@ var BottomSheet = forwardRef(
 BottomSheet.displayName = "BottomSheet";
 
 export { BottomSheet };
-//# sourceMappingURL=chunk-ULLCBART.js.map
-//# sourceMappingURL=chunk-ULLCBART.js.map
+//# sourceMappingURL=chunk-L4BPQAXU.js.map
+//# sourceMappingURL=chunk-L4BPQAXU.js.map

package/dist/{chunk-ULLCBART.js.map → chunk-L4BPQAXU.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/molecules/BottomSheet/BottomSheet.styles.ts","../src/components/molecules/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":";;;;;;;;;;;AAEO,IAAM,wBAAA,GAA2B,GAAA;AAAA,EACtC;AAAA,IACE,8EAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,aAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,sBAAA,GAAyB,GAAA;AAAA,EACpC;AAAA,IACE,+EAAA;AAAA,IACA,6CAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,eAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,uBAAA,GACX,gEAAA;AAEK,IAAM,sBAAA,GAAyB,uDAAA;AAE/B,IAAM,uBAAA,GAA0B,0CAAA;AC1BvC,IAAM,gBAAA,GAAmB,GAAA;AAUlB,IAAM,WAAA,GAAc,UAAA;AAAA,EACzB,CACE,EAAE,IAAA,EAAM,OAAA,EAAS,KAAA,EAAO,MAAA,EAAQ,oBAAA,GAAuB,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,IACrF,GAAA,KACG;AACH,IAAA,MAAM,QAAA,GAAW,OAA8B,IAAI,CAAA;AACnD,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,GAAA,EAAK,QAAQ,CAAA;AAC9C,IAAA,MAAM,UAAU,KAAA,EAAM;AACtB,IAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAQ,GAAI,iBAAA,CAAkB,MAAM,gBAAgB,CAAA;AAErE,IAAA,mBAAA,CAAoB,IAAA,EAAM,OAAA,EAAS,QAAA,EAAU,oBAAoB,CAAA;AAEjE,IAAA,YAAA,CAAa,IAAA,IAAQ,SAAS,QAAQ,CAAA;AACtC,IAAA,aAAA,CAAc,IAAI,CAAA;AAElB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,yBAAyB,EAAE,OAAA,EAAS,CAAA,EAClD,QAAA,kBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,WAAA;AAAA,QACL,IAAA,EAAK,QAAA;AAAA,QACL,YAAA,EAAW,MAAA;AAAA,QACX,iBAAA,EAAiB,QAAQ,OAAA,GAAU,MAAA;AAAA,QACnC,QAAA,EAAU,EAAA;AAAA,QACV,WAAW,EAAA,CAAG,sBAAA,CAAuB,EAAE,OAAA,EAAS,GAAG,SAAS,CAAA;AAAA,QAC3D,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAW,IAAA,EAAC,SAAA,EAAW,uBAAA,EAAyB,CAAA;AAAA,UACpD,KAAA,oBACC,GAAA,CAAC,QAAA,EAAA,EAAS,EAAA,EAAG,IAAA,EAAK,EAAA,EAAI,OAAA,EAAS,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,sBAAA,EACpD,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAED,QAAA;AAAA,UACA,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,yBAA0B,QAAA,EAAA,MAAA,EAAO;AAAA;AAAA;AAAA,KAC9D,EACF,CAAA;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-ULLCBART.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const bottomSheetOverlayStyles = cva(\n  [\n    'fixed inset-0 z-50 flex items-end justify-center bg-[var(--surface-overlay)]',\n    'transition-opacity duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const bottomSheetPanelStyles = cva(\n  [\n    'w-full max-w-md rounded-t-xl border border-b-0 border-[var(--border-default)]',\n    'bg-[var(--surface-secondary)] p-6 shadow-lg',\n    'transition-transform duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'translate-y-0',\n        false: 'translate-y-full',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const bottomSheetHandleStyles =\n  'mx-auto mb-4 h-1.5 w-10 rounded-full bg-[var(--border-strong)]';\n\nexport const bottomSheetTitleStyles = 'mb-4 text-lg font-semibold text-[var(--text-primary)]';\n\nexport const bottomSheetFooterStyles = 'mt-6 flex items-center justify-end gap-2';\n","import { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport {\n  bottomSheetFooterStyles,\n  bottomSheetHandleStyles,\n  bottomSheetOverlayStyles,\n  bottomSheetPanelStyles,\n  bottomSheetTitleStyles,\n} from './BottomSheet.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type BottomSheetProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n  open: boolean;\n  onClose: () => void;\n  title?: ReactNode;\n  footer?: ReactNode;\n  closeOnBackdropClick?: boolean;\n};\n\nexport const BottomSheet = forwardRef<HTMLDivElement, BottomSheetProps>(\n  (\n    { open, onClose, title, footer, closeOnBackdropClick = true, className, children, ...props },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className={bottomSheetOverlayStyles({ visible })}>\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(bottomSheetPanelStyles({ visible }), className)}\n          {...props}\n        >\n          <div aria-hidden className={bottomSheetHandleStyles} />\n          {title && (\n            <RichText as=\"h2\" id={titleId} variant=\"s1\" className={bottomSheetTitleStyles}>\n              {title}\n            </RichText>\n          )}\n          {children}\n          {footer && <div className={bottomSheetFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nBottomSheet.displayName = 'BottomSheet';\n"]}
+{"version":3,"sources":["../src/components/molecules/BottomSheet/BottomSheet.styles.ts","../src/components/molecules/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":";;;;;;;;;;;AAEO,IAAM,wBAAA,GAA2B,GAAA;AAAA,EACtC;AAAA,IACE,8EAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,aAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,sBAAA,GAAyB,GAAA;AAAA,EACpC;AAAA,IACE,+EAAA;AAAA,IACA,6CAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,IAAA,EAAM,eAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAEO,IAAM,uBAAA,GACX,gEAAA;AAEK,IAAM,sBAAA,GAAyB,uDAAA;AAE/B,IAAM,uBAAA,GAA0B,0CAAA;AC1BvC,IAAM,gBAAA,GAAmB,GAAA;AAUlB,IAAM,WAAA,GAAc,UAAA;AAAA,EACzB,CACE,EAAE,IAAA,EAAM,OAAA,EAAS,KAAA,EAAO,MAAA,EAAQ,oBAAA,GAAuB,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,IACrF,GAAA,KACG;AACH,IAAA,MAAM,QAAA,GAAW,OAA8B,IAAI,CAAA;AACnD,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,GAAA,EAAK,QAAQ,CAAA;AAC9C,IAAA,MAAM,UAAU,KAAA,EAAM;AACtB,IAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAQ,GAAI,iBAAA,CAAkB,MAAM,gBAAgB,CAAA;AAErE,IAAA,mBAAA,CAAoB,IAAA,EAAM,OAAA,EAAS,QAAA,EAAU,oBAAoB,CAAA;AAEjE,IAAA,YAAA,CAAa,IAAA,IAAQ,SAAS,QAAQ,CAAA;AACtC,IAAA,aAAA,CAAc,IAAI,CAAA;AAElB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAW,yBAAyB,EAAE,OAAA,EAAS,CAAA,EAClD,QAAA,kBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,WAAA;AAAA,QACL,IAAA,EAAK,QAAA;AAAA,QACL,YAAA,EAAW,MAAA;AAAA,QACX,iBAAA,EAAiB,QAAQ,OAAA,GAAU,MAAA;AAAA,QACnC,QAAA,EAAU,EAAA;AAAA,QACV,WAAW,EAAA,CAAG,sBAAA,CAAuB,EAAE,OAAA,EAAS,GAAG,SAAS,CAAA;AAAA,QAC3D,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAW,IAAA,EAAC,SAAA,EAAW,uBAAA,EAAyB,CAAA;AAAA,UACpD,KAAA,oBACC,GAAA,CAAC,QAAA,EAAA,EAAS,EAAA,EAAG,IAAA,EAAK,EAAA,EAAI,OAAA,EAAS,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,sBAAA,EACpD,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAED,QAAA;AAAA,UACA,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,yBAA0B,QAAA,EAAA,MAAA,EAAO;AAAA;AAAA;AAAA,KAC9D,EACF,CAAA;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-L4BPQAXU.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const bottomSheetOverlayStyles = cva(\n  [\n    'fixed inset-0 z-50 flex items-end justify-center bg-[var(--surface-overlay)]',\n    'transition-opacity duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'opacity-100',\n        false: 'opacity-0',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const bottomSheetPanelStyles = cva(\n  [\n    'w-full max-w-md rounded-t-xl border border-b-0 border-[var(--border-default)]',\n    'bg-[var(--surface-secondary)] p-6 shadow-lg',\n    'transition-transform duration-200 ease-out',\n  ],\n  {\n    variants: {\n      visible: {\n        true: 'translate-y-0',\n        false: 'translate-y-full',\n      },\n    },\n    defaultVariants: {\n      visible: false,\n    },\n  },\n);\n\nexport const bottomSheetHandleStyles =\n  'mx-auto mb-4 h-1.5 w-10 rounded-full bg-[var(--border-strong)]';\n\nexport const bottomSheetTitleStyles = 'mb-4 text-lg font-semibold text-[var(--text-primary)]';\n\nexport const bottomSheetFooterStyles = 'mt-6 flex items-center justify-end gap-2';\n","import { forwardRef, useId, useRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { RichText } from '@components';\nimport {\n  useDelayedUnmount,\n  useDismissableLayer,\n  useFocusTrap,\n  useMergedRef,\n  useScrollLock,\n} from '@hooks';\nimport { cn } from '@utils';\nimport {\n  bottomSheetFooterStyles,\n  bottomSheetHandleStyles,\n  bottomSheetOverlayStyles,\n  bottomSheetPanelStyles,\n  bottomSheetTitleStyles,\n} from './BottomSheet.styles';\n\nconst EXIT_DURATION_MS = 200;\n\nexport type BottomSheetProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n  open: boolean;\n  onClose: () => void;\n  title?: ReactNode;\n  footer?: ReactNode;\n  closeOnBackdropClick?: boolean;\n};\n\nexport const BottomSheet = forwardRef<HTMLDivElement, BottomSheetProps>(\n  (\n    { open, onClose, title, footer, closeOnBackdropClick = true, className, children, ...props },\n    ref,\n  ) => {\n    const panelRef = useRef<HTMLDivElement | null>(null);\n    const setPanelRef = useMergedRef(ref, panelRef);\n    const titleId = useId();\n    const { mounted, visible } = useDelayedUnmount(open, EXIT_DURATION_MS);\n\n    useDismissableLayer(open, onClose, panelRef, closeOnBackdropClick);\n    // The panel mounts one render after `open` flips, so the trap starts once it exists.\n    useFocusTrap(open && mounted, panelRef);\n    useScrollLock(open);\n\n    if (!mounted) {\n      return null;\n    }\n\n    return (\n      <div className={bottomSheetOverlayStyles({ visible })}>\n        <div\n          ref={setPanelRef}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? titleId : undefined}\n          tabIndex={-1}\n          className={cn(bottomSheetPanelStyles({ visible }), className)}\n          {...props}\n        >\n          <div aria-hidden className={bottomSheetHandleStyles} />\n          {title && (\n            <RichText as=\"h2\" id={titleId} variant=\"s1\" className={bottomSheetTitleStyles}>\n              {title}\n            </RichText>\n          )}\n          {children}\n          {footer && <div className={bottomSheetFooterStyles}>{footer}</div>}\n        </div>\n      </div>\n    );\n  },\n);\n\nBottomSheet.displayName = 'BottomSheet';\n"]}

package/dist/{chunk-36CVKI5R.js → chunk-LSWJBAM6.js}

@@ -1,4 +1,4 @@
-import { Modal } from './chunk-W3H7DYWX.js';
+import { Modal } from './chunk-4CY55XM3.js';
 import { Switch } from './chunk-ZABQF65Z.js';
 import { Button } from './chunk-KL6I2JFC.js';
 import { RichText } from './chunk-P4CV2EPR.js';
@@ -75,5 +75,5 @@ var CookiePreferences = ({
 };
 
 export { CookiePreferences };
-//# sourceMappingURL=chunk-36CVKI5R.js.map
-//# sourceMappingURL=chunk-36CVKI5R.js.map
+//# sourceMappingURL=chunk-LSWJBAM6.js.map
+//# sourceMappingURL=chunk-LSWJBAM6.js.map

package/dist/{chunk-36CVKI5R.js.map → chunk-LSWJBAM6.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/molecules/CookiePreferences/CookiePreferences.styles.ts","../src/components/molecules/CookiePreferences/CookiePreferences.tsx"],"names":[],"mappings":"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","file":"chunk-36CVKI5R.js","sourcesContent":["export const cookiePreferencesIntroStyles = 'mb-4 text-sm text-[var(--text-secondary)]';\n\nexport const cookieCategoryListStyles = 'flex flex-col gap-4';\n\nexport const cookieCategoryStyles =\n  'flex flex-col gap-2 rounded-lg border border-[var(--border-default)] p-4';\n\nexport const cookieCategoryHeaderStyles = 'flex items-center justify-between gap-4';\n\nexport const cookieCategoryTitleStyles = 'font-semibold text-[var(--text-primary)]';\n\nexport const cookieCategoryRequiredStyles = 'text-xs font-semibold text-[var(--text-secondary)]';\n\nexport const cookieCategoryDescriptionStyles = 'text-sm text-[var(--text-secondary)]';\n","import { useId, type ReactNode } from 'react';\nimport { Button, Modal, RichText, Switch } from '@components';\nimport {\n  cookieCategoryDescriptionStyles,\n  cookieCategoryHeaderStyles,\n  cookieCategoryListStyles,\n  cookieCategoryRequiredStyles,\n  cookieCategoryStyles,\n  cookieCategoryTitleStyles,\n  cookiePreferencesIntroStyles,\n} from './CookiePreferences.styles';\n\nexport interface CookieCategory {\n  id: string;\n  title: string;\n  description: ReactNode;\n  /** Strictly necessary cookies can't be turned off; they show `requiredLabel` instead of a switch. */\n  required?: boolean;\n}\n\nexport interface CookiePreferencesProps {\n  open: boolean;\n  onClose: () => void;\n  title: ReactNode;\n  description?: ReactNode;\n  categories: CookieCategory[];\n  /** Enabled state of each optional category, by id. */\n  value: Record<string, boolean>;\n  onChange: (id: string, enabled: boolean) => void;\n  onSave: () => void;\n  saveLabel: string;\n  cancelLabel: string;\n  /** e.g. \"Always on\". */\n  requiredLabel: string;\n  /** Prefix for stable ids: `<prefix>-<category id>` switches and `<prefix>-save` / `<prefix>-cancel` buttons. */\n  idPrefix?: string;\n}\n\n/**\n * Per-category cookie choices in a `Modal` (focus trapped, Escape closes). Controlled: the\n * consumer holds `value` and persists it on `onSave`.\n */\nexport const CookiePreferences = ({\n  open,\n  onClose,\n  title,\n  description,\n  categories,\n  value,\n  onChange,\n  onSave,\n  saveLabel,\n  cancelLabel,\n  requiredLabel,\n  idPrefix,\n}: CookiePreferencesProps) => {\n  const baseId = useId();\n  const prefix = idPrefix ?? baseId;\n  return (\n    <Modal\n      open={open}\n      onClose={onClose}\n      title={title}\n      footer={\n        <>\n          <Button id={`${prefix}-cancel`} type=\"button\" variant=\"ghost\" onClick={onClose}>\n            {cancelLabel}\n          </Button>\n          <Button id={`${prefix}-save`} type=\"button\" onClick={onSave}>\n            {saveLabel}\n          </Button>\n        </>\n      }\n    >\n      {description && (\n        <RichText as=\"p\" variant=\"p3\" className={cookiePreferencesIntroStyles}>\n          {description}\n        </RichText>\n      )}\n      <ul className={cookieCategoryListStyles}>\n        {categories.map((category) => {\n          const descriptionId = `${prefix}-${category.id}-description`;\n          return (\n            <li key={category.id} className={cookieCategoryStyles}>\n              <div className={cookieCategoryHeaderStyles}>\n                {category.required ? (\n                  <>\n                    <RichText as=\"h3\" variant=\"p2\" className={cookieCategoryTitleStyles}>\n                      {category.title}\n                    </RichText>\n                    <RichText as=\"span\" variant=\"p4\" className={cookieCategoryRequiredStyles}>\n                      {requiredLabel}\n                    </RichText>\n                  </>\n                ) : (\n                  <Switch\n                    id={`${prefix}-${category.id}`}\n                    label={category.title}\n                    checked={value[category.id] === true}\n                    onCheckedChange={(checked) => onChange(category.id, checked)}\n                    aria-describedby={descriptionId}\n                  />\n                )}\n              </div>\n              <RichText\n                as=\"p\"\n                id={descriptionId}\n                variant=\"p3\"\n                className={cookieCategoryDescriptionStyles}\n              >\n                {category.description}\n              </RichText>\n            </li>\n          );\n        })}\n      </ul>\n    </Modal>\n  );\n};\n"]}
+{"version":3,"sources":["../src/components/molecules/CookiePreferences/CookiePreferences.styles.ts","../src/components/molecules/CookiePreferences/CookiePreferences.tsx"],"names":[],"mappings":"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","file":"chunk-LSWJBAM6.js","sourcesContent":["export const cookiePreferencesIntroStyles = 'mb-4 text-sm text-[var(--text-secondary)]';\n\nexport const cookieCategoryListStyles = 'flex flex-col gap-4';\n\nexport const cookieCategoryStyles =\n  'flex flex-col gap-2 rounded-lg border border-[var(--border-default)] p-4';\n\nexport const cookieCategoryHeaderStyles = 'flex items-center justify-between gap-4';\n\nexport const cookieCategoryTitleStyles = 'font-semibold text-[var(--text-primary)]';\n\nexport const cookieCategoryRequiredStyles = 'text-xs font-semibold text-[var(--text-secondary)]';\n\nexport const cookieCategoryDescriptionStyles = 'text-sm text-[var(--text-secondary)]';\n","import { useId, type ReactNode } from 'react';\nimport { Button, Modal, RichText, Switch } from '@components';\nimport {\n  cookieCategoryDescriptionStyles,\n  cookieCategoryHeaderStyles,\n  cookieCategoryListStyles,\n  cookieCategoryRequiredStyles,\n  cookieCategoryStyles,\n  cookieCategoryTitleStyles,\n  cookiePreferencesIntroStyles,\n} from './CookiePreferences.styles';\n\nexport interface CookieCategory {\n  id: string;\n  title: string;\n  description: ReactNode;\n  /** Strictly necessary cookies can't be turned off; they show `requiredLabel` instead of a switch. */\n  required?: boolean;\n}\n\nexport interface CookiePreferencesProps {\n  open: boolean;\n  onClose: () => void;\n  title: ReactNode;\n  description?: ReactNode;\n  categories: CookieCategory[];\n  /** Enabled state of each optional category, by id. */\n  value: Record<string, boolean>;\n  onChange: (id: string, enabled: boolean) => void;\n  onSave: () => void;\n  saveLabel: string;\n  cancelLabel: string;\n  /** e.g. \"Always on\". */\n  requiredLabel: string;\n  /** Prefix for stable ids: `<prefix>-<category id>` switches and `<prefix>-save` / `<prefix>-cancel` buttons. */\n  idPrefix?: string;\n}\n\n/**\n * Per-category cookie choices in a `Modal` (focus trapped, Escape closes). Controlled: the\n * consumer holds `value` and persists it on `onSave`.\n */\nexport const CookiePreferences = ({\n  open,\n  onClose,\n  title,\n  description,\n  categories,\n  value,\n  onChange,\n  onSave,\n  saveLabel,\n  cancelLabel,\n  requiredLabel,\n  idPrefix,\n}: CookiePreferencesProps) => {\n  const baseId = useId();\n  const prefix = idPrefix ?? baseId;\n  return (\n    <Modal\n      open={open}\n      onClose={onClose}\n      title={title}\n      footer={\n        <>\n          <Button id={`${prefix}-cancel`} type=\"button\" variant=\"ghost\" onClick={onClose}>\n            {cancelLabel}\n          </Button>\n          <Button id={`${prefix}-save`} type=\"button\" onClick={onSave}>\n            {saveLabel}\n          </Button>\n        </>\n      }\n    >\n      {description && (\n        <RichText as=\"p\" variant=\"p3\" className={cookiePreferencesIntroStyles}>\n          {description}\n        </RichText>\n      )}\n      <ul className={cookieCategoryListStyles}>\n        {categories.map((category) => {\n          const descriptionId = `${prefix}-${category.id}-description`;\n          return (\n            <li key={category.id} className={cookieCategoryStyles}>\n              <div className={cookieCategoryHeaderStyles}>\n                {category.required ? (\n                  <>\n                    <RichText as=\"h3\" variant=\"p2\" className={cookieCategoryTitleStyles}>\n                      {category.title}\n                    </RichText>\n                    <RichText as=\"span\" variant=\"p4\" className={cookieCategoryRequiredStyles}>\n                      {requiredLabel}\n                    </RichText>\n                  </>\n                ) : (\n                  <Switch\n                    id={`${prefix}-${category.id}`}\n                    label={category.title}\n                    checked={value[category.id] === true}\n                    onCheckedChange={(checked) => onChange(category.id, checked)}\n                    aria-describedby={descriptionId}\n                  />\n                )}\n              </div>\n              <RichText\n                as=\"p\"\n                id={descriptionId}\n                variant=\"p3\"\n                className={cookieCategoryDescriptionStyles}\n              >\n                {category.description}\n              </RichText>\n            </li>\n          );\n        })}\n      </ul>\n    </Modal>\n  );\n};\n"]}

package/dist/{chunk-WUEVXL76.js → chunk-YYNW2PXL.js}

@@ -1,39 +1,10 @@
+import { selectStyles, selectChevronStyles } from './chunk-4H6VER5P.js';
 import { inputLabelStyles, inputErrorStyles, inputHintStyles } from './chunk-FFKHEBQ7.js';
 import { RichText } from './chunk-P4CV2EPR.js';
 import { cn } from './chunk-6LLGTBM6.js';
 import { forwardRef, useId } from 'react';
-import { cva } from 'class-variance-authority';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var selectStyles = cva(
-  [
-    "flex w-full appearance-none rounded-md bg-no-repeat pr-10",
-    "text-[var(--input-text)] bg-[var(--input-bg)]",
-    "border border-[var(--input-border)]",
-    "transition-colors duration-150 ease-in-out",
-    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--border-focus)] focus-visible:ring-offset-0",
-    "focus-visible:border-[var(--input-border-focus)]",
-    "disabled:cursor-not-allowed disabled:opacity-50"
-  ],
-  {
-    variants: {
-      state: {
-        default: "",
-        error: "border-[var(--input-border-error)] focus-visible:ring-[var(--border-error)]"
-      },
-      inputSize: {
-        sm: "h-8 px-2 text-xs",
-        md: "h-10 px-3 text-sm",
-        lg: "h-12 px-4 text-base"
-      }
-    },
-    defaultVariants: {
-      state: "default",
-      inputSize: "md"
-    }
-  }
-);
-var selectChevronStyles = "pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[var(--text-secondary)]";
 var Select = forwardRef(
   ({ className, state, inputSize, label, hint, error, id: idProp, children, ...props }, ref) => {
     const generatedId = useId();
@@ -87,5 +58,5 @@ var Select = forwardRef(
 Select.displayName = "Select";
 
 export { Select };
-//# sourceMappingURL=chunk-WUEVXL76.js.map
-//# sourceMappingURL=chunk-WUEVXL76.js.map
+//# sourceMappingURL=chunk-YYNW2PXL.js.map
+//# sourceMappingURL=chunk-YYNW2PXL.js.map

package/dist/chunk-YYNW2PXL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/atoms/Select/Select.tsx"],"names":[],"mappings":";;;;;;;AAsBO,IAAM,MAAA,GAAS,UAAA;AAAA,EACpB,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,WAAW,KAAA,EAAO,IAAA,EAAM,KAAA,EAAO,EAAA,EAAI,MAAA,EAAQ,QAAA,EAAU,GAAG,KAAA,IAAS,GAAA,KAAQ;AAC5F,IAAA,MAAM,cAAc,KAAA,EAAM;AAC1B,IAAA,MAAM,KAAK,MAAA,IAAU,WAAA;AACrB,IAAA,MAAM,aAAA,GAAgB,QAAQ,OAAA,GAAU,KAAA;AAExC,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,oBACC,GAAA,CAAC,OAAA,EAAA,EAAM,OAAA,EAAS,EAAA,EACd,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,gBAAA,EACzC,iBACH,CAAA,EACF,CAAA;AAAA,sBAEF,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,UAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,GAAA;AAAA,YACA,EAAA;AAAA,YACA,kBAAA,EAAkB,QAAQ,CAAA,EAAG,EAAE,WAAW,IAAA,GAAO,CAAA,EAAG,EAAE,CAAA,KAAA,CAAA,GAAU,MAAA;AAAA,YAChE,cAAA,EAAc,QAAQ,MAAA,GAAS,MAAA;AAAA,YAC/B,SAAA,EAAW,GAAG,YAAA,CAAa,EAAE,OAAO,aAAA,EAAe,SAAA,EAAW,CAAA,EAAG,SAAS,CAAA;AAAA,YACzE,GAAG,KAAA;AAAA,YAEH;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAW,IAAA;AAAA,YACX,OAAA,EAAQ,WAAA;AAAA,YACR,IAAA,EAAK,MAAA;AAAA,YACL,MAAA,EAAO,cAAA;AAAA,YACP,WAAA,EAAa,CAAA;AAAA,YACb,aAAA,EAAc,OAAA;AAAA,YACd,cAAA,EAAe,OAAA;AAAA,YACf,SAAA,EAAW,mBAAA;AAAA,YAEX,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,cAAA,EAAe;AAAA;AAAA;AACzB,OAAA,EACF,CAAA;AAAA,MACC,KAAA,oBACC,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAG,GAAA;AAAA,UACH,EAAA,EAAI,GAAG,EAAE,CAAA,MAAA,CAAA;AAAA,UACT,IAAA,EAAK,OAAA;AAAA,UACL,OAAA,EAAQ,IAAA;AAAA,UACR,SAAA,EAAW,gBAAA;AAAA,UAEV,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,MAED,CAAC,KAAA,IAAS,IAAA,oBACT,GAAA,CAAC,YAAS,EAAA,EAAG,GAAA,EAAI,EAAA,EAAI,CAAA,EAAG,EAAE,CAAA,KAAA,CAAA,EAAS,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAW,iBACxD,QAAA,EAAA,IAAA,EACH;AAAA,KAAA,EAEJ,CAAA;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-YYNW2PXL.js","sourcesContent":["import { RichText } from '@components';\nimport { cn } from '@utils';\nimport type { VariantProps } from 'class-variance-authority';\nimport { forwardRef, useId, type SelectHTMLAttributes } from 'react';\nimport {\n  inputErrorStyles,\n  inputHintStyles,\n  inputLabelStyles,\n} from '@components/atoms/Input/Input.styles';\nimport { selectChevronStyles, selectStyles } from './Select.styles';\n\nexport type SelectProps = SelectHTMLAttributes<HTMLSelectElement> &\n  VariantProps<typeof selectStyles> & {\n    label?: string;\n    hint?: string;\n    error?: string;\n  };\n\n/**\n * A native `<select>` with the same label / hint / error contract and look as `Input`. Native on\n * purpose: it gets the platform picker on mobile, typeahead and full screen reader support for free.\n */\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n  ({ className, state, inputSize, label, hint, error, id: idProp, children, ...props }, ref) => {\n    const generatedId = useId();\n    const id = idProp ?? generatedId;\n    const resolvedState = error ? 'error' : state;\n\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <label htmlFor={id}>\n            <RichText as=\"span\" variant=\"p3\" className={inputLabelStyles}>\n              {label}\n            </RichText>\n          </label>\n        )}\n        <div className=\"relative\">\n          <select\n            ref={ref}\n            id={id}\n            aria-describedby={error ? `${id}-error` : hint ? `${id}-hint` : undefined}\n            aria-invalid={error ? 'true' : undefined}\n            className={cn(selectStyles({ state: resolvedState, inputSize }), className)}\n            {...props}\n          >\n            {children}\n          </select>\n          <svg\n            aria-hidden\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={2}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            className={selectChevronStyles}\n          >\n            <path d=\"m6 9 6 6 6-6\" />\n          </svg>\n        </div>\n        {error && (\n          <RichText\n            as=\"p\"\n            id={`${id}-error`}\n            role=\"alert\"\n            variant=\"p4\"\n            className={inputErrorStyles}\n          >\n            {error}\n          </RichText>\n        )}\n        {!error && hint && (\n          <RichText as=\"p\" id={`${id}-hint`} variant=\"p4\" className={inputHintStyles}>\n            {hint}\n          </RichText>\n        )}\n      </div>\n    );\n  },\n);\n\nSelect.displayName = 'Select';\n"]}

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

@@ -2,11 +2,7 @@ import * as react from 'react';
 import { SelectHTMLAttributes } from 'react';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
-
-declare const selectStyles: (props?: ({
-    state?: "error" | "default" | null | undefined;
-    inputSize?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+import { s as selectStyles } from '../../../Select.styles-CeZROqOk.js';
 
 type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & VariantProps<typeof selectStyles> & {
     label?: string;

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

@@ -1,4 +1,5 @@
-export { Select } from '../../../chunk-WUEVXL76.js';
+export { Select } from '../../../chunk-YYNW2PXL.js';
+import '../../../chunk-4H6VER5P.js';
 import '../../../chunk-FFKHEBQ7.js';
 import '../../../chunk-P4CV2EPR.js';
 import '../../../chunk-6LLGTBM6.js';

package/dist/components/molecules/BottomSheet/index.js

@@ -1,8 +1,8 @@
-export { BottomSheet } from '../../../chunk-ULLCBART.js';
+export { BottomSheet } from '../../../chunk-L4BPQAXU.js';
 import '../../../chunk-QT62VC36.js';
 import '../../../chunk-53YMHM24.js';
-import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-JCJP427C.js';
+import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-P4Z7HH66.js';
 import '../../../chunk-P4CV2EPR.js';
 import '../../../chunk-6LLGTBM6.js';

package/dist/components/molecules/CookiePreferences/index.js

@@ -1,10 +1,10 @@
-export { CookiePreferences } from '../../../chunk-36CVKI5R.js';
-import '../../../chunk-W3H7DYWX.js';
+export { CookiePreferences } from '../../../chunk-LSWJBAM6.js';
+import '../../../chunk-4CY55XM3.js';
 import '../../../chunk-ZABQF65Z.js';
 import '../../../chunk-QT62VC36.js';
 import '../../../chunk-53YMHM24.js';
-import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-JCJP427C.js';
+import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-KL6I2JFC.js';
 import '../../../chunk-P4Z7HH66.js';
 import '../../../chunk-P4CV2EPR.js';

package/dist/components/molecules/Drawer/index.js

@@ -1,8 +1,8 @@
-export { Drawer } from '../../../chunk-VGLFR5SB.js';
+export { Drawer } from '../../../chunk-42G4RRCZ.js';
 import '../../../chunk-QT62VC36.js';
 import '../../../chunk-53YMHM24.js';
-import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-JCJP427C.js';
+import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-KL6I2JFC.js';
 import '../../../chunk-P4Z7HH66.js';
 import '../../../chunk-P4CV2EPR.js';

package/dist/components/molecules/Dropdown/index.d.ts

@@ -0,0 +1,44 @@
+import * as react from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import { s as selectStyles } from '../../../Select.styles-CeZROqOk.js';
+
+interface DropdownOption {
+    value: string;
+    label: string;
+}
+type DropdownProps = VariantProps<typeof selectStyles> & {
+    label: string;
+    options: DropdownOption[];
+    value: string;
+    onChange: (value: string) => void;
+    hint?: string;
+    error?: string;
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    className?: string;
+};
+/**
+ * A select whose list is drawn with the theme (a native `<select>` opens the platform picker).
+ * WAI-ARIA "select-only combobox": focus stays on the trigger and the active option is announced
+ * through `aria-activedescendant`; arrows, Home/End, Enter/Space, Escape and typing a letter behave
+ * like a native select.
+ */
+declare const Dropdown: react.ForwardRefExoticComponent<VariantProps<(props?: ({
+    state?: "error" | "default" | null | undefined;
+    inputSize?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & {
+    label: string;
+    options: DropdownOption[];
+    value: string;
+    onChange: (value: string) => void;
+    hint?: string;
+    error?: string;
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    className?: string;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+export { Dropdown, type DropdownOption, type DropdownProps };

package/dist/components/molecules/Dropdown/index.js

@@ -0,0 +1,8 @@
+export { Dropdown } from '../../../chunk-BGUNAALU.js';
+import '../../../chunk-JCJP427C.js';
+import '../../../chunk-4H6VER5P.js';
+import '../../../chunk-FFKHEBQ7.js';
+import '../../../chunk-P4CV2EPR.js';
+import '../../../chunk-6LLGTBM6.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/molecules/Dropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/components/molecules/Modal/index.js

@@ -1,8 +1,8 @@
-export { Modal } from '../../../chunk-W3H7DYWX.js';
+export { Modal } from '../../../chunk-4CY55XM3.js';
 import '../../../chunk-QT62VC36.js';
 import '../../../chunk-53YMHM24.js';
-import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-JCJP427C.js';
+import '../../../chunk-BNEEI7S5.js';
 import '../../../chunk-P4Z7HH66.js';
 import '../../../chunk-P4CV2EPR.js';
 import '../../../chunk-6LLGTBM6.js';

package/dist/index.d.ts

@@ -14,6 +14,7 @@ export { Card, CardContent, CardContentProps, CardDescription, CardDescriptionPr
 export { CookieBanner, CookieBannerProps } from './components/molecules/CookieBanner/index.js';
 export { CookieCategory, CookiePreferences, CookiePreferencesProps } from './components/molecules/CookiePreferences/index.js';
 export { Drawer, DrawerProps } from './components/molecules/Drawer/index.js';
+export { Dropdown, DropdownOption, DropdownProps } from './components/molecules/Dropdown/index.js';
 export { Language, LanguageOption, LanguageProps } from './components/molecules/Language/index.js';
 export { Modal, ModalProps } from './components/molecules/Modal/index.js';
 export { Snackbar, SnackbarProps } from './components/molecules/Snackbar/index.js';
@@ -30,4 +31,5 @@ import 'react';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 import 'react/jsx-runtime';
+import './Select.styles-CeZROqOk.js';
 import 'clsx';

package/dist/index.js

@@ -1,22 +1,23 @@
 export { useMediaQuery } from './chunk-2HCMNEIQ.js';
-export { Drawer } from './chunk-VGLFR5SB.js';
+export { Drawer } from './chunk-42G4RRCZ.js';
+export { Dropdown } from './chunk-BGUNAALU.js';
 export { Language } from './chunk-2YBZCUME.js';
 export { Snackbar } from './chunk-BKPP4D3Q.js';
 export { Table, TableBody, TableCell, TableHead, TableHeaderCell, TableRow } from './chunk-XCUA543I.js';
 export { Timeline } from './chunk-UL33H4AD.js';
 export { Textarea } from './chunk-3YRDRHO3.js';
 export { Accordion } from './chunk-V3YXRI7M.js';
-export { BottomSheet } from './chunk-ULLCBART.js';
+export { BottomSheet } from './chunk-L4BPQAXU.js';
 export { Breadcrumbs } from './chunk-PE6XEC7Y.js';
 export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './chunk-N5CLCKR3.js';
 export { CookieBanner } from './chunk-TR7XKJCO.js';
-export { CookiePreferences } from './chunk-36CVKI5R.js';
-export { Modal } from './chunk-W3H7DYWX.js';
+export { CookiePreferences } from './chunk-LSWJBAM6.js';
+export { Modal } from './chunk-4CY55XM3.js';
 export { Switch } from './chunk-ZABQF65Z.js';
 export { useFocusTrap } from './chunk-QT62VC36.js';
 export { useScrollLock } from './chunk-53YMHM24.js';
-export { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 export { useDismissableLayer } from './chunk-JCJP427C.js';
+export { useDelayedUnmount } from './chunk-BNEEI7S5.js';
 import './chunk-GQMA2AQI.js';
 export { Button, buttonStyles } from './chunk-KL6I2JFC.js';
 export { useMergedRef } from './chunk-P4Z7HH66.js';
@@ -24,7 +25,8 @@ export { Icon } from './chunk-7HQFLM4A.js';
 export { Image } from './chunk-5IHM2545.js';
 export { Input } from './chunk-DP274HDM.js';
 export { Link } from './chunk-D4I5OF3C.js';
-export { Select } from './chunk-WUEVXL76.js';
+export { Select } from './chunk-YYNW2PXL.js';
+import './chunk-4H6VER5P.js';
 import './chunk-FFKHEBQ7.js';
 export { RichText, elementByVariant } from './chunk-P4CV2EPR.js';
 export { cn } from './chunk-6LLGTBM6.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inzumer/ui-library",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "private": false,
   "description": "React UI component library for the Inzumer design system",
   "license": "MIT",
@@ -96,6 +96,10 @@
       "types": "./dist/components/molecules/Drawer/index.d.ts",
       "import": "./dist/components/molecules/Drawer/index.js"
     },
+    "./dropdown": {
+      "types": "./dist/components/molecules/Dropdown/index.d.ts",
+      "import": "./dist/components/molecules/Dropdown/index.js"
+    },
     "./language": {
       "types": "./dist/components/molecules/Language/index.d.ts",
       "import": "./dist/components/molecules/Language/index.js"
@@ -174,8 +178,8 @@
     "typescript": "^5.7.2",
     "vite-tsconfig-paths": "^6.1.1",
     "vitest": "^2.1.6",
-    "@inzumer/eslint-config": "0.1.0",
-    "@inzumer/tsconfig": "0.1.0"
+    "@inzumer/tsconfig": "0.1.0",
+    "@inzumer/eslint-config": "0.1.0"
   },
   "scripts": {
     "build": "tsup",

package/dist/chunk-WUEVXL76.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/atoms/Select/Select.styles.ts","../src/components/atoms/Select/Select.tsx"],"names":[],"mappings":"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","file":"chunk-WUEVXL76.js","sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const selectStyles = cva(\n  [\n    'flex w-full appearance-none rounded-md bg-no-repeat pr-10',\n    'text-[var(--input-text)] bg-[var(--input-bg)]',\n    'border border-[var(--input-border)]',\n    'transition-colors duration-150 ease-in-out',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--border-focus)] focus-visible:ring-offset-0',\n    'focus-visible:border-[var(--input-border-focus)]',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n  ],\n  {\n    variants: {\n      state: {\n        default: '',\n        error: 'border-[var(--input-border-error)] focus-visible:ring-[var(--border-error)]',\n      },\n      inputSize: {\n        sm: 'h-8 px-2 text-xs',\n        md: 'h-10 px-3 text-sm',\n        lg: 'h-12 px-4 text-base',\n      },\n    },\n    defaultVariants: {\n      state: 'default',\n      inputSize: 'md',\n    },\n  },\n);\n\n/** Chevron drawn with `currentColor`, positioned over the right padding of the select. */\nexport const selectChevronStyles =\n  'pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[var(--text-secondary)]';\n","import { RichText } from '@components';\nimport { cn } from '@utils';\nimport type { VariantProps } from 'class-variance-authority';\nimport { forwardRef, useId, type SelectHTMLAttributes } from 'react';\nimport {\n  inputErrorStyles,\n  inputHintStyles,\n  inputLabelStyles,\n} from '@components/atoms/Input/Input.styles';\nimport { selectChevronStyles, selectStyles } from './Select.styles';\n\nexport type SelectProps = SelectHTMLAttributes<HTMLSelectElement> &\n  VariantProps<typeof selectStyles> & {\n    label?: string;\n    hint?: string;\n    error?: string;\n  };\n\n/**\n * A native `<select>` with the same label / hint / error contract and look as `Input`. Native on\n * purpose: it gets the platform picker on mobile, typeahead and full screen reader support for free.\n */\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n  ({ className, state, inputSize, label, hint, error, id: idProp, children, ...props }, ref) => {\n    const generatedId = useId();\n    const id = idProp ?? generatedId;\n    const resolvedState = error ? 'error' : state;\n\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {label && (\n          <label htmlFor={id}>\n            <RichText as=\"span\" variant=\"p3\" className={inputLabelStyles}>\n              {label}\n            </RichText>\n          </label>\n        )}\n        <div className=\"relative\">\n          <select\n            ref={ref}\n            id={id}\n            aria-describedby={error ? `${id}-error` : hint ? `${id}-hint` : undefined}\n            aria-invalid={error ? 'true' : undefined}\n            className={cn(selectStyles({ state: resolvedState, inputSize }), className)}\n            {...props}\n          >\n            {children}\n          </select>\n          <svg\n            aria-hidden\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={2}\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            className={selectChevronStyles}\n          >\n            <path d=\"m6 9 6 6 6-6\" />\n          </svg>\n        </div>\n        {error && (\n          <RichText\n            as=\"p\"\n            id={`${id}-error`}\n            role=\"alert\"\n            variant=\"p4\"\n            className={inputErrorStyles}\n          >\n            {error}\n          </RichText>\n        )}\n        {!error && hint && (\n          <RichText as=\"p\" id={`${id}-hint`} variant=\"p4\" className={inputHintStyles}>\n            {hint}\n          </RichText>\n        )}\n      </div>\n    );\n  },\n);\n\nSelect.displayName = 'Select';\n"]}