@epilot/volt-ui 0.1.0 → 0.1.1

package/CHANGELOG.md

@@ -0,0 +1,72 @@
+## 0.1.0 (2025-10-20)
+
+Initial release of `@epilot/volt-ui` - a clean, lightweight, and tree-shakeable design system library for React applications.
+
+This project is forked from `@epilot/core-ui` and has been renamed to Volt UI. All references, package names, and CSS files have been updated accordingly.
+
+### Features
+
+- 🌳 Tree-shakeable component imports
+- 🎨 Tailwind CSS v4 with multiple build variants
+- 🚀 Zero runtime CSS injection
+- 📦 Modular architecture for optimal bundle size
+- 🎯 Full TypeScript support
+- 🌙 Light and dark mode ready
+- 🎭 Portal support for scoped CSS (Dialog, Popover, DropdownMenu, Tooltip, SelectInput)
+
+### CSS Builds
+
+- `volt-ui.css` - Tailwind 4 precompiled component styles
+- `volt-ui.scoped.css` - Scoped CSS using `[data-volt]` and `[data-volt-portal]` selectors
+- `volt-ui.flat.css` - Flattened CSS for Tailwind 3 / no Tailwind
+- `volt-ui.theme.css` - Tailwind 4 input for consumer build
+- `reset.css`, `reset.flat.css`, `reset.scoped.css` - Optional reset variants
+
+### Components
+
+- Accordion
+- Badge
+- Button & IconButton
+- Checkbox & CheckboxField
+- Dialog
+- DropdownMenu
+- Heading
+- Icons (320+ icons)
+- InputField
+- Link
+- Popover
+- Radio, RadioField & RadioGroup
+- SelectInput
+- Separator
+- Switch & SwitchField
+- Tabs
+- Text
+- TextArea
+- TextInput
+- Tooltip
+- Validation
+
+---
+
+## Previous History (as @epilot/core-ui)
+
+For historical reference, this project was previously published as `@epilot/core-ui` with the following notable releases:
+
+### 0.2.0-alpha.18 (2025-10-09)
+- build: add reset.flat.css and reset.scoped.css outputs
+- docs: README usage for reset.flat.css and reset.scoped.css
+
+### 0.2.0-alpha.17 (2025-10-09)
+- feat: add scoped CSS build (scoped under `:where([data-cui])`)
+- build: add PostCSS selector prefixing and Rollup target for scoped build
+- docs: document scoped usage and `[data-cui]` wrapper in README
+- docs: document that `reset.css` is now opt-in
+- perf/chore: export scoped CSS and mark as sideEffect in package
+- breaking: remove implicit `reset.css` from main CSS; consumers must import reset explicitly if needed
+
+### 0.2.0-alpha.16 (2025-10-08)
+- docs: Scoped CSS for MFEs, Shadow DOM example
+
+### 0.2.0-alpha.15
+- chore: add reset.css to dist and export map
+- fix: default border color transparent via reset layer

package/README.md

@@ -53,7 +53,7 @@ import { Button } from "@epilot/volt-ui/components/Button";
 ```
 
 ```css
-/* Scoped build: volt-ui styles only apply within [data-cui] container */
+/* Scoped build: volt-ui styles only apply within [data-volt] container */
 @import "@epilot/volt-ui/volt-ui.scoped.css";
 ```
 
@@ -66,7 +66,7 @@ import { Button } from "@epilot/volt-ui/components/Button";
 /* Reset variants (opt-in) */
 @import "@epilot/volt-ui/reset.css";        /* Global reset (affects page) */
 @import "@epilot/volt-ui/reset.flat.css";   /* Flattened reset for non-TW/TW3 */
-@import "@epilot/volt-ui/reset.scoped.css"; /* Scoped reset under [data-cui] */
+@import "@epilot/volt-ui/reset.scoped.css"; /* Scoped reset under [data-volt] */
 ```
 
 #### Scoped usage
@@ -76,13 +76,15 @@ import "@epilot/volt-ui/volt-ui.scoped.css";
 
 export function ScopedArea() {
   return (
-    <div data-cui>
+    <div data-volt>
       {/* Your volt-ui components here are isolated from the host page */}
     </div>
   );
 }
 ```
 
+**Note:** Components that use portals (Dialog, Popover, DropdownMenu, Tooltip, SelectInput) automatically add a `data-volt-portal` attribute to their portaled content, ensuring scoped styles work correctly even when content is rendered outside the main `data-volt` container.
+
 #### Reset is now opt-in
 
 The main styles no longer include a global reset. Choose one of the reset variants:
@@ -94,7 +96,7 @@ import "@epilot/volt-ui/reset.css";
 // Flat (for non-Tailwind/Tailwind 3 pipelines)
 import "@epilot/volt-ui/reset.flat.css";
 
-// Scoped (only inside [data-cui])
+// Scoped (only inside [data-volt])
 import "@epilot/volt-ui/reset.scoped.css";
 ```
 
@@ -186,7 +188,7 @@ async function injectScopedInlineStyles(shadowRoot: ShadowRoot, cssUrl: string)
 ├── index.js                    # Main entry point
 ├── styles/
 │   ├── volt-ui.css             # Tailwind 4 precompiled component styles
-│   ├── volt-ui.scoped.css      # Scoped CSS (requires wrapping with [data-cui])
+│   ├── volt-ui.scoped.css      # Scoped CSS (requires wrapping with [data-volt])
 │   ├── volt-ui.flat.css        # Flattened CSS for Tailwind 3 / no Tailwind
 │   ├── volt-ui.theme.css       # Tailwind 4 input for consumer build
 │   ├── colors.css              # tokens

package/dist/components/Dialog/Dialog.js

