@hyunsdev/ui 0.1.0

package/dist/components/item.js

@@ -0,0 +1,182 @@
+import {
+  Separator
+} from "../chunk-6ANDNGHD.js";
+import {
+  cn
+} from "../chunk-DN2AEEA2.js";
+
+// src/components/item.tsx
+import "react";
+import * as Slot from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+function ItemGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "list",
+      "data-slot": "item-group",
+      className: cn(
+        "group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ItemSeparator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Separator,
+    {
+      "data-slot": "item-separator",
+      orientation: "horizontal",
+      className: cn("my-2", className),
+      ...props
+    }
+  );
+}
+var itemVariants = cva(
+  "group/item flex w-full flex-wrap items-center rounded-lg border text-sm transition-colors duration-100 outline-none focus-visible:border-focus-ring focus-visible:ring-3 focus-visible:ring-focus-ring [a]:transition-colors [a]:hover:bg-background-modifier-hover",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent",
+        outline: "border-border",
+        muted: "border-transparent bg-background-secondary text-text-normal"
+      },
+      size: {
+        default: "gap-2.5 px-3 py-2.5",
+        sm: "gap-2.5 px-3 py-2.5",
+        xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Item({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot.Root : "div";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "item",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(itemVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+var itemMediaVariants = cva(
+  "flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        icon: "[&_svg:not([class*='size-'])]:size-4",
+        image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function ItemMedia({
+  className,
+  variant = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "item-media",
+      "data-variant": variant,
+      className: cn(itemMediaVariants({ variant, className })),
+      ...props
+    }
+  );
+}
+function ItemContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "item-content",
+      className: cn(
+        "flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ItemTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "item-title",
+      className: cn(
+        "font-heading line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ItemDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      "data-slot": "item-description",
+      className: cn(
+        "text-text-muted [&>a:hover]:text-text-accent-hover line-clamp-2 text-left text-sm leading-normal font-normal group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ItemActions({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "item-actions", className: cn("flex items-center gap-2", className), ...props });
+}
+function ItemHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "item-header",
+      className: cn("flex basis-full items-center justify-between gap-2", className),
+      ...props
+    }
+  );
+}
+function ItemFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "item-footer",
+      className: cn("flex basis-full items-center justify-between gap-2", className),
+      ...props
+    }
+  );
+}
+export {
+  Item,
+  ItemActions,
+  ItemContent,
+  ItemDescription,
+  ItemFooter,
+  ItemGroup,
+  ItemHeader,
+  ItemMedia,
+  ItemSeparator,
+  ItemTitle
+};
+//# sourceMappingURL=item.js.map

package/dist/components/item.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/item.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport * as Slot from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { Separator } from \"@hyunsdev/ui/components/separator\"\nimport { cn } from \"@hyunsdev/ui/lib/utils\"\n\nfunction ItemGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      role=\"list\"\n      data-slot=\"item-group\"\n      className={cn(\n        \"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"item-separator\"\n      orientation=\"horizontal\"\n      className={cn(\"my-2\", className)}\n      {...props}\n    />\n  )\n}\n\nconst itemVariants = cva(\n  \"group/item flex w-full flex-wrap items-center rounded-lg border text-sm transition-colors duration-100 outline-none focus-visible:border-focus-ring focus-visible:ring-3 focus-visible:ring-focus-ring [a]:transition-colors [a]:hover:bg-background-modifier-hover\",\n  {\n    variants: {\n      variant: {\n        default: \"border-transparent\",\n        outline: \"border-border\",\n        muted: \"border-transparent bg-background-secondary text-text-normal\",\n      },\n      size: {\n        default: \"gap-2.5 px-3 py-2.5\",\n        sm: \"gap-2.5 px-3 py-2.5\",\n        xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n)\n\nfunction Item({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof itemVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"div\"\n  return (\n    <Comp\n      data-slot=\"item\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(itemVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nconst itemMediaVariants = cva(\n  \"flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        icon: \"[&_svg:not([class*='size-'])]:size-4\",\n        image:\n          \"size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n)\n\nfunction ItemMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>) {\n  return (\n    <div\n      data-slot=\"item-media\"\n      data-variant={variant}\n      className={cn(itemMediaVariants({ variant, className }))}\n      {...props}\n    />\n  )\n}\n\nfunction ItemContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-content\"\n      className={cn(\n        \"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-title\"\n      className={cn(\n        \"font-heading line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"item-description\"\n      className={cn(\n        \"text-text-muted [&>a:hover]:text-text-accent-hover line-clamp-2 text-left text-sm leading-normal font-normal group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ItemActions({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"item-actions\" className={cn(\"flex items-center gap-2\", className)} {...props} />\n  )\n}\n\nfunction ItemHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-header\"\n      className={cn(\"flex basis-full items-center justify-between gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction ItemFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-footer\"\n      className={cn(\"flex basis-full items-center justify-between gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Item,\n  ItemMedia,\n  ItemContent,\n  ItemActions,\n  ItemGroup,\n  ItemSeparator,\n  ItemTitle,\n  ItemDescription,\n  ItemHeader,\n  ItemFooter,\n}\n"],"mappings":"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","names":[]}

