@ctlyst.id/voila-ui 12.0.0-beta.0 → 12.0.0-beta.2

package/dist/layouts/stack/index.js

@@ -0,0 +1,2 @@
+'use strict';var chunk62DI7Z6X_js=require('../../chunk-62DI7Z6X.js');require('../../chunk-II2I4YPO.js'),require('../../chunk-U6FQU43M.js'),require('../../chunk-5KL6F2HG.js');Object.defineProperty(exports,"Stack",{enumerable:true,get:function(){return chunk62DI7Z6X_js.a}});//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/layouts/stack/index.js.map

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

package/dist/layouts/stack/index.mjs

@@ -0,0 +1,2 @@
+export{a as Stack}from'../../chunk-PDFDJSTW.mjs';import'../../chunk-7VZWTYCC.mjs';import'../../chunk-FDO6GWH2.mjs';import'../../chunk-TFL53JS5.mjs';//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/layouts/stack/index.mjs.map

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

package/dist/layouts/text/index.css

@@ -0,0 +1,2 @@
+._1ccbe2w1{font-size:48px;font-weight:700;line-height:56px;letter-spacing:0px}._1ccbe2w2{font-size:40px;font-weight:700;line-height:48px;letter-spacing:0px}._1ccbe2w3{font-size:32px;font-weight:700;line-height:40px;letter-spacing:0px}._1ccbe2w4{font-size:24px;font-weight:700;line-height:32px;letter-spacing:0px}._1ccbe2w5{font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}._1ccbe2w6{font-size:16px;font-weight:700;line-height:24px;letter-spacing:0px}._1ccbe2w7{font-size:32px;line-height:40px;letter-spacing:0px}._1ccbe2w8{font-size:24px;line-height:32px;letter-spacing:0px}._1ccbe2w9{font-size:20px;line-height:32px;letter-spacing:0px}._1ccbe2wa{font-size:18px;line-height:24px;letter-spacing:0px}._1ccbe2wb{font-size:16px;line-height:24px;letter-spacing:0px}._1ccbe2wc{font-size:14px;line-height:20px;letter-spacing:0px}._1ccbe2wd{font-size:12px;line-height:16px;letter-spacing:0px}._1ccbe2we{font-size:10px;line-height:16px;letter-spacing:.5px}._1ccbe2wf{text-decoration:line-through}
+/*# sourceMappingURL=index.css.map */

package/dist/layouts/text/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["vanilla-extract-css-ns:src/layouts/text/text.css.ts.vanilla.css?source=#H4sIAAAAAAAAA52UTQqDMBBG954iF1BijD/VwxSNowmIiqYoLd69WOvGGBzcDvJeeB/oPX0hCmCTTz4OIVXXandUb0gJT/o5208TqFrqlMSUrrdGteDK/y2Mtg8b0BoGd+xzodo6JXQ9L463G5hhoEjD/pQrQ3A0BAxroDgDPxoYRxr2p1wZQsOArcSQlaKjwY+wBo4zxLYdbjVPbM1v9X3Y+t6i5UbL5ISG7VbYlrlFEwbtrBtDrlAatLNNfeS/AAza2QpWmhceeNWPp2HWbgmiG3KtujbdaFoO3auWmbN8AQW1B6ntBAAA"],"sourcesContent":["._1ccbe2w1 {\n  font-size: 48px;\n  font-weight: 700;\n  line-height: 56px;\n  letter-spacing: 0px;\n}\n._1ccbe2w2 {\n  font-size: 40px;\n  font-weight: 700;\n  line-height: 48px;\n  letter-spacing: 0px;\n}\n._1ccbe2w3 {\n  font-size: 32px;\n  font-weight: 700;\n  line-height: 40px;\n  letter-spacing: 0px;\n}\n._1ccbe2w4 {\n  font-size: 24px;\n  font-weight: 700;\n  line-height: 32px;\n  letter-spacing: 0px;\n}\n._1ccbe2w5 {\n  font-size: 20px;\n  font-weight: 700;\n  line-height: 28px;\n  letter-spacing: 0px;\n}\n._1ccbe2w6 {\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 24px;\n  letter-spacing: 0px;\n}\n._1ccbe2w7 {\n  font-size: 32px;\n  line-height: 40px;\n  letter-spacing: 0px;\n}\n._1ccbe2w8 {\n  font-size: 24px;\n  line-height: 32px;\n  letter-spacing: 0px;\n}\n._1ccbe2w9 {\n  font-size: 20px;\n  line-height: 32px;\n  letter-spacing: 0px;\n}\n._1ccbe2wa {\n  font-size: 18px;\n  line-height: 24px;\n  letter-spacing: 0px;\n}\n._1ccbe2wb {\n  font-size: 16px;\n  line-height: 24px;\n  letter-spacing: 0px;\n}\n._1ccbe2wc {\n  font-size: 14px;\n  line-height: 20px;\n  letter-spacing: 0px;\n}\n._1ccbe2wd {\n  font-size: 12px;\n  line-height: 16px;\n  letter-spacing: 0px;\n}\n._1ccbe2we {\n  font-size: 10px;\n  line-height: 16px;\n  letter-spacing: 0.5px;\n}\n._1ccbe2wf {\n  text-decoration: line-through;\n}"],"mappings":"AAAA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,IACb,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,GAClB,CACA,CAAC,UACC,UAAW,KACX,YAAa,KACb,eAAgB,IAClB,CACA,CAAC,UACC,gBAAiB,YACnB","names":[]}

