@byyuurin/ui 0.0.6 → 0.0.7

package/dist/runtime/theme/{alert.mjs → alert.js}

@@ -14,17 +14,17 @@ export default ct(
     variants: {
       variant: {
         "solid": {
-          root: "color-ui-c1 bg-solid-ui-fill",
+          root: "color-ui-cx bg-ui-fill",
           close: "ui-base-inverted"
         },
         "outline": {
-          root: "color-ui-content bg-solid-ui-c1 ring ring-inset ring-ui-fill"
+          root: "color-ui-content bg-ui-cx ring ring-inset ring-ui-fill/30"
         },
         "soft": {
-          root: "color-ui-content bg-solid-ui-fill/10"
+          root: "color-ui-content bg-soft-ui-fill/10"
         },
         "soft-outline": {
-          root: "color-ui-content bg-solid-ui-fill/10 ring ring-inset ring-ui-fill/40"
+          root: "color-ui-content bg-soft-ui-fill/10 ring ring-inset ring-ui-fill/30"
         }
       },
       orientation: {

package/dist/runtime/theme/app.d.ts

@@ -4,12 +4,15 @@ declare const _default: {
         loading: string;
         check: string;
         indeterminate: string;
+        up: string;
         down: string;
         arrowLeft: string;
         arrowRight: string;
         doubleLeft: string;
         doubleRight: string;
         ellipsis: string;
+        plus: string;
+        minus: string;
     };
 };
 export default _default;

package/dist/runtime/theme/{app.mjs → app.js}

@@ -5,11 +5,14 @@ export default {
     loading: "i-mdi-loading",
     check: "i-mdi-check-bold",
     indeterminate: "i-mdi-minus-thick",
+    up: "i-mdi-chevron-up",
     down: "i-mdi-chevron-down",
     arrowLeft: "i-mdi-chevron-left",
     arrowRight: "i-mdi-chevron-right",
     doubleLeft: "i-mdi-chevron-double-left",
     doubleRight: "i-mdi-chevron-double-right",
-    ellipsis: "i-mdi-dots-horizontal"
+    ellipsis: "i-mdi-dots-horizontal",
+    plus: "i-mdi-plus",
+    minus: "i-mdi-minus"
   }
 };

package/dist/runtime/theme/badge.d.ts

@@ -50,31 +50,55 @@ declare const _default: {
             };
         };
     };
