@rkosafo/cai.components 0.0.14 → 0.0.16

package/dist/index.d.ts

@@ -23,6 +23,7 @@ export * from './ui/alertDialog/index.js';
 export * from './ui/accordion/index.js';
 export * from './ui/tab/index.js';
 export * from './ui/icons/index.js';
+export * from "./ui/box/index.js";
 export * from './forms/input/index.js';
 export * from './forms/label/index.js';
 export * from './forms/datepicker/index.js';

package/dist/index.js

@@ -24,6 +24,7 @@ export * from './ui/alertDialog/index.js';
 export * from './ui/accordion/index.js';
 export * from './ui/tab/index.js';
 export * from './ui/icons/index.js';
+export * from "./ui/box/index.js";
 export * from './forms/input/index.js';
 export * from './forms/label/index.js';
 export * from './forms/datepicker/index.js';

package/dist/types/index.d.ts

@@ -772,3 +772,11 @@ export interface TabProps {
     tabStyle?: TabsVaraints['tabStyle'];
     divider?: boolean;
 }
+export interface BoxProps extends svelteHTML.HTMLAttributes<HTMLDivElement> {
+    children: any;
+    otherClasses?: string;
+    bgWhite?: boolean;
+    rounded?: boolean;
+    padding?: boolean;
+    shadow?: boolean;
+}

package/dist/ui/box/Box.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+	import { cn, type BoxProps } from '../../index.js';
+
+	let {
+		children,
+		otherClasses = '',
+		bgWhite = false,
+		rounded = false,
+		padding = false,
+		shadow = false,
+		...restProps
+	}: BoxProps = $props();
+</script>
+
+<div
+	{...restProps}
+	class={cn(
+		'scrollbar-thumb-blue scrollbar-thumb-rounded scrollbar-track-blue-lighter scrollbar-w-2 scrolling-touch h-full w-full overflow-y-auto ',
+		otherClasses
+	)}
+	class:rounded-[5px]={rounded}
+	class:bgWhite
+	class:p-6={padding}
+	class:shadow-sm={shadow}
+	class:shadow-gray-400={shadow}
+>
+	{@render children()}
+</div>

package/dist/ui/box/Box.svelte.d.ts

@@ -0,0 +1,4 @@
+import { type BoxProps } from '../../index.js';
+declare const Box: import("svelte").Component<BoxProps, {}, "">;
+type Box = ReturnType<typeof Box>;
+export default Box;

package/dist/ui/box/index.d.ts

@@ -0,0 +1 @@
+export { default as Box } from './Box.svelte';

package/dist/ui/box/index.js

@@ -0,0 +1 @@
+export { default as Box } from './Box.svelte';

package/dist/ui/drawer/theme.js

@@ -1,8 +1,8 @@
 import { tv } from 'tailwind-variants';
 export const drawer = tv({
     slots: {
-        base: 'z-50 bg-white dark:bg-gray-800',
-        backdrop: 'fixed top-0 start-0 z-50 w-full h-full',
+        base: 'z-2200 bg-white dark:bg-gray-800',
+        backdrop: 'fixed top-0 start-0 z-2100 w-full h-full',
         header: 'flex items-center justify-between rounded-t-lg shrink-0 text-xl font-semibold text-gray-900 dark:text-white px-4 py-2 border-b',
         close: 'absolute top-3 end-2.5',
         body: 'p-4 md:p-5 space-y-4',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rkosafo/cai.components",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "files": [
     "dist",
     "!dist/**/*.test.*",