package/dist/components/kbd.d.ts

@@ -0,0 +1,6 @@
+import * as React$1 from 'react';
+
+declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): React$1.JSX.Element;
+declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): React$1.JSX.Element;
+
+export { Kbd, KbdGroup };

package/dist/components/kbd.js

@@ -0,0 +1,34 @@
+import {
+  cn
+} from "../chunk-DN2AEEA2.js";
+
+// src/components/kbd.tsx
+import { jsx } from "react/jsx-runtime";
+function Kbd({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "kbd",
+    {
+      "data-slot": "kbd",
+      className: cn(
+        "bg-background-secondary text-text-muted in-data-[slot=tooltip-content]:bg-background-primary/20 in-data-[slot=tooltip-content]:text-tooltip-text pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm px-1 font-sans text-xs font-medium select-none [&_svg:not([class*='size-'])]:size-3",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function KbdGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "kbd",
+    {
+      "data-slot": "kbd-group",
+      className: cn("inline-flex items-center gap-1", className),
+      ...props
+    }
+  );
+}
+export {
+  Kbd,
+  KbdGroup
+};
+//# sourceMappingURL=kbd.js.map

package/dist/components/kbd.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/kbd.tsx"],"sourcesContent":["import { cn } from \"@hyunsdev/ui/lib/utils\"\n\nfunction Kbd({ className, ...props }: React.ComponentProps<\"kbd\">) {\n  return (\n    <kbd\n      data-slot=\"kbd\"\n      className={cn(\n        \"bg-background-secondary text-text-muted in-data-[slot=tooltip-content]:bg-background-primary/20 in-data-[slot=tooltip-content]:text-tooltip-text pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm px-1 font-sans text-xs font-medium select-none [&_svg:not([class*='size-'])]:size-3\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction KbdGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <kbd\n      data-slot=\"kbd-group\"\n      className={cn(\"inline-flex items-center gap-1\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Kbd, KbdGroup }\n"],"mappings":";;;;;AAII;AAFJ,SAAS,IAAI,EAAE,WAAW,GAAG,MAAM,GAAgC;AACjE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAgC;AACtE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,kCAAkC,SAAS;AAAA,MACxD,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/label.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+
+declare function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): React.JSX.Element;
+
+export { Label };

package/dist/components/label.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  Label
+} from "../chunk-WIEKNG4S.js";
+import "../chunk-DN2AEEA2.js";
+export {
+  Label
+};
+//# sourceMappingURL=label.js.map

package/dist/components/label.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/loading-bar.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+
+type LoadingBarProps = React.ComponentProps<"div"> & {
+    complete?: boolean;
+};
+declare function LoadingBar({ className, complete, ...props }: LoadingBarProps): React.JSX.Element;
+
+export { LoadingBar };

package/dist/components/loading-bar.js