-    compoundVariants: ({
-        position: "top-right";
-        inset: false;
-        class: {
-            base: string;
+    compoundVariants: import("@byyuurin/ui-kit").CVCompoundVariants<{
+        size: {
+            xs: {
+                root: string;
+            };
+            sm: {
+                root: string;
+            };
+            md: {
+                root: string;
+            };
+            lg: {
+                root: string;
+            };
+            xl: {
+                root: string;
+            };
+        };
+        position: {
+            'top-right': {
+                base: string;
+            };
+            'bottom-right': {
+                base: string;
+            };
+            'top-left': {
+                base: string;
+            };
+            'bottom-left': {
+                base: string;
+            };
         };
-    } | {
-        position: "bottom-right";
-        inset: false;
-        class: {
-            base: string;
+        show: {
+            true: {
+                base: string;
+            };
         };
-    } | {
-        position: "top-left";
-        inset: false;
-        class: {
-            base: string;
+        inset: {
+            true: "";
         };
-    } | {
-        position: "bottom-left";
-        inset: false;
-        class: {
-            base: string;
+        standalone: {
+            false: {
+                base: string;
+            };
         };
-    })[];
+    }, {
+        root: string;
+        base: string[];
+    }, undefined>;
     defaultVariants: {
         size: "md";
     };

package/dist/runtime/theme/{badge.mjs → badge.js}

@@ -5,8 +5,8 @@ export default ct(
     slots: {
       root: "relative inline-flex items-center justify-center shrink-0",
       base: [
-        "inline-block rounded-full ring ring-ui-c1 flex items-center justify-center color-ui-c1 font-medium whitespace-nowrap",
-        "h-1.2em min-w-1.2em p-0.2em text-0.8em bg-solid-ui-fill"
+        "inline-block rounded-full ring ring-ui-cx flex items-center justify-center color-ui-cx font-medium whitespace-nowrap",
+        "h-1.2em min-w-1.2em p-0.2em text-0.8em bg-ui-fill"
       ]
     },
     variants: {

package/dist/runtime/theme/button-group.d.ts

@@ -14,7 +14,7 @@ declare const _default: {
             vertical: "flex flex-col -space-y-px";
         };
     };
-    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
+    compoundVariants: import("@byyuurin/ui-kit").CVCompoundVariants<{
         size: {
             xs: "";
             sm: "";
@@ -27,7 +27,7 @@ declare const _default: {
             vertical: "flex flex-col -space-y-px";
         };
     }, undefined, "relative">;
-    defaultVariants: import("@byyuurin/ui-kit/index").CVDefaultVariants<{
+    defaultVariants: import("@byyuurin/ui-kit").CVDefaultVariants<{
         size: {
             xs: "";
             sm: "";

package/dist/runtime/theme/button.d.ts

@@ -65,124 +65,70 @@ declare const _default: {
             };
         };
     };
-    compoundVariants: ({
-        size: ("xs" | "sm" | "md")[];
-        class: {
-            base: string;
-            label: string;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
-        };
-        active?: undefined;
-        variant?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        size: ("lg" | "xl")[];
-        class: {
-            base: string;
-            label: string;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
-        };
-        active?: undefined;
-        variant?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        active: true;
-        variant: "solid";
-        class: {
-            base: string;
-            label?: undefined;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
+    compoundVariants: import("@byyuurin/ui-kit").CVCompoundVariants<{
+        variant: {
+            solid: {
+                base: string[];
+            };
+            outline: {
+                base: string[];
+            };
+            soft: {
+                base: string[];
+            };
+            'soft-outline': {
+                base: string[];
+            };
+            ghost: {
+                base: string[];
+            };
+            link: {
+                base: string[];
+            };
         };
-        size?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        active: true;
-        variant: "outline";
-        class: {
-            base: string;
-            label?: undefined;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
+        size: {
+            xs: {
+                base: string;
+            };
+            sm: {
+                base: string;
+            };
+            md: {
+                base: string;
+            };
+            lg: {
+                base: string;
+            };
+            xl: {
+                base: string;
+            };
         };
-        size?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        active: true;
-        variant: ("soft" | "soft-outline")[];
-        class: {
-            base: string;
-            label?: undefined;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
+        active: {
+            true: "";
         };
-        size?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        active: true;
-        variant: "ghost";
-        class: {
-            base: string;
-            label?: undefined;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
+        prefix: {
+            true: "";
         };
-        size?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        active: true;
-        variant: "link";
-        class: {
-            base: string;
-            label?: undefined;
-            prefixIcon?: undefined;
-            suffixIcon?: undefined;
+        suffix: {
+            true: "";
         };
-        size?: undefined;
-        loading?: undefined;
-        prefix?: undefined;
-        suffix?: undefined;
-    } | {
-        loading: true;
-        prefix: true;
-        class: {
-            prefixIcon: string;
-            base?: undefined;
-            label?: undefined;
-            suffixIcon?: undefined;
+        loading: {
+            true: "";
         };
-        size?: undefined;
-        active?: undefined;
-        variant?: undefined;
-        suffix?: undefined;
-    } | {
-        loading: true;
-        prefix: false;
-        suffix: true;
-        class: {
-            suffixIcon: string;
-            base?: undefined;
-            label?: undefined;
-            prefixIcon?: undefined;
+        groupOrientation: {
+            horizontal: {
+                base: string;
+            };
+            vertical: {
+                base: string;
+            };
         };
-        size?: undefined;
-        active?: undefined;
-        variant?: undefined;
-    })[];
+    }, {
+        base: string[];
+        label: string;
+        prefixIcon: string;
+        suffixIcon: string;
+    }, undefined>;
     defaultVariants: {
         size: "md";
     };

package/dist/runtime/theme/button.js

@@ -0,0 +1,164 @@
+import { ct } from "@byyuurin/ui-kit";
+import { buttonGroupVariant } from "./button-group.js";
+export default ct(
+  /* @unocss-include */
+  {
+    slots: {
+      base: [
+        "relative inline-flex items-center rounded-ui-button leading-normal transition-colors",
+        "outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ui-cb/80",
+        "disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:opacity-50"
+      ],
+      label: "color-inherit",
+      prefixIcon: "shrink-0 size-1.5em not-only-child:ml-0.5",
+      suffixIcon: "shrink-0 size-1.5em not-only-child:mr-0.5"
+    },
+    variants: {
+      ...buttonGroupVariant,
+      variant: {
+        "solid": {
+          base: [
+            "color-ui-cx bg-soft-ui-fill/85",
+            "hover:bg-soft-ui-fill/75 active:bg-soft-ui-fill/95",
+            "disabled:bg-soft-ui-fill/85 aria-disabled:bg-soft-ui-fill/85",
+            "hover:disabled:bg-soft-ui-fill/85 hover:aria-disabled:bg-soft-ui-fill/85"
+          ]
+        },
+        "outline": {
+          base: [
+            "color-ui-fill/80 bg-ui-cx ring ring-inset ring-ui-fill/30",
+            "hover:bg-soft-ui-fill/5 active:bg-soft-ui-fill/10",
+            "disabled:bg-ui-cx aria-disabled:bg-ui-cx",
+            "hover:disabled:bg-ui-cx hover:aria-disabled:bg-ui-cx"
+          ]
+        },
+        "soft": {
+          base: [
+            "color-ui-content/80 bg-soft-ui-fill/15",
+            "hover:bg-soft-ui-fill/10 hover:color-ui-content/80 active:bg-soft-ui-fill/25 active:color-ui-content/90",
+            "disabled:bg-soft-ui-fill/15 aria-disabled:bg-soft-ui-fill/15 disabled:color-ui-content/80 aria-disabled:color-ui-content/80",
+            "hover:disabled:bg-soft-ui-fill/15 hover:aria-disabled:bg-soft-ui-fill/15 hover:disabled:color-ui-content/80 hover:aria-disabled:color-ui-content/80"
+          ]
+        },
+        "soft-outline": {
+          base: [
+            "color-ui-content/80 bg-soft-ui-fill/15 ring ring-inset ring-ui-fill/30",
+            "hover:bg-soft-ui-fill/10 hover:color-ui-content/80 active:bg-soft-ui-fill/25 active:color-ui-content/90",
+            "disabled:bg-soft-ui-fill/15 aria-disabled:bg-soft-ui-fill/15 disabled:color-ui-content/80 aria-disabled:color-ui-content/80",
+            "hover:disabled:bg-soft-ui-fill/15 hover:aria-disabled:bg-soft-ui-fill/15 hover:disabled:color-ui-content/80 hover:aria-disabled:color-ui-content/80"
+          ]
+        },
+        "ghost": {
+          base: [
+            "color-ui-fill/80 bg-transparent",
+            "hover:bg-soft-ui-fill/5 hover:color-ui-fill/80 active:bg-soft-ui-fill/10 active:color-ui-fill/90",
+            "disabled:bg-transparent aria-disabled:bg-transparent disabled:hover:bg-transparent aria-disabled:hover:bg-transparent disabled:color-ui-fill/80 aria-disabled:color-ui-fill/80",
+            "hover:disabled:bg-transparent hover:aria-disabled:bg-transparent hover:disabled:hover:bg-transparent hover:aria-disabled:hover:bg-transparent hover:disabled:color-ui-fill/80 hover:aria-disabled:color-ui-fill/80"
+          ]
+        },
+        "link": {
+          base: [
+            "color-ui-fill/80 bg-transparent",
+            "hover:color-ui-fill/60 active:color-ui-fill",
+            "disabled:color-ui-fill aria-disabled:color-ui-fill",
+            "hover:disabled:color-ui-fill hover:aria-disabled:color-ui-fill"
+          ]
+        }
+      },
+      size: {
+        xs: {
+          base: "text-xs"
+        },
+        sm: {
+          base: "text-sm"
+        },
+        md: {
+          base: "text-base"
+        },
+        lg: {
+          base: "text-lg"
+        },
+        xl: {
+          base: "text-xl"
+        }
+      },
+      active: {
+        true: ""
+      },
+      prefix: {
+        true: ""
+      },
+      suffix: {
+        true: ""
+      },
+      loading: {
+        true: ""
+      }
+    },
+    compoundVariants: [
+      {
+        size: ["xs", "sm", "md"],
+        class: {
+          base: "p-1.5",
+          label: "px-1"
+        }
+      },
+      {
+        size: ["lg", "xl"],
+        class: {
+          base: "p-2.5",
+          label: "px-2"
+        }
+      },
+      {
+        active: true,
+        variant: "solid",
+        class: {
+          base: "bg-soft-ui-fill/95 hover:bg-soft-ui-fill/95"
+        }
+      },
+      {
+        active: true,
+        variant: "outline",
+        class: {
+          base: "bg-soft-ui-fill/10 hover:bg-soft-ui-fill/30"
+        }
+      },
+      {
+        active: true,
+        variant: ["soft", "soft-outline"],
+        class: {
+          base: "color-ui-content/90 bg-soft-ui-fill/25 hover:color-ui-content/90 hover:bg-soft-ui-fill/25"
+        }
+      },
+      {
+        active: true,
+        variant: "ghost",
+        class: {
+          base: "color-ui-fill/90 bg-soft-ui-fill/10 hover:color-ui-fill/90 hover:bg-soft-ui-fill/10"
+        }
+      },
+      {
+        active: true,
+        variant: "link",
+        class: {
+          base: "color-ui-fill hover:color-ui-fill"
+        }
+      },
+      {
+        loading: true,
+        prefix: true,
+        class: { prefixIcon: "animate-spin" }
+      },
+      {
+        loading: true,
+        prefix: false,
+        suffix: true,
+        class: { suffixIcon: "animate-spin" }
+      }
+    ],
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);

package/dist/runtime/theme/card.d.ts

@@ -9,27 +9,43 @@ declare const _default: {
         description: string;
     };
     variants: {
-        [key: string]: {
-            [key: string]: "" | {
-                root?: import("@byyuurin/ui-kit/index").ClassValue;
-                header?: import("@byyuurin/ui-kit/index").ClassValue;
-                body?: import("@byyuurin/ui-kit/index").ClassValue;
-                title?: import("@byyuurin/ui-kit/index").ClassValue;
-                description?: import("@byyuurin/ui-kit/index").ClassValue;
-                footer?: import("@byyuurin/ui-kit/index").ClassValue;
-            } | null;
+        variant: {
+            solid: {
+                root: string;
+                description: string;
+            };
+            outline: {
+                root: string;
+                description: string;
+            };
+            soft: {
+                root: string;
+                description: string;
+            };
+            'soft-outline': {
+                root: string;
+                description: string;
+            };
         };
     };
-    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
-        [key: string]: {
-            [key: string]: "" | {
-                root?: import("@byyuurin/ui-kit/index").ClassValue;
-                header?: import("@byyuurin/ui-kit/index").ClassValue;
-                body?: import("@byyuurin/ui-kit/index").ClassValue;
-                title?: import("@byyuurin/ui-kit/index").ClassValue;
-                description?: import("@byyuurin/ui-kit/index").ClassValue;
-                footer?: import("@byyuurin/ui-kit/index").ClassValue;
-            } | null;
+    compoundVariants: import("@byyuurin/ui-kit").CVCompoundVariants<{
+        variant: {
+            solid: {
+                root: string;
+                description: string;
+            };
+            outline: {
+                root: string;
+                description: string;
+            };
+            soft: {
+                root: string;
+                description: string;
+            };
+            'soft-outline': {
+                root: string;
+                description: string;
+            };
         };
     }, {
         root: string;
@@ -39,24 +55,8 @@ declare const _default: {
         title: string;
         description: string;
     }, undefined>;
-    defaultVariants: import("@byyuurin/ui-kit/index").CVDefaultVariants<{
-        [key: string]: {
-            [key: string]: "" | {
-                root?: import("@byyuurin/ui-kit/index").ClassValue;
-                header?: import("@byyuurin/ui-kit/index").ClassValue;
-                body?: import("@byyuurin/ui-kit/index").ClassValue;
-                title?: import("@byyuurin/ui-kit/index").ClassValue;
-                description?: import("@byyuurin/ui-kit/index").ClassValue;
-                footer?: import("@byyuurin/ui-kit/index").ClassValue;
-            } | null;
-        };
-    }, {
-        root: string;
-        header: string;
-        body: string;
-        footer: string;
-        title: string;
-        description: string;
-    }>;
+    defaultVariants: {
+        variant: "outline";
+    };
 };
 export default _default;

package/dist/runtime/theme/card.js

@@ -0,0 +1,37 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct(
+  /* @unocss-include */
+  {
+    slots: {
+      root: "rounded-ui-box divide-y",
+      header: "flex flex-wrap items-center gap-1 px-4 py-5 sm:px-6",
+      body: "flex-1 overflow-y-auto p-4 sm:p-6 empty:hidden",
+      footer: "flex items-center gap-1.5 p-4 sm:px-6",
+      title: "flex-grow text-xl font-semibold",
+      description: "w-full"
+    },
+    variants: {
+      variant: {
+        "solid": {
+          root: "color-ui-cx bg-ui-fill divide-ui-cx/20",
+          description: "color-ui-cx/80"
+        },
+        "outline": {
+          root: "color-ui-content bg-ui-cx divide-ui-content/20 ring ring-inset ring-ui-fill/20",
+          description: "color-ui-content/80"
+        },
+        "soft": {
+          root: "color-ui-content bg-soft-ui-fill/10 divide-ui-content/20",
+          description: "color-ui-content/80"
+        },
+        "soft-outline": {
+          root: "color-ui-content bg-soft-ui-fill/10 divide-ui-content/20 ring ring-inset ring-ui-fill/20",
+          description: "color-ui-content/80"
+        }
+      }
+    },
+    defaultVariants: {
+      variant: "outline"
+    }
+  }
+);

package/dist/runtime/theme/carousel.d.ts

@@ -37,7 +37,7 @@ declare const _default: {
             };
         };
     };
-    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
+    compoundVariants: import("@byyuurin/ui-kit").CVCompoundVariants<{
         orientation: {
             vertical: {
                 container: string;
@@ -73,7 +73,7 @@ declare const _default: {
         dots: string;
         dot: string;
     }, undefined>;
-    defaultVariants: import("@byyuurin/ui-kit/index").CVDefaultVariants<{
+    defaultVariants: import("@byyuurin/ui-kit").CVDefaultVariants<{
         orientation: {
             vertical: {
                 container: string;

package/dist/runtime/theme/{carousel.mjs → carousel.js}

@@ -12,7 +12,7 @@ export default ct(
       prev: "rounded-full",
       next: "rounded-full",
       dots: "flex flex-wrap items-center justify-center gap-3",
-      dot: "cursor-pointer size-3 bg-solid-ui-cb/10 rounded-full transition"
+      dot: "cursor-pointer size-3 bg-soft-ui-cb/10 rounded-full transition"
     },
     variants: {
       orientation: {
@@ -35,7 +35,7 @@ export default ct(
       },
       active: {
         true: {
-          dot: "bg-solid-ui-content"
+          dot: "bg-soft-ui-content"
         }
       }
     }