@@ -1,2 +1,2 @@
-import{jsx as a,jsxs as e}from"react/jsx-runtime";import*as t from"@radix-ui/react-dialog";import s from"classnames";import{forwardRef as o}from"react";const l=o(({className:e,...o},l)=>a(t.Overlay,{className:s("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),ref:l,...o}));l.displayName=t.Overlay.displayName;const i=e=>a(t.Root,{...e});i.displayName="Dialog.Root";const n=o(({className:e,asChild:o,...l},i)=>a(t.Trigger,{asChild:o,className:s("",e),ref:i,...l}));n.displayName="Dialog.Trigger";const r=o(({className:o,children:i,withOverlay:n=!0,...r},d)=>e(t.Portal,{children:[n&&a(l,{}),a(t.Content,{className:s("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-group-2 bg-gray-level-1 rounded-2xl p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",o),ref:d,...r,children:i})]}));r.displayName="Dialog.Content";const d=o(({className:e,...o},l)=>a(t.Title,{className:s(e),ref:l,...o}));d.displayName="Dialog.Title";const c=o(({className:e,...o},l)=>a(t.Description,{className:s(e),ref:l,...o}));c.displayName="Dialog.Description";const m=o(({className:o,children:l,asChild:i,...n},r)=>i?a(t.Close,{asChild:i,className:s("",o),ref:r,...n,children:l}):e(t.Close,{asChild:i,className:s("absolute right-4 size-6 flex items-center justify-center top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-accent disabled:pointer-events-none data-[state=open]:text-gray-light",o),ref:r,...n,children:[l||e("svg",{className:"h-4 w-4",fill:"none",height:"24",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[a("path",{d:"M18 6L6 18"}),a("path",{d:"M6 6l12 12"})]}),a("span",{className:"sr-only",children:"Close"})]}));m.displayName="Dialog.Close";const p={Root:i,Trigger:n,Overlay:l,Content:r,Title:d,Description:c,Close:m};export{p as Dialog};
+import{jsx as a,jsxs as e}from"react/jsx-runtime";import*as t from"@radix-ui/react-dialog";import s from"classnames";import{forwardRef as o}from"react";const l=o(({className:e,...o},l)=>a(t.Overlay,{className:s("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",e),ref:l,...o}));l.displayName=t.Overlay.displayName;const i=e=>a(t.Root,{...e});i.displayName="Dialog.Root";const n=o(({className:e,asChild:o,...l},i)=>a(t.Trigger,{asChild:o,className:s("",e),ref:i,...l}));n.displayName="Dialog.Trigger";const r=o(({className:o,children:i,withOverlay:n=!0,...r},d)=>e(t.Portal,{"data-volt-portal":"",children:[n&&a(l,{}),a(t.Content,{className:s("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-group-2 bg-gray-level-1 rounded-2xl p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",o),ref:d,...r,children:i})]}));r.displayName="Dialog.Content";const d=o(({className:e,...o},l)=>a(t.Title,{className:s(e),ref:l,...o}));d.displayName="Dialog.Title";const c=o(({className:e,...o},l)=>a(t.Description,{className:s(e),ref:l,...o}));c.displayName="Dialog.Description";const m=o(({className:o,children:l,asChild:i,...n},r)=>i?a(t.Close,{asChild:i,className:s("",o),ref:r,...n,children:l}):e(t.Close,{asChild:i,className:s("absolute right-4 size-6 flex items-center justify-center top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-accent disabled:pointer-events-none data-[state=open]:text-gray-light",o),ref:r,...n,children:[l||e("svg",{className:"h-4 w-4",fill:"none",height:"24",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[a("path",{d:"M18 6L6 18"}),a("path",{d:"M6 6l12 12"})]}),a("span",{className:"sr-only",children:"Close"})]}));m.displayName="Dialog.Close";const p={Root:i,Trigger:n,Overlay:l,Content:r,Title:d,Description:c,Close:m};export{p as Dialog};
 //# sourceMappingURL=Dialog.js.map

package/dist/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as RadixDialog from \"@radix-ui/react-dialog\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype DialogRootProps = ComponentPropsWithoutRef<typeof RadixDialog.Root>;\n\nconst DialogOverlay = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => {\n  return (\n    <RadixDialog.Overlay\n      className={cx(\n        \"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n\nDialogOverlay.displayName = RadixDialog.Overlay.displayName;\n\nconst DialogRoot: FC<DialogRootProps> = (props) => {\n  return <RadixDialog.Root {...props} />;\n};\n\nDialogRoot.displayName = \"Dialog.Root\";\n\nconst DialogTrigger = forwardRef<\n  HTMLButtonElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Trigger> & {\n    asChild?: boolean;\n  }\n>(({ className, asChild, ...props }, ref) => {\n  return (\n    <RadixDialog.Trigger\n      asChild={asChild}\n      className={cx(\"\", className)}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\nconst DialogContent = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Content> & {\n    withOverlay?: boolean;\n  }\n>(({ className, children, withOverlay = true, ...props }, ref) => {\n  return (\n    <RadixDialog.Portal>\n      {withOverlay && <DialogOverlay />}\n      <RadixDialog.Content\n        className={cx(\n          \"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-group-2 bg-gray-level-1 rounded-2xl p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]\",\n          className\n        )}\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </RadixDialog.Content>\n    </RadixDialog.Portal>\n  );\n});\n\nDialogContent.displayName = \"Dialog.Content\";\n\nconst DialogTitle = forwardRef<\n  HTMLHeadingElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => {\n  return <RadixDialog.Title className={cx(className)} ref={ref} {...props} />;\n});\n\nDialogTitle.displayName = \"Dialog.Title\";\n\nconst DialogDescription = forwardRef<\n  HTMLParagraphElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => {\n  return (\n    <RadixDialog.Description className={cx(className)} ref={ref} {...props} />\n  );\n});\n\nDialogDescription.displayName = \"Dialog.Description\";\n\nconst DialogClose = forwardRef<\n  HTMLButtonElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Close> & {\n    asChild?: boolean;\n  }\n>(({ className, children, asChild, ...props }, ref) => {\n  if (asChild) {\n    return (\n      <RadixDialog.Close\n        asChild={asChild}\n        className={cx(\"\", className)}\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </RadixDialog.Close>\n    );\n  }\n\n  return (\n    <RadixDialog.Close\n      asChild={asChild}\n      className={cx(\n        \"absolute right-4 size-6 flex items-center justify-center top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-accent disabled:pointer-events-none data-[state=open]:text-gray-light\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    >\n      {children || (\n        <svg\n          className=\"h-4 w-4\"\n          fill=\"none\"\n          height=\"24\"\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          width=\"24\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path d=\"M18 6L6 18\" />\n          <path d=\"M6 6l12 12\" />\n        </svg>\n      )}\n      <span className=\"sr-only\">Close</span>\n    </RadixDialog.Close>\n  );\n});\n\nDialogClose.displayName = \"Dialog.Close\";\n\nexport const Dialog = {\n  Root: DialogRoot,\n  Trigger: DialogTrigger,\n  Overlay: DialogOverlay,\n  Content: DialogContent,\n  Title: DialogTitle,\n  Description: DialogDescription,\n  Close: DialogClose,\n};\n"],"names":["DialogOverlay","forwardRef","className","props","ref","_jsx","RadixDialog","Overlay","cx","displayName","DialogRoot","Root","DialogTrigger","asChild","Trigger","DialogContent","children","withOverlay","_jsxs","Portal","Content","DialogTitle","Title","DialogDescription","Description","DialogClose","Close","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","d","Dialog"],"mappings":"wJAOA,MAAMA,EAAgBC,EAGpB,EAAGC,eAAcC,GAASC,IAExBC,EAACC,EAAYC,QAAO,CAClBL,UAAWM,EACT,yJACAN,GAEFE,IAAKA,KACDD,KAKVH,EAAcS,YAAcH,EAAYC,QAAQE,YAEhD,MAAMC,EAAmCP,GAChCE,EAACC,EAAYK,KAAI,IAAKR,IAG/BO,EAAWD,YAAc,cAEzB,MAAMG,EAAgBX,EAKpB,EAAGC,YAAWW,aAAYV,GAASC,IAEjCC,EAACC,EAAYQ,QAAO,CAClBD,QAASA,EACTX,UAAWM,EAAG,GAAIN,GAClBE,IAAKA,KACDD,KAKVS,EAAcH,YAAc,iBAE5B,MAAMM,EAAgBd,EAKpB,EAAGC,YAAWc,WAAUC,eAAc,KAASd,GAASC,IAEtDc,EAACZ,EAAYa,kBACVF,GAAeZ,EAACL,MACjBK,EAACC,EAAYc,QAAO,CAClBlB,UAAWM,EACT,6fACAN,GAEFE,IAAKA,KACDD,EAAKa,SAERA,QAMTD,EAAcN,YAAc,iBAE5B,MAAMY,EAAcpB,EAGlB,EAAGC,eAAcC,GAASC,IACnBC,EAACC,EAAYgB,MAAK,CAACpB,UAAWM,EAAGN,GAAYE,IAAKA,KAASD,KAGpEkB,EAAYZ,YAAc,eAE1B,MAAMc,EAAoBtB,EAGxB,EAAGC,eAAcC,GAASC,IAExBC,EAACC,EAAYkB,YAAW,CAACtB,UAAWM,EAAGN,GAAYE,IAAKA,KAASD,KAIrEoB,EAAkBd,YAAc,qBAEhC,MAAMgB,EAAcxB,EAKlB,EAAGC,YAAWc,WAAUH,aAAYV,GAASC,IACzCS,EAEAR,EAACC,EAAYoB,MAAK,CAChBb,QAASA,EACTX,UAAWM,EAAG,GAAIN,GAClBE,IAAKA,KACDD,EAAKa,SAERA,IAMLE,EAACZ,EAAYoB,MAAK,CAChBb,QAASA,EACTX,UAAWM,EACT,gNACAN,GAEFE,IAAKA,KACDD,YAEHa,GACCE,EAAA,MAAA,CACEhB,UAAU,UACVyB,KAAK,OACLC,OAAO,KACPC,OAAO,eACPC,cAAc,QACdC,eAAe,QACfC,YAAY,IACZC,QAAQ,YACRC,MAAM,KACNC,MAAM,uCAEN9B,EAAA,OAAA,CAAM+B,EAAE,eACR/B,EAAA,OAAA,CAAM+B,EAAE,kBAGZ/B,UAAMH,UAAU,UAASc,SAAA,cAK/BS,EAAYhB,YAAc,eAEnB,MAAM4B,EAAS,CACpB1B,KAAMD,EACNI,QAASF,EACTL,QAASP,EACToB,QAASL,EACTO,MAAOD,EACPG,YAAaD,EACbG,MAAOD"}
+{"version":3,"file":"Dialog.js","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as RadixDialog from \"@radix-ui/react-dialog\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype DialogRootProps = ComponentPropsWithoutRef<typeof RadixDialog.Root>;\n\nconst DialogOverlay = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => {\n  return (\n    <RadixDialog.Overlay\n      className={cx(\n        \"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n\nDialogOverlay.displayName = RadixDialog.Overlay.displayName;\n\nconst DialogRoot: FC<DialogRootProps> = (props) => {\n  return <RadixDialog.Root {...props} />;\n};\n\nDialogRoot.displayName = \"Dialog.Root\";\n\nconst DialogTrigger = forwardRef<\n  HTMLButtonElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Trigger> & {\n    asChild?: boolean;\n  }\n>(({ className, asChild, ...props }, ref) => {\n  return (\n    <RadixDialog.Trigger\n      asChild={asChild}\n      className={cx(\"\", className)}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n\nDialogTrigger.displayName = \"Dialog.Trigger\";\n\nconst DialogContent = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Content> & {\n    withOverlay?: boolean;\n  }\n>(({ className, children, withOverlay = true, ...props }, ref) => {\n  return (\n    <RadixDialog.Portal data-volt-portal=\"\">\n      {withOverlay && <DialogOverlay />}\n      <RadixDialog.Content\n        className={cx(\n          \"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-group-2 bg-gray-level-1 rounded-2xl p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]\",\n          className\n        )}\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </RadixDialog.Content>\n    </RadixDialog.Portal>\n  );\n});\n\nDialogContent.displayName = \"Dialog.Content\";\n\nconst DialogTitle = forwardRef<\n  HTMLHeadingElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => {\n  return <RadixDialog.Title className={cx(className)} ref={ref} {...props} />;\n});\n\nDialogTitle.displayName = \"Dialog.Title\";\n\nconst DialogDescription = forwardRef<\n  HTMLParagraphElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => {\n  return (\n    <RadixDialog.Description className={cx(className)} ref={ref} {...props} />\n  );\n});\n\nDialogDescription.displayName = \"Dialog.Description\";\n\nconst DialogClose = forwardRef<\n  HTMLButtonElement,\n  ComponentPropsWithoutRef<typeof RadixDialog.Close> & {\n    asChild?: boolean;\n  }\n>(({ className, children, asChild, ...props }, ref) => {\n  if (asChild) {\n    return (\n      <RadixDialog.Close\n        asChild={asChild}\n        className={cx(\"\", className)}\n        ref={ref}\n        {...props}\n      >\n        {children}\n      </RadixDialog.Close>\n    );\n  }\n\n  return (\n    <RadixDialog.Close\n      asChild={asChild}\n      className={cx(\n        \"absolute right-4 size-6 flex items-center justify-center top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-accent disabled:pointer-events-none data-[state=open]:text-gray-light\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    >\n      {children || (\n        <svg\n          className=\"h-4 w-4\"\n          fill=\"none\"\n          height=\"24\"\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          width=\"24\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path d=\"M18 6L6 18\" />\n          <path d=\"M6 6l12 12\" />\n        </svg>\n      )}\n      <span className=\"sr-only\">Close</span>\n    </RadixDialog.Close>\n  );\n});\n\nDialogClose.displayName = \"Dialog.Close\";\n\nexport const Dialog = {\n  Root: DialogRoot,\n  Trigger: DialogTrigger,\n  Overlay: DialogOverlay,\n  Content: DialogContent,\n  Title: DialogTitle,\n  Description: DialogDescription,\n  Close: DialogClose,\n};\n"],"names":["DialogOverlay","forwardRef","className","props","ref","_jsx","RadixDialog","Overlay","cx","displayName","DialogRoot","Root","DialogTrigger","asChild","Trigger","DialogContent","children","withOverlay","_jsxs","Portal","Content","DialogTitle","Title","DialogDescription","Description","DialogClose","Close","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","d","Dialog"],"mappings":"wJAOA,MAAMA,EAAgBC,EAGpB,EAAGC,eAAcC,GAASC,IAExBC,EAACC,EAAYC,QAAO,CAClBL,UAAWM,EACT,yJACAN,GAEFE,IAAKA,KACDD,KAKVH,EAAcS,YAAcH,EAAYC,QAAQE,YAEhD,MAAMC,EAAmCP,GAChCE,EAACC,EAAYK,KAAI,IAAKR,IAG/BO,EAAWD,YAAc,cAEzB,MAAMG,EAAgBX,EAKpB,EAAGC,YAAWW,aAAYV,GAASC,IAEjCC,EAACC,EAAYQ,QAAO,CAClBD,QAASA,EACTX,UAAWM,EAAG,GAAIN,GAClBE,IAAKA,KACDD,KAKVS,EAAcH,YAAc,iBAE5B,MAAMM,EAAgBd,EAKpB,EAAGC,YAAWc,WAAUC,eAAc,KAASd,GAASC,IAEtDc,EAACZ,EAAYa,2BAAwB,GAAEH,SAAA,CACpCC,GAAeZ,EAACL,EAAa,CAAA,GAC9BK,EAACC,EAAYc,QAAO,CAClBlB,UAAWM,EACT,6fACAN,GAEFE,IAAKA,KACDD,EAAKa,SAERA,QAMTD,EAAcN,YAAc,iBAE5B,MAAMY,EAAcpB,EAGlB,EAAGC,eAAcC,GAASC,IACnBC,EAACC,EAAYgB,MAAK,CAACpB,UAAWM,EAAGN,GAAYE,IAAKA,KAASD,KAGpEkB,EAAYZ,YAAc,eAE1B,MAAMc,EAAoBtB,EAGxB,EAAGC,eAAcC,GAASC,IAExBC,EAACC,EAAYkB,YAAW,CAACtB,UAAWM,EAAGN,GAAYE,IAAKA,KAASD,KAIrEoB,EAAkBd,YAAc,qBAEhC,MAAMgB,EAAcxB,EAKlB,EAAGC,YAAWc,WAAUH,aAAYV,GAASC,IACzCS,EAEAR,EAACC,EAAYoB,MAAK,CAChBb,QAASA,EACTX,UAAWM,EAAG,GAAIN,GAClBE,IAAKA,KACDD,EAAKa,SAERA,IAMLE,EAACZ,EAAYoB,MAAK,CAChBb,QAASA,EACTX,UAAWM,EACT,gNACAN,GAEFE,IAAKA,KACDD,YAEHa,GACCE,EAAA,MAAA,CACEhB,UAAU,UACVyB,KAAK,OACLC,OAAO,KACPC,OAAO,eACPC,cAAc,QACdC,eAAe,QACfC,YAAY,IACZC,QAAQ,YACRC,MAAM,KACNC,MAAM,uCAEN9B,EAAA,OAAA,CAAM+B,EAAE,eACR/B,EAAA,OAAA,CAAM+B,EAAE,kBAGZ/B,UAAMH,UAAU,UAASc,SAAA,cAK/BS,EAAYhB,YAAc,eAEnB,MAAM4B,EAAS,CACpB1B,KAAMD,EACNI,QAASF,EACTL,QAASP,EACToB,QAASL,EACTO,MAAOD,EACPG,YAAaD,EACbG,MAAOD"}

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"@radix-ui/react-dropdown-menu";import s from"classnames";import{forwardRef as o}from"react";const r=s("relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-2 text-sm text-gray-default outline-none transition-colors","data-[disabled]:pointer-events-none data-[disabled]:opacity-50","data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default"),n=s("z-50 min-w-48 rounded-md border border-gray-default bg-gray-level-1 p-1 text-gray-default shadow-xl outline-none","data-[state=open]:animate-in data-[state=closed]:animate-out","data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0","data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95","data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"),d=e("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z"})}),l="ml-auto pl-6 text-gray-light",i=a=>e(t.Root,{...a});i.displayName="DropdownMenu.Root";const c=o(({className:a,asChild:o,...r},n)=>e(t.Trigger,{asChild:o,className:s(a),ref:n,...r}));c.displayName="DropdownMenu.Trigger";const m=o(({className:a,sideOffset:o=4,align:r="start",...d},l)=>e(t.Portal,{children:e(t.Content,{align:r,className:s(n,a),ref:l,sideOffset:o,...d})}));m.displayName="DropdownMenu.Content";const p=o(({className:a,...o},n)=>e(t.Item,{className:s(r,a),ref:n,...o}));p.displayName="DropdownMenu.Item";const u=o(({className:o,children:n,checked:l,...i},c)=>a(t.CheckboxItem,{checked:l,className:s(r,o),ref:c,...i,children:[e(t.ItemIndicator,{className:"inline-flex items-center justify-center",children:d}),n]}));u.displayName="DropdownMenu.CheckboxItem";const f=a=>e(t.RadioGroup,{...a});f.displayName="DropdownMenu.RadioGroup";const h=o(({className:o,children:n,...d},l)=>a(t.RadioItem,{className:s(r,o),ref:l,...d,children:[e(t.ItemIndicator,{className:"absolute left-2 inline-flex items-center justify-center",children:e("span",{className:"h-1.5 w-1.5 rounded-circle bg-current"})}),n]}));h.displayName="DropdownMenu.RadioItem";const g=o(({className:a,...o},r)=>e(t.Separator,{className:s("-mx-1 my-1 h-px bg-gray-a6",a),ref:r,...o}));g.displayName="DropdownMenu.Separator";const N=o(({className:a,...o},r)=>e(t.Label,{className:s("px-3 py-2 text-xs font-semibold uppercase text-gray-light",a),ref:r,...o}));N.displayName="DropdownMenu.Label";const w=({className:a,...t})=>e("span",{className:s(l,a),...t});w.displayName="DropdownMenu.Shortcut";const b=a=>e(t.Sub,{...a});b.displayName="DropdownMenu.Sub";const x=o(({className:o,asChild:n,children:d,...i},c)=>a(t.SubTrigger,{asChild:n,className:s(r,"pr-2",o),ref:c,...i,children:[d,e("svg",{"aria-hidden":"true",className:s("h-4 w-4",l),fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"m9.29 6.71 1.42-1.42L17.42 12l-6.71 6.71-1.42-1.42L14.58 12 9.29 6.71z"})})]}));x.displayName="DropdownMenu.SubTrigger";const y=o(({className:a,sideOffset:o=6,...r},d)=>e(t.SubContent,{className:s(n,a),ref:d,sideOffset:o,...r}));y.displayName="DropdownMenu.SubContent";const C={Root:i,Trigger:c,Content:m,Item:p,CheckboxItem:u,RadioGroup:f,RadioItem:h,Separator:g,Label:N,Shortcut:w,Sub:b,SubTrigger:x,SubContent:y};export{C as DropdownMenu};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"@radix-ui/react-dropdown-menu";import s from"classnames";import{forwardRef as o}from"react";const r=s("relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-2 text-sm text-gray-default outline-none transition-colors","data-[disabled]:pointer-events-none data-[disabled]:opacity-50","data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default"),n=s("z-50 min-w-48 rounded-md border border-gray-default bg-gray-level-1 p-1 text-gray-default shadow-xl outline-none","data-[state=open]:animate-in data-[state=closed]:animate-out","data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0","data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95","data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"),d=e("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z"})}),l="ml-auto pl-6 text-gray-light",i=a=>e(t.Root,{...a});i.displayName="DropdownMenu.Root";const c=o(({className:a,asChild:o,...r},n)=>e(t.Trigger,{asChild:o,className:s(a),ref:n,...r}));c.displayName="DropdownMenu.Trigger";const m=o(({className:a,sideOffset:o=4,align:r="start",...d},l)=>e(t.Portal,{"data-volt-portal":"",children:e(t.Content,{align:r,className:s(n,a),ref:l,sideOffset:o,...d})}));m.displayName="DropdownMenu.Content";const p=o(({className:a,...o},n)=>e(t.Item,{className:s(r,a),ref:n,...o}));p.displayName="DropdownMenu.Item";const u=o(({className:o,children:n,checked:l,...i},c)=>a(t.CheckboxItem,{checked:l,className:s(r,o),ref:c,...i,children:[e(t.ItemIndicator,{className:"inline-flex items-center justify-center",children:d}),n]}));u.displayName="DropdownMenu.CheckboxItem";const f=a=>e(t.RadioGroup,{...a});f.displayName="DropdownMenu.RadioGroup";const h=o(({className:o,children:n,...d},l)=>a(t.RadioItem,{className:s(r,o),ref:l,...d,children:[e(t.ItemIndicator,{className:"absolute left-2 inline-flex items-center justify-center",children:e("span",{className:"h-1.5 w-1.5 rounded-circle bg-current"})}),n]}));h.displayName="DropdownMenu.RadioItem";const g=o(({className:a,...o},r)=>e(t.Separator,{className:s("-mx-1 my-1 h-px bg-gray-a6",a),ref:r,...o}));g.displayName="DropdownMenu.Separator";const N=o(({className:a,...o},r)=>e(t.Label,{className:s("px-3 py-2 text-xs font-semibold uppercase text-gray-light",a),ref:r,...o}));N.displayName="DropdownMenu.Label";const w=({className:a,...t})=>e("span",{className:s(l,a),...t});w.displayName="DropdownMenu.Shortcut";const b=a=>e(t.Sub,{...a});b.displayName="DropdownMenu.Sub";const x=o(({className:o,asChild:n,children:d,...i},c)=>a(t.SubTrigger,{asChild:n,className:s(r,"pr-2",o),ref:c,...i,children:[d,e("svg",{"aria-hidden":"true",className:s("h-4 w-4",l),fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"m9.29 6.71 1.42-1.42L17.42 12l-6.71 6.71-1.42-1.42L14.58 12 9.29 6.71z"})})]}));x.displayName="DropdownMenu.SubTrigger";const y=o(({className:a,sideOffset:o=6,...r},d)=>e(t.SubContent,{className:s(n,a),ref:d,sideOffset:o,...r}));y.displayName="DropdownMenu.SubContent";const C={Root:i,Trigger:c,Content:m,Item:p,CheckboxItem:u,RadioGroup:f,RadioItem:h,Separator:g,Label:N,Shortcut:w,Sub:b,SubTrigger:x,SubContent:y};export{C as DropdownMenu};
 //# sourceMappingURL=DropdownMenu.js.map

