@7onic-ui/react 0.3.8 → 0.3.10

package/dist/chunk-NWFMJWGX.mjs

@@ -0,0 +1,165 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/breadcrumb.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+var BreadcrumbContext = React.createContext({});
+var useBreadcrumbContext = () => React.useContext(BreadcrumbContext);
+function ChevronRightIcon({ className }) {
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      className,
+      fill: "none",
+      viewBox: "0 0 24 24",
+      stroke: "currentColor",
+      strokeWidth: 2
+    },
+    /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })
+  );
+}
+function EllipsisIcon({ className }) {
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      className,
+      fill: "currentColor",
+      viewBox: "0 0 24 24"
+    },
+    /* @__PURE__ */ React.createElement("circle", { cx: "6", cy: "12", r: "1.5" }),
+    /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "1.5" }),
+    /* @__PURE__ */ React.createElement("circle", { cx: "18", cy: "12", r: "1.5" })
+  );
+}
+var breadcrumbSizeMap = {
+  sm: { text: "text-xs", icon: "icon-xs", gap: "gap-1.5" },
+  default: { text: "text-sm", icon: "icon-xs", gap: "gap-2" },
+  lg: { text: "text-md", icon: "icon-sm", gap: "gap-2" }
+};
+var Breadcrumb = React.forwardRef(
+  ({ className, separator, size = "default", ...props }, ref) => /* @__PURE__ */ React.createElement(BreadcrumbContext.Provider, { value: { size, separator } }, /* @__PURE__ */ React.createElement(
+    "nav",
+    {
+      ref,
+      "aria-label": "breadcrumb",
+      className: cn("", className),
+      ...props
+    }
+  ))
+);
+Breadcrumb.displayName = "Breadcrumb";
+var BreadcrumbList = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { size = "default" } = useBreadcrumbContext();
+    const sizeClass = breadcrumbSizeMap[size];
+    return /* @__PURE__ */ React.createElement(
+      "ol",
+      {
+        ref,
+        className: cn(
+          "flex flex-wrap items-center",
+          sizeClass.gap,
+          sizeClass.text,
+          "text-text-muted",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+BreadcrumbList.displayName = "BreadcrumbList";
+var BreadcrumbItem = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+    "li",
+    {
+      ref,
+      className: cn("inline-flex items-center gap-1.5", className),
+      ...props
+    }
+  )
+);
+BreadcrumbItem.displayName = "BreadcrumbItem";
+var BreadcrumbLink = React.forwardRef(
+  ({ asChild, className, ...props }, ref) => {
+    const Comp = asChild ? Slot : "a";
+    return /* @__PURE__ */ React.createElement(
+      Comp,
+      {
+        ref,
+        className: cn(
+          "transition-colors duration-fast hover:text-foreground",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+BreadcrumbLink.displayName = "BreadcrumbLink";
+var BreadcrumbPage = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+    "span",
+    {
+      ref,
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page",
+      className: cn("text-foreground", className),
+      ...props
+    }
+  )
+);
+BreadcrumbPage.displayName = "BreadcrumbPage";
+var BreadcrumbSeparator = React.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    const { separator, size = "default" } = useBreadcrumbContext();
+    const sizeClass = breadcrumbSizeMap[size];
+    return /* @__PURE__ */ React.createElement(
+      "li",
+      {
+        ref,
+        role: "presentation",
+        "aria-hidden": "true",
+        className: cn("flex items-center text-text-subtle", className),
+        ...props
+      },
+      children ?? separator ?? /* @__PURE__ */ React.createElement(ChevronRightIcon, { className: sizeClass.icon })
+    );
+  }
+);
+BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
+var BreadcrumbEllipsis = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { size = "default" } = useBreadcrumbContext();
+    const sizeClass = breadcrumbSizeMap[size];
+    return /* @__PURE__ */ React.createElement(
+      "span",
+      {
+        ref,
+        role: "presentation",
+        "aria-hidden": "true",
+        className: cn("flex items-center justify-center", className),
+        ...props
+      },
+      /* @__PURE__ */ React.createElement(EllipsisIcon, { className: sizeClass.icon }),
+      /* @__PURE__ */ React.createElement("span", { className: "sr-only" }, "More")
+    );
+  }
+);
+BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
+
+export {
+  breadcrumbSizeMap,
+  Breadcrumb,
+  BreadcrumbList,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbPage,
+  BreadcrumbSeparator,
+  BreadcrumbEllipsis
+};
+//# sourceMappingURL=chunk-NWFMJWGX.mjs.map

