@casinogate/ui 1.10.9 → 1.10.11

package/dist/components/drawer/styles.js

@@ -0,0 +1,38 @@
+import { buttonVariants } from '../button/styles.js';
+import { tv } from '../../internal/utils/tailwindcss.js';
+export const drawerOverlayStyles = tv({
+    base: [
+        'cgui:fixed cgui:inset-0 cgui:z-(--cg-ui-z-index-dialog)',
+        'cgui:bg-neutral-100/50',
+        'cgui:transition-all cgui:duration-250 cgui:ease-in-out',
+        'cgui:data-[state=open]:animate-in cgui:data-[state=closed]:animate-out',
+        'cgui:data-[state=open]:fade-in-0 cgui:data-[state=closed]:fade-out-0',
+    ],
+});
+export const drawerContentStyles = tv({
+    base: [
+        'cgui:fixed cgui:z-(--cg-ui-z-index-dialog) cgui:outline-none',
+        'cgui:flex cgui:flex-col',
+        'cgui:data-[vaul-drawer-direction=bottom]:bottom-0 cgui:data-[vaul-drawer-direction=bottom]:left-0 cgui:data-[vaul-drawer-direction=bottom]:right-0 cgui:data-[vaul-drawer-direction=bottom]:rounded-t-md cgui:data-[vaul-drawer-direction=bottom]:max-h-[96%]',
+        'cgui:data-[vaul-drawer-direction=top]:top-0 cgui:data-[vaul-drawer-direction=top]:left-0 cgui:data-[vaul-drawer-direction=top]:right-0 cgui:data-[vaul-drawer-direction=top]:rounded-b-md cgui:data-[vaul-drawer-direction=top]:max-h-[96%] ',
+        'cgui:data-[vaul-drawer-direction=left]:top-0 cgui:data-[vaul-drawer-direction=left]:left-0 cgui:data-[vaul-drawer-direction=left]:bottom-0 cgui:data-[vaul-drawer-direction=left]:rounded-r-md cgui:data-[vaul-drawer-direction=left]:max-w-[96%]',
+        'cgui:data-[vaul-drawer-direction=right]:top-0 cgui:data-[vaul-drawer-direction=right]:right-0 cgui:data-[vaul-drawer-direction=right]:bottom-0 cgui:data-[vaul-drawer-direction=right]:rounded-l-md cgui:data-[vaul-drawer-direction=right]:max-w-[96%]',
+        'cgui:data-[vaul-drawer-direction=right]:[&_[data-vaul-handle]]:rotate-90 cgui:data-[vaul-drawer-direction=right]:[&_[data-vaul-handle]]:my-auto',
+        'cgui:data-[vaul-drawer-direction=left]:[&_[data-vaul-handle]]:rotate-90 cgui:data-[vaul-drawer-direction=left]:[&_[data-vaul-handle]]:my-auto',
+    ],
+    variants: {
+        variant: {
+            default: ['cgui:bg-surface-white'],
+            clean: [],
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+export const drawerHandleStyles = tv({
+    base: ['cgui:my-2 cgui:h-1.5 cgui:w-12', 'cgui:rounded-full'],
+});
+export const drawerTriggerProps = tv({
+    extend: buttonVariants,
+});

package/dist/components/drawer/types.d.ts

@@ -0,0 +1,11 @@
+import type { DrawerCloseProps as VaulDrawerCloseProps, DrawerContentProps as VaulDrawerContentProps, DrawerDescriptionProps as VaulDrawerDescriptionProps, DrawerHandleProps as VaulDrawerHandleProps, DrawerOverlayProps as VaulDrawerOverlayProps, DrawerPortalProps as VaulDrawerPortalProps, DrawerRootProps as VaulDrawerRootProps, DrawerTitleProps as VaulDrawerTitleProps, DrawerTriggerProps as VaulDrawerTriggerProps } from 'vaul-svelte';
+import type { DrawerContentVariants, DrawerOverlayVariants, DrawerTriggerVariants } from './styles.js';
+export type DrawerRootProps = VaulDrawerRootProps;
+export type DrawerPortalProps = VaulDrawerPortalProps;
+export type DrawerContentProps = VaulDrawerContentProps & DrawerContentVariants;
+export type DrawerOverlayProps = VaulDrawerOverlayProps & DrawerOverlayVariants;
+export type DrawerCloseProps = VaulDrawerCloseProps;
+export type DrawerTriggerProps = VaulDrawerTriggerProps & DrawerTriggerVariants;
+export type DrawerTitleProps = VaulDrawerTitleProps;
+export type DrawerDescriptionProps = VaulDrawerDescriptionProps;
+export type DrawerHandleProps = VaulDrawerHandleProps;

package/dist/components/drawer/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/index.d.ts

@@ -9,6 +9,7 @@ export * from './combobox/index.js';
 export * from './command/index.js';
 export * from './data-table/index.js';
 export * from './dialog/index.js';
+export * from './drawer/index.js';
 export * from './dropdown/index.js';
 export * from './field/index.js';
 export * from './icons/index.js';

package/dist/components/index.js

@@ -9,6 +9,7 @@ export * from './combobox/index.js';
 export * from './command/index.js';
 export * from './data-table/index.js';
 export * from './dialog/index.js';
+export * from './drawer/index.js';
 export * from './dropdown/index.js';
 export * from './field/index.js';
 export * from './icons/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@casinogate/ui",
-  "version": "1.10.9",
+  "version": "1.10.11",
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",
@@ -68,7 +68,8 @@
     "runed": "^0.35.1",
     "svelte-toolbelt": "^0.10.6",
     "tailwind-merge": "^3.3.1",
-    "tailwind-variants": "^3.2.2"
+    "tailwind-variants": "^3.2.2",
+    "vaul-svelte": "1.0.0-next.7"
   },
   "scripts": {
     "dev": "vite dev",