package/dist/components/DropdownMenu/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.js","sources":["../../../src/components/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["import * as RadixDropdown from \"@radix-ui/react-dropdown-menu\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype DropdownMenuRootProps = ComponentPropsWithoutRef<typeof RadixDropdown.Root>;\ntype DropdownMenuTriggerProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Trigger\n> & {\n    asChild?: boolean;\n};\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Content\n>;\ntype DropdownMenuItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Item\n>;\ntype DropdownMenuCheckboxItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.CheckboxItem\n> & {\n    checked?: boolean;\n};\ntype DropdownMenuRadioGroupProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.RadioGroup\n>;\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.RadioItem\n>;\ntype DropdownMenuSeparatorProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Separator\n>;\ntype DropdownMenuLabelProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Label\n>;\ntype DropdownMenuSubProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Sub\n>;\ntype DropdownMenuSubTriggerProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.SubTrigger\n> & { asChild?: boolean };\ntype DropdownMenuSubContentProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.SubContent\n>;\n\nconst itemBaseClasses = cx(\n    \"relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-2 text-sm text-gray-default outline-none transition-colors\",\n    \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n    \"data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default\"\n);\n\nconst contentBaseClasses = cx(\n    \"z-50 min-w-48 rounded-md border border-gray-default bg-gray-level-1 p-1 text-gray-default shadow-xl outline-none\",\n    \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n    \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n    \"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n    \"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\"\n);\n\nconst indicatorIcon = (\n    <svg\n        aria-hidden=\"true\"\n        className=\"h-4 w-4\"\n        fill=\"currentColor\"\n        focusable=\"false\"\n        viewBox=\"0 0 16 16\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n    >\n        <path d=\"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z\" />\n    </svg>\n);\n\nconst rightSlotClasses = \"ml-auto pl-6 text-gray-light\";\n\nconst DropdownMenuRoot: FC<DropdownMenuRootProps> = (props) => {\n    return <RadixDropdown.Root {...props} />;\n};\n\nDropdownMenuRoot.displayName = \"DropdownMenu.Root\";\n\nconst DropdownMenuTrigger = forwardRef<HTMLButtonElement, DropdownMenuTriggerProps>(\n    ({ className, asChild, ...props }, ref) => {\n        return (\n            <RadixDropdown.Trigger\n                asChild={asChild}\n                className={cx(className)}\n                ref={ref}\n                {...props}\n            />\n        );\n    }\n);\n\nDropdownMenuTrigger.displayName = \"DropdownMenu.Trigger\";\n\nconst DropdownMenuContent = forwardRef<HTMLDivElement, DropdownMenuContentProps>(\n    ({ className, sideOffset = 4, align = \"start\", ...props }, ref) => {\n        return (\n            <RadixDropdown.Portal>\n                <RadixDropdown.Content\n                    align={align}\n                    className={cx(contentBaseClasses, className)}\n                    ref={ref}\n                    sideOffset={sideOffset}\n                    {...props}\n                />\n            </RadixDropdown.Portal>\n        );\n    }\n);\n\nDropdownMenuContent.displayName = \"DropdownMenu.Content\";\n\nconst DropdownMenuItem = forwardRef<HTMLDivElement, DropdownMenuItemProps>(\n    ({ className, ...props }, ref) => (\n        <RadixDropdown.Item className={cx(itemBaseClasses, className)} ref={ref} {...props} />\n    )\n);\n\nDropdownMenuItem.displayName = \"DropdownMenu.Item\";\n\nconst DropdownMenuCheckboxItem = forwardRef<\n    HTMLDivElement,\n    DropdownMenuCheckboxItemProps\n>(({ className, children, checked, ...props }, ref) => (\n    <RadixDropdown.CheckboxItem\n        checked={checked}\n        className={cx(itemBaseClasses, className)}\n        ref={ref}\n        {...props}\n    >\n        <RadixDropdown.ItemIndicator className=\"inline-flex items-center justify-center\">\n            {indicatorIcon}\n        </RadixDropdown.ItemIndicator>\n        {children}\n    </RadixDropdown.CheckboxItem>\n));\n\nDropdownMenuCheckboxItem.displayName = \"DropdownMenu.CheckboxItem\";\n\nconst DropdownMenuRadioGroup: FC<DropdownMenuRadioGroupProps> = (props) => (\n    <RadixDropdown.RadioGroup {...props} />\n);\n\nDropdownMenuRadioGroup.displayName = \"DropdownMenu.RadioGroup\";\n\nconst DropdownMenuRadioItem = forwardRef<HTMLDivElement, DropdownMenuRadioItemProps>(\n    ({ className, children, ...props }, ref) => (\n        <RadixDropdown.RadioItem\n            className={cx(itemBaseClasses, className)}\n            ref={ref}\n            {...props}\n        >\n            <RadixDropdown.ItemIndicator className=\"absolute left-2 inline-flex items-center justify-center\">\n                <span className=\"h-1.5 w-1.5 rounded-circle bg-current\" />\n            </RadixDropdown.ItemIndicator>\n            {children}\n        </RadixDropdown.RadioItem>\n    )\n);\n\nDropdownMenuRadioItem.displayName = \"DropdownMenu.RadioItem\";\n\nconst DropdownMenuSeparator = forwardRef<\n    React.ElementRef<typeof RadixDropdown.Separator>,\n    DropdownMenuSeparatorProps\n>(({ className, ...props }, ref) => (\n    <RadixDropdown.Separator\n        className={cx(\"-mx-1 my-1 h-px bg-gray-a6\", className)}\n        ref={ref}\n        {...props}\n    />\n));\n\nDropdownMenuSeparator.displayName = \"DropdownMenu.Separator\";\n\nconst DropdownMenuLabel = forwardRef<\n    React.ElementRef<typeof RadixDropdown.Label>,\n    DropdownMenuLabelProps\n>(({ className, ...props }, ref) => (\n    <RadixDropdown.Label\n        className={cx(\"px-3 py-2 text-xs font-semibold uppercase text-gray-light\", className)}\n        ref={ref}\n        {...props}\n    />\n));\n\nDropdownMenuLabel.displayName = \"DropdownMenu.Label\";\n\nconst DropdownMenuShortcut: FC<React.HTMLAttributes<HTMLSpanElement>> = ({\n    className,\n    ...props\n}) => {\n    return <span className={cx(rightSlotClasses, className)} {...props} />;\n};\n\nDropdownMenuShortcut.displayName = \"DropdownMenu.Shortcut\";\n\nconst DropdownMenuSub: FC<DropdownMenuSubProps> = (props) => (\n    <RadixDropdown.Sub {...props} />\n);\n\nDropdownMenuSub.displayName = \"DropdownMenu.Sub\";\n\nconst DropdownMenuSubTrigger = forwardRef<\n    React.ElementRef<typeof RadixDropdown.SubTrigger>,\n    DropdownMenuSubTriggerProps\n>(({ className, asChild, children, ...props }, ref) => (\n    <RadixDropdown.SubTrigger\n        asChild={asChild}\n        className={cx(itemBaseClasses, \"pr-2\", className)}\n        ref={ref}\n        {...props}\n    >\n        {children}\n        <svg\n            aria-hidden=\"true\"\n            className={cx(\"h-4 w-4\", rightSlotClasses)}\n            fill=\"currentColor\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n        >\n            <path d=\"m9.29 6.71 1.42-1.42L17.42 12l-6.71 6.71-1.42-1.42L14.58 12 9.29 6.71z\" />\n        </svg>\n    </RadixDropdown.SubTrigger>\n));\n\nDropdownMenuSubTrigger.displayName = \"DropdownMenu.SubTrigger\";\n\nconst DropdownMenuSubContent = forwardRef<\n    HTMLDivElement,\n    DropdownMenuSubContentProps\n>(({ className, sideOffset = 6, ...props }, ref) => (\n    <RadixDropdown.SubContent\n        className={cx(contentBaseClasses, className)}\n        ref={ref}\n        sideOffset={sideOffset}\n        {...props}\n    />\n));\n\nDropdownMenuSubContent.displayName = \"DropdownMenu.SubContent\";\n\nexport const DropdownMenu = {\n    Root: DropdownMenuRoot,\n    Trigger: DropdownMenuTrigger,\n    Content: DropdownMenuContent,\n    Item: DropdownMenuItem,\n    CheckboxItem: DropdownMenuCheckboxItem,\n    RadioGroup: DropdownMenuRadioGroup,\n    RadioItem: DropdownMenuRadioItem,\n    Separator: DropdownMenuSeparator,\n    Label: DropdownMenuLabel,\n    Shortcut: DropdownMenuShortcut,\n    Sub: DropdownMenuSub,\n    SubTrigger: DropdownMenuSubTrigger,\n    SubContent: DropdownMenuSubContent,\n};\n\n\n"],"names":["itemBaseClasses","cx","contentBaseClasses","indicatorIcon","_jsx","className","fill","focusable","viewBox","xmlns","children","d","rightSlotClasses","DropdownMenuRoot","props","RadixDropdown","Root","displayName","DropdownMenuTrigger","forwardRef","asChild","ref","Trigger","DropdownMenuContent","sideOffset","align","Portal","Content","DropdownMenuItem","Item","DropdownMenuCheckboxItem","checked","_jsxs","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuSeparator","Separator","DropdownMenuLabel","Label","DropdownMenuShortcut","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","Shortcut"],"mappings":"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"}
+{"version":3,"file":"DropdownMenu.js","sources":["../../../src/components/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["import * as RadixDropdown from \"@radix-ui/react-dropdown-menu\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype DropdownMenuRootProps = ComponentPropsWithoutRef<typeof RadixDropdown.Root>;\ntype DropdownMenuTriggerProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Trigger\n> & {\n    asChild?: boolean;\n};\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Content\n>;\ntype DropdownMenuItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Item\n>;\ntype DropdownMenuCheckboxItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.CheckboxItem\n> & {\n    checked?: boolean;\n};\ntype DropdownMenuRadioGroupProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.RadioGroup\n>;\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.RadioItem\n>;\ntype DropdownMenuSeparatorProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Separator\n>;\ntype DropdownMenuLabelProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Label\n>;\ntype DropdownMenuSubProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.Sub\n>;\ntype DropdownMenuSubTriggerProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.SubTrigger\n> & { asChild?: boolean };\ntype DropdownMenuSubContentProps = ComponentPropsWithoutRef<\n    typeof RadixDropdown.SubContent\n>;\n\nconst itemBaseClasses = cx(\n    \"relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-3 py-2 text-sm text-gray-default outline-none transition-colors\",\n    \"data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n    \"data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default\"\n);\n\nconst contentBaseClasses = cx(\n    \"z-50 min-w-48 rounded-md border border-gray-default bg-gray-level-1 p-1 text-gray-default shadow-xl outline-none\",\n    \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n    \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n    \"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n    \"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\"\n);\n\nconst indicatorIcon = (\n    <svg\n        aria-hidden=\"true\"\n        className=\"h-4 w-4\"\n        fill=\"currentColor\"\n        focusable=\"false\"\n        viewBox=\"0 0 16 16\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n    >\n        <path d=\"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z\" />\n    </svg>\n);\n\nconst rightSlotClasses = \"ml-auto pl-6 text-gray-light\";\n\nconst DropdownMenuRoot: FC<DropdownMenuRootProps> = (props) => {\n    return <RadixDropdown.Root {...props} />;\n};\n\nDropdownMenuRoot.displayName = \"DropdownMenu.Root\";\n\nconst DropdownMenuTrigger = forwardRef<HTMLButtonElement, DropdownMenuTriggerProps>(\n    ({ className, asChild, ...props }, ref) => {\n        return (\n            <RadixDropdown.Trigger\n                asChild={asChild}\n                className={cx(className)}\n                ref={ref}\n                {...props}\n            />\n        );\n    }\n);\n\nDropdownMenuTrigger.displayName = \"DropdownMenu.Trigger\";\n\nconst DropdownMenuContent = forwardRef<HTMLDivElement, DropdownMenuContentProps>(\n    ({ className, sideOffset = 4, align = \"start\", ...props }, ref) => {\n        return (\n            <RadixDropdown.Portal data-volt-portal=\"\">\n                <RadixDropdown.Content\n                    align={align}\n                    className={cx(contentBaseClasses, className)}\n                    ref={ref}\n                    sideOffset={sideOffset}\n                    {...props}\n                />\n            </RadixDropdown.Portal>\n        );\n    }\n);\n\nDropdownMenuContent.displayName = \"DropdownMenu.Content\";\n\nconst DropdownMenuItem = forwardRef<HTMLDivElement, DropdownMenuItemProps>(\n    ({ className, ...props }, ref) => (\n        <RadixDropdown.Item className={cx(itemBaseClasses, className)} ref={ref} {...props} />\n    )\n);\n\nDropdownMenuItem.displayName = \"DropdownMenu.Item\";\n\nconst DropdownMenuCheckboxItem = forwardRef<\n    HTMLDivElement,\n    DropdownMenuCheckboxItemProps\n>(({ className, children, checked, ...props }, ref) => (\n    <RadixDropdown.CheckboxItem\n        checked={checked}\n        className={cx(itemBaseClasses, className)}\n        ref={ref}\n        {...props}\n    >\n        <RadixDropdown.ItemIndicator className=\"inline-flex items-center justify-center\">\n            {indicatorIcon}\n        </RadixDropdown.ItemIndicator>\n        {children}\n    </RadixDropdown.CheckboxItem>\n));\n\nDropdownMenuCheckboxItem.displayName = \"DropdownMenu.CheckboxItem\";\n\nconst DropdownMenuRadioGroup: FC<DropdownMenuRadioGroupProps> = (props) => (\n    <RadixDropdown.RadioGroup {...props} />\n);\n\nDropdownMenuRadioGroup.displayName = \"DropdownMenu.RadioGroup\";\n\nconst DropdownMenuRadioItem = forwardRef<HTMLDivElement, DropdownMenuRadioItemProps>(\n    ({ className, children, ...props }, ref) => (\n        <RadixDropdown.RadioItem\n            className={cx(itemBaseClasses, className)}\n            ref={ref}\n            {...props}\n        >\n            <RadixDropdown.ItemIndicator className=\"absolute left-2 inline-flex items-center justify-center\">\n                <span className=\"h-1.5 w-1.5 rounded-circle bg-current\" />\n            </RadixDropdown.ItemIndicator>\n            {children}\n        </RadixDropdown.RadioItem>\n    )\n);\n\nDropdownMenuRadioItem.displayName = \"DropdownMenu.RadioItem\";\n\nconst DropdownMenuSeparator = forwardRef<\n    React.ElementRef<typeof RadixDropdown.Separator>,\n    DropdownMenuSeparatorProps\n>(({ className, ...props }, ref) => (\n    <RadixDropdown.Separator\n        className={cx(\"-mx-1 my-1 h-px bg-gray-a6\", className)}\n        ref={ref}\n        {...props}\n    />\n));\n\nDropdownMenuSeparator.displayName = \"DropdownMenu.Separator\";\n\nconst DropdownMenuLabel = forwardRef<\n    React.ElementRef<typeof RadixDropdown.Label>,\n    DropdownMenuLabelProps\n>(({ className, ...props }, ref) => (\n    <RadixDropdown.Label\n        className={cx(\"px-3 py-2 text-xs font-semibold uppercase text-gray-light\", className)}\n        ref={ref}\n        {...props}\n    />\n));\n\nDropdownMenuLabel.displayName = \"DropdownMenu.Label\";\n\nconst DropdownMenuShortcut: FC<React.HTMLAttributes<HTMLSpanElement>> = ({\n    className,\n    ...props\n}) => {\n    return <span className={cx(rightSlotClasses, className)} {...props} />;\n};\n\nDropdownMenuShortcut.displayName = \"DropdownMenu.Shortcut\";\n\nconst DropdownMenuSub: FC<DropdownMenuSubProps> = (props) => (\n    <RadixDropdown.Sub {...props} />\n);\n\nDropdownMenuSub.displayName = \"DropdownMenu.Sub\";\n\nconst DropdownMenuSubTrigger = forwardRef<\n    React.ElementRef<typeof RadixDropdown.SubTrigger>,\n    DropdownMenuSubTriggerProps\n>(({ className, asChild, children, ...props }, ref) => (\n    <RadixDropdown.SubTrigger\n        asChild={asChild}\n        className={cx(itemBaseClasses, \"pr-2\", className)}\n        ref={ref}\n        {...props}\n    >\n        {children}\n        <svg\n            aria-hidden=\"true\"\n            className={cx(\"h-4 w-4\", rightSlotClasses)}\n            fill=\"currentColor\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n        >\n            <path d=\"m9.29 6.71 1.42-1.42L17.42 12l-6.71 6.71-1.42-1.42L14.58 12 9.29 6.71z\" />\n        </svg>\n    </RadixDropdown.SubTrigger>\n));\n\nDropdownMenuSubTrigger.displayName = \"DropdownMenu.SubTrigger\";\n\nconst DropdownMenuSubContent = forwardRef<\n    HTMLDivElement,\n    DropdownMenuSubContentProps\n>(({ className, sideOffset = 6, ...props }, ref) => (\n    <RadixDropdown.SubContent\n        className={cx(contentBaseClasses, className)}\n        ref={ref}\n        sideOffset={sideOffset}\n        {...props}\n    />\n));\n\nDropdownMenuSubContent.displayName = \"DropdownMenu.SubContent\";\n\nexport const DropdownMenu = {\n    Root: DropdownMenuRoot,\n    Trigger: DropdownMenuTrigger,\n    Content: DropdownMenuContent,\n    Item: DropdownMenuItem,\n    CheckboxItem: DropdownMenuCheckboxItem,\n    RadioGroup: DropdownMenuRadioGroup,\n    RadioItem: DropdownMenuRadioItem,\n    Separator: DropdownMenuSeparator,\n    Label: DropdownMenuLabel,\n    Shortcut: DropdownMenuShortcut,\n    Sub: DropdownMenuSub,\n    SubTrigger: DropdownMenuSubTrigger,\n    SubContent: DropdownMenuSubContent,\n};\n\n\n"],"names":["itemBaseClasses","cx","contentBaseClasses","indicatorIcon","_jsx","className","fill","focusable","viewBox","xmlns","children","d","rightSlotClasses","DropdownMenuRoot","props","RadixDropdown","Root","displayName","DropdownMenuTrigger","forwardRef","asChild","ref","Trigger","DropdownMenuContent","sideOffset","align","Portal","Content","DropdownMenuItem","Item","DropdownMenuCheckboxItem","checked","_jsxs","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuSeparator","Separator","DropdownMenuLabel","Label","DropdownMenuShortcut","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","Shortcut"],"mappings":"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"}