package/dist/chunk-NWFMJWGX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/breadcrumb.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '@/lib/utils'\n\n// ─── Context ──────────────────────────────────────────────\n\ntype BreadcrumbContextValue = {\n  size?: 'sm' | 'default' | 'lg'\n  separator?: React.ReactNode\n}\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValue>({})\nconst useBreadcrumbContext = () => React.useContext(BreadcrumbContext)\n\n// ─── Default Separator Icon ───────────────────────────────\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n  return (\n    <svg\n      className={className}\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      stroke=\"currentColor\"\n      strokeWidth={2}\n    >\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n    </svg>\n  )\n}\n\n// ─── Ellipsis Icon ────────────────────────────────────────\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n  return (\n    <svg\n      className={className}\n      fill=\"currentColor\"\n      viewBox=\"0 0 24 24\"\n    >\n      <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n      <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n      <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n    </svg>\n  )\n}\n\n// ─── Breadcrumb (Root) ────────────────────────────────────\n\nconst breadcrumbSizeMap = {\n  sm: { text: 'text-xs', icon: 'icon-xs', gap: 'gap-1.5' },\n  default: { text: 'text-sm', icon: 'icon-xs', gap: 'gap-2' },\n  lg: { text: 'text-md', icon: 'icon-sm', gap: 'gap-2' },\n} as const\n\nexport interface BreadcrumbProps extends React.ComponentPropsWithoutRef<'nav'> {\n  /** Separator element between items */\n  separator?: React.ReactNode\n  /** Size of the breadcrumb */\n  size?: 'sm' | 'default' | 'lg'\n  /** Max items before collapsing (undefined = no collapse) */\n  maxItems?: number\n  /** Items visible before the ellipsis when collapsed */\n  itemsBeforeCollapse?: number\n  /** Items visible after the ellipsis when collapsed */\n  itemsAfterCollapse?: number\n}\n\nconst Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n  ({ className, separator, size = 'default', ...props }, ref) => (\n    <BreadcrumbContext.Provider value={{ size, separator }}>\n      <nav\n        ref={ref}\n        aria-label=\"breadcrumb\"\n        className={cn('', className)}\n        {...props}\n      />\n    </BreadcrumbContext.Provider>\n  )\n)\nBreadcrumb.displayName = 'Breadcrumb'\n\n// ─── BreadcrumbList ───────────────────────────────────────\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n  ({ className, ...props }, ref) => {\n    const { size = 'default' } = useBreadcrumbContext()\n    const sizeClass = breadcrumbSizeMap[size]\n    return (\n      <ol\n        ref={ref}\n        className={cn(\n          'flex flex-wrap items-center',\n          sizeClass.gap,\n          sizeClass.text,\n          'text-text-muted',\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nBreadcrumbList.displayName = 'BreadcrumbList'\n\n// ─── BreadcrumbItem ───────────────────────────────────────\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n  ({ className, ...props }, ref) => (\n    <li\n      ref={ref}\n      className={cn('inline-flex items-center gap-1.5', className)}\n      {...props}\n    />\n  )\n)\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\n// ─── BreadcrumbLink ───────────────────────────────────────\n\nexport interface BreadcrumbLinkProps extends React.ComponentPropsWithoutRef<'a'> {\n  /** Use Radix Slot to compose with custom link components */\n  asChild?: boolean\n}\n\nconst BreadcrumbLink = React.forwardRef<HTMLAnchorElement, BreadcrumbLinkProps>(\n  ({ asChild, className, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'a'\n    return (\n      <Comp\n        ref={ref}\n        className={cn(\n          'transition-colors duration-fast hover:text-foreground',\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\n// ─── BreadcrumbPage ───────────────────────────────────────\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn('text-foreground', className)}\n      {...props}\n    />\n  )\n)\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\n// ─── BreadcrumbSeparator ──────────────────────────────────\n\nconst BreadcrumbSeparator = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n  ({ children, className, ...props }, ref) => {\n    const { separator, size = 'default' } = useBreadcrumbContext()\n    const sizeClass = breadcrumbSizeMap[size]\n    return (\n      <li\n        ref={ref}\n        role=\"presentation\"\n        aria-hidden=\"true\"\n        className={cn('flex items-center text-text-subtle', className)}\n        {...props}\n      >\n        {children ?? separator ?? <ChevronRightIcon className={sizeClass.icon} />}\n      </li>\n    )\n  }\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\n// ─── BreadcrumbEllipsis ───────────────────────────────────\n\nexport interface BreadcrumbEllipsisProps extends React.ComponentPropsWithoutRef<'span'> {}\n\nconst BreadcrumbEllipsis = React.forwardRef<HTMLSpanElement, BreadcrumbEllipsisProps>(\n  ({ className, ...props }, ref) => {\n    const { size = 'default' } = useBreadcrumbContext()\n    const sizeClass = breadcrumbSizeMap[size]\n    return (\n      <span\n        ref={ref}\n        role=\"presentation\"\n        aria-hidden=\"true\"\n        className={cn('flex items-center justify-center', className)}\n        {...props}\n      >\n        <EllipsisIcon className={sizeClass.icon} />\n        <span className=\"sr-only\">More</span>\n      </span>\n    )\n  }\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbEllipsis'\n\n// ─── Exports ──────────────────────────────────────────────\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n  breadcrumbSizeMap,\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-PTAPPOKU.mjs

