@byyuurin/ui 0.0.0

package/dist/theme/input.d.ts

@@ -0,0 +1,159 @@
+declare const _default: {
+    base: undefined;
+    slots: {
+        root: string;
+        base: string[];
+        prefix: string;
+        prefixIcon: string;
+        suffix: string;
+        suffixIcon: string;
+    };
+    variants: {
+        size: {
+            xs: {
+                root: string;
+            };
+            sm: {
+                root: string;
+            };
+            md: {
+                root: string;
+            };
+            lg: {
+                root: string;
+            };
+            xl: {
+                root: string;
+            };
+        };
+        variant: {
+            outline: {
+                root: string[];
+            };
+            soft: {
+                root: string[];
+            };
+            ghost: {
+                root: string[];
+            };
+            none: {
+                root: string;
+            };
+        };
+        prefix: {
+            true: "";
+        };
+        suffix: {
+            true: "";
+        };
+        loading: {
+            true: "";
+        };
+        underline: {
+            true: "";
+        };
+        highlight: {
+            true: {
+                base: string;
+            };
+        };
+        type: {
+            file: {
+                base: string;
+            };
+        };
+    };
+    compoundVariants: ({
+        variant: ("soft" | "ghost" | "none")[];
+        highlight: false;
+        underline: true;
+        class: {
+            root: string;
+            prefixIcon?: undefined;
+            suffixIcon?: undefined;
+        };
+        size?: undefined;
+        loading?: undefined;
+        prefix?: undefined;
+        suffix?: undefined;
+    } | {
+        size: ("xs" | "sm" | "md")[];
+        class: {
+            root: string;
+            prefixIcon?: undefined;
+            suffixIcon?: undefined;
+        };
+        variant?: undefined;
+        highlight?: undefined;
+        underline?: undefined;
+        loading?: undefined;
+        prefix?: undefined;
+        suffix?: undefined;
+    } | {
+        size: ("lg" | "xl")[];
+        class: {
+            root: string;
+            prefixIcon?: undefined;
+            suffixIcon?: undefined;
+        };
+        variant?: undefined;
+        highlight?: undefined;
+        underline?: undefined;
+        loading?: undefined;
+        prefix?: undefined;
+        suffix?: undefined;
+    } | {
+        variant: ("soft" | "ghost" | "none")[];
+        highlight: true;
+        class: {
+            root: string;
+            prefixIcon?: undefined;
+            suffixIcon?: undefined;
+        };
+        underline?: undefined;
+        size?: undefined;
+        loading?: undefined;
+        prefix?: undefined;
+        suffix?: undefined;
+    } | {
+        variant: "outline"[];
+        highlight: true;
+        class: {
+            root: string;
+            prefixIcon?: undefined;
+            suffixIcon?: undefined;
+        };
+        underline?: undefined;
+        size?: undefined;
+        loading?: undefined;
+        prefix?: undefined;
+        suffix?: undefined;
+    } | {
+        loading: true;
+        prefix: true;
+        class: {
+            prefixIcon: string;
+            root?: undefined;
+            suffixIcon?: undefined;
+        };
+        variant?: undefined;
+        highlight?: undefined;
+        underline?: undefined;
+        size?: undefined;
+        suffix?: undefined;
+    } | {
+        loading: true;
+        prefix: false;
+        suffix: true;
+        class: {
+            suffixIcon: string;
+            root?: undefined;
+            prefixIcon?: undefined;
+        };
+        variant?: undefined;
+        highlight?: undefined;
+        underline?: undefined;
+        size?: undefined;
+    })[];
+};
+export default _default;

package/dist/theme/input.mjs

