@nayhoo/ui 0.6.1 → 0.8.0

package/README.md

@@ -35,7 +35,7 @@ export default withVanillaExtract(nextConfig);
 ```tsx
 // src/app/layout.tsx
 
-import "@nayhoo/ui/css"; // REQUIRED
+import "@nayhoo/ui/theme/index.css"; // REQUIRED
 import type { Metadata } from "next";
 import "./globals.css";
 import { AppProvider } from "./provider";
@@ -102,7 +102,7 @@ export default defineConfig({
 ```tsx
 // src/main.tsx
 
-import "@nayhoo/ui/css"; // REQUIRED
+import "@nayhoo/ui/theme/index.css"; // REQUIRED
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import "./index.css";
@@ -130,7 +130,7 @@ function App({ children }: { children: React.ReactNode }) {
 ```tsx
 "use client";
 
-import { Button } from "@nayhoo/ui";
+import { Button } from "@nayhoo/ui/button";
 
 export const Component = () => {
   return <Button onClick={() => alert("Hello!")}>Press me</Button>;

package/dist/avatar.css-BKo21sUI.d.mts

@@ -0,0 +1,98 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const avatarRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "4": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "5": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "6": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    shape: {
+        square: {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        circle: {
+            borderRadius: "50%";
+        };
+    };
+    inactive: {
+        true: {
+            opacity: ".3";
+        };
+    };
+    interactive: {
+        true: {
+            selectors: {
+                "&::after": {
+                    content: "\"\"";
+                    position: "absolute";
+                    top: "0";
+                    right: "0";
+                    bottom: "0";
+                    left: "0";
+                    backgroundColor: "rgba(0, 0, 0, 0.08)";
+                    opacity: "0";
+                    pointerEvents: "none";
+                    transition: "opacity 100ms linear";
+                };
+                "&:hover::after": {
+                    opacity: "1";
+                };
+                '&[data-state="open"]::after': {
+                    backgroundColor: "rgba(0, 0, 0, 0.12)";
+                    opacity: "1";
+                };
+            };
+        };
+    };
+}>;
+type AvatarVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;
+declare const avatarImageRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type AvatarImageVariants = NonNullable<RecipeVariants<typeof avatarImageRecipe>>;
+declare const avatarFallbackRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            fontSize: "10px";
+            lineHeight: "15px";
+        };
+        "2": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "4": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "5": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "6": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type AvatarFallbackVariants = NonNullable<RecipeVariants<typeof avatarFallbackRecipe>>;
+
+export { type AvatarVariants as A, avatarRecipe as a, avatarImageRecipe as b, type AvatarImageVariants as c, avatarFallbackRecipe as d, type AvatarFallbackVariants as e };

package/dist/avatar.css-BKo21sUI.d.ts

@@ -0,0 +1,98 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const avatarRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "4": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "5": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "6": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    shape: {
+        square: {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        circle: {
+            borderRadius: "50%";
+        };
+    };
+    inactive: {
+        true: {
+            opacity: ".3";
+        };
+    };
+    interactive: {
+        true: {
+            selectors: {
+                "&::after": {
+                    content: "\"\"";
+                    position: "absolute";
+                    top: "0";
+                    right: "0";
+                    bottom: "0";
+                    left: "0";
+                    backgroundColor: "rgba(0, 0, 0, 0.08)";
+                    opacity: "0";
+                    pointerEvents: "none";
+                    transition: "opacity 100ms linear";
+                };
+                "&:hover::after": {
+                    opacity: "1";
+                };
+                '&[data-state="open"]::after': {
+                    backgroundColor: "rgba(0, 0, 0, 0.12)";
+                    opacity: "1";
+                };
+            };
+        };
+    };
+}>;
+type AvatarVariants = NonNullable<RecipeVariants<typeof avatarRecipe>>;
+declare const avatarImageRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type AvatarImageVariants = NonNullable<RecipeVariants<typeof avatarImageRecipe>>;
+declare const avatarFallbackRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            fontSize: "10px";
+            lineHeight: "15px";
+        };
+        "2": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "4": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "5": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "6": {
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type AvatarFallbackVariants = NonNullable<RecipeVariants<typeof avatarFallbackRecipe>>;
+
+export { type AvatarVariants as A, avatarRecipe as a, avatarImageRecipe as b, type AvatarImageVariants as c, avatarFallbackRecipe as d, type AvatarFallbackVariants as e };

package/dist/badge.css-ToNvOJof.d.mts

@@ -0,0 +1,36 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const badgeRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    color: {
+        primary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        error: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    size: {
+        "1": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type BadgeVariants = NonNullable<RecipeVariants<typeof badgeRecipe>>;
+
+export { type BadgeVariants as B, badgeRecipe as b };

package/dist/badge.css-ToNvOJof.d.ts

@@ -0,0 +1,36 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const badgeRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    color: {
+        primary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        error: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    size: {
+        "1": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type BadgeVariants = NonNullable<RecipeVariants<typeof badgeRecipe>>;
+
+export { type BadgeVariants as B, badgeRecipe as b };

package/dist/box.css-ic5Toaj1.d.mts

@@ -0,0 +1,7 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const boxRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type BoxVariants = NonNullable<RecipeVariants<typeof boxRecipe>>;
+
+export { type BoxVariants as B, boxRecipe as b };

package/dist/box.css-ic5Toaj1.d.ts

@@ -0,0 +1,7 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const boxRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type BoxVariants = NonNullable<RecipeVariants<typeof boxRecipe>>;
+
+export { type BoxVariants as B, boxRecipe as b };

package/dist/button.css-CU-ScpcU.d.mts

@@ -0,0 +1,122 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const buttonRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    fullWidth: {
+        true: {
+            width: "100%";
+        };
+    };
+    loading: {
+        true: {
+            color: "transparent !important";
+        };
+    };
+    size: {
+        "1": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    shape: {
+        square: {};
+        pill: {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    variant: {
+        primary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        secondary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        outline: {
+            boxShadow: `inset 0 0 0 1px var(--${string})` | `inset 0 0 0 1px var(--${string}, ${string})` | `inset 0 0 0 1px var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        ghost: {
+            backgroundColor: "transparent";
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        error: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        success: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+    };
+}>;
+type ButtonVariants = RecipeVariants<typeof buttonRecipe>;
+
+export { type ButtonVariants as B, buttonRecipe as b };