@@ -0,0 +1,117 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/divider.tsx
+import * as React from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import { cva } from "class-variance-authority";
+var dividerVariants = cva("shrink-0", {
+  variants: {
+    orientation: {
+      horizontal: "w-full",
+      vertical: "h-full self-stretch"
+    },
+    variant: {
+      solid: "border-solid",
+      dashed: "border-dashed",
+      dotted: "border-dotted"
+    },
+    color: {
+      default: "border-border/60",
+      muted: "border-border-subtle",
+      strong: "border-border-strong"
+    },
+    spacing: {
+      sm: "",
+      md: "",
+      default: "",
+      lg: ""
+    }
+  },
+  compoundVariants: [
+    // Horizontal spacing
+    { orientation: "horizontal", spacing: "sm", className: "my-2" },
+    { orientation: "horizontal", spacing: "md", className: "my-3" },
+    { orientation: "horizontal", spacing: "default", className: "my-4" },
+    { orientation: "horizontal", spacing: "lg", className: "my-8" },
+    // Vertical spacing
+    { orientation: "vertical", spacing: "sm", className: "mx-2" },
+    { orientation: "vertical", spacing: "md", className: "mx-3" },
+    { orientation: "vertical", spacing: "default", className: "mx-4" },
+    { orientation: "vertical", spacing: "lg", className: "mx-8" },
+    // Horizontal line style (border-top)
+    { orientation: "horizontal", className: "border-t border-l-0" },
+    // Vertical line style (border-left)
+    { orientation: "vertical", className: "border-l border-t-0" }
+  ],
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "solid",
+    color: "default",
+    spacing: "default"
+  }
+});
+var Divider = React.forwardRef(({
+  className,
+  orientation = "horizontal",
+  variant = "solid",
+  color = "default",
+  spacing = "default",
+  label,
+  labelPosition = "center",
+  decorative = true,
+  ...props
+}, ref) => {
+  const lineClass = cn(
+    "flex-1",
+    variant === "dashed" ? "border-dashed" : variant === "dotted" ? "border-dotted" : "border-solid",
+    color === "muted" ? "border-border-subtle" : color === "strong" ? "border-border-strong" : "border-border/60",
+    "border-t"
+  );
+  const spacingClass = spacing === "sm" ? "my-2" : spacing === "md" ? "my-3" : spacing === "lg" ? "my-8" : "my-4";
+  if (label && orientation === "horizontal") {
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        role: decorative ? "none" : "separator",
+        "aria-orientation": "horizontal",
+        className: cn(
+          "flex items-center w-full",
+          spacingClass,
+          className
+        )
+      },
+      /* @__PURE__ */ React.createElement("div", { className: cn(
+        lineClass,
+        labelPosition === "left" ? "max-w-[10%]" : ""
+      ) }),
+      /* @__PURE__ */ React.createElement("span", { className: "px-3 text-sm text-text-muted shrink-0 select-none" }, label),
+      /* @__PURE__ */ React.createElement("div", { className: cn(
+        lineClass,
+        labelPosition === "right" ? "max-w-[10%]" : ""
+      ) })
+    );
+  }
+  return /* @__PURE__ */ React.createElement(
+    SeparatorPrimitive.Root,
+    {
+      ref,
+      decorative,
+      orientation,
+      className: cn(
+        dividerVariants({ orientation, variant, color, spacing }),
+        className
+      ),
+      ...props
+    }
+  );
+});
+Divider.displayName = "Divider";
+
+export {
+  dividerVariants,
+  Divider
+};
+//# sourceMappingURL=chunk-PTAPPOKU.mjs.map