@@ -0,0 +1,133 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct({
+  slots: {
+    root: "inline-flex items-center gap-x-2 rounded-ui-base transition-colors aria-disabled:opacity-50",
+    base: [
+      "w-full color-inherit bg-transparent border-0 placeholder:color-ui-cb/50",
+      "focus:outline-none",
+      "disabled:cursor-not-allowed"
+    ],
+    prefix: "flex items-center",
+    prefixIcon: "shrink-0 size-1.25em",
+    suffix: "flex items-center",
+    suffixIcon: "shrink-0 size-1.25em"
+  },
+  variants: {
+    size: {
+      xs: {
+        root: "text-xs"
+      },
+      sm: {
+        root: "text-sm"
+      },
+      md: {
+        root: "text-base"
+      },
+      lg: {
+        root: "text-lg"
+      },
+      xl: {
+        root: "text-xl"
+      }
+    },
+    variant: {
+      outline: {
+        root: [
+          "color-ui-cb/80 bg-ui-c1 ring ring-inset ring-ui-cb/50",
+          "focus-within:ring-2 focus-within:ring-ui-cb/50",
+          "aria-disabled:ring-ui-cb/80 hover:aria-disabled:ring-ui-cb/80"
+        ]
+      },
+      soft: {
+        root: [
+          "color-ui-cb/80 bg-ui-cb/4",
+          "hover:bg-ui-cb/6 hover:color-ui-cb/80 focus-within:bg-ui-cb/8 focus-within:color-ui-cb/85",
+          "aria-disabled:color-ui-content/80 aria-disabled:bg-ui-fill/5 hover:aria-disabled:color-ui-content/80 hover:aria-disabled:bg-ui-fill/5"
+        ]
+      },
+      ghost: {
+        root: [
+          "color-ui-cb/80 bg-transparent",
+          "hover:bg-ui-cb/6 hover:color-ui-cb/80 focus-within:bg-ui-cb/8 focus-within:color-ui-cb/85",
+          "aria-disabled:color-ui-fill/80 aria-disabled:bg-transparent hover:aria-disabled:color-ui-fill/80 hover:aria-disabled:bg-transparent"
+        ]
+      },
+      none: {
+        root: "color-ui-cb bg-transparent"
+      }
+    },
+    prefix: {
+      true: ""
+    },
+    suffix: {
+      true: ""
+    },
+    loading: {
+      true: ""
+    },
+    underline: {
+      true: ""
+    },
+    highlight: {
+      true: {
+        base: ""
+      }
+    },
+    type: {
+      file: {
+        base: "prefix-normal not-disabled:cursor-pointer file:pointer-events-none file:py-0 file:font-size-0.875em file:rounded-ui-button file:border-none file:color-ui-c1 file:bg-ui-cb/80"
+      }
+    }
+  },
+  compoundVariants: [
+    {
+      variant: ["soft", "ghost", "none"],
+      highlight: false,
+      underline: true,
+      class: {
+        root: "relative after:content-empty after:absolute after:inset-x-0 after:bottom-0 after:h-1px after:bg-ui-cb/40"
+      }
+    },
+    {
+      size: ["xs", "sm", "md"],
+      class: {
+        root: "p-1.5 px-2.5"
+      }
+    },
+    {
+      size: ["lg", "xl"],
+      class: {
+        root: "p-2.5 px-3.5"
+      }
+    },
+    {
+      variant: ["soft", "ghost", "none"],
+      highlight: true,
+      class: {
+        root: "ring ring-inset ring-ui-fill/80"
+      }
+    },
+    {
+      variant: ["outline"],
+      highlight: true,
+      class: {
+        root: "ring-2 ring-ui-fill/80 focus-within:ring-ui-fill/80"
+      }
+    },
+    {
+      loading: true,
+      prefix: true,
+      class: {
+        prefixIcon: "animate-spin"
+      }
+    },
+    {
+      loading: true,
+      prefix: false,
+      suffix: true,
+      class: {
+        suffixIcon: "animate-spin"
+      }
+    }
+  ]
+});

package/dist/theme/link.d.ts

@@ -0,0 +1,31 @@
+declare const _default: {
+    base: string;
+    slots: undefined;
+    variants: {
+        underline: {
+            true: "border-current";
+            false: "border-transparent";
+        };
+        active: {
+            true: string[];
+            false: string[];
+        };
+        disabled: {
+            true: "cursor-not-allowed opacity-50";
+        };
+    };
+    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
+        underline: {
+            true: "border-current";
+            false: "border-transparent";
+        };
+        active: {
+            true: string[];
+            false: string[];
+        };
+        disabled: {
+            true: "cursor-not-allowed opacity-50";
+        };
+    }, undefined, "border-y border-t-transparent focus-visible:outline-ui-cb">;
+};
+export default _default;

package/dist/theme/link.mjs