package/dist/layouts/text/index.d.mts

@@ -0,0 +1,103 @@
+import * as react from 'react';
+import { PropsWithChildren, HTMLAttributes, ElementType } from 'react';
+import { BoxProps } from '../box/index.mjs';
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+import 'rainbow-sprinkles/dist/declarations/src/types';
+import 'clsx';
+
+declare const textRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    textStyle: {
+        heading1: {
+            readonly fontSize: "48px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "56px";
+            readonly letterSpacing: "0px";
+        };
+        heading2: {
+            readonly fontSize: "40px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "48px";
+            readonly letterSpacing: "0px";
+        };
+        heading3: {
+            readonly fontSize: "32px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "40px";
+            readonly letterSpacing: "0px";
+        };
+        heading4: {
+            readonly fontSize: "24px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        heading5: {
+            readonly fontSize: "20px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "28px";
+            readonly letterSpacing: "0px";
+        };
+        heading6: {
+            readonly fontSize: "16px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        subheading1: {
+            readonly fontSize: "32px";
+            readonly lineHeight: "40px";
+            readonly letterSpacing: "0px";
+        };
+        subheading2: {
+            readonly fontSize: "24px";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        subtitle1: {
+            readonly fontSize: "20px";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        subtitle2: {
+            readonly fontSize: "18px";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        body1: {
+            readonly fontSize: "16px";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        body2: {
+            readonly fontSize: "14px";
+            readonly lineHeight: "20px";
+            readonly letterSpacing: "0px";
+        };
+        caption: {
+            readonly fontSize: "12px";
+            readonly lineHeight: "16px";
+            readonly letterSpacing: "0px";
+        };
+        footer: {
+            readonly fontSize: "10px";
+            readonly lineHeight: "16px";
+            readonly letterSpacing: "0.5px";
+        };
+    };
+    isStrikethrough: {
+        true: {
+            textDecoration: "line-through";
+        };
+    };
+}>;
+type TextRecipe = RecipeVariants<typeof textRecipe>;
+
+type TextProperties = Omit<HTMLAttributes<HTMLParagraphElement | HTMLAnchorElement | HTMLHeadingElement>, 'as' | 'height' | 'width' | 'size' | 'ref' | 'disabled' | 'wrap' | 'sizes' | 'color'>;
+type BaseTextProps = BoxProps & TextProperties & TextRecipe & {
+    as?: ElementType;
+};
+declare const Text: react.ForwardRefExoticComponent<Omit<PropsWithChildren<BaseTextProps>, "ref"> & react.RefAttributes<BaseTextProps>>;
+type TextProps = Parameters<typeof Text>[0];
+
+export { Text, type TextProperties, type TextProps };

package/dist/layouts/text/index.d.ts

@@ -0,0 +1,103 @@
+import * as react from 'react';
+import { PropsWithChildren, HTMLAttributes, ElementType } from 'react';
+import { BoxProps } from '../box/index.js';
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+import 'rainbow-sprinkles/dist/declarations/src/types';
+import 'clsx';
+
+declare const textRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    textStyle: {
+        heading1: {
+            readonly fontSize: "48px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "56px";
+            readonly letterSpacing: "0px";
+        };
+        heading2: {
+            readonly fontSize: "40px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "48px";
+            readonly letterSpacing: "0px";
+        };
+        heading3: {
+            readonly fontSize: "32px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "40px";
+            readonly letterSpacing: "0px";
+        };
+        heading4: {
+            readonly fontSize: "24px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        heading5: {
+            readonly fontSize: "20px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "28px";
+            readonly letterSpacing: "0px";
+        };
+        heading6: {
+            readonly fontSize: "16px";
+            readonly fontWeight: "700";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        subheading1: {
+            readonly fontSize: "32px";
+            readonly lineHeight: "40px";
+            readonly letterSpacing: "0px";
+        };
+        subheading2: {
+            readonly fontSize: "24px";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        subtitle1: {
+            readonly fontSize: "20px";
+            readonly lineHeight: "32px";
+            readonly letterSpacing: "0px";
+        };
+        subtitle2: {
+            readonly fontSize: "18px";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        body1: {
+            readonly fontSize: "16px";
+            readonly lineHeight: "24px";
+            readonly letterSpacing: "0px";
+        };
+        body2: {
+            readonly fontSize: "14px";
+            readonly lineHeight: "20px";
+            readonly letterSpacing: "0px";
+        };
+        caption: {
+            readonly fontSize: "12px";
+            readonly lineHeight: "16px";
+            readonly letterSpacing: "0px";
+        };
+        footer: {
+            readonly fontSize: "10px";
+            readonly lineHeight: "16px";
+            readonly letterSpacing: "0.5px";
+        };
+    };
+    isStrikethrough: {
+        true: {
+            textDecoration: "line-through";
+        };
+    };
+}>;
+type TextRecipe = RecipeVariants<typeof textRecipe>;
+
+type TextProperties = Omit<HTMLAttributes<HTMLParagraphElement | HTMLAnchorElement | HTMLHeadingElement>, 'as' | 'height' | 'width' | 'size' | 'ref' | 'disabled' | 'wrap' | 'sizes' | 'color'>;
+type BaseTextProps = BoxProps & TextProperties & TextRecipe & {
+    as?: ElementType;
+};
+declare const Text: react.ForwardRefExoticComponent<Omit<PropsWithChildren<BaseTextProps>, "ref"> & react.RefAttributes<BaseTextProps>>;
+type TextProps = Parameters<typeof Text>[0];
+
+export { Text, type TextProperties, type TextProps };

package/dist/layouts/text/index.js

@@ -0,0 +1,2 @@
+'use strict';var chunkRL57HCU3_js=require('../../chunk-RL57HCU3.js');require('../../chunk-MFVR2NOW.js'),require('../../chunk-U6FQU43M.js'),require('../../chunk-5KL6F2HG.js');Object.defineProperty(exports,"Text",{enumerable:true,get:function(){return chunkRL57HCU3_js.a}});//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/layouts/text/index.js.map

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

package/dist/layouts/text/index.mjs

@@ -0,0 +1,2 @@
+export{a as Text}from'../../chunk-IWO56Z5V.mjs';import'../../chunk-KQZOO6GU.mjs';import'../../chunk-FDO6GWH2.mjs';import'../../chunk-TFL53JS5.mjs';//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/layouts/text/index.mjs.map

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

package/dist/modal-D4slfQuk.d.mts

@@ -0,0 +1,97 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { DialogProps, DialogContentProps } from '@radix-ui/react-dialog';
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const modalContainerRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        full: {
+            width: "100%";
+            height: "100%";
+            maxWidth: "100%";
+            maxHeight: "100%";
+        };
+        small: {
+            width: "400px";
+        };
+        medium: {
+            width: "600px";
+        };
+        large: {
+            width: "800px";
+        };
+    };
+    noPadding: {
+        true: {
+            padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    colorScheme: {
+        primary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        neutral: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        danger: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        warning: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        info: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        white: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type ModalContainerRecipe = RecipeVariants<typeof modalContainerRecipe>;
+
+type ModalProperties = Omit<DialogProps, 'open' | 'onOpenChange'>;
+type ModalProps = ModalProperties & ModalContainerRecipe & {
+    'data-test-id'?: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    size?: string;
+    destroyOnClose?: boolean;
+    noPadding?: boolean;
+    colorScheme?: string;
+    closeOnOverlayClick?: boolean;
+    closeIcon?: ReactNode;
+    classNameBody?: string;
+    isCloseWhenEscape?: boolean;
+    onOpenAutoFocus?: DialogContentProps['onOpenAutoFocus'];
+    onCloseAutoFocus?: DialogContentProps['onCloseAutoFocus'];
+};
+declare const Modal: react.ForwardRefExoticComponent<ModalProperties & {
+    size?: "small" | "medium" | "full" | "large" | undefined;
+    noPadding?: boolean | undefined;
+    colorScheme?: "primary" | "white" | "info" | "warning" | "neutral" | "danger" | undefined;
+} & {
+    'data-test-id'?: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    size?: string;
+    destroyOnClose?: boolean;
+    noPadding?: boolean;
+    colorScheme?: string;
+    closeOnOverlayClick?: boolean;
+    closeIcon?: ReactNode;
+    classNameBody?: string;
+    isCloseWhenEscape?: boolean;
+    onOpenAutoFocus?: DialogContentProps["onOpenAutoFocus"];
+    onCloseAutoFocus?: DialogContentProps["onCloseAutoFocus"];
+} & {
+    children?: ReactNode | undefined;
+} & react.RefAttributes<HTMLDivElement>>;
+
+export { Modal as M, type ModalProps as a };

package/dist/modal-D4slfQuk.d.ts

@@ -0,0 +1,97 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { DialogProps, DialogContentProps } from '@radix-ui/react-dialog';
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const modalContainerRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        full: {
+            width: "100%";
+            height: "100%";
+            maxWidth: "100%";
+            maxHeight: "100%";
+        };
+        small: {
+            width: "400px";
+        };
+        medium: {
+            width: "600px";
+        };
+        large: {
+            width: "800px";
+        };
+    };
+    noPadding: {
+        true: {
+            padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    colorScheme: {
+        primary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        neutral: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        danger: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        warning: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        info: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        white: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type ModalContainerRecipe = RecipeVariants<typeof modalContainerRecipe>;
+
+type ModalProperties = Omit<DialogProps, 'open' | 'onOpenChange'>;
+type ModalProps = ModalProperties & ModalContainerRecipe & {
+    'data-test-id'?: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    size?: string;
+    destroyOnClose?: boolean;
+    noPadding?: boolean;
+    colorScheme?: string;
+    closeOnOverlayClick?: boolean;
+    closeIcon?: ReactNode;
+    classNameBody?: string;
+    isCloseWhenEscape?: boolean;
+    onOpenAutoFocus?: DialogContentProps['onOpenAutoFocus'];
+    onCloseAutoFocus?: DialogContentProps['onCloseAutoFocus'];
+};
+declare const Modal: react.ForwardRefExoticComponent<ModalProperties & {
+    size?: "small" | "medium" | "full" | "large" | undefined;
+    noPadding?: boolean | undefined;
+    colorScheme?: "primary" | "white" | "info" | "warning" | "neutral" | "danger" | undefined;
+} & {
+    'data-test-id'?: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    size?: string;
+    destroyOnClose?: boolean;
+    noPadding?: boolean;
+    colorScheme?: string;
+    closeOnOverlayClick?: boolean;
+    closeIcon?: ReactNode;
+    classNameBody?: string;
+    isCloseWhenEscape?: boolean;
+    onOpenAutoFocus?: DialogContentProps["onOpenAutoFocus"];
+    onCloseAutoFocus?: DialogContentProps["onCloseAutoFocus"];
+} & {
+    children?: ReactNode | undefined;
+} & react.RefAttributes<HTMLDivElement>>;
+
+export { Modal as M, type ModalProps as a };

package/package.json

@@ -1,25 +1,66 @@
 {
   "name": "@ctlyst.id/voila-ui",
-  "version": "12.0.0-beta.0",
+  "type": "commonjs",
+  "version": "12.0.0-beta.2",
   "description": "UI library for voila user facing library.",
   "main": "dist/index.js",
-  "module": "dist/ui.esm.js",
+  "module": "dist/index.mjs",
   "typings": "dist/index.d.ts",
-  "voila-ui:source": "./src/index.ts",
-  "repository": "https://github.com/machtwatch/voila-ui",
+  "voila-ui:source": {
+    ".": "./src/index.ts",
+    "./components/*": "./src/components/*/index.ts",
+    "./layouts/*": "./src/layouts/*/index.ts"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/machtwatch/voila-ui.git",
+    "directory": "packages/ui"
+  },
   "author": "Catalyst Tech",
   "license": "Apache-2.0",
   "files": [
     "dist"
   ],
+  "sideEffects": [
+    "*.css",
+    "*.css.ts",
+    "./dist/**/*.css"
+  ],
+  "typesVersions": {
+    "*": {
+      "components/*": [
+        "./dist/components/*/index.d.ts"
+      ],
+      "layouts/*": [
+        "./dist/layouts/*/index.d.ts"
+      ]
+    }
+  },
   "exports": {
     ".": {
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
     },
     "./styles": {
       "import": "./dist/index.css",
       "require": "./dist/index.css"
+    },
+    "./components/*": {
+      "types": "./dist/components/*/index.d.ts",
+      "import": "./dist/components/*/index.mjs",
+      "require": "./dist/components/*/index.js"
+    },
+    "./layouts/*.css": "./dist/layouts/*.css",
+    "./layouts/*": {
+      "types": "./dist/layouts/*/index.d.ts",
+      "import": "./dist/layouts/*/index.mjs",
+      "require": "./dist/layouts/*/index.js"
     }
   },
   "publishConfig": {
@@ -51,38 +92,39 @@
     "clsx": "^2.1.1",
     "downshift": "^7.6.0",
     "focus-trap": "^7.6.0",
-    "framer-motion": "^11.6.0",
     "rainbow-sprinkles": "^0.17.3",
     "react-spring": "^9.7.4",
     "react-transition-group": "^4.4.5",
     "react-use-gesture": "^9.1.3",
     "tslib": "^2.7.0",
     "xstate": "^4.38.2",
-    "@ctlyst.id/icons": "3.0.0-beta.0",
-    "@ctlyst.id/utils": "3.0.0-beta.0"
+    "@ctlyst.id/icons": "3.0.0-beta.2",
+    "@ctlyst.id/utils": "3.0.0-beta.2"
   },
   "peerDependencies": {
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "@ctlyst.id/icons": "3.0.0-beta.0",
-    "@ctlyst.id/utils": "3.0.0-beta.0",
-    "@ctlyst.id/voila-ui-core": "3.0.0-beta.0"
+    "@ctlyst.id/icons": "3.0.0-beta.2",
+    "@ctlyst.id/utils": "3.0.0-beta.2",
+    "@ctlyst.id/voila-ui-core": "3.0.0-beta.2"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
     "@babel/preset-typescript": "^7.20.0",
     "@types/body-scroll-lock": "^3.1.0",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^20.17.14",
     "@types/react-transition-group": "^4.4.6",
     "@vanilla-extract/jest-transform": "^1.1.9",
     "babel-loader": "^9.1.3",
     "babel-preset-react-app": "^10.0.1",
     "polished": "^4.3.0",
-    "@ctlyst.id/icons": "3.0.0-beta.0",
-    "@ctlyst.id/utils": "3.0.0-beta.0",
-    "@ctlyst.id/voila-ui-core": "3.0.0-beta.0"
+    "@ctlyst.id/icons": "3.0.0-beta.2",
+    "@ctlyst.id/utils": "3.0.0-beta.2",
+    "@ctlyst.id/voila-ui-core": "3.0.0-beta.2"
   },
   "scripts": {
-    "build": "tsup",
+    "build": "NODE_OPTIONS='--max-old-space-size=8192' tsup",
     "clean": "rimraf dist",
     "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
     "lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",