package/dist/chunk-PTAPPOKU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/divider.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as SeparatorPrimitive from '@radix-ui/react-separator'\nimport { cva } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ─── Divider ─────────────────────────────────────────────────\n\nconst dividerVariants = cva('shrink-0', {\n  variants: {\n    orientation: {\n      horizontal: 'w-full',\n      vertical: 'h-full self-stretch',\n    },\n    variant: {\n      solid: 'border-solid',\n      dashed: 'border-dashed',\n      dotted: 'border-dotted',\n    },\n    color: {\n      default: 'border-border/60',\n      muted: 'border-border-subtle',\n      strong: 'border-border-strong',\n    },\n    spacing: {\n      sm: '',\n      md: '',\n      default: '',\n      lg: '',\n    },\n  },\n  compoundVariants: [\n    // Horizontal spacing\n    { orientation: 'horizontal', spacing: 'sm', className: 'my-2' },\n    { orientation: 'horizontal', spacing: 'md', className: 'my-3' },\n    { orientation: 'horizontal', spacing: 'default', className: 'my-4' },\n    { orientation: 'horizontal', spacing: 'lg', className: 'my-8' },\n    // Vertical spacing\n    { orientation: 'vertical', spacing: 'sm', className: 'mx-2' },\n    { orientation: 'vertical', spacing: 'md', className: 'mx-3' },\n    { orientation: 'vertical', spacing: 'default', className: 'mx-4' },\n    { orientation: 'vertical', spacing: 'lg', className: 'mx-8' },\n    // Horizontal line style (border-top)\n    { orientation: 'horizontal', className: 'border-t border-l-0' },\n    // Vertical line style (border-left)\n    { orientation: 'vertical', className: 'border-l border-t-0' },\n  ],\n  defaultVariants: {\n    orientation: 'horizontal',\n    variant: 'solid',\n    color: 'default',\n    spacing: 'default',\n  },\n})\n\nexport interface DividerProps\n  extends Omit<React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>, 'children' | 'color' | 'orientation'> {\n  /** Direction of the divider */\n  orientation?: 'horizontal' | 'vertical'\n  /** Line style */\n  variant?: 'solid' | 'dashed' | 'dotted'\n  /** Line color intensity */\n  color?: 'default' | 'muted' | 'strong'\n  /** Spacing around the divider */\n  spacing?: 'sm' | 'md' | 'default' | 'lg'\n  /** Content to display on the divider line (horizontal only) */\n  label?: React.ReactNode\n  /** Label position along the line */\n  labelPosition?: 'left' | 'center' | 'right'\n}\n\nconst Divider = React.forwardRef<\n  React.ElementRef<typeof SeparatorPrimitive.Root>,\n  DividerProps\n>(({\n  className,\n  orientation = 'horizontal',\n  variant = 'solid',\n  color = 'default',\n  spacing = 'default',\n  label,\n  labelPosition = 'center',\n  decorative = true,\n  ...props\n}, ref) => {\n  // Line style class for label mode\n  const lineClass = cn(\n    'flex-1',\n    variant === 'dashed' ? 'border-dashed' : variant === 'dotted' ? 'border-dotted' : 'border-solid',\n    color === 'muted' ? 'border-border-subtle' : color === 'strong' ? 'border-border-strong' : 'border-border/60',\n    'border-t'\n  )\n\n  // Spacing class for label wrapper\n  const spacingClass =\n    spacing === 'sm' ? 'my-2'\n    : spacing === 'md' ? 'my-3'\n    : spacing === 'lg' ? 'my-8'\n    : 'my-4'\n\n  // Horizontal with label: render as flex container with two lines\n  if (label && orientation === 'horizontal') {\n    return (\n      <div\n        role={decorative ? 'none' : 'separator'}\n        aria-orientation=\"horizontal\"\n        className={cn(\n          'flex items-center w-full',\n          spacingClass,\n          className\n        )}\n      >\n        <div className={cn(\n          lineClass,\n          labelPosition === 'left' ? 'max-w-[10%]' : ''\n        )} />\n        <span className=\"px-3 text-sm text-text-muted shrink-0 select-none\">{label}</span>\n        <div className={cn(\n          lineClass,\n          labelPosition === 'right' ? 'max-w-[10%]' : ''\n        )} />\n      </div>\n    )\n  }\n\n  // Default: Radix Separator\n  return (\n    <SeparatorPrimitive.Root\n      ref={ref}\n      decorative={decorative}\n      orientation={orientation}\n      className={cn(\n        dividerVariants({ orientation, variant, color, spacing }),\n        className\n      )}\n      {...props}\n    />\n  )\n})\nDivider.displayName = 'Divider'\n\n// ─── Exports ─────────────────────────────────────────────────\n\nexport { Divider, dividerVariants }\n"],"mappings":";;;;;;AAEA,YAAY,WAAW;AACvB,YAAY,wBAAwB;AACpC,SAAS,WAAW;AAKpB,IAAM,kBAAkB,IAAI,YAAY;AAAA,EACtC,UAAU;AAAA,IACR,aAAa;AAAA,MACX,YAAY;AAAA,MACZ,UAAU;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ;AAAA,IACV;AAAA,IACA,OAAO;AAAA,MACL,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,IACA,SAAS;AAAA,MACP,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,kBAAkB;AAAA;AAAA,IAEhB,EAAE,aAAa,cAAc,SAAS,MAAM,WAAW,OAAO;AAAA,IAC9D,EAAE,aAAa,cAAc,SAAS,MAAM,WAAW,OAAO;AAAA,IAC9D,EAAE,aAAa,cAAc,SAAS,WAAW,WAAW,OAAO;AAAA,IACnE,EAAE,aAAa,cAAc,SAAS,MAAM,WAAW,OAAO;AAAA;AAAA,IAE9D,EAAE,aAAa,YAAY,SAAS,MAAM,WAAW,OAAO;AAAA,IAC5D,EAAE,aAAa,YAAY,SAAS,MAAM,WAAW,OAAO;AAAA,IAC5D,EAAE,aAAa,YAAY,SAAS,WAAW,WAAW,OAAO;AAAA,IACjE,EAAE,aAAa,YAAY,SAAS,MAAM,WAAW,OAAO;AAAA;AAAA,IAE5D,EAAE,aAAa,cAAc,WAAW,sBAAsB;AAAA;AAAA,IAE9D,EAAE,aAAa,YAAY,WAAW,sBAAsB;AAAA,EAC9D;AAAA,EACA,iBAAiB;AAAA,IACf,aAAa;AAAA,IACb,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS;AAAA,EACX;AACF,CAAC;AAkBD,IAAM,UAAgB,iBAGpB,CAAC;AAAA,EACD;AAAA,EACA,cAAc;AAAA,EACd,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV;AAAA,EACA,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,GAAG;AACL,GAAG,QAAQ;AAET,QAAM,YAAY;AAAA,IAChB;AAAA,IACA,YAAY,WAAW,kBAAkB,YAAY,WAAW,kBAAkB;AAAA,IAClF,UAAU,UAAU,yBAAyB,UAAU,WAAW,yBAAyB;AAAA,IAC3F;AAAA,EACF;AAGA,QAAM,eACJ,YAAY,OAAO,SACjB,YAAY,OAAO,SACnB,YAAY,OAAO,SACnB;AAGJ,MAAI,SAAS,gBAAgB,cAAc;AACzC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,aAAa,SAAS;AAAA,QAC5B,oBAAiB;AAAA,QACjB,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA;AAAA,MAEA,oCAAC,SAAI,WAAW;AAAA,QACd;AAAA,QACA,kBAAkB,SAAS,gBAAgB;AAAA,MAC7C,GAAG;AAAA,MACH,oCAAC,UAAK,WAAU,uDAAqD,KAAM;AAAA,MAC3E,oCAAC,SAAI,WAAW;AAAA,QACd;AAAA,QACA,kBAAkB,UAAU,gBAAgB;AAAA,MAC9C,GAAG;AAAA,IACL;AAAA,EAEJ;AAGA,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,gBAAgB,EAAE,aAAa,SAAS,OAAO,QAAQ,CAAC;AAAA,QACxD;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AACD,QAAQ,cAAc;","names":[]}

package/dist/chunk-PVTBM7V7.mjs

@@ -0,0 +1,316 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/card.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+var CardContext = React.createContext({
+  size: "default",
+  direction: "vertical"
+});
+function useCard() {
+  return React.useContext(CardContext);
+}
+var cardVariants = cva(
+  "flex overflow-hidden transition-all duration-normal",
+  {
+    variants: {
+      variant: {
+        default: "bg-background-paper border border-border-subtle shadow-sm",
+        outline: "bg-background-paper border border-border",
+        ghost: "bg-transparent"
+      },
+      size: {
+        sm: "",
+        default: "",
+        lg: ""
+      },
+      radius: {
+        sm: "rounded-sm",
+        // 2px
+        base: "rounded",
+        // 4px
+        md: "rounded-md",
+        // 6px
+        lg: "rounded-lg",
+        // 8px
+        xl: "rounded-xl",
+        // 12px
+        "2xl": "rounded-2xl"
+        // 16px
+      },
+      direction: {
+        vertical: "flex-col",
+        horizontal: "flex-row"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "xl",
+      direction: "vertical"
+    }
+  }
+);
+var Card = React.forwardRef(
+  ({
+    className,
+    variant = "default",
+    size = "default",
+    radius = "xl",
+    direction = "vertical",
+    interactive = false,
+    asChild = false,
+    children,
+    ...props
+  }, ref) => {
+    const Comp = asChild ? Slot : "div";
+    let content = children;
+    if (direction === "horizontal") {
+      const childArray = React.Children.toArray(children);
+      const imageChildren = [];
+      const otherChildren = [];
+      childArray.forEach((child) => {
+        if (React.isValidElement(child) && child.type === CardImage) {
+          imageChildren.push(child);
+        } else {
+          otherChildren.push(child);
+        }
+      });
+      content = /* @__PURE__ */ React.createElement(React.Fragment, null, imageChildren, /* @__PURE__ */ React.createElement("div", { className: "flex-1 flex flex-col min-w-0" }, otherChildren));
+    }
+    return /* @__PURE__ */ React.createElement(CardContext.Provider, { value: { size, direction } }, /* @__PURE__ */ React.createElement(
+      Comp,
+      {
+        ref,
+        className: cn(
+          cardVariants({ variant, size, radius, direction }),
+          interactive && "cursor-pointer hover:shadow-md hover:-translate-y-0.5",
+          className
+        ),
+        ...props
+      },
+      content
+    ));
+  }
+);
+Card.displayName = "Card";
+var sizePaddingXMap = {
+  sm: "px-4",
+  // 16px
+  default: "px-4 sm:px-6",
+  // 16px → 24px
+  lg: "px-6 sm:px-8"
+  // 24px → 32px
+};
+var sizePaddingYMap = {
+  sm: "py-3",
+  // 12px
+  default: "py-3 sm:py-4",
+  // 12px → 16px
+  lg: "py-4 sm:py-5"
+  // 16px → 20px
+};
+var sizePaddingTMap = {
+  sm: "pt-5",
+  // 20px
+  default: "pt-5 sm:pt-6",
+  // 20px → 24px
+  lg: "pt-6 sm:pt-8"
+  // 24px → 32px
+};
+var sizeInnerPbMap = {
+  sm: "pb-3",
+  // 12px
+  default: "pb-3 sm:pb-4",
+  // 12px → 16px
+  lg: "pb-3 sm:pb-4"
+  // 12px → 16px (default와 동일)
+};
+var sizeLastPbMap = {
+  sm: "last:pb-5",
+  // 20px
+  default: "last:pb-5 sm:last:pb-6",
+  // 20px → 24px
+  lg: "last:pb-6 sm:last:pb-8"
+  // 24px → 32px
+};
+var overlayOpacityMap = {
+  10: "from-black/10",
+  20: "from-black/20",
+  30: "from-black/30",
+  40: "from-black/40",
+  50: "from-black/50",
+  60: "from-black/60",
+  70: "from-black/70",
+  80: "from-black/80",
+  90: "from-black/90"
+};
+var CardImage = React.forwardRef(
+  ({ className, overlay = false, overlayOpacity = 60, overlayClassName, alt = "", ...props }, ref) => {
+    const { direction } = useCard();
+    const isHorizontal = direction === "horizontal";
+    if (isHorizontal) {
+      const opacityClass = overlay ? overlayOpacityMap[overlayOpacity] || "from-black/60" : null;
+      return /* @__PURE__ */ React.createElement("div", { className: cn("relative shrink-0 w-48 overflow-hidden", className) }, /* @__PURE__ */ React.createElement(
+        "img",
+        {
+          ref,
+          alt,
+          className: "absolute inset-0 w-full h-full object-cover",
+          ...props
+        }
+      ), overlay && /* @__PURE__ */ React.createElement("div", { className: cn("absolute inset-0 bg-gradient-to-t to-transparent", overlayClassName || opacityClass) }));
+    }
+    if (overlay) {
+      const opacityClass = overlayOpacityMap[overlayOpacity] || "from-black/60";
+      return /* @__PURE__ */ React.createElement("div", { className: "relative w-full shrink-0 overflow-hidden" }, /* @__PURE__ */ React.createElement(
+        "img",
+        {
+          ref,
+          alt,
+          className: cn("w-full object-cover", className),
+          ...props
+        }
+      ), /* @__PURE__ */ React.createElement("div", { className: cn("absolute inset-0 bg-gradient-to-t to-transparent", overlayClassName || opacityClass) }));
+    }
+    return /* @__PURE__ */ React.createElement(
+      "img",
+      {
+        ref,
+        alt,
+        className: cn("w-full object-cover shrink-0", className),
+        ...props
+      }
+    );
+  }
+);
+CardImage.displayName = "CardImage";
+var CardHeader = React.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    const { size } = useCard();
+    const childArray = React.Children.toArray(children);
+    const actionChildren = [];
+    const otherChildren = [];
+    childArray.forEach((child) => {
+      if (React.isValidElement(child) && child.type === CardAction) {
+        actionChildren.push(child);
+      } else {
+        otherChildren.push(child);
+      }
+    });
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex items-start gap-3",
+          sizePaddingXMap[size],
+          sizePaddingTMap[size],
+          sizeInnerPbMap[size],
+          sizeLastPbMap[size],
+          className
+        ),
+        ...props
+      },
+      /* @__PURE__ */ React.createElement("div", { className: "flex-1 min-w-0 space-y-3" }, otherChildren),
+      actionChildren
+    );
+  }
+);
+CardHeader.displayName = "CardHeader";
+var CardTitle = React.forwardRef(
+  ({ className, icon, children, ...props }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "h3",
+      {
+        ref,
+        className: cn(
+          "text-base font-semibold text-foreground tracking-tight",
+          icon && "flex items-center gap-2",
+          className
+        ),
+        ...props
+      },
+      icon && /* @__PURE__ */ React.createElement("span", { className: "shrink-0 icon-sm [&>svg]:w-full [&>svg]:h-full", "aria-hidden": "true" }, icon),
+      children
+    );
+  }
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "p",
+      {
+        ref,
+        className: cn("text-sm text-text-muted", className),
+        ...props
+      }
+    );
+  }
+);
+CardDescription.displayName = "CardDescription";
+var CardAction = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        className: cn("shrink-0 ml-auto -mr-2 -mt-2", className),
+        ...props
+      }
+    );
+  }
+);
+CardAction.displayName = "CardAction";
+var CardContent = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { size } = useCard();
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        className: cn(sizePaddingXMap[size], "pb-0", sizeLastPbMap[size], className),
+        ...props
+      }
+    );
+  }
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { size } = useCard();
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex items-center gap-2",
+          sizePaddingXMap[size],
+          sizePaddingYMap[size],
+          "mt-auto",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+CardFooter.displayName = "CardFooter";
+
+export {
+  cardVariants,
+  Card,
+  CardImage,
+  CardHeader,
+  CardTitle,
+  CardDescription,
+  CardAction,
+  CardContent,
+  CardFooter
+};
+//# sourceMappingURL=chunk-PVTBM7V7.mjs.map