@@ -0,0 +1,23 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct({
+  base: "border-y border-t-transparent focus-visible:outline-ui-cb",
+  variants: {
+    underline: {
+      true: "border-current",
+      false: "border-transparent"
+    },
+    active: {
+      true: [
+        "color-ui-fill",
+        "disabled:color-ui-fill aria-disabled:color-ui-fill"
+      ],
+      false: [
+        "color-ui-cb hover:color-ui-cb/80 transition-colors",
+        "disabled:hover:color-ui-cb aria-disabled:hover:color-ui-cb"
+      ]
+    },
+    disabled: {
+      true: "cursor-not-allowed opacity-50"
+    }
+  }
+});

package/dist/theme/modal.d.ts

@@ -0,0 +1,50 @@
+declare const _default: {
+    base: undefined;
+    slots: {
+        overlay: string;
+        content: string;
+        header: string;
+        body: string;
+        footer: string;
+        title: string;
+        description: string;
+        close: string;
+    };
+    variants: {
+        transition: {
+            true: {
+                overlay: string;
+                content: string;
+            };
+        };
+        blur: {
+            true: {
+                overlay: string;
+            };
+        };
+        size: {
+            fullscreen: {
+                content: string;
+            };
+            sm: {
+                content: string;
+            };
+            md: {
+                content: string;
+            };
+            lg: {
+                content: string;
+            };
+            xl: {
+                content: string;
+            };
+        };
+    };
+    compoundVariants: {
+        size: ("sm" | "md" | "lg" | "xl")[];
+        class: {
+            content: string[];
+        };
+    }[];
+};
+export default _default;

package/dist/theme/modal.mjs

@@ -0,0 +1,54 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct({
+  slots: {
+    overlay: "fixed inset-0 bg-ui-c3/75",
+    content: "fixed bg-ui-c1 divide-y divide-ui-cb/10 flex flex-col focus:outline-none",
+    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 color-ui-cb text-xl font-semibold",
+    description: "w-full color-ui-cb/80",
+    close: "ms-auto"
+  },
+  variants: {
+    transition: {
+      true: {
+        overlay: "data-[state=open]:animate-[fade-in_200ms_ease-out] data-[state=closed]:animate-[fade-out_200ms_ease-in]",
+        content: "data-[state=open]:animate-[scale-in_200ms_ease-out] data-[state=closed]:animate-[scale-out_200ms_ease-in]"
+      }
+    },
+    blur: {
+      true: {
+        overlay: "backdrop-blur-sm"
+      }
+    },
+    size: {
+      fullscreen: {
+        content: "inset-0"
+      },
+      sm: {
+        content: "w-screen-sm"
+      },
+      md: {
+        content: "w-screen-md"
+      },
+      lg: {
+        content: "w-screen-lg"
+      },
+      xl: {
+        content: "w-screen-xl"
+      }
+    }
+  },
+  compoundVariants: [
+    {
+      size: ["sm", "md", "lg", "xl"],
+      class: {
+        content: [
+          "bottom-4 left-[50%] translate-x-[-50%] h-auto max-w-[calc(100%-2rem)] max-h-[calc(100%-2rem)] ring ring-ui-c2",
+          "sm:bottom-auto sm:top-[50%] sm:translate-y-[-50%] sm:rounded-ui-box sm:shadow-lg"
+        ]
+      }
+    }
+  ]
+});

package/dist/theme/popover.d.ts

@@ -0,0 +1,27 @@
+declare const _default: {
+    base: undefined;
+    slots: {
+        content: string[];
+        arrow: string;
+    };
+    variants: {
+        [key: string]: {
+            [key: string]: "" | {
+                content?: import("@byyuurin/ui-kit/index").ClassValue;
+                arrow?: import("@byyuurin/ui-kit/index").ClassValue;
+            } | null;
+        };
+    };
+    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
+        [key: string]: {
+            [key: string]: "" | {
+                content?: import("@byyuurin/ui-kit/index").ClassValue;
+                arrow?: import("@byyuurin/ui-kit/index").ClassValue;
+            } | null;
+        };
+    }, {
+        content: string[];
+        arrow: string;
+    }, undefined>;
+};
+export default _default;

package/dist/theme/popover.mjs

@@ -0,0 +1,10 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct({
+  slots: {
+    content: [
+      "color-ui-base bg-ui-base shadow-lg rounded-ui-box ring ring-ui-base/10",
+      "data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] focus:outline-none pointer-events-auto"
+    ],
+    arrow: "fill-ui-base stroke-ui-cb/10"
+  }
+});

package/dist/theme/radioGroup.d.ts

@@ -0,0 +1,131 @@
+declare const _default: {
+    base: undefined;
+    slots: {
+        root: string;
+        fieldset: string;
+        legend: string;
+        item: string;
+        base: string;
+        indicator: string;
+        container: string;
+        wrapper: string;
+        label: string;
+        description: string;
+    };
+    variants: {
+        orientation: {
+            horizontal: {
+                fieldset: string;
+                wrapper: string;
+            };
+            vertical: {
+                fieldset: string;
+            };
+        };
+        size: {
+            xs: {
+                root: string;
+            };
+            sm: {
+                root: string;
+            };
+            md: {
+                root: string;
+            };
+            lg: {
+                root: string;
+            };
+            xl: {
+                root: string;
+            };
+        };
+        dot: {
+            true: {
+                indicator: string;
+            };
+        };
+        round: {
+            true: {
+                base: string;
+                indicator: string;
+            };
+        };
+        disabled: {
+            true: {
+                root: string;
+            };
+            false: {
+                label: string;
+            };
+        };
+        required: {
+            true: {
+                legend: string;
+            };
+        };
+    };
+    compoundVariants: import("@byyuurin/ui-kit/index").CVCompoundVariants<{
+        orientation: {
+            horizontal: {
+                fieldset: string;
+                wrapper: string;
+            };
+            vertical: {
+                fieldset: string;
+            };
+        };
+        size: {
+            xs: {
+                root: string;
+            };
+            sm: {
+                root: string;
+            };
+            md: {
+                root: string;
+            };
+            lg: {
+                root: string;
+            };
+            xl: {
+                root: string;
+            };
+        };
+        dot: {
+            true: {
+                indicator: string;
+            };
+        };
+        round: {
+            true: {
+                base: string;
+                indicator: string;
+            };
+        };
+        disabled: {
+            true: {
+                root: string;
+            };
+            false: {
+                label: string;
+            };
+        };
+        required: {
+            true: {
+                legend: string;
+            };
+        };
+    }, {
+        root: string;
+        fieldset: string;
+        legend: string;
+        item: string;
+        base: string;
+        indicator: string;
+        container: string;
+        wrapper: string;
+        label: string;
+        description: string;
+    }, undefined>;
+};
+export default _default;

package/dist/theme/radioGroup.mjs

@@ -0,0 +1,67 @@
+import { ct } from "@byyuurin/ui-kit";
+export default ct({
+  slots: {
+    root: "relative",
+    fieldset: "flex flex-wrap gap-0.5em",
+    legend: "mb-1 block font-medium color-ui-cb",
+    item: "flex items-start",
+    base: "size-1.25em rounded-ui-base ring ring-inset ring-ui-cb focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ui-cb",
+    indicator: "flex items-center justify-center size-full rounded-ui-base bg-ui-fill",
+    container: "h-1.5em flex items-center",
+    wrapper: "ms-2",
+    label: "block font-medium color-ui-cb",
+    description: "color-ui-cb/60"
+  },
+  variants: {
+    orientation: {
+      horizontal: {
+        fieldset: "flex-row",
+        wrapper: "me-2"
+      },
+      vertical: {
+        fieldset: "flex-col"
+      }
+    },
+    size: {
+      xs: {
+        root: "text-xs"
+      },
+      sm: {
+        root: "text-sm"
+      },
+      md: {
+        root: "text-base"
+      },
+      lg: {
+        root: "text-lg"
+      },
+      xl: {
+        root: "text-xl"
+      }
+    },
+    dot: {
+      true: {
+        indicator: "after:content-empty after:size-0.75em after:bg-ui-c1 after:rounded-ui-base"
+      }
+    },
+    round: {
+      true: {
+        base: "rounded-full",
+        indicator: "rounded-full after:rounded-full"
+      }
+    },
+    disabled: {
+      true: {
+        root: "opacity-50 after:content-empty after:absolute after:inset-0 after:cursor-not-allowed"
+      },
+      false: {
+        label: "cursor-pointer"
+      }
+    },
+    required: {
+      true: {
+        legend: "after:content-['*'] after:ms-0.5"
+      }
+    }
+  }
+});