@@ -0,0 +1,127 @@
+"use client";
+import {
+  cn
+} from "../chunk-DN2AEEA2.js";
+
+// src/components/loading-bar.tsx
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function LoadingBar({ className, complete = false, ...props }) {
+  const [phase, setPhase] = React.useState(
+    () => complete ? "finishing" : "loading"
+  );
+  React.useEffect(() => {
+    setPhase(complete ? "finishing" : "loading");
+  }, [complete]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "progressbar",
+      "aria-label": "Loading",
+      "aria-busy": phase === "loading" ? true : void 0,
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      "aria-valuenow": phase === "finishing" ? 100 : void 0,
+      "data-slot": "loading-bar",
+      "data-state": phase,
+      className: cn(
+        "bg-border relative h-1 w-full overflow-hidden rounded-full",
+        "before:bg-interactive-accent/15 before:absolute before:inset-0",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("style", { children: `
+          .loadingBar_Et4z {
+            --loading-bar-duration: 2.5s;
+            --loading-bar-delay: calc(var(--loading-bar-duration) / -2);
+            --loading-bar-gradient: color-mix(
+              in oklab,
+              var(--interactive-accent) 58%,
+              transparent
+            );
+            --loading-bar-gradient-strong: color-mix(
+              in oklab,
+              var(--interactive-accent-hover) 88%,
+              transparent
+            );
+            background-image:
+              linear-gradient(
+                90deg,
+                transparent 0%,
+                var(--loading-bar-gradient) 28%,
+                var(--loading-bar-gradient-strong) 50%,
+                var(--loading-bar-gradient) 72%,
+                transparent 100%
+              );
+            will-change: transform;
+          }
+
+          .loadingBar_Et4z[data-state="loading"] {
+            width: 56%;
+            animation: loadingBar_flow_Et4z var(--loading-bar-duration) cubic-bezier(0.05, 0.6, 0.8, 0.25) infinite;
+          }
+
+          .loadingBar_Et4z[data-offset="true"][data-state="loading"] {
+            animation-delay: var(--loading-bar-delay);
+          }
+
+          .loadingBar_Et4z[data-state="finishing"] {
+            background-color: var(--interactive-accent);
+            background-image: none;
+            width: 100%;
+            transform-origin: left center;
+            animation: loadingBar_finish_Et4z 560ms cubic-bezier(0.5, 1, 0.36, 1) forwards;
+          }
+
+          .loadingBar_Et4z[data-offset="true"][data-state="finishing"] {
+            display: none;
+          }
+
+          @keyframes loadingBar_flow_Et4z {
+            0% { transform: translateX(-115%); }
+            100% { transform: translateX(205%); }
+          }
+
+          @keyframes loadingBar_finish_Et4z {
+            0% { transform: scaleX(0); }
+            100% { transform: scaleX(1); }
+          }
+
+          @media (prefers-reduced-motion: reduce) {
+            .loadingBar_Et4z[data-state="loading"] {
+              width: 100%;
+              animation: loadingBar_reduce_Et4z 1.6s ease-in-out infinite;
+            }
+
+            .loadingBar_Et4z[data-offset="true"][data-state="loading"] {
+              display: none;
+            }
+
+            .loadingBar_Et4z[data-state="finishing"] {
+              animation-duration: 1ms;
+            }
+          }
+
+          @keyframes loadingBar_reduce_Et4z {
+            0%, 100% { opacity: 0.38; }
+            50% { opacity: 0.86; }
+          }
+        ` }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            "data-slot": "loading-bar-indicator",
+            "data-state": phase,
+            className: "loadingBar_Et4z absolute inset-y-0 left-0 rounded-full"
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  LoadingBar
+};
+//# sourceMappingURL=loading-bar.js.map

package/dist/components/loading-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/loading-bar.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"@hyunsdev/ui/lib/utils\"\n\ntype LoadingBarProps = React.ComponentProps<\"div\"> & {\n  complete?: boolean\n}\n\nfunction LoadingBar({ className, complete = false, ...props }: LoadingBarProps) {\n  const [phase, setPhase] = React.useState<\"loading\" | \"finishing\">(() =>\n    complete ? \"finishing\" : \"loading\",\n  )\n\n  React.useEffect(() => {\n    setPhase(complete ? \"finishing\" : \"loading\")\n  }, [complete])\n\n  return (\n    <div\n      role=\"progressbar\"\n      aria-label=\"Loading\"\n      aria-busy={phase === \"loading\" ? true : undefined}\n      aria-valuemin={0}\n      aria-valuemax={100}\n      aria-valuenow={phase === \"finishing\" ? 100 : undefined}\n      data-slot=\"loading-bar\"\n      data-state={phase}\n      className={cn(\n        \"bg-border relative h-1 w-full overflow-hidden rounded-full\",\n        \"before:bg-interactive-accent/15 before:absolute before:inset-0\",\n        className,\n      )}\n      {...props}\n    >\n      <style>\n        {`\n          .loadingBar_Et4z {\n            --loading-bar-duration: 2.5s;\n            --loading-bar-delay: calc(var(--loading-bar-duration) / -2);\n            --loading-bar-gradient: color-mix(\n              in oklab,\n              var(--interactive-accent) 58%,\n              transparent\n            );\n            --loading-bar-gradient-strong: color-mix(\n              in oklab,\n              var(--interactive-accent-hover) 88%,\n              transparent\n            );\n            background-image:\n              linear-gradient(\n                90deg,\n                transparent 0%,\n                var(--loading-bar-gradient) 28%,\n                var(--loading-bar-gradient-strong) 50%,\n                var(--loading-bar-gradient) 72%,\n                transparent 100%\n              );\n            will-change: transform;\n          }\n\n          .loadingBar_Et4z[data-state=\"loading\"] {\n            width: 56%;\n            animation: loadingBar_flow_Et4z var(--loading-bar-duration) cubic-bezier(0.05, 0.6, 0.8, 0.25) infinite;\n          }\n\n          .loadingBar_Et4z[data-offset=\"true\"][data-state=\"loading\"] {\n            animation-delay: var(--loading-bar-delay);\n          }\n\n          .loadingBar_Et4z[data-state=\"finishing\"] {\n            background-color: var(--interactive-accent);\n            background-image: none;\n            width: 100%;\n            transform-origin: left center;\n            animation: loadingBar_finish_Et4z 560ms cubic-bezier(0.5, 1, 0.36, 1) forwards;\n          }\n\n          .loadingBar_Et4z[data-offset=\"true\"][data-state=\"finishing\"] {\n            display: none;\n          }\n\n          @keyframes loadingBar_flow_Et4z {\n            0% { transform: translateX(-115%); }\n            100% { transform: translateX(205%); }\n          }\n\n          @keyframes loadingBar_finish_Et4z {\n            0% { transform: scaleX(0); }\n            100% { transform: scaleX(1); }\n          }\n\n          @media (prefers-reduced-motion: reduce) {\n            .loadingBar_Et4z[data-state=\"loading\"] {\n              width: 100%;\n              animation: loadingBar_reduce_Et4z 1.6s ease-in-out infinite;\n            }\n\n            .loadingBar_Et4z[data-offset=\"true\"][data-state=\"loading\"] {\n              display: none;\n            }\n\n            .loadingBar_Et4z[data-state=\"finishing\"] {\n              animation-duration: 1ms;\n            }\n          }\n\n          @keyframes loadingBar_reduce_Et4z {\n            0%, 100% { opacity: 0.38; }\n            50% { opacity: 0.86; }\n          }\n        `}\n      </style>\n      <span\n        aria-hidden=\"true\"\n        data-slot=\"loading-bar-indicator\"\n        data-state={phase}\n        className=\"loadingBar_Et4z absolute inset-y-0 left-0 rounded-full\"\n      />\n      {/* <span\n        aria-hidden=\"true\"\n        data-offset=\"true\"\n        data-slot=\"loading-bar-indicator\"\n        data-state={phase}\n        className=\"loadingBar_Et4z absolute inset-y-0 left-0 rounded-full\"\n      /> */}\n    </div>\n  )\n}\n\nexport { LoadingBar }\n"],"mappings":";;;;;;AAEA,YAAY,WAAW;AAkBnB,SAgBE,KAhBF;AAVJ,SAAS,WAAW,EAAE,WAAW,WAAW,OAAO,GAAG,MAAM,GAAoB;AAC9E,QAAM,CAAC,OAAO,QAAQ,IAAU;AAAA,IAAkC,MAChE,WAAW,cAAc;AAAA,EAC3B;AAEA,EAAM,gBAAU,MAAM;AACpB,aAAS,WAAW,cAAc,SAAS;AAAA,EAC7C,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAW;AAAA,MACX,aAAW,UAAU,YAAY,OAAO;AAAA,MACxC,iBAAe;AAAA,MACf,iBAAe;AAAA,MACf,iBAAe,UAAU,cAAc,MAAM;AAAA,MAC7C,aAAU;AAAA,MACV,cAAY;AAAA,MACZ,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,4BAAC,WACE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WA6EH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,aAAU;AAAA,YACV,cAAY;AAAA,YACZ,WAAU;AAAA;AAAA,QACZ;AAAA;AAAA;AAAA,EAQF;AAEJ;","names":[]}

package/dist/components/loading-dots.d.ts

@@ -0,0 +1,5 @@
+import * as React$1 from 'react';
+
+declare function LoadingDots({ className, ...props }: React.ComponentProps<"svg">): React$1.JSX.Element;
+
+export { LoadingDots };

package/dist/components/loading-dots.js

@@ -0,0 +1,45 @@
+import {
+  cn
+} from "../chunk-DN2AEEA2.js";
+
+// src/components/loading-dots.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function LoadingDots({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      role: "status",
+      "aria-label": "Loading",
+      viewBox: "0 0 24 24",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "currentColor",
+      className: cn("size-4", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("style", { children: `
+          .loadingDots_dot {
+            opacity: 0.28;
+            animation: loadingDots_fade 1.2s ease-in-out infinite;
+          }
+
+          .loadingDots_dot--1 { animation-delay: 0s; }
+          .loadingDots_dot--2 { animation-delay: 0.2s; }
+          .loadingDots_dot--3 { animation-delay: 0.4s; }
+
+          @keyframes loadingDots_fade {
+            0%, 100% { opacity: 0.28; }
+            30% { opacity: 1; }
+            60% { opacity: 0.48; }
+          }
+        ` }),
+        /* @__PURE__ */ jsx("circle", { className: "loadingDots_dot loadingDots_dot--1", cx: "5", cy: "12", r: "2.5" }),
+        /* @__PURE__ */ jsx("circle", { className: "loadingDots_dot loadingDots_dot--2", cx: "12", cy: "12", r: "2.5" }),
+        /* @__PURE__ */ jsx("circle", { className: "loadingDots_dot loadingDots_dot--3", cx: "19", cy: "12", r: "2.5" })
+      ]
+    }
+  );
+}
+export {
+  LoadingDots
+};
+//# sourceMappingURL=loading-dots.js.map