package/dist/components/Popover/Popover.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"@radix-ui/react-popover";import a from"classnames";import{forwardRef as s}from"react";const i=o=>e(t.Root,{...o});i.displayName="Popover.Root";const r=s(({className:o,asChild:s,...i},r)=>e(t.Trigger,{asChild:s,className:a("",o),ref:r,...i}));r.displayName="Popover.Trigger";const n=s(({className:o,align:s="center",sideOffset:i=4,...r},n)=>e(t.Portal,{children:e(t.Content,{align:s,className:a("z-50 w-72 rounded-md bg-gray-level-1 p-4 border border-gray-default text-gray-default shadow-xl outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",o),ref:n,sideOffset:i,...r})}));n.displayName=t.Content.displayName;const d=s(({className:s,asChild:i,...r},n)=>i?e(t.Close,{asChild:i,className:a("",s),ref:n,...r}):o(t.Close,{asChild:i,className:a("absolute right-4 top-4 rounded-sm opacity-70 ring-accent transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-gray-950 focus:ring-offset-2 disabled:pointer-events-none",s),ref:n,...r,children:[o("svg",{className:"h-4 w-4",fill:"none",height:"24",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[e("path",{d:"M18 6L6 18"}),e("path",{d:"M6 6l12 12"})]}),e("span",{className:"sr-only",children:"Close"})]}));d.displayName="Popover.Close";const l={Root:i,Trigger:r,Content:n,Close:d};export{l as Popover};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as t from"@radix-ui/react-popover";import a from"classnames";import{forwardRef as s}from"react";const r=o=>e(t.Root,{...o});r.displayName="Popover.Root";const i=s(({className:o,asChild:s,...r},i)=>e(t.Trigger,{asChild:s,className:a("",o),ref:i,...r}));i.displayName="Popover.Trigger";const n=s(({className:o,align:s="center",sideOffset:r=4,...i},n)=>e(t.Portal,{"data-volt-portal":"",children:e(t.Content,{align:s,className:a("z-50 w-72 rounded-md bg-gray-level-1 p-4 border border-gray-default text-gray-default shadow-xl outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",o),ref:n,sideOffset:r,...i})}));n.displayName=t.Content.displayName;const d=s(({className:s,asChild:r,...i},n)=>r?e(t.Close,{asChild:r,className:a("",s),ref:n,...i}):o(t.Close,{asChild:r,className:a("absolute right-4 top-4 rounded-sm opacity-70 ring-accent transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-gray-950 focus:ring-offset-2 disabled:pointer-events-none",s),ref:n,...i,children:[o("svg",{className:"h-4 w-4",fill:"none",height:"24",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[e("path",{d:"M18 6L6 18"}),e("path",{d:"M6 6l12 12"})]}),e("span",{className:"sr-only",children:"Close"})]}));d.displayName="Popover.Close";const l={Root:r,Trigger:i,Content:n,Close:d};export{l as Popover};
 //# sourceMappingURL=Popover.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as RadixPopover from \"@radix-ui/react-popover\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype PopoverRootProps = ComponentPropsWithoutRef<typeof RadixPopover.Root>;\ntype PopoverTriggerProps = ComponentPropsWithoutRef<\n  typeof RadixPopover.Trigger\n> & {\n  asChild?: boolean;\n};\ntype PopoverContentProps = ComponentPropsWithoutRef<\n  typeof RadixPopover.Content\n>;\ntype PopoverCloseProps = ComponentPropsWithoutRef<typeof RadixPopover.Close> & {\n  asChild?: boolean;\n};\n\nconst PopoverRoot: FC<PopoverRootProps> = (props) => {\n  return <RadixPopover.Root {...props} />;\n};\n\nPopoverRoot.displayName = \"Popover.Root\";\n\nconst PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n  ({ className, asChild, ...props }, ref) => {\n    return (\n      <RadixPopover.Trigger\n        asChild={asChild}\n        className={cx(\"\", className)}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\n\nPopoverTrigger.displayName = \"Popover.Trigger\";\n\nconst PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n  ({ className, align = \"center\", sideOffset = 4, ...props }, ref) => {\n    return (\n      <RadixPopover.Portal>\n        <RadixPopover.Content\n          align={align}\n          className={cx(\n            \"z-50 w-72 rounded-md bg-gray-level-1 p-4 border border-gray-default text-gray-default shadow-xl outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n            className\n          )}\n          ref={ref}\n          sideOffset={sideOffset}\n          {...props}\n        />\n      </RadixPopover.Portal>\n    );\n  }\n);\n\nPopoverContent.displayName = RadixPopover.Content.displayName;\n\nconst PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(\n  ({ className, asChild, ...props }, ref) => {\n    if (asChild) {\n      return (\n        <RadixPopover.Close\n          asChild={asChild}\n          className={cx(\"\", className)}\n          ref={ref}\n          {...props}\n        />\n      );\n    }\n\n    return (\n      <RadixPopover.Close\n        asChild={asChild}\n        className={cx(\n          \"absolute right-4 top-4 rounded-sm opacity-70 ring-accent transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-gray-950 focus:ring-offset-2 disabled:pointer-events-none\",\n          className\n        )}\n        ref={ref}\n        {...props}\n      >\n        <svg\n          className=\"h-4 w-4\"\n          fill=\"none\"\n          height=\"24\"\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          width=\"24\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path d=\"M18 6L6 18\" />\n          <path d=\"M6 6l12 12\" />\n        </svg>\n        <span className=\"sr-only\">Close</span>\n      </RadixPopover.Close>\n    );\n  }\n);\n\nPopoverClose.displayName = \"Popover.Close\";\n\nexport const Popover = {\n  Root: PopoverRoot,\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n  Close: PopoverClose,\n};\n"],"names":["PopoverRoot","props","_jsx","RadixPopover","Root","displayName","PopoverTrigger","forwardRef","className","asChild","ref","Trigger","cx","PopoverContent","align","sideOffset","Portal","Content","PopoverClose","Close","_jsxs","children","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","d","Popover"],"mappings":"yJAkBA,MAAMA,EAAqCC,GAClCC,EAACC,EAAaC,KAAI,IAAKH,IAGhCD,EAAYK,YAAc,eAE1B,MAAMC,EAAiBC,EACrB,EAAGC,YAAWC,aAAYR,GAASS,IAE/BR,EAACC,EAAaQ,QAAO,CACnBF,QAASA,EACTD,UAAWI,EAAG,GAAIJ,GAClBE,IAAKA,KACDT,KAMZK,EAAeD,YAAc,kBAE7B,MAAMQ,EAAiBN,EACrB,EAAGC,YAAWM,QAAQ,SAAUC,aAAa,KAAMd,GAASS,IAExDR,EAACC,EAAaa,iBACZd,EAACC,EAAac,SACZH,MAAOA,EACPN,UAAWI,EACT,gcACAJ,GAEFE,IAAKA,EACLK,WAAYA,KACRd,OAOdY,EAAeR,YAAcF,EAAac,QAAQZ,YAElD,MAAMa,EAAeX,EACnB,EAAGC,YAAWC,aAAYR,GAASS,IAC7BD,EAEAP,EAACC,EAAagB,MAAK,CACjBV,QAASA,EACTD,UAAWI,EAAG,GAAIJ,GAClBE,IAAKA,KACDT,IAMRmB,EAACjB,EAAagB,MAAK,CACjBV,QAASA,EACTD,UAAWI,EACT,qMACAJ,GAEFE,IAAKA,KACDT,EAAKoB,SAAA,CAETD,SACEZ,UAAU,UACVc,KAAK,OACLC,OAAO,KACPC,OAAO,eACPC,cAAc,QACdC,eAAe,QACfC,YAAY,IACZC,QAAQ,YACRC,MAAM,KACNC,MAAM,6BAA4BT,SAAA,CAElCnB,EAAA,OAAA,CAAM6B,EAAE,eACR7B,EAAA,OAAA,CAAM6B,EAAE,kBAEV7B,UAAMM,UAAU,UAASa,SAAA,cAMjCH,EAAab,YAAc,gBAEpB,MAAM2B,EAAU,CACrB5B,KAAMJ,EACNW,QAASL,EACTW,QAASJ,EACTM,MAAOD"}
+{"version":3,"file":"Popover.js","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as RadixPopover from \"@radix-ui/react-popover\";\nimport cx from \"classnames\";\nimport type { ComponentPropsWithoutRef, FC } from \"react\";\nimport { forwardRef } from \"react\";\n\ntype PopoverRootProps = ComponentPropsWithoutRef<typeof RadixPopover.Root>;\ntype PopoverTriggerProps = ComponentPropsWithoutRef<\n  typeof RadixPopover.Trigger\n> & {\n  asChild?: boolean;\n};\ntype PopoverContentProps = ComponentPropsWithoutRef<\n  typeof RadixPopover.Content\n>;\ntype PopoverCloseProps = ComponentPropsWithoutRef<typeof RadixPopover.Close> & {\n  asChild?: boolean;\n};\n\nconst PopoverRoot: FC<PopoverRootProps> = (props) => {\n  return <RadixPopover.Root {...props} />;\n};\n\nPopoverRoot.displayName = \"Popover.Root\";\n\nconst PopoverTrigger = forwardRef<HTMLButtonElement, PopoverTriggerProps>(\n  ({ className, asChild, ...props }, ref) => {\n    return (\n      <RadixPopover.Trigger\n        asChild={asChild}\n        className={cx(\"\", className)}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\n\nPopoverTrigger.displayName = \"Popover.Trigger\";\n\nconst PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n  ({ className, align = \"center\", sideOffset = 4, ...props }, ref) => {\n    return (\n      <RadixPopover.Portal data-volt-portal=\"\">\n        <RadixPopover.Content\n          align={align}\n          className={cx(\n            \"z-50 w-72 rounded-md bg-gray-level-1 p-4 border border-gray-default text-gray-default shadow-xl outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n            className\n          )}\n          ref={ref}\n          sideOffset={sideOffset}\n          {...props}\n        />\n      </RadixPopover.Portal>\n    );\n  }\n);\n\nPopoverContent.displayName = RadixPopover.Content.displayName;\n\nconst PopoverClose = forwardRef<HTMLButtonElement, PopoverCloseProps>(\n  ({ className, asChild, ...props }, ref) => {\n    if (asChild) {\n      return (\n        <RadixPopover.Close\n          asChild={asChild}\n          className={cx(\"\", className)}\n          ref={ref}\n          {...props}\n        />\n      );\n    }\n\n    return (\n      <RadixPopover.Close\n        asChild={asChild}\n        className={cx(\n          \"absolute right-4 top-4 rounded-sm opacity-70 ring-accent transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-gray-950 focus:ring-offset-2 disabled:pointer-events-none\",\n          className\n        )}\n        ref={ref}\n        {...props}\n      >\n        <svg\n          className=\"h-4 w-4\"\n          fill=\"none\"\n          height=\"24\"\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          width=\"24\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path d=\"M18 6L6 18\" />\n          <path d=\"M6 6l12 12\" />\n        </svg>\n        <span className=\"sr-only\">Close</span>\n      </RadixPopover.Close>\n    );\n  }\n);\n\nPopoverClose.displayName = \"Popover.Close\";\n\nexport const Popover = {\n  Root: PopoverRoot,\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n  Close: PopoverClose,\n};\n"],"names":["PopoverRoot","props","_jsx","RadixPopover","Root","displayName","PopoverTrigger","forwardRef","className","asChild","ref","Trigger","cx","PopoverContent","align","sideOffset","Portal","children","Content","PopoverClose","Close","_jsxs","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","d","Popover"],"mappings":"yJAkBA,MAAMA,EAAqCC,GAClCC,EAACC,EAAaC,KAAI,IAAKH,IAGhCD,EAAYK,YAAc,eAE1B,MAAMC,EAAiBC,EACrB,EAAGC,YAAWC,aAAYR,GAASS,IAE/BR,EAACC,EAAaQ,QAAO,CACnBF,QAASA,EACTD,UAAWI,EAAG,GAAIJ,GAClBE,IAAKA,KACDT,KAMZK,EAAeD,YAAc,kBAE7B,MAAMQ,EAAiBN,EACrB,EAAGC,YAAWM,QAAQ,SAAUC,aAAa,KAAMd,GAASS,IAExDR,EAACC,EAAaa,2BAAwB,GAAEC,SACtCf,EAACC,EAAae,QAAO,CACnBJ,MAAOA,EACPN,UAAWI,EACT,gcACAJ,GAEFE,IAAKA,EACLK,WAAYA,KACRd,OAOdY,EAAeR,YAAcF,EAAae,QAAQb,YAElD,MAAMc,EAAeZ,EACnB,EAAGC,YAAWC,aAAYR,GAASS,IAC7BD,EAEAP,EAACC,EAAaiB,MAAK,CACjBX,QAASA,EACTD,UAAWI,EAAG,GAAIJ,GAClBE,IAAKA,KACDT,IAMRoB,EAAClB,EAAaiB,MAAK,CACjBX,QAASA,EACTD,UAAWI,EACT,qMACAJ,GAEFE,IAAKA,KACDT,EAAKgB,SAAA,CAETI,SACEb,UAAU,UACVc,KAAK,OACLC,OAAO,KACPC,OAAO,eACPC,cAAc,QACdC,eAAe,QACfC,YAAY,IACZC,QAAQ,YACRC,MAAM,KACNC,MAAM,6BAA4Bb,SAAA,CAElCf,EAAA,OAAA,CAAM6B,EAAE,eACR7B,EAAA,OAAA,CAAM6B,EAAE,kBAEV7B,UAAMM,UAAU,UAASS,SAAA,cAMjCE,EAAad,YAAc,gBAEpB,MAAM2B,EAAU,CACrB5B,KAAMJ,EACNW,QAASL,EACTY,QAASL,EACTO,MAAOD"}

package/dist/components/SelectInput/SelectInput.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as l}from"react/jsx-runtime";import*as a from"@radix-ui/react-select";import{cx as t}from"class-variance-authority";import{forwardRef as r,useState as i,useMemo as n}from"react";import{InputField as s}from"../InputField/InputField.js";const d=()=>l("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z"})}),o=()=>l("svg",{"aria-hidden":"true",className:"h-5 w-5",fill:"currentColor",focusable:"false",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"m11.52 14.2-3.15-3.14a.51.51 0 0 1-.1-.15.46.46 0 0 1 .09-.5c.08-.08.19-.13.32-.13h6.64c.13 0 .24.05.33.14.08.1.12.2.12.32 0 .03-.05.14-.14.32l-3.15 3.15a.64.64 0 0 1-.48.2.64.64 0 0 1-.48-.2Z"})}),c=()=>l("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 17 17",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"m8.9 9.5 2.06 2.05c.09.1.2.14.35.15.14 0 .25-.05.35-.15.1-.1.15-.2.15-.35a.48.48 0 0 0-.15-.35L9.61 8.8l2.05-2.05c.1-.09.14-.2.14-.34a.47.47 0 0 0-.14-.36.48.48 0 0 0-.35-.14.48.48 0 0 0-.35.14L8.9 8.1 6.86 6.05a.48.48 0 0 0-.35-.14.47.47 0 0 0-.35.14c-.1.1-.15.22-.15.35 0 .14.05.26.15.35L8.2 8.8l-2.05 2.05c-.1.1-.14.21-.14.35 0 .14.04.26.14.35.1.1.21.15.35.15.14 0 .25-.05.35-.15l2.05-2.04Zm.01 5.64a6.17 6.17 0 0 1-4.48-1.86A6.4 6.4 0 0 1 2.58 8.8a6.17 6.17 0 0 1 1.85-4.48A6.4 6.4 0 0 1 8.9 2.47a6.17 6.17 0 0 1 4.48 1.85 6.4 6.4 0 0 1 1.85 4.48 6.17 6.17 0 0 1-1.85 4.48 6.4 6.4 0 0 1-4.48 1.86Z"})}),h=t("flex h-6 flex-1 items-center justify-between gap-2 text-left text-base text-gray-default outline-none","data-[placeholder]:text-gray-disabled"),u=t("min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-lg bg-gray-level-1 shadow-lg"),p=t("flex cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 text-sm text-gray-default outline-none transition-colors","data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default"),m=r(({id:r,options:m,label:f,labelHidden:x,description:g,helperText:b,helperTextTone:v="default",state:w="default",prefix:y,suffix:N,actions:C,clearable:I,onClear:T,className:j,fieldClassName:L,controlClassName:A,placeholder:B,disabled:V,readOnly:Z,required:H,value:O,defaultValue:P,onChange:q,...F},R)=>{const S=void 0!==O,[$,k]=i(P??""),D=S?O??"":$,G=n(()=>{const e=[];return g&&e.push(`${r}-description`),b&&e.push(`${r}-helper`),e.join(" ")||void 0},[g,b,r]),M=Boolean(I&&""!==D&&!Z&&!V),z=e=>{S||k(e),q?.(e)};return e(s.Root,{className:t(L,j),disabled:V,id:r,readOnly:Z,state:w,children:[f?l(s.Label,{visuallyHidden:x,children:f}):null,e(a.Root,{...F,disabled:V||Z,onValueChange:z,required:H,value:D,children:[e(s.Control,{className:A,children:[y?l(s.Prefix,{children:y}):null,e(a.Trigger,{"aria-describedby":G,"aria-invalid":"error"===w||"error"===v,className:h,id:r,ref:R,children:[l(a.Value,{placeholder:B}),l(a.Icon,{className:"text-gray-light",children:l(o,{})})]}),C?l(s.Actions,{children:C}):null,M?l(s.Actions,{children:l("button",{"aria-label":"Clear selection",className:"flex h-6 w-6 items-center justify-center rounded-full text-gray-light transition hover:text-gray-default",onClick:e=>{e.stopPropagation(),z(""),T?.()},type:"button",children:l(c,{})})}):null,N?l(s.Suffix,{children:N}):null]}),l(a.Portal,{children:l(a.Content,{align:"start",className:u,position:"popper",sideOffset:4,children:l(a.Viewport,{className:"p-1",children:m.map(t=>(e=>"options"in e)(t)?e(a.Group,{children:[l(a.Label,{className:"px-3 py-2 text-xs font-semibold uppercase text-gray-light",children:t.label}),t.options.map(t=>e(a.Item,{className:p,disabled:t.disabled,value:t.value,children:[l(a.ItemText,{children:t.label}),l(a.ItemIndicator,{className:"text-accent-default",children:l(d,{})})]},t.value))]},t.label):e(a.Item,{className:p,disabled:t.disabled,value:t.value,children:[l(a.ItemText,{children:t.label}),l(a.ItemIndicator,{className:"text-accent-default",children:l(d,{})})]},t.value))})})})]}),b?l(s.HelperText,{tone:v,children:b}):null,g?l(s.Description,{children:g}):null]})});m.displayName="SelectInput";export{m as SelectInput};
+import{jsxs as e,jsx as l}from"react/jsx-runtime";import*as a from"@radix-ui/react-select";import{cx as t}from"class-variance-authority";import{forwardRef as r,useState as i,useMemo as n}from"react";import{InputField as s}from"../InputField/InputField.js";const d=()=>l("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z"})}),o=()=>l("svg",{"aria-hidden":"true",className:"h-5 w-5",fill:"currentColor",focusable:"false",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"m11.52 14.2-3.15-3.14a.51.51 0 0 1-.1-.15.46.46 0 0 1 .09-.5c.08-.08.19-.13.32-.13h6.64c.13 0 .24.05.33.14.08.1.12.2.12.32 0 .03-.05.14-.14.32l-3.15 3.15a.64.64 0 0 1-.48.2.64.64 0 0 1-.48-.2Z"})}),c=()=>l("svg",{"aria-hidden":"true",className:"h-4 w-4",fill:"currentColor",focusable:"false",viewBox:"0 0 17 17",xmlns:"http://www.w3.org/2000/svg",children:l("path",{d:"m8.9 9.5 2.06 2.05c.09.1.2.14.35.15.14 0 .25-.05.35-.15.1-.1.15-.2.15-.35a.48.48 0 0 0-.15-.35L9.61 8.8l2.05-2.05c.1-.09.14-.2.14-.34a.47.47 0 0 0-.14-.36.48.48 0 0 0-.35-.14.48.48 0 0 0-.35.14L8.9 8.1 6.86 6.05a.48.48 0 0 0-.35-.14.47.47 0 0 0-.35.14c-.1.1-.15.22-.15.35 0 .14.05.26.15.35L8.2 8.8l-2.05 2.05c-.1.1-.14.21-.14.35 0 .14.04.26.14.35.1.1.21.15.35.15.14 0 .25-.05.35-.15l2.05-2.04Zm.01 5.64a6.17 6.17 0 0 1-4.48-1.86A6.4 6.4 0 0 1 2.58 8.8a6.17 6.17 0 0 1 1.85-4.48A6.4 6.4 0 0 1 8.9 2.47a6.17 6.17 0 0 1 4.48 1.85 6.4 6.4 0 0 1 1.85 4.48 6.17 6.17 0 0 1-1.85 4.48 6.4 6.4 0 0 1-4.48 1.86Z"})}),h=t("flex h-6 flex-1 items-center justify-between gap-2 text-left text-base text-gray-default outline-none","data-[placeholder]:text-gray-disabled"),u=t("min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-lg bg-gray-level-1 shadow-lg"),p=t("flex cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 text-sm text-gray-default outline-none transition-colors","data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default"),m=r(({id:r,options:m,label:f,labelHidden:x,description:g,helperText:b,helperTextTone:v="default",state:w="default",prefix:y,suffix:N,actions:C,clearable:I,onClear:T,className:j,fieldClassName:L,controlClassName:A,placeholder:B,disabled:V,readOnly:Z,required:H,value:O,defaultValue:P,onChange:q,...F},R)=>{const S=void 0!==O,[$,k]=i(P??""),D=S?O??"":$,G=n(()=>{const e=[];return g&&e.push(`${r}-description`),b&&e.push(`${r}-helper`),e.join(" ")||void 0},[g,b,r]),M=Boolean(I&&""!==D&&!Z&&!V),z=e=>{S||k(e),q?.(e)};return e(s.Root,{className:t(L,j),disabled:V,id:r,readOnly:Z,state:w,children:[f?l(s.Label,{visuallyHidden:x,children:f}):null,e(a.Root,{...F,disabled:V||Z,onValueChange:z,required:H,value:D,children:[e(s.Control,{className:A,children:[y?l(s.Prefix,{children:y}):null,e(a.Trigger,{"aria-describedby":G,"aria-invalid":"error"===w||"error"===v,className:h,id:r,ref:R,children:[l(a.Value,{placeholder:B}),l(a.Icon,{className:"text-gray-light",children:l(o,{})})]}),C?l(s.Actions,{children:C}):null,M?l(s.Actions,{children:l("button",{"aria-label":"Clear selection",className:"flex h-6 w-6 items-center justify-center rounded-full text-gray-light transition hover:text-gray-default",onClick:e=>{e.stopPropagation(),z(""),T?.()},type:"button",children:l(c,{})})}):null,N?l(s.Suffix,{children:N}):null]}),l(a.Portal,{"data-volt-portal":"",children:l(a.Content,{align:"start",className:u,position:"popper",sideOffset:4,children:l(a.Viewport,{className:"p-1",children:m.map(t=>(e=>"options"in e)(t)?e(a.Group,{children:[l(a.Label,{className:"px-3 py-2 text-xs font-semibold uppercase text-gray-light",children:t.label}),t.options.map(t=>e(a.Item,{className:p,disabled:t.disabled,value:t.value,children:[l(a.ItemText,{children:t.label}),l(a.ItemIndicator,{className:"text-accent-default",children:l(d,{})})]},t.value))]},t.label):e(a.Item,{className:p,disabled:t.disabled,value:t.value,children:[l(a.ItemText,{children:t.label}),l(a.ItemIndicator,{className:"text-accent-default",children:l(d,{})})]},t.value))})})})]}),b?l(s.HelperText,{tone:v,children:b}):null,g?l(s.Description,{children:g}):null]})});m.displayName="SelectInput";export{m as SelectInput};
 //# sourceMappingURL=SelectInput.js.map