package/dist/button.css-CU-ScpcU.d.ts

@@ -0,0 +1,122 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const buttonRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    fullWidth: {
+        true: {
+            width: "100%";
+        };
+    };
+    loading: {
+        true: {
+            color: "transparent !important";
+        };
+    };
+    size: {
+        "1": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "3": {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    shape: {
+        square: {};
+        pill: {
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+    variant: {
+        primary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        secondary: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        outline: {
+            boxShadow: `inset 0 0 0 1px var(--${string})` | `inset 0 0 0 1px var(--${string}, ${string})` | `inset 0 0 0 1px var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        ghost: {
+            backgroundColor: "transparent";
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        error: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        success: {
+            backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            selectors: {
+                "&:hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                "&:active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+    };
+}>;
+type ButtonVariants = RecipeVariants<typeof buttonRecipe>;
+
+export { type ButtonVariants as B, buttonRecipe as b };

package/dist/card.css-r1QAh--W.d.mts

@@ -0,0 +1,19 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const cardRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    variant: {
+        outline: {
+            outline: `1px solid var(--${string})` | `1px solid var(--${string}, ${string})` | `1px solid var(--${string}, ${number})`;
+        };
+        ghost: {};
+    };
+    disableElevation: {
+        true: {
+            boxShadow: "none";
+        };
+    };
+}>;
+type CardVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;
+
+export { type CardVariants as C, cardRecipe as c };

package/dist/card.css-r1QAh--W.d.ts

@@ -0,0 +1,19 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const cardRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    variant: {
+        outline: {
+            outline: `1px solid var(--${string})` | `1px solid var(--${string}, ${string})` | `1px solid var(--${string}, ${number})`;
+        };
+        ghost: {};
+    };
+    disableElevation: {
+        true: {
+            boxShadow: "none";
+        };
+    };
+}>;
+type CardVariants = NonNullable<RecipeVariants<typeof cardRecipe>>;
+
+export { type CardVariants as C, cardRecipe as c };

package/dist/checkbox.css-BlFMNrMD.d.mts

@@ -0,0 +1,22 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const checkboxRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type CheckboxVariants = NonNullable<RecipeVariants<typeof checkboxRecipe>>;
+declare const checkboxIndicatorRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type CheckboxIndicatorVariants = NonNullable<RecipeVariants<typeof checkboxIndicatorRecipe>>;
+
+export { type CheckboxVariants as C, type CheckboxIndicatorVariants as a, checkboxIndicatorRecipe as b, checkboxRecipe as c };

package/dist/checkbox.css-BlFMNrMD.d.ts

@@ -0,0 +1,22 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+import { RecipeVariants } from '@vanilla-extract/recipes';
+
+declare const checkboxRecipe: _vanilla_extract_recipes.RuntimeFn<{
+    size: {
+        "1": {
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        "2": {
+            width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
+type CheckboxVariants = NonNullable<RecipeVariants<typeof checkboxRecipe>>;
+declare const checkboxIndicatorRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
+type CheckboxIndicatorVariants = NonNullable<RecipeVariants<typeof checkboxIndicatorRecipe>>;
+
+export { type CheckboxVariants as C, type CheckboxIndicatorVariants as a, checkboxIndicatorRecipe as b, checkboxRecipe as c };

package/dist/chunk-3RLW7QB4.mjs

@@ -0,0 +1,14 @@
+// src/theme/recipes/menu.css.ts
+import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
+var menuItemRecipe = _7a468({ defaultClassName: "menu_menuItemRecipe__dsc0091 menu_baseMenuItemRecipe__dsc0090", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
+var menuLabelRecipe = _7a468({ defaultClassName: "menu_menuLabelRecipe__dsc0092 menu_baseMenuItemRecipe__dsc0090", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
+var menuRecipe = _7a468({ defaultClassName: "menu_menuRecipe__dsc0093", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
+var menuSeparatorRecipe = _7a468({ defaultClassName: "menu_menuSeparatorRecipe__dsc0094", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
+
+export {
+  menuItemRecipe,
+  menuLabelRecipe,
+  menuRecipe,
+  menuSeparatorRecipe
+};
+//# sourceMappingURL=chunk-3RLW7QB4.mjs.map