package/dist/components/loading-dots.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/loading-dots.tsx"],"sourcesContent":["import { cn } from \"@hyunsdev/ui/lib/utils\"\n\nfunction LoadingDots({ className, ...props }: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      role=\"status\"\n      aria-label=\"Loading\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      fill=\"currentColor\"\n      className={cn(\"size-4\", className)}\n      {...props}\n    >\n      <style>\n        {`\n          .loadingDots_dot {\n            opacity: 0.28;\n            animation: loadingDots_fade 1.2s ease-in-out infinite;\n          }\n\n          .loadingDots_dot--1 { animation-delay: 0s; }\n          .loadingDots_dot--2 { animation-delay: 0.2s; }\n          .loadingDots_dot--3 { animation-delay: 0.4s; }\n\n          @keyframes loadingDots_fade {\n            0%, 100% { opacity: 0.28; }\n            30% { opacity: 1; }\n            60% { opacity: 0.48; }\n          }\n        `}\n      </style>\n\n      <circle className=\"loadingDots_dot loadingDots_dot--1\" cx=\"5\" cy=\"12\" r=\"2.5\" />\n      <circle className=\"loadingDots_dot loadingDots_dot--2\" cx=\"12\" cy=\"12\" r=\"2.5\" />\n      <circle className=\"loadingDots_dot loadingDots_dot--3\" cx=\"19\" cy=\"12\" r=\"2.5\" />\n    </svg>\n  )\n}\n\nexport { LoadingDots }\n"],"mappings":";;;;;AAII,SASE,KATF;AAFJ,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAgC;AACzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAW;AAAA,MACX,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,MAAK;AAAA,MACL,WAAW,GAAG,UAAU,SAAS;AAAA,MAChC,GAAG;AAAA,MAEJ;AAAA,4BAAC,WACE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAgBH;AAAA,QAEA,oBAAC,YAAO,WAAU,sCAAqC,IAAG,KAAI,IAAG,MAAK,GAAE,OAAM;AAAA,QAC9E,oBAAC,YAAO,WAAU,sCAAqC,IAAG,MAAK,IAAG,MAAK,GAAE,OAAM;AAAA,QAC/E,oBAAC,YAAO,WAAU,sCAAqC,IAAG,MAAK,IAAG,MAAK,GAAE,OAAM;AAAA;AAAA;AAAA,EACjF;AAEJ;","names":[]}