package/dist/components/SelectInput/SelectInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.js","sources":["../../../src/components/SelectInput/SelectInput.tsx"],"sourcesContent":["import * as RadixSelect from \"@radix-ui/react-select\";\nimport { cx } from \"class-variance-authority\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo, useState } from \"react\";\n\nimport { InputField, type InputFieldState } from \"../InputField/InputField\";\nimport type { ValidationVariant } from \"../Validation/Validation\";\n\nexport interface SelectOption {\n  value: string;\n  label: ReactNode;\n  disabled?: boolean;\n}\n\nexport interface SelectGroup {\n  label: string;\n  options: SelectOption[];\n}\n\nconst isGroup = (item: SelectOption | SelectGroup): item is SelectGroup =>\n  \"options\" in item;\n\nexport interface SelectInputProps\n  extends Omit<\n    RadixSelect.SelectProps,\n    | \"children\"\n    | \"onValueChange\"\n    | \"value\"\n    | \"defaultValue\"\n    | \"disabled\"\n    | \"required\"\n  > {\n  id: string;\n  options: (SelectOption | SelectGroup)[];\n  label?: ReactNode;\n  labelHidden?: boolean;\n  description?: ReactNode;\n  helperText?: ReactNode;\n  helperTextTone?: ValidationVariant;\n  state?: InputFieldState;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  actions?: ReactNode;\n  clearable?: boolean;\n  onClear?: () => void;\n  className?: string;\n  fieldClassName?: string;\n  controlClassName?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n  placeholder?: string;\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\nconst CheckmarkIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-4 w-4\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 16 16\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z\" />\n  </svg>\n);\n\nconst ChevronDownIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-5 w-5\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"m11.52 14.2-3.15-3.14a.51.51 0 0 1-.1-.15.46.46 0 0 1 .09-.5c.08-.08.19-.13.32-.13h6.64c.13 0 .24.05.33.14.08.1.12.2.12.32 0 .03-.05.14-.14.32l-3.15 3.15a.64.64 0 0 1-.48.2.64.64 0 0 1-.48-.2Z\" />\n  </svg>\n);\n\nconst ClearIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-4 w-4\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 17 17\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"m8.9 9.5 2.06 2.05c.09.1.2.14.35.15.14 0 .25-.05.35-.15.1-.1.15-.2.15-.35a.48.48 0 0 0-.15-.35L9.61 8.8l2.05-2.05c.1-.09.14-.2.14-.34a.47.47 0 0 0-.14-.36.48.48 0 0 0-.35-.14.48.48 0 0 0-.35.14L8.9 8.1 6.86 6.05a.48.48 0 0 0-.35-.14.47.47 0 0 0-.35.14c-.1.1-.15.22-.15.35 0 .14.05.26.15.35L8.2 8.8l-2.05 2.05c-.1.1-.14.21-.14.35 0 .14.04.26.14.35.1.1.21.15.35.15.14 0 .25-.05.35-.15l2.05-2.04Zm.01 5.64a6.17 6.17 0 0 1-4.48-1.86A6.4 6.4 0 0 1 2.58 8.8a6.17 6.17 0 0 1 1.85-4.48A6.4 6.4 0 0 1 8.9 2.47a6.17 6.17 0 0 1 4.48 1.85 6.4 6.4 0 0 1 1.85 4.48 6.17 6.17 0 0 1-1.85 4.48 6.4 6.4 0 0 1-4.48 1.86Z\" />\n  </svg>\n);\n\nconst triggerClasses = cx(\n  \"flex h-6 flex-1 items-center justify-between gap-2 text-left text-base text-gray-default outline-none\",\n  \"data-[placeholder]:text-gray-disabled\"\n);\n\nconst contentClasses = cx(\n  \"min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-lg bg-gray-level-1 shadow-lg\"\n);\n\nconst viewportClasses = \"p-1\";\n\nconst itemClasses = cx(\n  \"flex cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 text-sm text-gray-default outline-none transition-colors\",\n  \"data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default\"\n);\n\nconst groupLabelClasses =\n  \"px-3 py-2 text-xs font-semibold uppercase text-gray-light\";\n\nexport const SelectInput = forwardRef<HTMLButtonElement, SelectInputProps>(\n  (\n    {\n      id,\n      options,\n      label,\n      labelHidden,\n      description,\n      helperText,\n      helperTextTone = \"default\",\n      state = \"default\",\n      prefix,\n      suffix,\n      actions,\n      clearable,\n      onClear,\n      className,\n      fieldClassName,\n      controlClassName,\n      placeholder,\n      disabled,\n      readOnly,\n      required,\n      value: valueProp,\n      defaultValue,\n      onChange,\n      ...rest\n    },\n    ref\n  ) => {\n    const isControlled = valueProp !== undefined;\n    const [uncontrolledValue, setUncontrolledValue] = useState<string>(\n      defaultValue ?? \"\"\n    );\n    const currentValue = isControlled ? (valueProp ?? \"\") : uncontrolledValue;\n\n    const describedBy = useMemo(() => {\n      const ids: string[] = [];\n\n      if (description) ids.push(`${id}-description`);\n      if (helperText) ids.push(`${id}-helper`);\n\n      return ids.join(\" \") || undefined;\n    }, [description, helperText, id]);\n\n    const showClearButton = Boolean(\n      clearable && currentValue !== \"\" && !readOnly && !disabled\n    );\n\n    const handleValueChange = (nextValue: string) => {\n      if (!isControlled) {\n        setUncontrolledValue(nextValue);\n      }\n      onChange?.(nextValue);\n    };\n\n    return (\n      <InputField.Root\n        className={cx(fieldClassName, className)}\n        disabled={disabled}\n        id={id}\n        readOnly={readOnly}\n        state={state}\n      >\n        {label ? (\n          <InputField.Label visuallyHidden={labelHidden}>\n            {label}\n          </InputField.Label>\n        ) : null}\n\n        <RadixSelect.Root\n          {...rest}\n          disabled={disabled || readOnly}\n          onValueChange={handleValueChange}\n          required={required}\n          value={currentValue}\n        >\n          <InputField.Control className={controlClassName}>\n            {prefix ? <InputField.Prefix>{prefix}</InputField.Prefix> : null}\n            <RadixSelect.Trigger\n              aria-describedby={describedBy}\n              aria-invalid={state === \"error\" || helperTextTone === \"error\"}\n              className={triggerClasses}\n              id={id}\n              ref={ref}\n            >\n              <RadixSelect.Value placeholder={placeholder} />\n              <RadixSelect.Icon className=\"text-gray-light\">\n                <ChevronDownIcon />\n              </RadixSelect.Icon>\n            </RadixSelect.Trigger>\n            {actions ? (\n              <InputField.Actions>{actions}</InputField.Actions>\n            ) : null}\n            {showClearButton ? (\n              <InputField.Actions>\n                <button\n                  aria-label=\"Clear selection\"\n                  className=\"flex h-6 w-6 items-center justify-center rounded-full text-gray-light transition hover:text-gray-default\"\n                  onClick={(event) => {\n                    event.stopPropagation();\n                    handleValueChange(\"\");\n                    onClear?.();\n                  }}\n                  type=\"button\"\n                >\n                  <ClearIcon />\n                </button>\n              </InputField.Actions>\n            ) : null}\n            {suffix ? <InputField.Suffix>{suffix}</InputField.Suffix> : null}\n          </InputField.Control>\n\n          <RadixSelect.Portal>\n            <RadixSelect.Content\n              align=\"start\"\n              className={contentClasses}\n              position=\"popper\"\n              sideOffset={4}\n            >\n              <RadixSelect.Viewport className={viewportClasses}>\n                {options.map((item) =>\n                  isGroup(item) ? (\n                    <RadixSelect.Group key={item.label}>\n                      <RadixSelect.Label className={groupLabelClasses}>\n                        {item.label}\n                      </RadixSelect.Label>\n                      {item.options.map((option) => (\n                        <RadixSelect.Item\n                          className={itemClasses}\n                          disabled={option.disabled}\n                          key={option.value}\n                          value={option.value}\n                        >\n                          <RadixSelect.ItemText>\n                            {option.label}\n                          </RadixSelect.ItemText>\n                          <RadixSelect.ItemIndicator className=\"text-accent-default\">\n                            <CheckmarkIcon />\n                          </RadixSelect.ItemIndicator>\n                        </RadixSelect.Item>\n                      ))}\n                    </RadixSelect.Group>\n                  ) : (\n                    <RadixSelect.Item\n                      className={itemClasses}\n                      disabled={item.disabled}\n                      key={item.value}\n                      value={item.value}\n                    >\n                      <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                      <RadixSelect.ItemIndicator className=\"text-accent-default\">\n                        <CheckmarkIcon />\n                      </RadixSelect.ItemIndicator>\n                    </RadixSelect.Item>\n                  )\n                )}\n              </RadixSelect.Viewport>\n            </RadixSelect.Content>\n          </RadixSelect.Portal>\n        </RadixSelect.Root>\n\n        {helperText ? (\n          <InputField.HelperText tone={helperTextTone}>\n            {helperText}\n          </InputField.HelperText>\n        ) : null}\n        {description ? (\n          <InputField.Description>{description}</InputField.Description>\n        ) : null}\n      </InputField.Root>\n    );\n  }\n);\n\nSelectInput.displayName = \"SelectInput\";\n"],"names":["CheckmarkIcon","_jsx","className","fill","focusable","viewBox","xmlns","children","d","ChevronDownIcon","ClearIcon","triggerClasses","cx","contentClasses","itemClasses","SelectInput","forwardRef","id","options","label","labelHidden","description","helperText","helperTextTone","state","prefix","suffix","actions","clearable","onClear","fieldClassName","controlClassName","placeholder","disabled","readOnly","required","value","valueProp","defaultValue","onChange","rest","ref","isControlled","undefined","uncontrolledValue","setUncontrolledValue","useState","currentValue","describedBy","useMemo","ids","push","join","showClearButton","Boolean","handleValueChange","nextValue","_jsxs","InputField","Root","Label","visuallyHidden","RadixSelect","onValueChange","Control","Prefix","Trigger","Value","Icon","Actions","onClick","event","stopPropagation","type","Suffix","Portal","Content","align","position","sideOffset","Viewport","map","item","isGroup","Group","option","Item","ItemText","ItemIndicator","HelperText","tone","Description","displayName"],"mappings":"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"}
+{"version":3,"file":"SelectInput.js","sources":["../../../src/components/SelectInput/SelectInput.tsx"],"sourcesContent":["import * as RadixSelect from \"@radix-ui/react-select\";\nimport { cx } from \"class-variance-authority\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo, useState } from \"react\";\n\nimport { InputField, type InputFieldState } from \"../InputField/InputField\";\nimport type { ValidationVariant } from \"../Validation/Validation\";\n\nexport interface SelectOption {\n  value: string;\n  label: ReactNode;\n  disabled?: boolean;\n}\n\nexport interface SelectGroup {\n  label: string;\n  options: SelectOption[];\n}\n\nconst isGroup = (item: SelectOption | SelectGroup): item is SelectGroup =>\n  \"options\" in item;\n\nexport interface SelectInputProps\n  extends Omit<\n    RadixSelect.SelectProps,\n    | \"children\"\n    | \"onValueChange\"\n    | \"value\"\n    | \"defaultValue\"\n    | \"disabled\"\n    | \"required\"\n  > {\n  id: string;\n  options: (SelectOption | SelectGroup)[];\n  label?: ReactNode;\n  labelHidden?: boolean;\n  description?: ReactNode;\n  helperText?: ReactNode;\n  helperTextTone?: ValidationVariant;\n  state?: InputFieldState;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  actions?: ReactNode;\n  clearable?: boolean;\n  onClear?: () => void;\n  className?: string;\n  fieldClassName?: string;\n  controlClassName?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n  placeholder?: string;\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\nconst CheckmarkIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-4 w-4\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 16 16\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"M6.65 10.15 12.3 4.5a.64.64 0 0 1 .93 0c.14.13.2.3.2.48s-.06.34-.2.47l-6.11 6.13a.64.64 0 0 1-.93 0L3.31 8.72a.62.62 0 0 1-.2-.48c.01-.18.08-.34.21-.47.14-.14.3-.2.48-.2s.34.06.47.2l2.37 2.38Z\" />\n  </svg>\n);\n\nconst ChevronDownIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-5 w-5\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"m11.52 14.2-3.15-3.14a.51.51 0 0 1-.1-.15.46.46 0 0 1 .09-.5c.08-.08.19-.13.32-.13h6.64c.13 0 .24.05.33.14.08.1.12.2.12.32 0 .03-.05.14-.14.32l-3.15 3.15a.64.64 0 0 1-.48.2.64.64 0 0 1-.48-.2Z\" />\n  </svg>\n);\n\nconst ClearIcon = () => (\n  <svg\n    aria-hidden=\"true\"\n    className=\"h-4 w-4\"\n    fill=\"currentColor\"\n    focusable=\"false\"\n    viewBox=\"0 0 17 17\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"m8.9 9.5 2.06 2.05c.09.1.2.14.35.15.14 0 .25-.05.35-.15.1-.1.15-.2.15-.35a.48.48 0 0 0-.15-.35L9.61 8.8l2.05-2.05c.1-.09.14-.2.14-.34a.47.47 0 0 0-.14-.36.48.48 0 0 0-.35-.14.48.48 0 0 0-.35.14L8.9 8.1 6.86 6.05a.48.48 0 0 0-.35-.14.47.47 0 0 0-.35.14c-.1.1-.15.22-.15.35 0 .14.05.26.15.35L8.2 8.8l-2.05 2.05c-.1.1-.14.21-.14.35 0 .14.04.26.14.35.1.1.21.15.35.15.14 0 .25-.05.35-.15l2.05-2.04Zm.01 5.64a6.17 6.17 0 0 1-4.48-1.86A6.4 6.4 0 0 1 2.58 8.8a6.17 6.17 0 0 1 1.85-4.48A6.4 6.4 0 0 1 8.9 2.47a6.17 6.17 0 0 1 4.48 1.85 6.4 6.4 0 0 1 1.85 4.48 6.17 6.17 0 0 1-1.85 4.48 6.4 6.4 0 0 1-4.48 1.86Z\" />\n  </svg>\n);\n\nconst triggerClasses = cx(\n  \"flex h-6 flex-1 items-center justify-between gap-2 text-left text-base text-gray-default outline-none\",\n  \"data-[placeholder]:text-gray-disabled\"\n);\n\nconst contentClasses = cx(\n  \"min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-lg bg-gray-level-1 shadow-lg\"\n);\n\nconst viewportClasses = \"p-1\";\n\nconst itemClasses = cx(\n  \"flex cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 text-sm text-gray-default outline-none transition-colors\",\n  \"data-[highlighted]:bg-accent-soft data-[highlighted]:text-accent-default\"\n);\n\nconst groupLabelClasses =\n  \"px-3 py-2 text-xs font-semibold uppercase text-gray-light\";\n\nexport const SelectInput = forwardRef<HTMLButtonElement, SelectInputProps>(\n  (\n    {\n      id,\n      options,\n      label,\n      labelHidden,\n      description,\n      helperText,\n      helperTextTone = \"default\",\n      state = \"default\",\n      prefix,\n      suffix,\n      actions,\n      clearable,\n      onClear,\n      className,\n      fieldClassName,\n      controlClassName,\n      placeholder,\n      disabled,\n      readOnly,\n      required,\n      value: valueProp,\n      defaultValue,\n      onChange,\n      ...rest\n    },\n    ref\n  ) => {\n    const isControlled = valueProp !== undefined;\n    const [uncontrolledValue, setUncontrolledValue] = useState<string>(\n      defaultValue ?? \"\"\n    );\n    const currentValue = isControlled ? (valueProp ?? \"\") : uncontrolledValue;\n\n    const describedBy = useMemo(() => {\n      const ids: string[] = [];\n\n      if (description) ids.push(`${id}-description`);\n      if (helperText) ids.push(`${id}-helper`);\n\n      return ids.join(\" \") || undefined;\n    }, [description, helperText, id]);\n\n    const showClearButton = Boolean(\n      clearable && currentValue !== \"\" && !readOnly && !disabled\n    );\n\n    const handleValueChange = (nextValue: string) => {\n      if (!isControlled) {\n        setUncontrolledValue(nextValue);\n      }\n      onChange?.(nextValue);\n    };\n\n    return (\n      <InputField.Root\n        className={cx(fieldClassName, className)}\n        disabled={disabled}\n        id={id}\n        readOnly={readOnly}\n        state={state}\n      >\n        {label ? (\n          <InputField.Label visuallyHidden={labelHidden}>\n            {label}\n          </InputField.Label>\n        ) : null}\n\n        <RadixSelect.Root\n          {...rest}\n          disabled={disabled || readOnly}\n          onValueChange={handleValueChange}\n          required={required}\n          value={currentValue}\n        >\n          <InputField.Control className={controlClassName}>\n            {prefix ? <InputField.Prefix>{prefix}</InputField.Prefix> : null}\n            <RadixSelect.Trigger\n              aria-describedby={describedBy}\n              aria-invalid={state === \"error\" || helperTextTone === \"error\"}\n              className={triggerClasses}\n              id={id}\n              ref={ref}\n            >\n              <RadixSelect.Value placeholder={placeholder} />\n              <RadixSelect.Icon className=\"text-gray-light\">\n                <ChevronDownIcon />\n              </RadixSelect.Icon>\n            </RadixSelect.Trigger>\n            {actions ? (\n              <InputField.Actions>{actions}</InputField.Actions>\n            ) : null}\n            {showClearButton ? (\n              <InputField.Actions>\n                <button\n                  aria-label=\"Clear selection\"\n                  className=\"flex h-6 w-6 items-center justify-center rounded-full text-gray-light transition hover:text-gray-default\"\n                  onClick={(event) => {\n                    event.stopPropagation();\n                    handleValueChange(\"\");\n                    onClear?.();\n                  }}\n                  type=\"button\"\n                >\n                  <ClearIcon />\n                </button>\n              </InputField.Actions>\n            ) : null}\n            {suffix ? <InputField.Suffix>{suffix}</InputField.Suffix> : null}\n          </InputField.Control>\n\n          <RadixSelect.Portal data-volt-portal=\"\">\n            <RadixSelect.Content\n              align=\"start\"\n              className={contentClasses}\n              position=\"popper\"\n              sideOffset={4}\n            >\n              <RadixSelect.Viewport className={viewportClasses}>\n                {options.map((item) =>\n                  isGroup(item) ? (\n                    <RadixSelect.Group key={item.label}>\n                      <RadixSelect.Label className={groupLabelClasses}>\n                        {item.label}\n                      </RadixSelect.Label>\n                      {item.options.map((option) => (\n                        <RadixSelect.Item\n                          className={itemClasses}\n                          disabled={option.disabled}\n                          key={option.value}\n                          value={option.value}\n                        >\n                          <RadixSelect.ItemText>\n                            {option.label}\n                          </RadixSelect.ItemText>\n                          <RadixSelect.ItemIndicator className=\"text-accent-default\">\n                            <CheckmarkIcon />\n                          </RadixSelect.ItemIndicator>\n                        </RadixSelect.Item>\n                      ))}\n                    </RadixSelect.Group>\n                  ) : (\n                    <RadixSelect.Item\n                      className={itemClasses}\n                      disabled={item.disabled}\n                      key={item.value}\n                      value={item.value}\n                    >\n                      <RadixSelect.ItemText>{item.label}</RadixSelect.ItemText>\n                      <RadixSelect.ItemIndicator className=\"text-accent-default\">\n                        <CheckmarkIcon />\n                      </RadixSelect.ItemIndicator>\n                    </RadixSelect.Item>\n                  )\n                )}\n              </RadixSelect.Viewport>\n            </RadixSelect.Content>\n          </RadixSelect.Portal>\n        </RadixSelect.Root>\n\n        {helperText ? (\n          <InputField.HelperText tone={helperTextTone}>\n            {helperText}\n          </InputField.HelperText>\n        ) : null}\n        {description ? (\n          <InputField.Description>{description}</InputField.Description>\n        ) : null}\n      </InputField.Root>\n    );\n  }\n);\n\nSelectInput.displayName = \"SelectInput\";\n"],"names":["CheckmarkIcon","_jsx","className","fill","focusable","viewBox","xmlns","children","d","ChevronDownIcon","ClearIcon","triggerClasses","cx","contentClasses","itemClasses","SelectInput","forwardRef","id","options","label","labelHidden","description","helperText","helperTextTone","state","prefix","suffix","actions","clearable","onClear","fieldClassName","controlClassName","placeholder","disabled","readOnly","required","value","valueProp","defaultValue","onChange","rest","ref","isControlled","undefined","uncontrolledValue","setUncontrolledValue","useState","currentValue","describedBy","useMemo","ids","push","join","showClearButton","Boolean","handleValueChange","nextValue","_jsxs","InputField","Root","Label","visuallyHidden","RadixSelect","onValueChange","Control","Prefix","Trigger","Value","Icon","Actions","onClick","event","stopPropagation","type","Suffix","Portal","Content","align","position","sideOffset","Viewport","map","item","isGroup","Group","option","Item","ItemText","ItemIndicator","HelperText","tone","Description","displayName"],"mappings":"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"}