package/dist/chunk-PVTBM7V7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/card.tsx"],"sourcesContent":["'use client'\n/* eslint-disable @next/next/no-img-element */\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ── Context for size propagation ──\ntype CardSize = 'sm' | 'default' | 'lg'\ntype CardDirection = 'vertical' | 'horizontal'\n\nconst CardContext = React.createContext<{ size: CardSize; direction: CardDirection }>({\n  size: 'default',\n  direction: 'vertical',\n})\n\nfunction useCard() {\n  return React.useContext(CardContext)\n}\n\n// ── Card (Root) ──\nconst cardVariants = cva(\n  'flex overflow-hidden transition-all duration-normal',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background-paper border border-border-subtle shadow-sm',\n        outline: 'bg-background-paper border border-border',\n        ghost: 'bg-transparent',\n      },\n      size: {\n        sm: '',\n        default: '',\n        lg: '',\n      },\n      radius: {\n        sm: 'rounded-sm',       // 2px\n        base: 'rounded',        // 4px\n        md: 'rounded-md',       // 6px\n        lg: 'rounded-lg',       // 8px\n        xl: 'rounded-xl',       // 12px\n        '2xl': 'rounded-2xl',   // 16px\n      },\n      direction: {\n        vertical: 'flex-col',\n        horizontal: 'flex-row',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'xl',\n      direction: 'vertical',\n    },\n  }\n)\n\nexport type CardVariant = 'default' | 'outline' | 'ghost'\nexport type CardRadius = 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl'\n\nexport interface CardProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof cardVariants> {\n  /** Visual style */\n  variant?: CardVariant\n  /** Content padding scale */\n  size?: CardSize\n  /** Border radius */\n  radius?: CardRadius\n  /** Layout direction */\n  direction?: CardDirection\n  /** Enable hover effect for interactive cards */\n  interactive?: boolean\n  /** Render as child element (Slot pattern) */\n  asChild?: boolean\n}\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n  ({\n    className,\n    variant = 'default',\n    size = 'default',\n    radius = 'xl',\n    direction = 'vertical',\n    interactive = false,\n    asChild = false,\n    children,\n    ...props\n  }, ref) => {\n    const Comp = asChild ? Slot : 'div'\n\n    // Horizontal: separate CardImage from rest, wrap rest in flex-col\n    let content = children\n    if (direction === 'horizontal') {\n      const childArray = React.Children.toArray(children)\n      const imageChildren: React.ReactNode[] = []\n      const otherChildren: React.ReactNode[] = []\n\n      childArray.forEach((child) => {\n        if (React.isValidElement(child) && child.type === CardImage) {\n          imageChildren.push(child)\n        } else {\n          otherChildren.push(child)\n        }\n      })\n\n      content = (\n        <>\n          {imageChildren}\n          <div className=\"flex-1 flex flex-col min-w-0\">\n            {otherChildren}\n          </div>\n        </>\n      )\n    }\n\n    return (\n      <CardContext.Provider value={{ size, direction }}>\n        <Comp\n          ref={ref}\n          className={cn(\n            cardVariants({ variant, size, radius, direction }),\n            interactive && 'cursor-pointer hover:shadow-md hover:-translate-y-0.5',\n            className\n          )}\n          {...props}\n        >\n          {content}\n        </Comp>\n      </CardContext.Provider>\n    )\n  }\n)\nCard.displayName = 'Card'\n\n// ── Size-based padding map (responsive: mobile → desktop) ──\n\nconst sizePaddingXMap = {\n  sm: 'px-4',               // 16px\n  default: 'px-4 sm:px-6',  // 16px → 24px\n  lg: 'px-6 sm:px-8',       // 24px → 32px\n} as const\n\nconst sizePaddingYMap = {\n  sm: 'py-3',               // 12px\n  default: 'py-3 sm:py-4',  // 12px → 16px\n  lg: 'py-4 sm:py-5',       // 16px → 20px\n} as const\n\n// Top padding for CardHeader — optical balance (top >= sides)\nconst sizePaddingTMap = {\n  sm: 'pt-5',               // 20px\n  default: 'pt-5 sm:pt-6',  // 20px → 24px\n  lg: 'pt-6 sm:pt-8',       // 24px → 32px\n} as const\n\n// Inner bottom padding (between sections) — tighter than outer\nconst sizeInnerPbMap = {\n  sm: 'pb-3',               // 12px\n  default: 'pb-3 sm:pb-4',  // 12px → 16px\n  lg: 'pb-3 sm:pb-4',       // 12px → 16px (default와 동일)\n} as const\n\n// Last-child bottom padding for CardContent (when no footer) — match pt\nconst sizeLastPbMap = {\n  sm: 'last:pb-5',                    // 20px\n  default: 'last:pb-5 sm:last:pb-6',  // 20px → 24px\n  lg: 'last:pb-6 sm:last:pb-8',       // 24px → 32px\n} as const\n\n// ── CardImage ──\n// Overlay opacity to Tailwind class mapping\nconst overlayOpacityMap: Record<number, string> = {\n  10: 'from-black/10',\n  20: 'from-black/20',\n  30: 'from-black/30',\n  40: 'from-black/40',\n  50: 'from-black/50',\n  60: 'from-black/60',\n  70: 'from-black/70',\n  80: 'from-black/80',\n  90: 'from-black/90',\n}\n\nexport interface CardImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /** Gradient overlay on image */\n  overlay?: boolean\n  /** Overlay opacity (10–90). Default: 60 */\n  overlayOpacity?: number\n  /** Custom class for overlay gradient (overrides overlayOpacity) */\n  overlayClassName?: string\n}\n\nconst CardImage = React.forwardRef<HTMLImageElement, CardImageProps>(\n  ({ className, overlay = false, overlayOpacity = 60, overlayClassName, alt = '', ...props }, ref) => {\n    const { direction } = useCard()\n    const isHorizontal = direction === 'horizontal'\n\n    // Horizontal: use absolute positioning so the image fills the\n    // wrapper height which is determined by the content side via\n    // flexbox align-items:stretch (default).\n    if (isHorizontal) {\n      const opacityClass = overlay\n        ? (overlayOpacityMap[overlayOpacity] || 'from-black/60')\n        : null\n\n      return (\n        <div className={cn('relative shrink-0 w-48 overflow-hidden', className)}>\n          <img\n            ref={ref}\n            alt={alt}\n            className=\"absolute inset-0 w-full h-full object-cover\"\n            {...props}\n          />\n          {overlay && (\n            <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n          )}\n        </div>\n      )\n    }\n\n    // Vertical\n    if (overlay) {\n      const opacityClass = overlayOpacityMap[overlayOpacity] || 'from-black/60'\n\n      return (\n        <div className=\"relative w-full shrink-0 overflow-hidden\">\n          <img\n            ref={ref}\n            alt={alt}\n            className={cn('w-full object-cover', className)}\n            {...props}\n          />\n          <div className={cn('absolute inset-0 bg-gradient-to-t to-transparent', overlayClassName || opacityClass)} />\n        </div>\n      )\n    }\n\n    return (\n      <img\n        ref={ref}\n        alt={alt}\n        className={cn('w-full object-cover shrink-0', className)}\n        {...props}\n      />\n    )\n  }\n)\nCardImage.displayName = 'CardImage'\n\n// ── CardHeader ──\nexport interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardHeader = React.forwardRef<HTMLDivElement, CardHeaderProps>(\n  ({ className, children, ...props }, ref) => {\n    const { size } = useCard()\n\n    // Separate CardAction from other children for proper flex layout\n    const childArray = React.Children.toArray(children)\n    const actionChildren: React.ReactNode[] = []\n    const otherChildren: React.ReactNode[] = []\n\n    childArray.forEach((child) => {\n      if (React.isValidElement(child) && child.type === CardAction) {\n        actionChildren.push(child)\n      } else {\n        otherChildren.push(child)\n      }\n    })\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex items-start gap-3',\n          sizePaddingXMap[size],\n          sizePaddingTMap[size],\n          sizeInnerPbMap[size],\n          sizeLastPbMap[size],\n          className\n        )}\n        {...props}\n      >\n        <div className=\"flex-1 min-w-0 space-y-3\">\n          {otherChildren}\n        </div>\n        {actionChildren}\n      </div>\n    )\n  }\n)\nCardHeader.displayName = 'CardHeader'\n\n// ── CardTitle ──\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n  /** Leading icon */\n  icon?: React.ReactNode\n}\n\nconst CardTitle = React.forwardRef<HTMLHeadingElement, CardTitleProps>(\n  ({ className, icon, children, ...props }, ref) => {\n    return (\n      <h3\n        ref={ref}\n        className={cn(\n          'text-base font-semibold text-foreground tracking-tight',\n          icon && 'flex items-center gap-2',\n          className\n        )}\n        {...props}\n      >\n        {icon && (\n          <span className=\"shrink-0 icon-sm [&>svg]:w-full [&>svg]:h-full\" aria-hidden=\"true\">\n            {icon}\n          </span>\n        )}\n        {children}\n      </h3>\n    )\n  }\n)\nCardTitle.displayName = 'CardTitle'\n\n// ── CardDescription ──\nexport interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nconst CardDescription = React.forwardRef<HTMLParagraphElement, CardDescriptionProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <p\n        ref={ref}\n        className={cn('text-sm text-text-muted', className)}\n        {...props}\n      />\n    )\n  }\n)\nCardDescription.displayName = 'CardDescription'\n\n// ── CardAction ──\nexport interface CardActionProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardAction = React.forwardRef<HTMLDivElement, CardActionProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn('shrink-0 ml-auto -mr-2 -mt-2', className)}\n        {...props}\n      />\n    )\n  }\n)\nCardAction.displayName = 'CardAction'\n\n// ── CardContent ──\nexport interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardContent = React.forwardRef<HTMLDivElement, CardContentProps>(\n  ({ className, ...props }, ref) => {\n    const { size } = useCard()\n\n    return (\n      <div\n        ref={ref}\n        className={cn(sizePaddingXMap[size], 'pb-0', sizeLastPbMap[size], className)}\n        {...props}\n      />\n    )\n  }\n)\nCardContent.displayName = 'CardContent'\n\n// ── CardFooter ──\nexport interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst CardFooter = React.forwardRef<HTMLDivElement, CardFooterProps>(\n  ({ className, ...props }, ref) => {\n    const { size } = useCard()\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex items-center gap-2',\n          sizePaddingXMap[size],\n          sizePaddingYMap[size],\n          'mt-auto',\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nCardFooter.displayName = 'CardFooter'\n\nexport {\n  Card,\n  CardImage,\n  CardHeader,\n  CardTitle,\n  CardDescription,\n  CardAction,\n  CardContent,\n  CardFooter,\n  cardVariants,\n}\n"],"mappings":"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","names":[]}