package/dist/components/main-provider.d.ts

@@ -0,0 +1,7 @@
+import * as React$1 from 'react';
+
+declare function MainProvider({ children }: {
+    children: React.ReactNode;
+}): React$1.JSX.Element;
+
+export { MainProvider };

package/dist/components/main-provider.js

@@ -0,0 +1,12 @@
+import {
+  MainProvider
+} from "../chunk-WIZ4OLOB.js";
+import "../chunk-23KUNTRD.js";
+import "../chunk-D3SP7GL3.js";
+import "../chunk-UXCBLYG6.js";
+import "../chunk-3RTSANKB.js";
+import "../chunk-DN2AEEA2.js";
+export {
+  MainProvider
+};
+//# sourceMappingURL=main-provider.js.map

package/dist/components/main-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/components/mark.d.ts

@@ -0,0 +1,11 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const markVariants: (props?: ({
+    variant?: "default" | "accent" | "error" | "muted" | "info" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type MarkVariant = NonNullable<VariantProps<typeof markVariants>["variant"]>;
+declare function Mark({ className, variant, ...props }: React.ComponentProps<"mark"> & VariantProps<typeof markVariants>): React.JSX.Element;
+
+export { Mark, type MarkVariant, markVariants };

package/dist/components/mark.js

@@ -0,0 +1,44 @@
+import {
+  cn
+} from "../chunk-DN2AEEA2.js";
+
+// src/components/mark.tsx
+import "react";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var markVariants = cva("box-decoration-clone px-0.5 py-px text-text-normal", {
+  variants: {
+    variant: {
+      default: "bg-text-highlight-background",
+      accent: "bg-interactive-accent text-text-on-accent",
+      info: "bg-background-info text-text-info",
+      success: "bg-background-success text-text-success",
+      warning: "bg-background-warning text-text-warning",
+      error: "bg-background-error text-text-error",
+      muted: "bg-background-secondary text-text-muted"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+function Mark({
+  className,
+  variant = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "mark",
+    {
+      "data-slot": "mark",
+      "data-variant": variant,
+      className: cn(markVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+export {
+  Mark,
+  markVariants
+};
+//# sourceMappingURL=mark.js.map

package/dist/components/mark.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/mark.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@hyunsdev/ui/lib/utils\"\n\nconst markVariants = cva(\"box-decoration-clone px-0.5 py-px text-text-normal\", {\n  variants: {\n    variant: {\n      default: \"bg-text-highlight-background\",\n      accent: \"bg-interactive-accent text-text-on-accent\",\n      info: \"bg-background-info text-text-info\",\n      success: \"bg-background-success text-text-success\",\n      warning: \"bg-background-warning text-text-warning\",\n      error: \"bg-background-error text-text-error\",\n      muted: \"bg-background-secondary text-text-muted\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n})\n\ntype MarkVariant = NonNullable<VariantProps<typeof markVariants>[\"variant\"]>\n\nfunction Mark({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"mark\"> & VariantProps<typeof markVariants>) {\n  return (\n    <mark\n      data-slot=\"mark\"\n      data-variant={variant}\n      className={cn(markVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Mark, markVariants, type MarkVariant }\n"],"mappings":";;;;;AAAA,OAAuB;AAEvB,SAAS,WAA8B;AA6BnC;AAzBJ,IAAM,eAAe,IAAI,sDAAsD;AAAA,EAC7E,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAID,SAAS,KAAK;AAAA,EACZ;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAqE;AACnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;AAAA,MACjD,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/pagination.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { Button } from './button.js';
+import 'class-variance-authority/types';
+import 'class-variance-authority';
+
+declare function Pagination({ className, ...props }: React.ComponentProps<"nav">): React.JSX.Element;
+declare function PaginationContent({ className, ...props }: React.ComponentProps<"ul">): React.JSX.Element;
+declare function PaginationItem({ ...props }: React.ComponentProps<"li">): React.JSX.Element;
+type PaginationLinkProps = {
+    isActive?: boolean;
+} & Pick<React.ComponentProps<typeof Button>, "size"> & React.ComponentProps<"a">;
+declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): React.JSX.Element;
+declare function PaginationPrevious({ className, text, ...props }: React.ComponentProps<typeof PaginationLink> & {
+    text?: string;
+}): React.JSX.Element;
+declare function PaginationNext({ className, text, ...props }: React.ComponentProps<typeof PaginationLink> & {
+    text?: string;
+}): React.JSX.Element;
+declare function PaginationEllipsis({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };