@shipfox/react-ui 0.12.0 → 0.13.0

package/.turbo/turbo-build.log

@@ -1,12 +1,12 @@
  WARN  Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
 
-> @shipfox/react-ui@0.12.0 build /runner/_work/tooling/tooling/libs/react/ui
+> @shipfox/react-ui@0.13.0 build /runner/_work/tooling/tooling/libs/react/ui
 > swc && pnpm run build:css
 
-Successfully compiled: 132 files with swc (442.91ms)
+Successfully compiled: 136 files with swc (375.92ms)
  WARN  Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
 
-> @shipfox/react-ui@0.12.0 build:css /runner/_work/tooling/tooling/libs/react/ui
+> @shipfox/react-ui@0.13.0 build:css /runner/_work/tooling/tooling/libs/react/ui
 > vite build --config vite.css.config.ts && rm -f dist/css-entry.js dist/css-entry.js.map
 
 vite v7.2.7 building client environment for production...
@@ -14,6 +14,6 @@ transforming...
 ✓ 2 modules transformed.
 rendering chunks...
 computing gzip size...
-dist/styles.css    91.82 kB │ gzip: 14.49 kB
+dist/styles.css    92.31 kB │ gzip: 14.56 kB
 dist/css-entry.js   0.00 kB │ gzip:  0.02 kB
-✓ built in 616ms
+✓ built in 632ms

package/.turbo/turbo-check.log

@@ -1,6 +1,6 @@
  WARN  Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
 
-> @shipfox/react-ui@0.12.0 check /runner/_work/tooling/tooling/libs/react/ui
+> @shipfox/react-ui@0.13.0 check /runner/_work/tooling/tooling/libs/react/ui
 > biome-check --fix
 
-Checked 151 files in 277ms. No fixes applied.
+Checked 155 files in 283ms. No fixes applied.

package/.turbo/turbo-type.log

@@ -1,5 +1,5 @@
  WARN  Issue while reading "/runner/_work/tooling/tooling/.npmrc". Failed to replace env in config: ${NPM_ACCESS_TOKEN}
 
-> @shipfox/react-ui@0.12.0 type /runner/_work/tooling/tooling/libs/react/ui
+> @shipfox/react-ui@0.13.0 type /runner/_work/tooling/tooling/libs/react/ui
 > tsc-emit
 

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @shipfox/react-ui
 
+## 0.13.0
+
+### Minor Changes
+
+- 45a8a61: Add Tabs component
+
 ## 0.12.0
 
 ### Minor Changes

package/dist/components/badge/index.d.ts

@@ -1,5 +1,5 @@
-export { Badge, type BadgeProps, type BadgeVariant, badgeVariants } from './badge';
-export { IconBadge, type IconBadgeProps, type IconBadgeVariant } from './icon-badge';
-export { StatusBadge, type StatusBadgeProps } from './status-badge';
-export { UserBadge, type UserBadgeProps } from './user-badge';
+export * from './badge';
+export * from './icon-badge';
+export * from './status-badge';
+export * from './user-badge';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACjF,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,gBAAgB,EAAC,MAAM,cAAc,CAAC;AACnF,OAAO,EAAC,WAAW,EAAE,KAAK,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAC,MAAM,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/badge/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC"}

package/dist/components/badge/index.js

@@ -1,6 +1,6 @@
-export { Badge, badgeVariants } from './badge.js';
-export { IconBadge } from './icon-badge.js';
-export { StatusBadge } from './status-badge.js';
-export { UserBadge } from './user-badge.js';
+export * from './badge.js';
+export * from './icon-badge.js';
+export * from './status-badge.js';
+export * from './user-badge.js';
 
 //# sourceMappingURL=index.js.map

package/dist/components/badge/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/badge/index.ts"],"sourcesContent":["export {Badge, type BadgeProps, type BadgeVariant, badgeVariants} from './badge';\nexport {IconBadge, type IconBadgeProps, type IconBadgeVariant} from './icon-badge';\nexport {StatusBadge, type StatusBadgeProps} from './status-badge';\nexport {UserBadge, type UserBadgeProps} from './user-badge';\n"],"names":["Badge","badgeVariants","IconBadge","StatusBadge","UserBadge"],"mappings":"AAAA,SAAQA,KAAK,EAAsCC,aAAa,QAAO,UAAU;AACjF,SAAQC,SAAS,QAAmD,eAAe;AACnF,SAAQC,WAAW,QAA8B,iBAAiB;AAClE,SAAQC,SAAS,QAA4B,eAAe"}
+{"version":3,"sources":["../../../src/components/badge/index.ts"],"sourcesContent":["export * from './badge';\nexport * from './icon-badge';\nexport * from './status-badge';\nexport * from './user-badge';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,eAAe"}

package/dist/components/dropdown-menu/index.d.ts

@@ -1,3 +1,2 @@
-export type { DropdownMenuCheckboxItemProps, DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuLabelProps, DropdownMenuRadioItemProps, DropdownMenuShortcutProps, DropdownMenuSubTriggerProps, } from './dropdown-menu';
-export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, dropdownMenuContentVariants, dropdownMenuItemVariants, dropdownMenuLabelVariants, } from './dropdown-menu';
+export * from './dropdown-menu';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/dropdown-menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,6BAA6B,EAC7B,wBAAwB,EACxB,qBAAqB,EACrB,sBAAsB,EACtB,0BAA0B,EAC1B,yBAAyB,EACzB,2BAA2B,GAC5B,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,wBAAwB,EACxB,mBAAmB,EACnB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,mBAAmB,EACnB,2BAA2B,EAC3B,wBAAwB,EACxB,yBAAyB,GAC1B,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/components/dropdown-menu/index.js

@@ -1,3 +1,3 @@
-export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, dropdownMenuContentVariants, dropdownMenuItemVariants, dropdownMenuLabelVariants } from './dropdown-menu.js';
+export * from './dropdown-menu.js';
 
 //# sourceMappingURL=index.js.map