package/dist/components/Tooltip/Tooltip.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"@radix-ui/react-tooltip";import{forwardRef as o,useContext as t,createContext as n,isValidElement as i,cloneElement as d}from"react";const l=n(!1),s=({children:a,delayDuration:o=400})=>e(l.Provider,{value:!0,children:e(r.Provider,{delayDuration:o,children:a})}),c=o(({children:o,content:n,open:s,defaultOpen:c,onOpenChange:m,delayDuration:p=400,side:u="top",align:h="center",className:f,...g},y)=>{const N=t(l),x=i(o)?(()=>{const e=o;return d(e,{className:[e.props?.className,f].filter(Boolean).join(" "),ref:y,...g})})():e("span",{className:f,ref:y,...g,children:o}),b=a(r.Root,{defaultOpen:c,onOpenChange:m,open:s,children:[e(r.Trigger,{asChild:!0,children:x}),a(r.Content,{align:h,className:"z-50 rounded-sm bg-gray-12/70 backdrop-blur-sm px-2 py-1 text-sm text-gray-contrast shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",side:u,children:[n,e(r.Arrow,{className:"fill-gray-12/70 backdrop-blur-sm"})]})]});return N?b:e(r.Provider,{delayDuration:p,children:b})});c.displayName="Tooltip";export{c as Tooltip,s as TooltipProvider};
+import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"@radix-ui/react-tooltip";import{forwardRef as t,useContext as o,createContext as n,isValidElement as l,cloneElement as i}from"react";const d=n(!1),s=({children:a,delayDuration:t=400})=>e(d.Provider,{value:!0,children:e(r.Provider,{delayDuration:t,children:a})}),c=t(({children:t,content:n,open:s,defaultOpen:c,onOpenChange:m,delayDuration:p=400,side:u="top",align:h="center",className:f,...g},y)=>{const N=o(d),x=l(t)?(()=>{const e=t;return i(e,{className:[e.props?.className,f].filter(Boolean).join(" "),ref:y,...g})})():e("span",{className:f,ref:y,...g,children:t}),b=a(r.Root,{defaultOpen:c,onOpenChange:m,open:s,children:[e(r.Trigger,{asChild:!0,children:x}),e(r.Portal,{"data-volt-portal":"",children:a(r.Content,{align:h,className:"z-50 rounded-sm bg-gray-12/70 backdrop-blur-sm px-2 py-1 text-sm text-gray-contrast shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",side:u,children:[n,e(r.Arrow,{className:"fill-gray-12/70 backdrop-blur-sm"})]})})]});return N?b:e(r.Provider,{delayDuration:p,children:b})});c.displayName="Tooltip";export{c as Tooltip,s as TooltipProvider};
 //# sourceMappingURL=Tooltip.js.map

package/dist/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as RadixTooltip from \"@radix-ui/react-tooltip\";\nimport { cloneElement, createContext, forwardRef, isValidElement, useContext } from \"react\";\nimport type { ReactNode } from \"react\";\n\nexport interface TooltipProps {\n  children: ReactNode;\n  content: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  delayDuration?: number;\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  align?: \"start\" | \"center\" | \"end\";\n  className?: string;\n}\n\n// Internal context to detect presence of a surrounding TooltipProvider\nconst TooltipPresenceContext = createContext<boolean>(false);\n\ntype TooltipProviderProps = {\n  children: ReactNode;\n  delayDuration?: number;\n};\n\nexport const TooltipProvider = ({\n  children,\n  delayDuration = 400,\n}: TooltipProviderProps) => {\n  return (\n    <TooltipPresenceContext.Provider value={true}>\n      <RadixTooltip.Provider delayDuration={delayDuration}>\n        {children}\n      </RadixTooltip.Provider>\n    </TooltipPresenceContext.Provider>\n  );\n};\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n  (\n    {\n      children,\n      content,\n      open,\n      defaultOpen,\n      onOpenChange,\n      delayDuration = 400,\n      side = \"top\",\n      align = \"center\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const isInsideProvider = useContext(TooltipPresenceContext);\n\n    const triggerChild = isValidElement(children)\n      ? (() => {\n        const childEl = children as React.ReactElement<{ className?: string } & React.RefAttributes<unknown>>\n\n        return cloneElement(childEl, {\n          className: [childEl.props?.className, className]\n            .filter(Boolean)\n            .join(\" \"),\n          ref: ref as unknown as never,\n          ...props,\n        })\n      })()\n      : (\n        <span className={className} ref={ref as unknown as never} {...props}>\n          {children}\n        </span>\n      );\n\n    const tooltipBody = (\n      <RadixTooltip.Root\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        open={open}\n      >\n        <RadixTooltip.Trigger asChild>{triggerChild}</RadixTooltip.Trigger>\n        <RadixTooltip.Content\n          align={align}\n          className=\"z-50 rounded-sm bg-gray-12/70 backdrop-blur-sm px-2 py-1 text-sm text-gray-contrast shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\"\n          side={side}\n        >\n          {content}\n          <RadixTooltip.Arrow className=\"fill-gray-12/70 backdrop-blur-sm\" />\n        </RadixTooltip.Content>\n      </RadixTooltip.Root>\n    );\n\n    if (isInsideProvider) {\n      return tooltipBody;\n    }\n\n    return (\n      <RadixTooltip.Provider delayDuration={delayDuration}>\n        {tooltipBody}\n      </RadixTooltip.Provider>\n    );\n  }\n);\n\nTooltip.displayName = \"Tooltip\";\n"],"names":["TooltipPresenceContext","createContext","TooltipProvider","children","delayDuration","_jsx","Provider","value","RadixTooltip","Tooltip","forwardRef","content","open","defaultOpen","onOpenChange","side","align","className","props","ref","isInsideProvider","useContext","triggerChild","isValidElement","childEl","cloneElement","filter","Boolean","join","tooltipBody","_jsxs","Root","Trigger","asChild","Content","Arrow","displayName"],"mappings":"wMAiBA,MAAMA,EAAyBC,GAAuB,GAOzCC,EAAkB,EAC7BC,WACAC,gBAAgB,OAGdC,EAACL,EAAuBM,SAAQ,CAACC,OAAO,EAAIJ,SAC1CE,EAACG,EAAaF,SAAQ,CAACF,cAAeA,WACnCD,MAMIM,EAAUC,EACrB,EAEIP,WACAQ,UACAC,OACAC,cACAC,eACAV,gBAAgB,IAChBW,OAAO,MACPC,QAAQ,SACRC,eACGC,GAELC,KAEA,MAAMC,EAAmBC,EAAWrB,GAE9BsB,EAAeC,EAAepB,GAChC,MACA,MAAMqB,EAAUrB,EAEhB,OAAOsB,EAAaD,EAAS,CAC3BP,UAAW,CAACO,EAAQN,OAAOD,UAAWA,GACnCS,OAAOC,SACPC,KAAK,KACRT,IAAKA,KACFD,GAEN,EAVC,GAYAb,EAAA,OAAA,CAAMY,UAAWA,EAAWE,IAAKA,KAA6BD,EAAKf,SAChEA,IAID0B,EACJC,EAACtB,EAAauB,KAAI,CAChBlB,YAAaA,EACbC,aAAcA,EACdF,KAAMA,EAAIT,SAAA,CAEVE,EAACG,EAAawB,QAAO,CAACC,SAAO,EAAA9B,SAAEmB,IAC/BQ,EAACtB,EAAa0B,QAAO,CACnBlB,MAAOA,EACPC,UAAU,+NACVF,KAAMA,EAAIZ,SAAA,CAETQ,EACDN,EAACG,EAAa2B,MAAK,CAAClB,UAAU,2CAKpC,OAAIG,EACKS,EAIPxB,EAACG,EAAaF,SAAQ,CAACF,cAAeA,EAAaD,SAChD0B,MAMTpB,EAAQ2B,YAAc"}
+{"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as RadixTooltip from \"@radix-ui/react-tooltip\";\nimport { cloneElement, createContext, forwardRef, isValidElement, useContext } from \"react\";\nimport type { ReactNode } from \"react\";\n\nexport interface TooltipProps {\n  children: ReactNode;\n  content: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  delayDuration?: number;\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  align?: \"start\" | \"center\" | \"end\";\n  className?: string;\n}\n\n// Internal context to detect presence of a surrounding TooltipProvider\nconst TooltipPresenceContext = createContext<boolean>(false);\n\ntype TooltipProviderProps = {\n  children: ReactNode;\n  delayDuration?: number;\n};\n\nexport const TooltipProvider = ({\n  children,\n  delayDuration = 400,\n}: TooltipProviderProps) => {\n  return (\n    <TooltipPresenceContext.Provider value={true}>\n      <RadixTooltip.Provider delayDuration={delayDuration}>\n        {children}\n      </RadixTooltip.Provider>\n    </TooltipPresenceContext.Provider>\n  );\n};\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n  (\n    {\n      children,\n      content,\n      open,\n      defaultOpen,\n      onOpenChange,\n      delayDuration = 400,\n      side = \"top\",\n      align = \"center\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const isInsideProvider = useContext(TooltipPresenceContext);\n\n    const triggerChild = isValidElement(children)\n      ? (() => {\n        const childEl = children as React.ReactElement<{ className?: string } & React.RefAttributes<unknown>>\n\n        return cloneElement(childEl, {\n          className: [childEl.props?.className, className]\n            .filter(Boolean)\n            .join(\" \"),\n          ref: ref as unknown as never,\n          ...props,\n        })\n      })()\n      : (\n        <span className={className} ref={ref as unknown as never} {...props}>\n          {children}\n        </span>\n      );\n\n    const tooltipBody = (\n      <RadixTooltip.Root\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        open={open}\n      >\n        <RadixTooltip.Trigger asChild>{triggerChild}</RadixTooltip.Trigger>\n        <RadixTooltip.Portal data-volt-portal=\"\">\n          <RadixTooltip.Content\n            align={align}\n            className=\"z-50 rounded-sm bg-gray-12/70 backdrop-blur-sm px-2 py-1 text-sm text-gray-contrast shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\"\n            side={side}\n          >\n            {content}\n            <RadixTooltip.Arrow className=\"fill-gray-12/70 backdrop-blur-sm\" />\n          </RadixTooltip.Content>\n        </RadixTooltip.Portal>\n      </RadixTooltip.Root>\n    );\n\n    if (isInsideProvider) {\n      return tooltipBody;\n    }\n\n    return (\n      <RadixTooltip.Provider delayDuration={delayDuration}>\n        {tooltipBody}\n      </RadixTooltip.Provider>\n    );\n  }\n);\n\nTooltip.displayName = \"Tooltip\";\n"],"names":["TooltipPresenceContext","createContext","TooltipProvider","children","delayDuration","_jsx","Provider","value","RadixTooltip","Tooltip","forwardRef","content","open","defaultOpen","onOpenChange","side","align","className","props","ref","isInsideProvider","useContext","triggerChild","isValidElement","childEl","cloneElement","filter","Boolean","join","tooltipBody","_jsxs","Root","Trigger","asChild","Portal","Content","Arrow","displayName"],"mappings":"wMAiBA,MAAMA,EAAyBC,GAAuB,GAOzCC,EAAkB,EAC7BC,WACAC,gBAAgB,OAGdC,EAACL,EAAuBM,SAAQ,CAACC,OAAO,EAAIJ,SAC1CE,EAACG,EAAaF,SAAQ,CAACF,cAAeA,WACnCD,MAMIM,EAAUC,EACrB,EAEIP,WACAQ,UACAC,OACAC,cACAC,eACAV,gBAAgB,IAChBW,OAAO,MACPC,QAAQ,SACRC,eACGC,GAELC,KAEA,MAAMC,EAAmBC,EAAWrB,GAE9BsB,EAAeC,EAAepB,GAChC,MACA,MAAMqB,EAAUrB,EAEhB,OAAOsB,EAAaD,EAAS,CAC3BP,UAAW,CAACO,EAAQN,OAAOD,UAAWA,GACnCS,OAAOC,SACPC,KAAK,KACRT,IAAKA,KACFD,GAEN,EAVC,GAYAb,EAAA,OAAA,CAAMY,UAAWA,EAAWE,IAAKA,KAA6BD,EAAKf,SAChEA,IAID0B,EACJC,EAACtB,EAAauB,KAAI,CAChBlB,YAAaA,EACbC,aAAcA,EACdF,KAAMA,EAAIT,SAAA,CAEVE,EAACG,EAAawB,QAAO,CAACC,SAAO,EAAA9B,SAAEmB,IAC/BjB,EAACG,EAAa0B,OAAM,CAAA,mBAAkB,GAAE/B,SACtC2B,EAACtB,EAAa2B,QAAO,CACnBnB,MAAOA,EACPC,UAAU,+NACVF,KAAMA,EAAIZ,SAAA,CAETQ,EACDN,EAACG,EAAa4B,MAAK,CAACnB,UAAU,6CAMtC,OAAIG,EACKS,EAIPxB,EAACG,EAAaF,SAAQ,CAACF,cAAeA,EAAaD,SAChD0B,MAMTpB,EAAQ4B,YAAc"}