package/dist/components/dropdown-menu/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/dropdown-menu/index.ts"],"sourcesContent":["export type {\n  DropdownMenuCheckboxItemProps,\n  DropdownMenuContentProps,\n  DropdownMenuItemProps,\n  DropdownMenuLabelProps,\n  DropdownMenuRadioItemProps,\n  DropdownMenuShortcutProps,\n  DropdownMenuSubTriggerProps,\n} from './dropdown-menu';\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n  dropdownMenuContentVariants,\n  dropdownMenuItemVariants,\n  dropdownMenuLabelVariants,\n} from './dropdown-menu';\n"],"names":["DropdownMenu","DropdownMenuCheckboxItem","DropdownMenuContent","DropdownMenuGroup","DropdownMenuItem","DropdownMenuLabel","DropdownMenuPortal","DropdownMenuRadioGroup","DropdownMenuRadioItem","DropdownMenuSeparator","DropdownMenuShortcut","DropdownMenuSub","DropdownMenuSubContent","DropdownMenuSubTrigger","DropdownMenuTrigger","dropdownMenuContentVariants","dropdownMenuItemVariants","dropdownMenuLabelVariants"],"mappings":"AASA,SACEA,YAAY,EACZC,wBAAwB,EACxBC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,iBAAiB,EACjBC,kBAAkB,EAClBC,sBAAsB,EACtBC,qBAAqB,EACrBC,qBAAqB,EACrBC,oBAAoB,EACpBC,eAAe,EACfC,sBAAsB,EACtBC,sBAAsB,EACtBC,mBAAmB,EACnBC,2BAA2B,EAC3BC,wBAAwB,EACxBC,yBAAyB,QACpB,kBAAkB"}
+{"version":3,"sources":["../../../src/components/dropdown-menu/index.ts"],"sourcesContent":["export * from './dropdown-menu';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB"}

package/dist/components/index.d.ts

@@ -17,7 +17,9 @@ export * from './input';
 export * from './item';
 export * from './label';
 export * from './modal';
+export * from './moving-border';
 export * from './popover';
+export * from './tabs';
 export * from './textarea';
 export * from './theme';
 export * from './toast';

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC"}

package/dist/components/index.js

@@ -17,7 +17,9 @@ export * from './input/index.js';
 export * from './item/index.js';
 export * from './label/index.js';
 export * from './modal/index.js';
+export * from './moving-border/index.js';
 export * from './popover/index.js';
+export * from './tabs/index.js';
 export * from './textarea/index.js';
 export * from './theme/index.js';
 export * from './toast/index.js';

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './alert';\nexport * from './avatar';\nexport * from './badge';\nexport * from './button';\nexport * from './calendar';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './date-picker';\nexport * from './date-time-range-picker';\nexport * from './dot-grid';\nexport * from './dropdown-menu';\nexport * from './dynamic-item';\nexport * from './form';\nexport * from './icon';\nexport * from './inline-tips';\nexport * from './input';\nexport * from './item';\nexport * from './label';\nexport * from './modal';\nexport * from './popover';\nexport * from './textarea';\nexport * from './theme';\nexport * from './toast';\nexport * from './tooltip';\nexport * from './typography';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,2BAA2B;AACzC,cAAc,aAAa;AAC3B,cAAc,kBAAkB;AAChC,cAAc,iBAAiB;AAC/B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,eAAe"}
+{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './alert';\nexport * from './avatar';\nexport * from './badge';\nexport * from './button';\nexport * from './calendar';\nexport * from './checkbox';\nexport * from './code-block';\nexport * from './date-picker';\nexport * from './date-time-range-picker';\nexport * from './dot-grid';\nexport * from './dropdown-menu';\nexport * from './dynamic-item';\nexport * from './form';\nexport * from './icon';\nexport * from './inline-tips';\nexport * from './input';\nexport * from './item';\nexport * from './label';\nexport * from './modal';\nexport * from './moving-border';\nexport * from './popover';\nexport * from './tabs';\nexport * from './textarea';\nexport * from './theme';\nexport * from './toast';\nexport * from './tooltip';\nexport * from './typography';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,aAAa;AAC3B,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,2BAA2B;AACzC,cAAc,aAAa;AAC3B,cAAc,kBAAkB;AAChC,cAAc,iBAAiB;AAC/B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,eAAe"}

package/dist/components/modal/index.d.ts

@@ -1,3 +1,2 @@
-export type { ModalContentProps, ModalDescriptionProps, ModalHeaderProps, ModalOverlayProps, ModalTitleProps, } from './modal';
-export { Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, modalContentVariants, modalDefaultTransition, modalOverlayVariants, } from './modal';
+export * from './modal';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/modal/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,iBAAiB,EACjB,qBAAqB,EACrB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,GAChB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,KAAK,EACL,SAAS,EACT,UAAU,EACV,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,WAAW,EACX,YAAY,EACZ,WAAW,EACX,UAAU,EACV,YAAY,EACZ,oBAAoB,EACpB,sBAAsB,EACtB,oBAAoB,GACrB,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/modal/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/dist/components/modal/index.js

@@ -1,3 +1,3 @@
-export { Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, modalContentVariants, modalDefaultTransition, modalOverlayVariants } from './modal.js';
+export * from './modal.js';
 
 //# sourceMappingURL=index.js.map

package/dist/components/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/modal/index.ts"],"sourcesContent":["export type {\n  ModalContentProps,\n  ModalDescriptionProps,\n  ModalHeaderProps,\n  ModalOverlayProps,\n  ModalTitleProps,\n} from './modal';\nexport {\n  Modal,\n  ModalBody,\n  ModalClose,\n  ModalContent,\n  ModalDescription,\n  ModalFooter,\n  ModalHeader,\n  ModalOverlay,\n  ModalPortal,\n  ModalTitle,\n  ModalTrigger,\n  modalContentVariants,\n  modalDefaultTransition,\n  modalOverlayVariants,\n} from './modal';\n"],"names":["Modal","ModalBody","ModalClose","ModalContent","ModalDescription","ModalFooter","ModalHeader","ModalOverlay","ModalPortal","ModalTitle","ModalTrigger","modalContentVariants","modalDefaultTransition","modalOverlayVariants"],"mappings":"AAOA,SACEA,KAAK,EACLC,SAAS,EACTC,UAAU,EACVC,YAAY,EACZC,gBAAgB,EAChBC,WAAW,EACXC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,UAAU,EACVC,YAAY,EACZC,oBAAoB,EACpBC,sBAAsB,EACtBC,oBAAoB,QACf,UAAU"}
+{"version":3,"sources":["../../../src/components/modal/index.ts"],"sourcesContent":["export * from './modal';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU"}

package/dist/components/modal/modal.d.ts

@@ -18,8 +18,9 @@ declare function ModalOverlay({ className, animated, transition, ...props }: Mod
 type ModalContentProps = ComponentProps<typeof DialogPrimitive.Content> & {
     animated?: boolean;
     transition?: Transition;
+    overlayClassName?: string;
 };
-declare function ModalContent({ className, children, animated, transition, ...props }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
+declare function ModalContent({ className, children, animated, transition, overlayClassName, ...props }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
 type ModalHeaderProps = ComponentProps<'div'> & {
     title?: string;
     showEscIndicator?: boolean;

package/dist/components/modal/modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAK1D,OAAO,EAAS,KAAK,UAAU,EAAC,MAAM,eAAe,CAAC;AAEtD,OAAO,EAAC,KAAK,cAAc,EAA4B,MAAM,OAAO,CAAC;AAIrE,QAAA,MAAM,sBAAsB,EAAE,UAI7B,CAAC;AAiBF,QAAA,MAAM,oBAAoB,oFAEzB,CAAC;AAEF,QAAA,MAAM,oBAAoB,oFAEzB,CAAC;AAEF,iBAAS,KAAK,CAAC,EACb,UAAiC,EACjC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAC,2CAerE;AAED,iBAAS,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAQ1E;AAED,iBAAS,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAQxE;AAED,iBAAS,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQtE;AAED,KAAK,iBAAiB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAe,EACf,UAAmC,EACnC,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAqBnB;AAED,KAAK,iBAAiB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,QAAe,EACf,UAAmC,EACnC,GAAG,KAAK,EACT,EAAE,iBAAiB,2CAuCnB;AAED,KAAK,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,KAAK,EACL,gBAAuB,EACvB,SAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,gBAAgB,2CAmClB;AAED,iBAAS,SAAS,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,cAAc,CAAC,KAAK,CAAC,2CAexE;AAED,iBAAS,WAAW,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,cAAc,CAAC,KAAK,CAAC,2CAS1E;AAED,KAAK,eAAe,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,CAAC;AAEpE,iBAAS,UAAU,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,eAAe,2CAazD;AAED,KAAK,qBAAqB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,CAAC;AAEhF,iBAAS,gBAAgB,CAAC,EAAC,SAAS,EAAE,GAAG,KAAK,EAAC,EAAE,qBAAqB,2CAUrE;AAED,OAAO,EACL,KAAK,EACL,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,SAAS,EACT,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,oBAAoB,EACpB,oBAAoB,EACpB,sBAAsB,GACvB,CAAC;AAEF,YAAY,EACV,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,qBAAqB,GACtB,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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"}

package/dist/components/modal/modal.js

@@ -104,14 +104,15 @@ function ModalOverlay({ className, animated = true, transition = modalDefaultTra
         ...props
     });
 }
-function ModalContent({ className, children, animated = true, transition = modalDefaultTransition, ...props }) {
+function ModalContent({ className, children, animated = true, transition = modalDefaultTransition, overlayClassName, ...props }) {
     const { isDesktop } = useModalContext();
     if (!isDesktop) {
         return /*#__PURE__*/ _jsxs(ModalPortal, {
             children: [
                 /*#__PURE__*/ _jsx(ModalOverlay, {
                     animated: animated,
-                    transition: transition
+                    transition: transition,
+                    className: overlayClassName
                 }),
                 /*#__PURE__*/ _jsx(VaulDrawer.Content, {
                     className: cn('fixed bottom-0 left-0 right-0 z-50 flex flex-col bg-background-neutral-base rounded-t-16 max-h-[85vh] shadow-tooltip', className),
@@ -140,7 +141,8 @@ function ModalContent({ className, children, animated = true, transition = modal
         children: [
             /*#__PURE__*/ _jsx(ModalOverlay, {
                 animated: animated,
-                transition: transition
+                transition: transition,
+                className: overlayClassName
             }),
             /*#__PURE__*/ _jsx(DialogPrimitive.Content, {
                 className: baseClasses,

package/dist/components/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/modal/modal.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {cva} from 'class-variance-authority';\nimport {Button} from 'components/button';\nimport {Icon} from 'components/icon';\nimport {Text} from 'components/typography';\nimport {motion, type Transition} from 'framer-motion';\nimport {useMediaQuery} from 'hooks/useMediaQuery';\nimport {type ComponentProps, createContext, useContext} from 'react';\nimport {cn} from 'utils/cn';\nimport {Drawer as VaulDrawer} from 'vaul';\n\nconst modalDefaultTransition: Transition = {\n  type: 'spring',\n  stiffness: 300,\n  damping: 30,\n};\n\ntype ModalContextValue = {\n  breakpoint: string;\n  isDesktop: boolean;\n};\n\nconst ModalContext = createContext<ModalContextValue | null>(null);\n\nfunction useModalContext() {\n  const context = useContext(ModalContext);\n  if (!context) {\n    throw new Error('Modal components must be used within a Modal component');\n  }\n  return context;\n}\n\nconst modalOverlayVariants = cva(\n  'fixed inset-0 z-40 bg-background-backdrop-backdrop data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n);\n\nconst modalContentVariants = cva(\n  'fixed left-1/2 top-1/2 z-50 flex flex-col overflow-clip bg-background-neutral-base rounded-16 w-full max-w-[576px] -translate-x-1/2 -translate-y-1/2 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 shadow-tooltip',\n);\n\nfunction Modal({\n  breakpoint = '(min-width: 768px)',\n  children,\n  ...props\n}: ComponentProps<typeof DialogPrimitive.Root> & {breakpoint?: string}) {\n  const isDesktop = useMediaQuery(breakpoint);\n\n  const contextValue: ModalContextValue = {\n    breakpoint,\n    isDesktop,\n  };\n\n  const Root = isDesktop ? DialogPrimitive.Root : VaulDrawer.Root;\n\n  return (\n    <ModalContext.Provider value={contextValue}>\n      <Root {...props}>{children}</Root>\n    </ModalContext.Provider>\n  );\n}\n\nfunction ModalTrigger(props: ComponentProps<typeof DialogPrimitive.Trigger>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Trigger {...props} />;\n  }\n\n  return <VaulDrawer.Trigger {...props} />;\n}\n\nfunction ModalPortal(props: ComponentProps<typeof DialogPrimitive.Portal>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Portal {...props} />;\n  }\n\n  return <VaulDrawer.Portal {...props} />;\n}\n\nfunction ModalClose(props: ComponentProps<typeof DialogPrimitive.Close>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Close {...props} />;\n  }\n\n  return <VaulDrawer.Close {...props} />;\n}\n\ntype ModalOverlayProps = ComponentProps<typeof DialogPrimitive.Overlay> & {\n  animated?: boolean;\n  transition?: Transition;\n};\n\nfunction ModalOverlay({\n  className,\n  animated = true,\n  transition = modalDefaultTransition,\n  ...props\n}: ModalOverlayProps) {\n  const {isDesktop} = useModalContext();\n\n  if (!isDesktop) {\n    return <VaulDrawer.Overlay className={cn(modalOverlayVariants(), className)} {...props} />;\n  }\n\n  if (animated) {\n    return (\n      <DialogPrimitive.Overlay className={cn(modalOverlayVariants(), className)} asChild {...props}>\n        <motion.div\n          initial={{opacity: 0}}\n          animate={{opacity: 1}}\n          exit={{opacity: 0}}\n          transition={transition}\n        />\n      </DialogPrimitive.Overlay>\n    );\n  }\n\n  return <DialogPrimitive.Overlay className={cn(modalOverlayVariants(), className)} {...props} />;\n}\n\ntype ModalContentProps = ComponentProps<typeof DialogPrimitive.Content> & {\n  animated?: boolean;\n  transition?: Transition;\n};\n\nfunction ModalContent({\n  className,\n  children,\n  animated = true,\n  transition = modalDefaultTransition,\n  ...props\n}: ModalContentProps) {\n  const {isDesktop} = useModalContext();\n\n  if (!isDesktop) {\n    return (\n      <ModalPortal>\n        <ModalOverlay animated={animated} transition={transition} />\n        <VaulDrawer.Content\n          className={cn(\n            'fixed bottom-0 left-0 right-0 z-50 flex flex-col bg-background-neutral-base rounded-t-16 max-h-[85vh] shadow-tooltip',\n            className,\n          )}\n          {...props}\n        >\n          <div className=\"relative w-full h-full flex flex-col min-h-0\">\n            <div className=\"pointer-events-none absolute inset-0 shadow-separator-inset rounded-t-16\" />\n            <div className=\"flex items-center justify-center pt-8 pb-8 shrink-0\">\n              <div className=\"bg-foreground-neutral-subtle w-32 h-4 rounded-full opacity-40\" />\n            </div>\n            {children}\n          </div>\n        </VaulDrawer.Content>\n      </ModalPortal>\n    );\n  }\n\n  const baseClasses = cn(modalContentVariants(), className);\n\n  return (\n    <ModalPortal>\n      <ModalOverlay animated={animated} transition={transition} />\n      <DialogPrimitive.Content className={baseClasses} {...props}>\n        <div className=\"relative size-full\">\n          <div className=\"pointer-events-none absolute inset-0 shadow-separator-inset rounded-16\" />\n          {children}\n        </div>\n      </DialogPrimitive.Content>\n    </ModalPortal>\n  );\n}\n\ntype ModalHeaderProps = ComponentProps<'div'> & {\n  title?: string;\n  showEscIndicator?: boolean;\n  showClose?: boolean;\n};\n\nfunction ModalHeader({\n  className,\n  title,\n  showEscIndicator = true,\n  showClose = true,\n  children,\n  ...props\n}: ModalHeaderProps) {\n  const {isDesktop} = useModalContext();\n\n  return (\n    <div className=\"flex flex-col w-full shrink-0\" {...props}>\n      <div className=\"bg-background-neutral-base flex items-center justify-center gap-20 overflow-clip px-24 py-16 w-full\">\n        {title ? (\n          <Text size=\"lg\" className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\">\n            {title}\n          </Text>\n        ) : (\n          <div className=\"flex-1\">{children}</div>\n        )}\n        <div className=\"flex items-center gap-8\">\n          {isDesktop && showEscIndicator && (\n            <kbd className=\"flex items-center justify-center rounded-8 border border-border-neutral-base shadow-button-neutral bg-background-field-base text-xs text-foreground-neutral-subtle px-4\">\n              esc\n            </kbd>\n          )}\n          {showClose && (\n            <ModalClose asChild>\n              <Button\n                variant=\"transparent\"\n                size=\"xs\"\n                className=\"rounded-4 p-2 cursor-pointer bg-transparent border-none text-foreground-neutral-muted hover:text-foreground-neutral-base hover:bg-background-components-hover transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-background-accent-blue-base focus-visible:ring-offset-2 w-24 h-24\"\n              >\n                <Icon name=\"close\" />\n              </Button>\n            </ModalClose>\n          )}\n        </div>\n      </div>\n      <div className=\"bg-border-neutral-strong h-[1px] w-full\" />\n    </div>\n  );\n}\n\nfunction ModalBody({className, children, ...props}: ComponentProps<'div'>) {\n  const {isDesktop} = useModalContext();\n\n  return (\n    <div\n      className={cn(\n        'bg-background-neutral-base flex flex-col items-start px-24 pb-24 pt-16 w-full',\n        isDesktop ? 'overflow-clip' : 'overflow-y-auto overflow-x-clip flex-1',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction ModalFooter({className, children, ...props}: ComponentProps<'div'>) {\n  return (\n    <div className=\"flex flex-col w-full shrink-0\" {...props}>\n      <div className=\"bg-border-neutral-strong h-[1px] w-full\" />\n      <div className=\"bg-background-neutral-base flex items-end justify-end gap-20 overflow-clip px-24 py-16 w-full\">\n        <div className={cn('flex items-center gap-16', className)}>{children}</div>\n      </div>\n    </div>\n  );\n}\n\ntype ModalTitleProps = ComponentProps<typeof DialogPrimitive.Title>;\n\nfunction ModalTitle({className, ...props}: ModalTitleProps) {\n  const {isDesktop} = useModalContext();\n\n  const titleClassName = cn(\n    'font-medium text-lg leading-20 overflow-ellipsis overflow-hidden text-foreground-neutral-base',\n    className,\n  );\n\n  if (!isDesktop) {\n    return <VaulDrawer.Title className={titleClassName} {...props} />;\n  }\n\n  return <DialogPrimitive.Title className={titleClassName} {...props} />;\n}\n\ntype ModalDescriptionProps = ComponentProps<typeof DialogPrimitive.Description>;\n\nfunction ModalDescription({className, ...props}: ModalDescriptionProps) {\n  const {isDesktop} = useModalContext();\n\n  const descClassName = cn('text-sm leading-20 text-foreground-neutral-subtle', className);\n\n  if (!isDesktop) {\n    return <VaulDrawer.Description className={descClassName} {...props} />;\n  }\n\n  return <DialogPrimitive.Description className={descClassName} {...props} />;\n}\n\nexport {\n  Modal,\n  ModalPortal,\n  ModalOverlay,\n  ModalTrigger,\n  ModalClose,\n  ModalContent,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n  ModalTitle,\n  ModalDescription,\n  modalContentVariants,\n  modalOverlayVariants,\n  modalDefaultTransition,\n};\n\nexport type {\n  ModalContentProps,\n  ModalHeaderProps,\n  ModalOverlayProps,\n  ModalTitleProps,\n  ModalDescriptionProps,\n};\n"],"names":["DialogPrimitive","cva","Button","Icon","Text","motion","useMediaQuery","createContext","useContext","cn","Drawer","VaulDrawer","modalDefaultTransition","type","stiffness","damping","ModalContext","useModalContext","context","Error","modalOverlayVariants","modalContentVariants","Modal","breakpoint","children","props","isDesktop","contextValue","Root","Provider","value","ModalTrigger","Trigger","ModalPortal","Portal","ModalClose","Close","ModalOverlay","className","animated","transition","Overlay","asChild","div","initial","opacity","animate","exit","ModalContent","Content","baseClasses","ModalHeader","title","showEscIndicator","showClose","size","kbd","variant","name","ModalBody","ModalFooter","ModalTitle","titleClassName","Title","ModalDescription","descClassName","Description"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/modal/modal.tsx"],"sourcesContent":["import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {cva} from 'class-variance-authority';\nimport {Button} from 'components/button';\nimport {Icon} from 'components/icon';\nimport {Text} from 'components/typography';\nimport {motion, type Transition} from 'framer-motion';\nimport {useMediaQuery} from 'hooks/useMediaQuery';\nimport {type ComponentProps, createContext, useContext} from 'react';\nimport {cn} from 'utils/cn';\nimport {Drawer as VaulDrawer} from 'vaul';\n\nconst modalDefaultTransition: Transition = {\n  type: 'spring',\n  stiffness: 300,\n  damping: 30,\n};\n\ntype ModalContextValue = {\n  breakpoint: string;\n  isDesktop: boolean;\n};\n\nconst ModalContext = createContext<ModalContextValue | null>(null);\n\nfunction useModalContext() {\n  const context = useContext(ModalContext);\n  if (!context) {\n    throw new Error('Modal components must be used within a Modal component');\n  }\n  return context;\n}\n\nconst modalOverlayVariants = cva(\n  'fixed inset-0 z-40 bg-background-backdrop-backdrop data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n);\n\nconst modalContentVariants = cva(\n  'fixed left-1/2 top-1/2 z-50 flex flex-col overflow-clip bg-background-neutral-base rounded-16 w-full max-w-[576px] -translate-x-1/2 -translate-y-1/2 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 shadow-tooltip',\n);\n\nfunction Modal({\n  breakpoint = '(min-width: 768px)',\n  children,\n  ...props\n}: ComponentProps<typeof DialogPrimitive.Root> & {breakpoint?: string}) {\n  const isDesktop = useMediaQuery(breakpoint);\n\n  const contextValue: ModalContextValue = {\n    breakpoint,\n    isDesktop,\n  };\n\n  const Root = isDesktop ? DialogPrimitive.Root : VaulDrawer.Root;\n\n  return (\n    <ModalContext.Provider value={contextValue}>\n      <Root {...props}>{children}</Root>\n    </ModalContext.Provider>\n  );\n}\n\nfunction ModalTrigger(props: ComponentProps<typeof DialogPrimitive.Trigger>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Trigger {...props} />;\n  }\n\n  return <VaulDrawer.Trigger {...props} />;\n}\n\nfunction ModalPortal(props: ComponentProps<typeof DialogPrimitive.Portal>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Portal {...props} />;\n  }\n\n  return <VaulDrawer.Portal {...props} />;\n}\n\nfunction ModalClose(props: ComponentProps<typeof DialogPrimitive.Close>) {\n  const {isDesktop} = useModalContext();\n\n  if (isDesktop) {\n    return <DialogPrimitive.Close {...props} />;\n  }\n\n  return <VaulDrawer.Close {...props} />;\n}\n\ntype ModalOverlayProps = ComponentProps<typeof DialogPrimitive.Overlay> & {\n  animated?: boolean;\n  transition?: Transition;\n};\n\nfunction ModalOverlay({\n  className,\n  animated = true,\n  transition = modalDefaultTransition,\n  ...props\n}: ModalOverlayProps) {\n  const {isDesktop} = useModalContext();\n\n  if (!isDesktop) {\n    return <VaulDrawer.Overlay className={cn(modalOverlayVariants(), className)} {...props} />;\n  }\n\n  if (animated) {\n    return (\n      <DialogPrimitive.Overlay className={cn(modalOverlayVariants(), className)} asChild {...props}>\n        <motion.div\n          initial={{opacity: 0}}\n          animate={{opacity: 1}}\n          exit={{opacity: 0}}\n          transition={transition}\n        />\n      </DialogPrimitive.Overlay>\n    );\n  }\n\n  return <DialogPrimitive.Overlay className={cn(modalOverlayVariants(), className)} {...props} />;\n}\n\ntype ModalContentProps = ComponentProps<typeof DialogPrimitive.Content> & {\n  animated?: boolean;\n  transition?: Transition;\n  overlayClassName?: string;\n};\n\nfunction ModalContent({\n  className,\n  children,\n  animated = true,\n  transition = modalDefaultTransition,\n  overlayClassName,\n  ...props\n}: ModalContentProps) {\n  const {isDesktop} = useModalContext();\n\n  if (!isDesktop) {\n    return (\n      <ModalPortal>\n        <ModalOverlay animated={animated} transition={transition} className={overlayClassName} />\n        <VaulDrawer.Content\n          className={cn(\n            'fixed bottom-0 left-0 right-0 z-50 flex flex-col bg-background-neutral-base rounded-t-16 max-h-[85vh] shadow-tooltip',\n            className,\n          )}\n          {...props}\n        >\n          <div className=\"relative w-full h-full flex flex-col min-h-0\">\n            <div className=\"pointer-events-none absolute inset-0 shadow-separator-inset rounded-t-16\" />\n            <div className=\"flex items-center justify-center pt-8 pb-8 shrink-0\">\n              <div className=\"bg-foreground-neutral-subtle w-32 h-4 rounded-full opacity-40\" />\n            </div>\n            {children}\n          </div>\n        </VaulDrawer.Content>\n      </ModalPortal>\n    );\n  }\n\n  const baseClasses = cn(modalContentVariants(), className);\n\n  return (\n    <ModalPortal>\n      <ModalOverlay animated={animated} transition={transition} className={overlayClassName} />\n      <DialogPrimitive.Content className={baseClasses} {...props}>\n        <div className=\"relative size-full\">\n          <div className=\"pointer-events-none absolute inset-0 shadow-separator-inset rounded-16\" />\n          {children}\n        </div>\n      </DialogPrimitive.Content>\n    </ModalPortal>\n  );\n}\n\ntype ModalHeaderProps = ComponentProps<'div'> & {\n  title?: string;\n  showEscIndicator?: boolean;\n  showClose?: boolean;\n};\n\nfunction ModalHeader({\n  className,\n  title,\n  showEscIndicator = true,\n  showClose = true,\n  children,\n  ...props\n}: ModalHeaderProps) {\n  const {isDesktop} = useModalContext();\n\n  return (\n    <div className=\"flex flex-col w-full shrink-0\" {...props}>\n      <div className=\"bg-background-neutral-base flex items-center justify-center gap-20 overflow-clip px-24 py-16 w-full\">\n        {title ? (\n          <Text size=\"lg\" className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\">\n            {title}\n          </Text>\n        ) : (\n          <div className=\"flex-1\">{children}</div>\n        )}\n        <div className=\"flex items-center gap-8\">\n          {isDesktop && showEscIndicator && (\n            <kbd className=\"flex items-center justify-center rounded-8 border border-border-neutral-base shadow-button-neutral bg-background-field-base text-xs text-foreground-neutral-subtle px-4\">\n              esc\n            </kbd>\n          )}\n          {showClose && (\n            <ModalClose asChild>\n              <Button\n                variant=\"transparent\"\n                size=\"xs\"\n                className=\"rounded-4 p-2 cursor-pointer bg-transparent border-none text-foreground-neutral-muted hover:text-foreground-neutral-base hover:bg-background-components-hover transition-colors duration-150 outline-none focus-visible:ring-2 focus-visible:ring-background-accent-blue-base focus-visible:ring-offset-2 w-24 h-24\"\n              >\n                <Icon name=\"close\" />\n              </Button>\n            </ModalClose>\n          )}\n        </div>\n      </div>\n      <div className=\"bg-border-neutral-strong h-[1px] w-full\" />\n    </div>\n  );\n}\n\nfunction ModalBody({className, children, ...props}: ComponentProps<'div'>) {\n  const {isDesktop} = useModalContext();\n\n  return (\n    <div\n      className={cn(\n        'bg-background-neutral-base flex flex-col items-start px-24 pb-24 pt-16 w-full',\n        isDesktop ? 'overflow-clip' : 'overflow-y-auto overflow-x-clip flex-1',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction ModalFooter({className, children, ...props}: ComponentProps<'div'>) {\n  return (\n    <div className=\"flex flex-col w-full shrink-0\" {...props}>\n      <div className=\"bg-border-neutral-strong h-[1px] w-full\" />\n      <div className=\"bg-background-neutral-base flex items-end justify-end gap-20 overflow-clip px-24 py-16 w-full\">\n        <div className={cn('flex items-center gap-16', className)}>{children}</div>\n      </div>\n    </div>\n  );\n}\n\ntype ModalTitleProps = ComponentProps<typeof DialogPrimitive.Title>;\n\nfunction ModalTitle({className, ...props}: ModalTitleProps) {\n  const {isDesktop} = useModalContext();\n\n  const titleClassName = cn(\n    'font-medium text-lg leading-20 overflow-ellipsis overflow-hidden text-foreground-neutral-base',\n    className,\n  );\n\n  if (!isDesktop) {\n    return <VaulDrawer.Title className={titleClassName} {...props} />;\n  }\n\n  return <DialogPrimitive.Title className={titleClassName} {...props} />;\n}\n\ntype ModalDescriptionProps = ComponentProps<typeof DialogPrimitive.Description>;\n\nfunction ModalDescription({className, ...props}: ModalDescriptionProps) {\n  const {isDesktop} = useModalContext();\n\n  const descClassName = cn('text-sm leading-20 text-foreground-neutral-subtle', className);\n\n  if (!isDesktop) {\n    return <VaulDrawer.Description className={descClassName} {...props} />;\n  }\n\n  return <DialogPrimitive.Description className={descClassName} {...props} />;\n}\n\nexport {\n  Modal,\n  ModalPortal,\n  ModalOverlay,\n  ModalTrigger,\n  ModalClose,\n  ModalContent,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n  ModalTitle,\n  ModalDescription,\n  modalContentVariants,\n  modalOverlayVariants,\n  modalDefaultTransition,\n};\n\nexport type {\n  ModalContentProps,\n  ModalHeaderProps,\n  ModalOverlayProps,\n  ModalTitleProps,\n  ModalDescriptionProps,\n};\n"],"names":["DialogPrimitive","cva","Button","Icon","Text","motion","useMediaQuery","createContext","useContext","cn","Drawer","VaulDrawer","modalDefaultTransition","type","stiffness","damping","ModalContext","useModalContext","context","Error","modalOverlayVariants","modalContentVariants","Modal","breakpoint","children","props","isDesktop","contextValue","Root","Provider","value","ModalTrigger","Trigger","ModalPortal","Portal","ModalClose","Close","ModalOverlay","className","animated","transition","Overlay","asChild","div","initial","opacity","animate","exit","ModalContent","overlayClassName","Content","baseClasses","ModalHeader","title","showEscIndicator","showClose","size","kbd","variant","name","ModalBody","ModalFooter","ModalTitle","titleClassName","Title","ModalDescription","descClassName","Description"],"mappings":"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"}

package/dist/components/modal/modal.stories.js

@@ -139,6 +139,7 @@ export const ImportForm = {
                     }),
                     /*#__PURE__*/ _jsxs(ModalContent, {
                         "aria-describedby": undefined,
+                        overlayClassName: "bg-background-modal-overlay",
                         children: [
                             /*#__PURE__*/ _jsx(ModalTitle, {
                                 className: "sr-only",
@@ -263,6 +264,7 @@ export const GithubActions = {
                     }),
                     /*#__PURE__*/ _jsxs(ModalContent, {
                         "aria-describedby": undefined,
+                        overlayClassName: "bg-background-modal-overlay",
                         children: [
                             /*#__PURE__*/ _jsx(ModalTitle, {
                                 className: "sr-only",

package/dist/components/modal/modal.stories.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/modal/modal.stories.tsx"],"sourcesContent":["import {argosScreenshot} from '@argos-ci/storybook/vitest';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {screen, within} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {Button, ButtonLink} from 'components/button';\nimport {\n  CodeBlock,\n  CodeBlockBody,\n  CodeBlockContent,\n  CodeBlockCopyButton,\n  CodeBlockFilename,\n  CodeBlockFiles,\n  CodeBlockFooter,\n  CodeBlockHeader,\n  CodeBlockItem,\n} from 'components/code-block';\nimport {DatePicker} from 'components/date-picker';\nimport {DynamicItem} from 'components/dynamic-item';\nimport {Icon} from 'components/icon';\nimport {Input} from 'components/input';\nimport {ItemTitle} from 'components/item';\nimport {Label} from 'components/label';\nimport {MovingBorder} from 'components/moving-border';\nimport {Text} from 'components/typography';\nimport {useState} from 'react';\nimport {cn} from 'utils/cn';\nimport illustration2 from '../../assets/illustration-2.svg';\nimport illustrationBg from '../../assets/illustration-gradient.svg';\nimport {\n  Modal,\n  ModalBody,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalTitle,\n  ModalTrigger,\n} from './modal';\n\nconst OPEN_MODAL_REGEX = /open modal/i;\nconst IMPORT_JOBS_REGEX = /import past jobs from github/i;\nconst GITHUB_ACTIONS_REGEX = /run github actions on shipfox/i;\n\nconst DEFAULT_START_DATE = new Date('2025-12-06T00:00:00.000Z');\n\nconst meta = {\n  title: 'Components/Modal',\n  component: Modal,\n  tags: ['autodocs'],\n  parameters: {\n    layout: 'centered',\n  },\n} satisfies Meta<typeof Modal>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: OPEN_MODAL_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Default Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Open Modal</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Modal Title</ModalTitle>\n            <ModalHeader>\n              <Text\n                size=\"lg\"\n                className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\"\n              >\n                Modal Title\n              </Text>\n            </ModalHeader>\n            <ModalBody>\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                This modal automatically adapts between dialog (desktop) and drawer (mobile) based\n                on screen size. Try resizing your browser window!\n              </Text>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Confirm\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nexport const ImportForm: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: IMPORT_JOBS_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Import Form Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n    const [date, setDate] = useState<Date | undefined>(DEFAULT_START_DATE);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Import past jobs from GitHub</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Import past jobs from GitHub</ModalTitle>\n            <ModalHeader title=\"Import past jobs from GitHub\" />\n            <ModalBody className=\"gap-20\">\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                Backfill your CI history by importing past runs from your GitHub repo. We&apos;ll\n                handle the rest by creating a background task to import the data for you.\n              </Text>\n              <div className=\"flex flex-col gap-20 w-full\">\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label>Repository owner</Label>\n                  <Input placeholder=\"apache\" />\n                </div>\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label>Repository name</Label>\n                  <Input placeholder=\"kafka\" />\n                </div>\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label htmlFor=\"start-date\">Start date</Label>\n                  <DatePicker\n                    id=\"start-date\"\n                    date={date}\n                    onDateSelect={setDate}\n                    onClear={() => setDate(undefined)}\n                    placeholder=\"DD/MM/YYYY\"\n                  />\n                </div>\n              </div>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Import\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nconst diffCode = `jobs:\n  build:\n-   runs-on: ubuntu-latest\n+   runs-on: shipfox-2vcpu-ubuntu-2404`;\n\nexport const GithubActions: Story = {\n  parameters: {\n    viewport: {\n      defaultViewport: 'large',\n    },\n  },\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: GITHUB_ACTIONS_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Github Actions Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[50vh] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Run GitHub Actions on Shipfox</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Run GitHub Actions on Shipfox</ModalTitle>\n            <ModalHeader title=\"Run GitHub Actions on Shipfox\" />\n            <ModalBody className=\"gap-32\">\n              <div className=\"flex flex-col gap-20 w-full\">\n                <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                  This will run your jobs on Shipfox&apos;s optimized infrastructure. Giving you\n                  faster builds, and dedicated resources.\n                </Text>\n                <div className=\"relative\">\n                  <img\n                    src={illustration2}\n                    alt=\"illustration-2\"\n                    className=\"hidden sm:block absolute overflow-clip right-2 top-1/2 -translate-y-1/2 translate-x-8 w-fit object-contain z-50\"\n                  />\n                  <div className={cn('relative overflow-hidden bg-transparent p-1 rounded-8')}>\n                    <div className=\"absolute inset-0\" style={{borderRadius: 'calc(0.5rem * 0.96)'}}>\n                      <MovingBorder duration={6000} rx=\"30%\" ry=\"30%\">\n                        <div className=\"h-100 w-200 bg-[radial-gradient(#ff9e7a_40%,transparent_60%)]\" />\n                      </MovingBorder>\n                    </div>\n                    <div\n                      className=\"relative\"\n                      style={{\n                        borderRadius: 'calc(0.5rem * 0.96)',\n                      }}\n                    >\n                      <DynamicItem\n                        variant=\"default\"\n                        title={\n                          <div className=\"flex items-center gap-6\">\n                            <span className=\"flex shrink-0 items-center justify-center text-tag-success-icon w-16 h-16\">\n                              <Icon\n                                name=\"money\"\n                                size=\"sm\"\n                                color=\"var(--foreground-neutral-subtle, #a1a1aa)\"\n                              />\n                            </span>\n                            <ItemTitle>6000 free credits/month to run your jobs</ItemTitle>\n                          </div>\n                        }\n                        description=\"~500 builds/month. No payment required.\"\n                        rightElement={\n                          <img\n                            src={illustrationBg}\n                            alt=\"illustration-bg\"\n                            className=\"hidden sm:block absolute overflow-clip right-4 w-fit object-contain scale-105\"\n                          />\n                        }\n                      />\n                    </div>\n                  </div>\n                </div>\n              </div>\n              <div className=\"flex flex-col gap-20 w-full\">\n                <div className=\"flex flex-col gap-6\">\n                  <div className=\"flex items-center justify-center w-full\">\n                    <Text className=\"flex-1 font-semibold text-foreground-neutral-base overflow-ellipsis overflow-hidden whitespace-nowrap\">\n                      Update your GitHub Actions workflow\n                    </Text>\n                    <ButtonLink variant=\"base\" size=\"sm\" href=\"#\" iconRight=\"bookOpen\">\n                      See docs\n                    </ButtonLink>\n                  </div>\n                  <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                    Replace the runs-on line in your workflow file to use Shipfox runners.\n                  </Text>\n                </div>\n\n                <CodeBlock\n                  data={[\n                    {\n                      language: 'yaml',\n                      filename: '.github/workflows/<workflow-name>.yml',\n                      code: diffCode,\n                    },\n                  ]}\n                  defaultValue=\"yaml\"\n                >\n                  <CodeBlockHeader>\n                    <CodeBlockFiles>\n                      {(item) => (\n                        <CodeBlockFilename value={item.language}>{item.filename}</CodeBlockFilename>\n                      )}\n                    </CodeBlockFiles>\n                    <CodeBlockCopyButton />\n                  </CodeBlockHeader>\n                  <CodeBlockBody>\n                    {(item) => (\n                      <CodeBlockItem value={item.language}>\n                        <CodeBlockContent language={item.language}>{item.code}</CodeBlockContent>\n                      </CodeBlockItem>\n                    )}\n                  </CodeBlockBody>\n                  <CodeBlockFooter\n                    state=\"running\"\n                    message=\"Waiting for Shipfox runner event…\"\n                    description=\"This usually takes 30-60 seconds after you commit the workflow file.\"\n                  />\n                </CodeBlock>\n              </div>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Got it\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nexport const OpenedModal: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: OPEN_MODAL_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Opened Modal State');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Open Modal</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Modal Title</ModalTitle>\n            <ModalHeader>\n              <Text\n                size=\"lg\"\n                className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\"\n              >\n                Modal Title\n              </Text>\n            </ModalHeader>\n            <ModalBody>\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                This modal automatically adapts between dialog (desktop) and drawer (mobile) based\n                on screen size. Try resizing your browser window!\n              </Text>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Confirm\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n"],"names":["argosScreenshot","screen","within","userEvent","Button","ButtonLink","CodeBlock","CodeBlockBody","CodeBlockContent","CodeBlockCopyButton","CodeBlockFilename","CodeBlockFiles","CodeBlockFooter","CodeBlockHeader","CodeBlockItem","DatePicker","DynamicItem","Icon","Input","ItemTitle","Label","MovingBorder","Text","useState","cn","illustration2","illustrationBg","Modal","ModalBody","ModalContent","ModalFooter","ModalHeader","ModalTitle","ModalTrigger","OPEN_MODAL_REGEX","IMPORT_JOBS_REGEX","GITHUB_ACTIONS_REGEX","DEFAULT_START_DATE","Date","meta","title","component","tags","parameters","layout","Default","play","ctx","canvasElement","step","canvas","user","setup","triggerButton","getByRole","name","click","findByRole","Promise","resolve","setTimeout","render","open","setOpen","div","className","onOpenChange","asChild","aria-describedby","undefined","size","variant","onClick","ImportForm","date","setDate","placeholder","htmlFor","id","onDateSelect","onClear","diffCode","GithubActions","viewport","defaultViewport","img","src","alt","style","borderRadius","duration","rx","ry","span","color","description","rightElement","href","iconRight","data","language","filename","code","defaultValue","item","value","state","message","OpenedModal"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/modal/modal.stories.tsx"],"sourcesContent":["import {argosScreenshot} from '@argos-ci/storybook/vitest';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {screen, within} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {Button, ButtonLink} from 'components/button';\nimport {\n  CodeBlock,\n  CodeBlockBody,\n  CodeBlockContent,\n  CodeBlockCopyButton,\n  CodeBlockFilename,\n  CodeBlockFiles,\n  CodeBlockFooter,\n  CodeBlockHeader,\n  CodeBlockItem,\n} from 'components/code-block';\nimport {DatePicker} from 'components/date-picker';\nimport {DynamicItem} from 'components/dynamic-item';\nimport {Icon} from 'components/icon';\nimport {Input} from 'components/input';\nimport {ItemTitle} from 'components/item';\nimport {Label} from 'components/label';\nimport {MovingBorder} from 'components/moving-border';\nimport {Text} from 'components/typography';\nimport {useState} from 'react';\nimport {cn} from 'utils/cn';\nimport illustration2 from '../../assets/illustration-2.svg';\nimport illustrationBg from '../../assets/illustration-gradient.svg';\nimport {\n  Modal,\n  ModalBody,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalTitle,\n  ModalTrigger,\n} from './modal';\n\nconst OPEN_MODAL_REGEX = /open modal/i;\nconst IMPORT_JOBS_REGEX = /import past jobs from github/i;\nconst GITHUB_ACTIONS_REGEX = /run github actions on shipfox/i;\n\nconst DEFAULT_START_DATE = new Date('2025-12-06T00:00:00.000Z');\n\nconst meta = {\n  title: 'Components/Modal',\n  component: Modal,\n  tags: ['autodocs'],\n  parameters: {\n    layout: 'centered',\n  },\n} satisfies Meta<typeof Modal>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: OPEN_MODAL_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Default Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Open Modal</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Modal Title</ModalTitle>\n            <ModalHeader>\n              <Text\n                size=\"lg\"\n                className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\"\n              >\n                Modal Title\n              </Text>\n            </ModalHeader>\n            <ModalBody>\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                This modal automatically adapts between dialog (desktop) and drawer (mobile) based\n                on screen size. Try resizing your browser window!\n              </Text>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Confirm\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nexport const ImportForm: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: IMPORT_JOBS_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Import Form Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n    const [date, setDate] = useState<Date | undefined>(DEFAULT_START_DATE);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Import past jobs from GitHub</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined} overlayClassName=\"bg-background-modal-overlay\">\n            <ModalTitle className=\"sr-only\">Import past jobs from GitHub</ModalTitle>\n            <ModalHeader title=\"Import past jobs from GitHub\" />\n            <ModalBody className=\"gap-20\">\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                Backfill your CI history by importing past runs from your GitHub repo. We&apos;ll\n                handle the rest by creating a background task to import the data for you.\n              </Text>\n              <div className=\"flex flex-col gap-20 w-full\">\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label>Repository owner</Label>\n                  <Input placeholder=\"apache\" />\n                </div>\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label>Repository name</Label>\n                  <Input placeholder=\"kafka\" />\n                </div>\n                <div className=\"flex flex-col gap-8 w-full\">\n                  <Label htmlFor=\"start-date\">Start date</Label>\n                  <DatePicker\n                    id=\"start-date\"\n                    date={date}\n                    onDateSelect={setDate}\n                    onClear={() => setDate(undefined)}\n                    placeholder=\"DD/MM/YYYY\"\n                  />\n                </div>\n              </div>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Import\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nconst diffCode = `jobs:\n  build:\n-   runs-on: ubuntu-latest\n+   runs-on: shipfox-2vcpu-ubuntu-2404`;\n\nexport const GithubActions: Story = {\n  parameters: {\n    viewport: {\n      defaultViewport: 'large',\n    },\n  },\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: GITHUB_ACTIONS_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Github Actions Modal Open');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[50vh] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Run GitHub Actions on Shipfox</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined} overlayClassName=\"bg-background-modal-overlay\">\n            <ModalTitle className=\"sr-only\">Run GitHub Actions on Shipfox</ModalTitle>\n            <ModalHeader title=\"Run GitHub Actions on Shipfox\" />\n            <ModalBody className=\"gap-32\">\n              <div className=\"flex flex-col gap-20 w-full\">\n                <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                  This will run your jobs on Shipfox&apos;s optimized infrastructure. Giving you\n                  faster builds, and dedicated resources.\n                </Text>\n                <div className=\"relative\">\n                  <img\n                    src={illustration2}\n                    alt=\"illustration-2\"\n                    className=\"hidden sm:block absolute overflow-clip right-2 top-1/2 -translate-y-1/2 translate-x-8 w-fit object-contain z-50\"\n                  />\n                  <div className={cn('relative overflow-hidden bg-transparent p-1 rounded-8')}>\n                    <div className=\"absolute inset-0\" style={{borderRadius: 'calc(0.5rem * 0.96)'}}>\n                      <MovingBorder duration={6000} rx=\"30%\" ry=\"30%\">\n                        <div className=\"h-100 w-200 bg-[radial-gradient(#ff9e7a_40%,transparent_60%)]\" />\n                      </MovingBorder>\n                    </div>\n                    <div\n                      className=\"relative\"\n                      style={{\n                        borderRadius: 'calc(0.5rem * 0.96)',\n                      }}\n                    >\n                      <DynamicItem\n                        variant=\"default\"\n                        title={\n                          <div className=\"flex items-center gap-6\">\n                            <span className=\"flex shrink-0 items-center justify-center text-tag-success-icon w-16 h-16\">\n                              <Icon\n                                name=\"money\"\n                                size=\"sm\"\n                                color=\"var(--foreground-neutral-subtle, #a1a1aa)\"\n                              />\n                            </span>\n                            <ItemTitle>6000 free credits/month to run your jobs</ItemTitle>\n                          </div>\n                        }\n                        description=\"~500 builds/month. No payment required.\"\n                        rightElement={\n                          <img\n                            src={illustrationBg}\n                            alt=\"illustration-bg\"\n                            className=\"hidden sm:block absolute overflow-clip right-4 w-fit object-contain scale-105\"\n                          />\n                        }\n                      />\n                    </div>\n                  </div>\n                </div>\n              </div>\n              <div className=\"flex flex-col gap-20 w-full\">\n                <div className=\"flex flex-col gap-6\">\n                  <div className=\"flex items-center justify-center w-full\">\n                    <Text className=\"flex-1 font-semibold text-foreground-neutral-base overflow-ellipsis overflow-hidden whitespace-nowrap\">\n                      Update your GitHub Actions workflow\n                    </Text>\n                    <ButtonLink variant=\"base\" size=\"sm\" href=\"#\" iconRight=\"bookOpen\">\n                      See docs\n                    </ButtonLink>\n                  </div>\n                  <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                    Replace the runs-on line in your workflow file to use Shipfox runners.\n                  </Text>\n                </div>\n\n                <CodeBlock\n                  data={[\n                    {\n                      language: 'yaml',\n                      filename: '.github/workflows/<workflow-name>.yml',\n                      code: diffCode,\n                    },\n                  ]}\n                  defaultValue=\"yaml\"\n                >\n                  <CodeBlockHeader>\n                    <CodeBlockFiles>\n                      {(item) => (\n                        <CodeBlockFilename value={item.language}>{item.filename}</CodeBlockFilename>\n                      )}\n                    </CodeBlockFiles>\n                    <CodeBlockCopyButton />\n                  </CodeBlockHeader>\n                  <CodeBlockBody>\n                    {(item) => (\n                      <CodeBlockItem value={item.language}>\n                        <CodeBlockContent language={item.language}>{item.code}</CodeBlockContent>\n                      </CodeBlockItem>\n                    )}\n                  </CodeBlockBody>\n                  <CodeBlockFooter\n                    state=\"running\"\n                    message=\"Waiting for Shipfox runner event…\"\n                    description=\"This usually takes 30-60 seconds after you commit the workflow file.\"\n                  />\n                </CodeBlock>\n              </div>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Got it\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n\nexport const OpenedModal: Story = {\n  play: async (ctx) => {\n    const {canvasElement, step} = ctx;\n    const canvas = within(canvasElement);\n    const user = userEvent.setup();\n\n    await step('Open the modal', async () => {\n      const triggerButton = canvas.getByRole('button', {name: OPEN_MODAL_REGEX});\n      await user.click(triggerButton);\n    });\n\n    await step('Wait for dialog to appear and render', async () => {\n      await screen.findByRole('dialog');\n      await new Promise((resolve) => setTimeout(resolve, 100));\n    });\n\n    await argosScreenshot(ctx, 'Opened Modal State');\n  },\n  render: () => {\n    const [open, setOpen] = useState(false);\n\n    return (\n      <div className=\"flex h-[calc(100vh/2)] w-[calc(100vw/2)] items-center justify-center rounded-16 bg-background-subtle-base shadow-tooltip\">\n        <Modal open={open} onOpenChange={setOpen}>\n          <ModalTrigger asChild>\n            <Button>Open Modal</Button>\n          </ModalTrigger>\n          <ModalContent aria-describedby={undefined}>\n            <ModalTitle className=\"sr-only\">Modal Title</ModalTitle>\n            <ModalHeader>\n              <Text\n                size=\"lg\"\n                className=\"flex-1 overflow-ellipsis overflow-hidden whitespace-nowrap\"\n              >\n                Modal Title\n              </Text>\n            </ModalHeader>\n            <ModalBody>\n              <Text size=\"sm\" className=\"text-foreground-neutral-subtle w-full\">\n                This modal automatically adapts between dialog (desktop) and drawer (mobile) based\n                on screen size. Try resizing your browser window!\n              </Text>\n            </ModalBody>\n            <ModalFooter>\n              <Button variant=\"transparent\" onClick={() => setOpen(false)}>\n                Cancel\n              </Button>\n              <Button variant=\"primary\" onClick={() => setOpen(false)}>\n                Confirm\n              </Button>\n            </ModalFooter>\n          </ModalContent>\n        </Modal>\n      </div>\n    );\n  },\n};\n"],"names":["argosScreenshot","screen","within","userEvent","Button","ButtonLink","CodeBlock","CodeBlockBody","CodeBlockContent","CodeBlockCopyButton","CodeBlockFilename","CodeBlockFiles","CodeBlockFooter","CodeBlockHeader","CodeBlockItem","DatePicker","DynamicItem","Icon","Input","ItemTitle","Label","MovingBorder","Text","useState","cn","illustration2","illustrationBg","Modal","ModalBody","ModalContent","ModalFooter","ModalHeader","ModalTitle","ModalTrigger","OPEN_MODAL_REGEX","IMPORT_JOBS_REGEX","GITHUB_ACTIONS_REGEX","DEFAULT_START_DATE","Date","meta","title","component","tags","parameters","layout","Default","play","ctx","canvasElement","step","canvas","user","setup","triggerButton","getByRole","name","click","findByRole","Promise","resolve","setTimeout","render","open","setOpen","div","className","onOpenChange","asChild","aria-describedby","undefined","size","variant","onClick","ImportForm","date","setDate","overlayClassName","placeholder","htmlFor","id","onDateSelect","onClear","diffCode","GithubActions","viewport","defaultViewport","img","src","alt","style","borderRadius","duration","rx","ry","span","color","description","rightElement","href","iconRight","data","language","filename","code","defaultValue","item","value","state","message","OpenedModal"],"mappings":"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"}

package/dist/components/tabs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './tabs';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/dist/components/tabs/index.js

@@ -0,0 +1,3 @@
+export * from './tabs.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/tabs/index.ts"],"sourcesContent":["export * from './tabs';\n"],"names":[],"mappings":"AAAA,cAAc,SAAS"}

package/dist/components/tabs/tabs.d.ts

@@ -0,0 +1,50 @@
+import { type HTMLMotionProps, type Transition } from 'framer-motion';
+import { type ComponentProps, type ReactNode } from 'react';
+type TabsContextType<T extends string = string> = {
+    activeValue: T;
+    handleValueChange: (value: T) => void;
+    registerTrigger: (value: string, node: HTMLElement | null) => void;
+    getTriggerElement: (value: string) => HTMLElement | undefined;
+    getAllTriggerValues: () => string[];
+};
+declare function useTabs<T extends string = string>(): TabsContextType<T>;
+type BaseTabsProps = ComponentProps<'div'> & {
+    children: ReactNode;
+};
+type UnControlledTabsProps<T extends string = string> = BaseTabsProps & {
+    defaultValue?: T;
+    value?: never;
+    onValueChange?: never;
+};
+type ControlledTabsProps<T extends string = string> = BaseTabsProps & {
+    value: T;
+    onValueChange?: (value: T) => void;
+    defaultValue?: never;
+};
+type TabsProps<T extends string = string> = UnControlledTabsProps<T> | ControlledTabsProps<T>;
+declare function Tabs<T extends string = string>({ defaultValue, value, onValueChange, children, className, ...props }: TabsProps<T>): import("react/jsx-runtime").JSX.Element;
+type TabsListProps = ComponentProps<'div'> & {
+    children: ReactNode;
+    activeClassName?: string;
+    transition?: Transition;
+};
+declare function TabsList({ children, className, activeClassName, transition, ...props }: TabsListProps): import("react/jsx-runtime").JSX.Element;
+type TabsTriggerProps = Omit<HTMLMotionProps<'button'>, 'ref'> & {
+    value: string;
+    children: ReactNode;
+};
+declare const TabsTrigger: import("react").ForwardRefExoticComponent<Omit<HTMLMotionProps<"button">, "ref"> & {
+    value: string;
+    children: ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;
+type TabsContentsProps = ComponentProps<'div'> & {
+    children: ReactNode;
+};
+declare function TabsContents({ children, className, ...props }: TabsContentsProps): import("react/jsx-runtime").JSX.Element;
+type TabsContentProps = ComponentProps<'div'> & {
+    value: string;
+    children: ReactNode;
+};
+declare function TabsContent({ children, value, className, ...props }: TabsContentProps): import("react/jsx-runtime").JSX.Element | null;
+export { Tabs, TabsList, TabsTrigger, TabsContents, TabsContent, useTabs, type TabsContextType, type TabsProps, type TabsListProps, type TabsTriggerProps, type TabsContentsProps, type TabsContentProps, };
+//# sourceMappingURL=tabs.d.ts.map

package/dist/components/tabs/tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"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"}