@axtec/components 0.1.0

package/dist/index15.js

@@ -0,0 +1,42 @@
+import { jsx as s } from "react/jsx-runtime";
+import { cn as d } from "./index3.js";
+const m = {
+  default: "bg-slate-100 text-slate-700",
+  primary: "bg-primary-100 text-primary-700",
+  success: "bg-green-100 text-green-700",
+  warning: "bg-yellow-100 text-yellow-700",
+  danger: "bg-red-100 text-red-700",
+  info: "bg-blue-100 text-blue-700"
+}, a = {
+  sm: "px-2 py-0.5 text-xs",
+  md: "px-2.5 py-1 text-sm",
+  lg: "px-3 py-1.5 text-base"
+}, o = {
+  md: "rounded-md",
+  full: "rounded-full"
+};
+function u({
+  children: e,
+  variant: t = "default",
+  size: r = "md",
+  rounded: l = "full",
+  className: n
+}) {
+  return /* @__PURE__ */ s(
+    "span",
+    {
+      className: d(
+        "inline-flex items-center font-medium",
+        m[t],
+        a[r],
+        o[l],
+        n
+      ),
+      children: e
+    }
+  );
+}
+export {
+  u as Badge
+};
+//# sourceMappingURL=index15.js.map

package/dist/index15.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index15.js","sources":["../src/components/Badge/Badge.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface BadgeProps {\n  children: ReactNode\n  variant?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'\n  size?: 'sm' | 'md' | 'lg'\n  rounded?: 'md' | 'full'\n  className?: string\n}\n\nconst variantStyles = {\n  default: 'bg-slate-100 text-slate-700',\n  primary: 'bg-primary-100 text-primary-700',\n  success: 'bg-green-100 text-green-700',\n  warning: 'bg-yellow-100 text-yellow-700',\n  danger: 'bg-red-100 text-red-700',\n  info: 'bg-blue-100 text-blue-700',\n}\n\nconst sizeStyles = {\n  sm: 'px-2 py-0.5 text-xs',\n  md: 'px-2.5 py-1 text-sm',\n  lg: 'px-3 py-1.5 text-base',\n}\n\nconst roundedStyles = {\n  md: 'rounded-md',\n  full: 'rounded-full',\n}\n\nexport function Badge({\n  children,\n  variant = 'default',\n  size = 'md',\n  rounded = 'full',\n  className,\n}: BadgeProps) {\n  return (\n    <span\n      className={cn(\n        'inline-flex items-center font-medium',\n        variantStyles[variant],\n        sizeStyles[size],\n        roundedStyles[rounded],\n        className\n      )}\n    >\n      {children}\n    </span>\n  )\n}\n"],"names":["variantStyles","sizeStyles","roundedStyles","Badge","children","variant","size","rounded","className","jsx","cn"],"mappings":";;AAWA,MAAMA,IAAgB;AAAA,EACpB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AACR,GAEMC,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,SAASC,EAAM;AAAA,EACpB,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,WAAAC;AACF,GAAe;AACb,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAV,EAAcK,CAAO;AAAA,QACrBJ,EAAWK,CAAI;AAAA,QACfJ,EAAcK,CAAO;AAAA,QACrBC;AAAA,MAAA;AAAA,MAGD,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/index16.js

@@ -0,0 +1,76 @@
+import { jsx as e, jsxs as n, Fragment as f } from "react/jsx-runtime";
+import { HomeIcon as c, ChevronRightIcon as x } from "@heroicons/react/20/solid";
+import { cn as N } from "./index3.js";
+function g({
+  items: a,
+  showHome: i = !0,
+  homeHref: h = "/",
+  onHomeClick: s,
+  separator: m,
+  className: d
+}) {
+  const o = () => /* @__PURE__ */ e("span", { className: "mx-2 text-slate-400", children: m || /* @__PURE__ */ e(x, { className: "h-4 w-4" }) }), u = (t, r) => {
+    const l = /* @__PURE__ */ e(
+      "span",
+      {
+        className: N(
+          "text-sm",
+          r ? "font-medium text-slate-900" : "text-slate-500 hover:text-slate-700"
+        ),
+        children: t.label
+      }
+    );
+    return r ? l : t.href ? /* @__PURE__ */ e(
+      "a",
+      {
+        href: t.href,
+        className: "transition-colors duration-150",
+        onClick: t.onClick,
+        children: l
+      }
+    ) : t.onClick ? /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        onClick: t.onClick,
+        className: "transition-colors duration-150",
+        children: l
+      }
+    ) : l;
+  };
+  return /* @__PURE__ */ e("nav", { "aria-label": "Breadcrumb", className: d, children: /* @__PURE__ */ n("ol", { className: "flex items-center", children: [
+    i && /* @__PURE__ */ n(f, { children: [
+      /* @__PURE__ */ e("li", { children: s ? /* @__PURE__ */ n(
+        "button",
+        {
+          type: "button",
+          onClick: s,
+          className: "text-slate-400 hover:text-slate-600 transition-colors duration-150",
+          children: [
+            /* @__PURE__ */ e(c, { className: "h-5 w-5" }),
+            /* @__PURE__ */ e("span", { className: "sr-only", children: "Home" })
+          ]
+        }
+      ) : /* @__PURE__ */ n(
+        "a",
+        {
+          href: h,
+          className: "text-slate-400 hover:text-slate-600 transition-colors duration-150",
+          children: [
+            /* @__PURE__ */ e(c, { className: "h-5 w-5" }),
+            /* @__PURE__ */ e("span", { className: "sr-only", children: "Home" })
+          ]
+        }
+      ) }),
+      a.length > 0 && /* @__PURE__ */ e(o, {})
+    ] }),
+    a.map((t, r) => /* @__PURE__ */ n("li", { className: "flex items-center", children: [
+      u(t, r === a.length - 1),
+      r < a.length - 1 && /* @__PURE__ */ e(o, {})
+    ] }, r))
+  ] }) });
+}
+export {
+  g as Breadcrumbs
+};
+//# sourceMappingURL=index16.js.map

package/dist/index16.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index16.js","sources":["../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { ChevronRightIcon, HomeIcon } from '@heroicons/react/20/solid'\nimport { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface BreadcrumbItem {\n  label: ReactNode\n  href?: string\n  onClick?: () => void\n}\n\nexport interface BreadcrumbsProps {\n  items: BreadcrumbItem[]\n  showHome?: boolean\n  homeHref?: string\n  onHomeClick?: () => void\n  separator?: ReactNode\n  className?: string\n}\n\nexport function Breadcrumbs({\n  items,\n  showHome = true,\n  homeHref = '/',\n  onHomeClick,\n  separator,\n  className,\n}: BreadcrumbsProps) {\n  const Separator = () => (\n    <span className=\"mx-2 text-slate-400\">\n      {separator || <ChevronRightIcon className=\"h-4 w-4\" />}\n    </span>\n  )\n\n  const renderItem = (item: BreadcrumbItem, isLast: boolean) => {\n    const content = (\n      <span\n        className={cn(\n          'text-sm',\n          isLast\n            ? 'font-medium text-slate-900'\n            : 'text-slate-500 hover:text-slate-700'\n        )}\n      >\n        {item.label}\n      </span>\n    )\n\n    if (isLast) {\n      return content\n    }\n\n    if (item.href) {\n      return (\n        <a\n          href={item.href}\n          className=\"transition-colors duration-150\"\n          onClick={item.onClick}\n        >\n          {content}\n        </a>\n      )\n    }\n\n    if (item.onClick) {\n      return (\n        <button\n          type=\"button\"\n          onClick={item.onClick}\n          className=\"transition-colors duration-150\"\n        >\n          {content}\n        </button>\n      )\n    }\n\n    return content\n  }\n\n  return (\n    <nav aria-label=\"Breadcrumb\" className={className}>\n      <ol className=\"flex items-center\">\n        {showHome && (\n          <>\n            <li>\n              {onHomeClick ? (\n                <button\n                  type=\"button\"\n                  onClick={onHomeClick}\n                  className=\"text-slate-400 hover:text-slate-600 transition-colors duration-150\"\n                >\n                  <HomeIcon className=\"h-5 w-5\" />\n                  <span className=\"sr-only\">Home</span>\n                </button>\n              ) : (\n                <a\n                  href={homeHref}\n                  className=\"text-slate-400 hover:text-slate-600 transition-colors duration-150\"\n                >\n                  <HomeIcon className=\"h-5 w-5\" />\n                  <span className=\"sr-only\">Home</span>\n                </a>\n              )}\n            </li>\n            {items.length > 0 && <Separator />}\n          </>\n        )}\n        {items.map((item, index) => (\n          <li key={index} className=\"flex items-center\">\n            {renderItem(item, index === items.length - 1)}\n            {index < items.length - 1 && <Separator />}\n          </li>\n        ))}\n      </ol>\n    </nav>\n  )\n}\n"],"names":["Breadcrumbs","items","showHome","homeHref","onHomeClick","separator","className","Separator","jsx","ChevronRightIcon","renderItem","item","isLast","content","cn","jsxs","Fragment","HomeIcon","index"],"mappings":";;;AAmBO,SAASA,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,GAAqB;AACnB,QAAMC,IAAY,MAChB,gBAAAC,EAAC,QAAA,EAAK,WAAU,uBACb,UAAAH,KAAa,gBAAAG,EAACC,GAAA,EAAiB,WAAU,UAAA,CAAU,EAAA,CACtD,GAGIC,IAAa,CAACC,GAAsBC,MAAoB;AAC5D,UAAMC,IACJ,gBAAAL;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWM;AAAA,UACT;AAAA,UACAF,IACI,+BACA;AAAA,QAAA;AAAA,QAGL,UAAAD,EAAK;AAAA,MAAA;AAAA,IAAA;AAIV,WAAIC,IACKC,IAGLF,EAAK,OAEL,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAMG,EAAK;AAAA,QACX,WAAU;AAAA,QACV,SAASA,EAAK;AAAA,QAEb,UAAAE;AAAA,MAAA;AAAA,IAAA,IAKHF,EAAK,UAEL,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAASG,EAAK;AAAA,QACd,WAAU;AAAA,QAET,UAAAE;AAAA,MAAA;AAAA,IAAA,IAKAA;AAAA,EACT;AAEA,SACE,gBAAAL,EAAC,SAAI,cAAW,cAAa,WAAAF,GAC3B,UAAA,gBAAAS,EAAC,MAAA,EAAG,WAAU,qBACX,UAAA;AAAA,IAAAb,KACC,gBAAAa,EAAAC,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAR,EAAC,QACE,UAAAJ,IACC,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAASX;AAAA,UACT,WAAU;AAAA,UAEV,UAAA;AAAA,YAAA,gBAAAI,EAACS,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,YAC9B,gBAAAT,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,OAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,IAGhC,gBAAAO;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAMZ;AAAA,UACN,WAAU;AAAA,UAEV,UAAA;AAAA,YAAA,gBAAAK,EAACS,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,YAC9B,gBAAAT,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,OAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,GAGpC;AAAA,MACCP,EAAM,SAAS,KAAK,gBAAAO,EAACD,GAAA,CAAA,CAAU;AAAA,IAAA,GAClC;AAAA,IAEDN,EAAM,IAAI,CAACU,GAAMO,MAChB,gBAAAH,EAAC,MAAA,EAAe,WAAU,qBACvB,UAAA;AAAA,MAAAL,EAAWC,GAAMO,MAAUjB,EAAM,SAAS,CAAC;AAAA,MAC3CiB,IAAQjB,EAAM,SAAS,uBAAMM,GAAA,CAAA,CAAU;AAAA,IAAA,EAAA,GAFjCW,CAGT,CACD;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ;"}

package/dist/index17.js

@@ -0,0 +1,53 @@
+import { jsx as e, jsxs as d, Fragment as m } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { cn as b } from "./index3.js";
+import { Loader as f } from "./index35.js";
+const u = {
+  primary: "bg-primary-500 text-white hover:bg-primary-600 active:bg-primary-700 focus:ring-primary-500",
+  secondary: "bg-slate-100 text-slate-900 hover:bg-slate-200 active:bg-slate-300 focus:ring-slate-500",
+  outline: "border border-slate-300 bg-transparent text-slate-700 hover:bg-slate-50 active:bg-slate-100 focus:ring-slate-500",
+  ghost: "bg-transparent text-slate-700 hover:bg-slate-100 active:bg-slate-200 focus:ring-slate-500",
+  danger: "bg-red-500 text-white hover:bg-red-600 active:bg-red-700 focus:ring-red-500"
+}, x = {
+  sm: "px-3 py-1.5 text-sm gap-1.5",
+  md: "px-4 py-2 text-base gap-2",
+  lg: "px-6 py-3 text-lg gap-2.5"
+}, y = p(
+  ({
+    className: o,
+    variant: i = "primary",
+    size: t = "md",
+    isLoading: r = !1,
+    leftIcon: s,
+    rightIcon: a,
+    disabled: n,
+    children: l,
+    ...c
+  }, g) => /* @__PURE__ */ e(
+    "button",
+    {
+      ref: g,
+      className: b(
+        "inline-flex items-center justify-center font-semibold rounded-lg",
+        "transition-colors duration-200",
+        "focus:outline-none focus:ring-2 focus:ring-offset-2",
+        "disabled:opacity-50 disabled:cursor-not-allowed",
+        u[i],
+        x[t],
+        o
+      ),
+      disabled: n || r,
+      ...c,
+      children: r ? /* @__PURE__ */ e(f, { size: t === "lg" ? "md" : "sm", color: "current" }) : /* @__PURE__ */ d(m, { children: [
+        s && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: s }),
+        l,
+        a && /* @__PURE__ */ e("span", { className: "flex-shrink-0", children: a })
+      ] })
+    }
+  )
+);
+y.displayName = "Button";
+export {
+  y as Button
+};
+//# sourceMappingURL=index17.js.map

package/dist/index17.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index17.js","sources":["../src/components/Button/Button.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes, type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\nimport { Loader } from '../Loader/Loader'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger'\n  size?: 'sm' | 'md' | 'lg'\n  isLoading?: boolean\n  leftIcon?: ReactNode\n  rightIcon?: ReactNode\n}\n\nconst variantStyles = {\n  primary:\n    'bg-primary-500 text-white hover:bg-primary-600 active:bg-primary-700 focus:ring-primary-500',\n  secondary:\n    'bg-slate-100 text-slate-900 hover:bg-slate-200 active:bg-slate-300 focus:ring-slate-500',\n  outline:\n    'border border-slate-300 bg-transparent text-slate-700 hover:bg-slate-50 active:bg-slate-100 focus:ring-slate-500',\n  ghost:\n    'bg-transparent text-slate-700 hover:bg-slate-100 active:bg-slate-200 focus:ring-slate-500',\n  danger:\n    'bg-red-500 text-white hover:bg-red-600 active:bg-red-700 focus:ring-red-500',\n}\n\nconst sizeStyles = {\n  sm: 'px-3 py-1.5 text-sm gap-1.5',\n  md: 'px-4 py-2 text-base gap-2',\n  lg: 'px-6 py-3 text-lg gap-2.5',\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      variant = 'primary',\n      size = 'md',\n      isLoading = false,\n      leftIcon,\n      rightIcon,\n      disabled,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <button\n        ref={ref}\n        className={cn(\n          'inline-flex items-center justify-center font-semibold rounded-lg',\n          'transition-colors duration-200',\n          'focus:outline-none focus:ring-2 focus:ring-offset-2',\n          'disabled:opacity-50 disabled:cursor-not-allowed',\n          variantStyles[variant],\n          sizeStyles[size],\n          className\n        )}\n        disabled={disabled || isLoading}\n        {...props}\n      >\n        {isLoading ? (\n          <Loader size={size === 'lg' ? 'md' : 'sm'} color=\"current\" />\n        ) : (\n          <>\n            {leftIcon && <span className=\"flex-shrink-0\">{leftIcon}</span>}\n            {children}\n            {rightIcon && <span className=\"flex-shrink-0\">{rightIcon}</span>}\n          </>\n        )}\n      </button>\n    )\n  }\n)\n\nButton.displayName = 'Button'\n"],"names":["variantStyles","sizeStyles","Button","forwardRef","className","variant","size","isLoading","leftIcon","rightIcon","disabled","children","props","ref","jsx","cn","Loader","jsxs","Fragment"],"mappings":";;;;AAYA,MAAMA,IAAgB;AAAA,EACpB,SACE;AAAA,EACF,WACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AAAA,EACF,QACE;AACJ,GAEMC,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAASC;AAAA,EACpB,CACE;AAAA,IACE,WAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAY;AAAA,IACZ,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAf,EAAcK,CAAO;AAAA,QACrBJ,EAAWK,CAAI;AAAA,QACfF;AAAA,MAAA;AAAA,MAEF,UAAUM,KAAYH;AAAA,MACrB,GAAGK;AAAA,MAEH,UAAAL,IACC,gBAAAO,EAACE,GAAA,EAAO,MAAMV,MAAS,OAAO,OAAO,MAAM,OAAM,UAAA,CAAU,IAE3D,gBAAAW,EAAAC,GAAA,EACG,UAAA;AAAA,QAAAV,KAAY,gBAAAM,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAAN,GAAS;AAAA,QACtDG;AAAA,QACAF,KAAa,gBAAAK,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAAL,EAAA,CAAU;AAAA,MAAA,EAAA,CAC3D;AAAA,IAAA;AAAA,EAAA;AAKV;AAEAP,EAAO,cAAc;"}

package/dist/index18.js

@@ -0,0 +1,16 @@
+import { jsx as r } from "react/jsx-runtime";
+import { cn as i } from "./index3.js";
+const m = ({ buttons: o, className: e }) => /* @__PURE__ */ r("div", { className: i("flex flex-row items-center justify-end gap-1", e), children: o.map(({ icon: t, onClick: n, label: s }, a) => /* @__PURE__ */ r(
+  "button",
+  {
+    onClick: n,
+    "aria-label": s,
+    className: "cursor-pointer p-2 rounded-md hover:bg-slate-100 transition-colors",
+    children: t
+  },
+  `btnGroup_${a}`
+)) });
+export {
+  m as ButtonGroup
+};
+//# sourceMappingURL=index18.js.map

package/dist/index18.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index18.js","sources":["../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import { type ReactElement } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface ButtonGroupItem {\n  icon: ReactElement\n  onClick: () => void\n  label?: string\n}\n\nexport interface ButtonGroupProps {\n  buttons: ButtonGroupItem[]\n  className?: string\n}\n\nexport const ButtonGroup = ({ buttons, className }: ButtonGroupProps) => {\n  return (\n    <div className={cn('flex flex-row items-center justify-end gap-1', className)}>\n      {buttons.map(({ icon, onClick, label }, index) => (\n        <button\n          key={`btnGroup_${index}`}\n          onClick={onClick}\n          aria-label={label}\n          className=\"cursor-pointer p-2 rounded-md hover:bg-slate-100 transition-colors\"\n        >\n          {icon}\n        </button>\n      ))}\n    </div>\n  )\n}\n"],"names":["ButtonGroup","buttons","className","jsx","cn","icon","onClick","label","index"],"mappings":";;AAcO,MAAMA,IAAc,CAAC,EAAE,SAAAC,GAAS,WAAAC,QAEnC,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,gDAAgDF,CAAS,GACzE,UAAAD,EAAQ,IAAI,CAAC,EAAE,MAAAI,GAAM,SAAAC,GAAS,OAAAC,EAAA,GAASC,MACtC,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IAEC,SAAAG;AAAA,IACA,cAAYC;AAAA,IACZ,WAAU;AAAA,IAET,UAAAF;AAAA,EAAA;AAAA,EALI,YAAYG,CAAK;AAAA,CAOzB,GACH;"}

package/dist/index19.js

@@ -0,0 +1,157 @@
+import { jsxs as t, jsx as l } from "react/jsx-runtime";
+import { cn as r } from "./index3.js";
+import { Badge as v } from "./index15.js";
+import { Button as N } from "./index17.js";
+const h = {
+  none: "",
+  sm: "p-3",
+  md: "p-4",
+  lg: "p-6"
+}, f = {
+  none: "",
+  sm: "shadow-sm",
+  md: "shadow-md",
+  lg: "shadow-lg"
+}, u = {
+  none: "",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  xl: "rounded-xl",
+  "2xl": "rounded-2xl"
+}, w = {
+  sm: "text-base",
+  md: "text-xl",
+  lg: "text-2xl"
+};
+function k({
+  children: a,
+  padding: i = "md",
+  shadow: n = "sm",
+  rounded: m = "xl",
+  border: c = !0,
+  hover: o = !1,
+  stat: s,
+  action: e,
+  className: x
+}) {
+  var b, p;
+  if (s) {
+    const d = ((b = s.trend) == null ? void 0 : b.direction) === "up" ? "text-green-600" : ((p = s.trend) == null ? void 0 : p.direction) === "down" ? "text-red-500" : "text-slate-500";
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        className: r(
+          "bg-white",
+          h[i],
+          f[n],
+          u[m],
+          c && "border border-slate-200",
+          o && "hover:shadow-md transition-shadow",
+          x
+        ),
+        children: [
+          /* @__PURE__ */ t("div", { className: "flex justify-between items-start", children: [
+            /* @__PURE__ */ t("div", { className: "flex flex-col", children: [
+              /* @__PURE__ */ l("span", { className: "text-sm text-slate-500 font-medium mb-1", children: s.label }),
+              /* @__PURE__ */ l(
+                "span",
+                {
+                  className: r(
+                    "font-semibold text-primary-500 leading-tight",
+                    w[s.size || "md"]
+                  ),
+                  children: s.value
+                }
+              ),
+              s.subtext && /* @__PURE__ */ l("span", { className: "text-xs text-slate-500 mt-1", children: s.subtext })
+            ] }),
+            s.icon && /* @__PURE__ */ l("div", { className: "flex-shrink-0", children: s.icon })
+          ] }),
+          s.trend && /* @__PURE__ */ t("div", { className: r("flex items-center gap-1 mt-2 text-xs font-medium", d), children: [
+            s.trend.direction === "up" && "↑",
+            s.trend.direction === "down" && "↓",
+            s.trend.direction === "stable" && "→",
+            s.trend.value && /* @__PURE__ */ l("span", { children: s.trend.value })
+          ] }),
+          a
+        ]
+      }
+    );
+  }
+  return e ? /* @__PURE__ */ t(
+    "div",
+    {
+      className: r(
+        "bg-white flex flex-col",
+        h[i],
+        f[n],
+        u[m],
+        c && "border border-slate-200",
+        o && "hover:shadow-md transition-shadow",
+        x
+      ),
+      children: [
+        (e.title || e.status) && /* @__PURE__ */ t("div", { className: "flex items-start justify-between gap-3 mb-3", children: [
+          e.title && /* @__PURE__ */ l("h3", { className: "font-semibold text-base text-slate-900", children: e.title }),
+          e.status && /* @__PURE__ */ l(v, { variant: e.status.variant || "default", size: "sm", children: e.status.label })
+        ] }),
+        e.description && /* @__PURE__ */ l("p", { className: "text-sm text-slate-600 mb-4 line-clamp-2 leading-relaxed", children: e.description }),
+        e.metrics && e.metrics.length > 0 && /* @__PURE__ */ l("div", { className: "space-y-2 mb-4 flex-1", children: e.metrics.map((d, g) => /* @__PURE__ */ t("div", { className: "flex justify-between text-sm", children: [
+          /* @__PURE__ */ l("span", { className: "text-slate-500", children: d.label }),
+          /* @__PURE__ */ l(
+            "span",
+            {
+              className: r("font-semibold", d.highlight ? "text-red-600" : "text-slate-900"),
+              children: d.value
+            }
+          )
+        ] }, g)) }),
+        a && /* @__PURE__ */ l("div", { className: "flex-1", children: a }),
+        e.badges && e.badges.length > 0 && /* @__PURE__ */ l("div", { className: "flex flex-wrap gap-1.5 mb-4", children: e.badges.map((d, g) => /* @__PURE__ */ l(v, { variant: d.variant || "default", size: "sm", children: d.label }, g)) }),
+        e.ctaLabel && /* @__PURE__ */ l(
+          N,
+          {
+            onClick: e.onCtaClick,
+            disabled: e.ctaDisabled,
+            isLoading: e.ctaLoading,
+            leftIcon: e.ctaIcon,
+            className: "w-full mt-auto",
+            children: e.ctaLabel
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ l(
+    "div",
+    {
+      className: r(
+        "bg-white",
+        h[i],
+        f[n],
+        u[m],
+        c && "border border-slate-200",
+        o && "hover:shadow-md transition-shadow",
+        x
+      ),
+      children: a
+    }
+  );
+}
+const y = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 md:grid-cols-2",
+  3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
+  4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
+}, S = {
+  sm: "gap-2",
+  md: "gap-3",
+  lg: "gap-4"
+};
+function B({ children: a, columns: i = 2, gap: n = "md", className: m }) {
+  return /* @__PURE__ */ l("div", { className: r("grid", y[i], S[n], m), children: a });
+}
+export {
+  k as Card,
+  B as CardGrid
+};
+//# sourceMappingURL=index19.js.map

package/dist/index19.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index19.js","sources":["../src/components/Card/Card.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\nimport { Badge } from '../Badge/Badge'\nimport { Button } from '../Button/Button'\n\n// Base card container props\nexport interface CardProps {\n  children?: ReactNode\n  padding?: 'none' | 'sm' | 'md' | 'lg'\n  shadow?: 'none' | 'sm' | 'md' | 'lg'\n  rounded?: 'none' | 'md' | 'lg' | 'xl' | '2xl'\n  border?: boolean\n  hover?: boolean\n  className?: string\n}\n\n// Stat card props (for displaying a prominent value)\nexport interface CardStatProps {\n  label: string\n  value: string | number\n  subtext?: string\n  trend?: {\n    direction: 'up' | 'down' | 'stable'\n    value?: string\n  }\n  icon?: ReactNode\n  size?: 'sm' | 'md' | 'lg'\n}\n\n// Metric row for action-style cards\nexport interface CardMetric {\n  label: string\n  value: string | number\n  highlight?: boolean\n}\n\n// Action card props (for actionable items with CTAs)\nexport interface CardActionProps {\n  title?: string\n  status?: {\n    label: string\n    variant?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'\n  }\n  description?: string\n  metrics?: CardMetric[]\n  badges?: Array<{\n    label: string\n    variant?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'\n  }>\n  ctaLabel?: string\n  onCtaClick?: () => void\n  ctaLoading?: boolean\n  ctaDisabled?: boolean\n  ctaIcon?: ReactNode\n}\n\n// Combined card props\nexport type FullCardProps = CardProps & {\n  stat?: CardStatProps\n  action?: CardActionProps\n}\n\nconst paddingStyles = {\n  none: '',\n  sm: 'p-3',\n  md: 'p-4',\n  lg: 'p-6',\n}\n\nconst shadowStyles = {\n  none: '',\n  sm: 'shadow-sm',\n  md: 'shadow-md',\n  lg: 'shadow-lg',\n}\n\nconst roundedStyles = {\n  none: '',\n  md: 'rounded-md',\n  lg: 'rounded-lg',\n  xl: 'rounded-xl',\n  '2xl': 'rounded-2xl',\n}\n\nconst valueSizeStyles = {\n  sm: 'text-base',\n  md: 'text-xl',\n  lg: 'text-2xl',\n}\n\nexport function Card({\n  children,\n  padding = 'md',\n  shadow = 'sm',\n  rounded = 'xl',\n  border = true,\n  hover = false,\n  stat,\n  action,\n  className,\n}: FullCardProps) {\n  // Stat card mode\n  if (stat) {\n    const trendColor =\n      stat.trend?.direction === 'up'\n        ? 'text-green-600'\n        : stat.trend?.direction === 'down'\n          ? 'text-red-500'\n          : 'text-slate-500'\n\n    return (\n      <div\n        className={cn(\n          'bg-white',\n          paddingStyles[padding],\n          shadowStyles[shadow],\n          roundedStyles[rounded],\n          border && 'border border-slate-200',\n          hover && 'hover:shadow-md transition-shadow',\n          className\n        )}\n      >\n        <div className=\"flex justify-between items-start\">\n          <div className=\"flex flex-col\">\n            <span className=\"text-sm text-slate-500 font-medium mb-1\">{stat.label}</span>\n            <span\n              className={cn(\n                'font-semibold text-primary-500 leading-tight',\n                valueSizeStyles[stat.size || 'md']\n              )}\n            >\n              {stat.value}\n            </span>\n            {stat.subtext && <span className=\"text-xs text-slate-500 mt-1\">{stat.subtext}</span>}\n          </div>\n          {stat.icon && <div className=\"flex-shrink-0\">{stat.icon}</div>}\n        </div>\n        {stat.trend && (\n          <div className={cn('flex items-center gap-1 mt-2 text-xs font-medium', trendColor)}>\n            {stat.trend.direction === 'up' && '↑'}\n            {stat.trend.direction === 'down' && '↓'}\n            {stat.trend.direction === 'stable' && '→'}\n            {stat.trend.value && <span>{stat.trend.value}</span>}\n          </div>\n        )}\n        {children}\n      </div>\n    )\n  }\n\n  // Action card mode\n  if (action) {\n    return (\n      <div\n        className={cn(\n          'bg-white flex flex-col',\n          paddingStyles[padding],\n          shadowStyles[shadow],\n          roundedStyles[rounded],\n          border && 'border border-slate-200',\n          hover && 'hover:shadow-md transition-shadow',\n          className\n        )}\n      >\n        {/* Header with title and status badge */}\n        {(action.title || action.status) && (\n          <div className=\"flex items-start justify-between gap-3 mb-3\">\n            {action.title && (\n              <h3 className=\"font-semibold text-base text-slate-900\">{action.title}</h3>\n            )}\n            {action.status && (\n              <Badge variant={action.status.variant || 'default'} size=\"sm\">\n                {action.status.label}\n              </Badge>\n            )}\n          </div>\n        )}\n\n        {/* Description */}\n        {action.description && (\n          <p className=\"text-sm text-slate-600 mb-4 line-clamp-2 leading-relaxed\">\n            {action.description}\n          </p>\n        )}\n\n        {/* Metrics */}\n        {action.metrics && action.metrics.length > 0 && (\n          <div className=\"space-y-2 mb-4 flex-1\">\n            {action.metrics.map((metric, idx) => (\n              <div key={idx} className=\"flex justify-between text-sm\">\n                <span className=\"text-slate-500\">{metric.label}</span>\n                <span\n                  className={cn('font-semibold', metric.highlight ? 'text-red-600' : 'text-slate-900')}\n                >\n                  {metric.value}\n                </span>\n              </div>\n            ))}\n          </div>\n        )}\n\n        {/* Custom content */}\n        {children && <div className=\"flex-1\">{children}</div>}\n\n        {/* Status badges */}\n        {action.badges && action.badges.length > 0 && (\n          <div className=\"flex flex-wrap gap-1.5 mb-4\">\n            {action.badges.map((badge, idx) => (\n              <Badge key={idx} variant={badge.variant || 'default'} size=\"sm\">\n                {badge.label}\n              </Badge>\n            ))}\n          </div>\n        )}\n\n        {/* CTA Button */}\n        {action.ctaLabel && (\n          <Button\n            onClick={action.onCtaClick}\n            disabled={action.ctaDisabled}\n            isLoading={action.ctaLoading}\n            leftIcon={action.ctaIcon}\n            className=\"w-full mt-auto\"\n          >\n            {action.ctaLabel}\n          </Button>\n        )}\n      </div>\n    )\n  }\n\n  // Basic card mode (original behavior)\n  return (\n    <div\n      className={cn(\n        'bg-white',\n        paddingStyles[padding],\n        shadowStyles[shadow],\n        roundedStyles[rounded],\n        border && 'border border-slate-200',\n        hover && 'hover:shadow-md transition-shadow',\n        className\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n\n// Grid layout for cards\nexport interface CardGridProps {\n  children: ReactNode\n  columns?: 1 | 2 | 3 | 4\n  gap?: 'sm' | 'md' | 'lg'\n  className?: string\n}\n\nconst columnStyles = {\n  1: 'grid-cols-1',\n  2: 'grid-cols-1 md:grid-cols-2',\n  3: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',\n  4: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-4',\n}\n\nconst gapStyles = {\n  sm: 'gap-2',\n  md: 'gap-3',\n  lg: 'gap-4',\n}\n\nexport function CardGrid({ children, columns = 2, gap = 'md', className }: CardGridProps) {\n  return (\n    <div className={cn('grid', columnStyles[columns], gapStyles[gap], className)}>{children}</div>\n  )\n}\n"],"names":["paddingStyles","shadowStyles","roundedStyles","valueSizeStyles","Card","children","padding","shadow","rounded","border","hover","stat","action","className","trendColor","_a","_b","jsxs","cn","jsx","Badge","metric","idx","badge","Button","columnStyles","gapStyles","CardGrid","columns","gap"],"mappings":"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"}

package/dist/index20.js

@@ -0,0 +1,21 @@
+import { jsx as r } from "react/jsx-runtime";
+import { cn as m } from "./index3.js";
+function n({
+  children: t,
+  className: e
+}) {
+  return /* @__PURE__ */ r(
+    "h4",
+    {
+      className: m(
+        "text-base font-medium text-slate-900",
+        e
+      ),
+      children: t
+    }
+  );
+}
+export {
+  n as CardHeading
+};
+//# sourceMappingURL=index20.js.map

package/dist/index20.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index20.js","sources":["../src/components/Typography/CardHeading.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface CardHeadingProps {\n  children: ReactNode\n  className?: string\n}\n\nexport function CardHeading({\n  children,\n  className,\n}: CardHeadingProps) {\n  return (\n    <h4\n      className={cn(\n        'text-base font-medium text-slate-900',\n        className\n      )}\n    >\n      {children}\n    </h4>\n  )\n}\n"],"names":["CardHeading","children","className","jsx","cn"],"mappings":";;AAQO,SAASA,EAAY;AAAA,EAC1B,UAAAC;AAAA,EACA,WAAAC;AACF,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/index21.js

@@ -0,0 +1,49 @@
+import { jsx as l, jsxs as s } from "react/jsx-runtime";
+import { cn as n } from "./index3.js";
+const o = ({
+  items: c,
+  className: t
+}) => /* @__PURE__ */ l("div", { className: n("flex justify-center gap-8 p-5", t), children: c.map((e, r) => /* @__PURE__ */ s("div", { className: "flex flex-col flex-1", children: [
+  /* @__PURE__ */ s("div", { className: "flex items-center gap-2 mb-3", children: [
+    /* @__PURE__ */ l(
+      "div",
+      {
+        className: "w-5 h-2.5 rounded-full",
+        style: { backgroundColor: e.color }
+      }
+    ),
+    /* @__PURE__ */ l(
+      "span",
+      {
+        className: "text-sm font-medium",
+        style: { color: e.color },
+        children: e.label
+      }
+    )
+  ] }),
+  e.data.map((a, d) => /* @__PURE__ */ s("div", { className: "mb-2", children: [
+    /* @__PURE__ */ l("div", { className: "text-sm font-semibold text-slate-900 mb-1", children: a.title }),
+    /* @__PURE__ */ s("div", { className: "text-sm text-slate-500", children: [
+      a.value,
+      a.percentage && /* @__PURE__ */ s("span", { className: "ml-1 text-slate-400", children: [
+        "(",
+        a.percentage,
+        ")"
+      ] })
+    ] })
+  ] }, d))
+] }, r)) }), x = ({ items: c, className: t }) => /* @__PURE__ */ l("div", { className: n("flex items-center justify-center gap-6", t), children: c.map((e, r) => /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
+  /* @__PURE__ */ l(
+    "div",
+    {
+      className: "w-3 h-3 rounded-full",
+      style: { backgroundColor: e.color }
+    }
+  ),
+  /* @__PURE__ */ l("span", { className: "text-sm text-slate-600", children: e.label })
+] }, r)) });
+export {
+  x as ChartLegend,
+  o as StatisticsLegend
+};
+//# sourceMappingURL=index21.js.map

package/dist/index21.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index21.js","sources":["../src/components/StatisticsLegend/StatisticsLegend.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface StatisticsLegendItem {\n  label: string\n  color: string\n  data: {\n    title: string\n    value: string | number\n    percentage?: string\n  }[]\n}\n\nexport interface StatisticsLegendProps {\n  items: StatisticsLegendItem[]\n  className?: string\n}\n\nexport const StatisticsLegend = ({\n  items,\n  className,\n}: StatisticsLegendProps) => {\n  return (\n    <div className={cn('flex justify-center gap-8 p-5', className)}>\n      {items.map((item, index) => (\n        <div key={index} className=\"flex flex-col flex-1\">\n          {/* Legend label */}\n          <div className=\"flex items-center gap-2 mb-3\">\n            <div\n              className=\"w-5 h-2.5 rounded-full\"\n              style={{ backgroundColor: item.color }}\n            />\n            <span\n              className=\"text-sm font-medium\"\n              style={{ color: item.color }}\n            >\n              {item.label}\n            </span>\n          </div>\n\n          {/* Data items */}\n          {item.data.map((dataItem, dataIndex) => (\n            <div key={dataIndex} className=\"mb-2\">\n              <div className=\"text-sm font-semibold text-slate-900 mb-1\">\n                {dataItem.title}\n              </div>\n              <div className=\"text-sm text-slate-500\">\n                {dataItem.value}\n                {dataItem.percentage && (\n                  <span className=\"ml-1 text-slate-400\">\n                    ({dataItem.percentage})\n                  </span>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  )\n}\n\n// Simple color dot legend for charts\nexport interface ChartLegendProps {\n  items: {\n    label: string\n    color: string\n  }[]\n  className?: string\n}\n\nexport const ChartLegend = ({ items, className }: ChartLegendProps) => {\n  return (\n    <div className={cn('flex items-center justify-center gap-6', className)}>\n      {items.map((item, index) => (\n        <div key={index} className=\"flex items-center gap-2\">\n          <div\n            className=\"w-3 h-3 rounded-full\"\n            style={{ backgroundColor: item.color }}\n          />\n          <span className=\"text-sm text-slate-600\">{item.label}</span>\n        </div>\n      ))}\n    </div>\n  )\n}\n"],"names":["StatisticsLegend","items","className","jsx","cn","item","index","jsxs","dataItem","dataIndex","ChartLegend"],"mappings":";;AAiBO,MAAMA,IAAmB,CAAC;AAAA,EAC/B,OAAAC;AAAA,EACA,WAAAC;AACF,MAEI,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,iCAAiCF,CAAS,GAC1D,UAAAD,EAAM,IAAI,CAACI,GAAMC,MAChB,gBAAAC,EAAC,OAAA,EAAgB,WAAU,wBAEzB,UAAA;AAAA,EAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,gCACb,UAAA;AAAA,IAAA,gBAAAJ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,iBAAiBE,EAAK,MAAA;AAAA,MAAM;AAAA,IAAA;AAAA,IAEvC,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAOE,EAAK,MAAA;AAAA,QAEpB,UAAAA,EAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EACR,GACF;AAAA,EAGCA,EAAK,KAAK,IAAI,CAACG,GAAUC,MACxB,gBAAAF,EAAC,OAAA,EAAoB,WAAU,QAC7B,UAAA;AAAA,IAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,6CACZ,UAAAK,EAAS,OACZ;AAAA,IACA,gBAAAD,EAAC,OAAA,EAAI,WAAU,0BACZ,UAAA;AAAA,MAAAC,EAAS;AAAA,MACTA,EAAS,cACR,gBAAAD,EAAC,QAAA,EAAK,WAAU,uBAAsB,UAAA;AAAA,QAAA;AAAA,QAClCC,EAAS;AAAA,QAAW;AAAA,MAAA,EAAA,CACxB;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,EAAA,GAXQC,CAYV,CACD;AAAA,KA9BOH,CA+BV,CACD,GACH,GAaSI,IAAc,CAAC,EAAE,OAAAT,GAAO,WAAAC,QAEjC,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,0CAA0CF,CAAS,GACnE,UAAAD,EAAM,IAAI,CAACI,GAAMC,MAChB,gBAAAC,EAAC,OAAA,EAAgB,WAAU,2BACzB,UAAA;AAAA,EAAA,gBAAAJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,iBAAiBE,EAAK,MAAA;AAAA,IAAM;AAAA,EAAA;AAAA,EAEvC,gBAAAF,EAAC,QAAA,EAAK,WAAU,0BAA0B,YAAK,MAAA,CAAM;AAAA,KAL7CG,CAMV,CACD,GACH;"}

package/dist/index22.js

@@ -0,0 +1,53 @@
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { forwardRef as d } from "react";
+import { cn as i } from "./index3.js";
+import { CheckIcon as l } from "@heroicons/react/20/solid";
+const f = d(
+  ({ className: c, label: e, description: s, id: m, checked: o, ...n }, p) => {
+    const a = m || (e == null ? void 0 : e.toLowerCase().replace(/\s+/g, "-"));
+    return /* @__PURE__ */ t(
+      "label",
+      {
+        htmlFor: a,
+        className: i("flex items-start gap-3 cursor-pointer group", c),
+        children: [
+          /* @__PURE__ */ t("div", { className: "relative flex-shrink-0 mt-0.5", children: [
+            /* @__PURE__ */ r(
+              "input",
+              {
+                ref: p,
+                type: "checkbox",
+                id: a,
+                checked: o,
+                className: "peer sr-only",
+                ...n
+              }
+            ),
+            /* @__PURE__ */ r(
+              "div",
+              {
+                className: i(
+                  "h-5 w-5 rounded border-2 transition-colors duration-200",
+                  "flex items-center justify-center",
+                  "peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2",
+                  "peer-disabled:opacity-50 peer-disabled:cursor-not-allowed",
+                  o ? "bg-primary-500 border-primary-500" : "bg-white border-slate-300 group-hover:border-slate-400"
+                ),
+                children: o && /* @__PURE__ */ r(l, { className: "h-3.5 w-3.5 text-white" })
+              }
+            )
+          ] }),
+          (e || s) && /* @__PURE__ */ t("div", { className: "flex flex-col", children: [
+            e && /* @__PURE__ */ r("span", { className: "text-sm font-medium text-slate-900", children: e }),
+            s && /* @__PURE__ */ r("span", { className: "text-sm text-slate-500", children: s })
+          ] })
+        ]
+      }
+    );
+  }
+);
+f.displayName = "Checkbox";
+export {
+  f as Checkbox
+};
+//# sourceMappingURL=index22.js.map

package/dist/index22.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index22.js","sources":["../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { forwardRef, type InputHTMLAttributes } from 'react'\nimport { cn } from '@/lib/utils'\nimport { CheckIcon } from '@heroicons/react/20/solid'\n\nexport interface CheckboxProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n  label?: string\n  description?: string\n}\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  ({ className, label, description, id, checked, ...props }, ref) => {\n    const checkboxId = id || label?.toLowerCase().replace(/\\s+/g, '-')\n\n    return (\n      <label\n        htmlFor={checkboxId}\n        className={cn('flex items-start gap-3 cursor-pointer group', className)}\n      >\n        <div className=\"relative flex-shrink-0 mt-0.5\">\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            id={checkboxId}\n            checked={checked}\n            className=\"peer sr-only\"\n            {...props}\n          />\n          <div\n            className={cn(\n              'h-5 w-5 rounded border-2 transition-colors duration-200',\n              'flex items-center justify-center',\n              'peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2',\n              'peer-disabled:opacity-50 peer-disabled:cursor-not-allowed',\n              checked\n                ? 'bg-primary-500 border-primary-500'\n                : 'bg-white border-slate-300 group-hover:border-slate-400'\n            )}\n          >\n            {checked && <CheckIcon className=\"h-3.5 w-3.5 text-white\" />}\n          </div>\n        </div>\n        {(label || description) && (\n          <div className=\"flex flex-col\">\n            {label && (\n              <span className=\"text-sm font-medium text-slate-900\">{label}</span>\n            )}\n            {description && (\n              <span className=\"text-sm text-slate-500\">{description}</span>\n            )}\n          </div>\n        )}\n      </label>\n    )\n  }\n)\n\nCheckbox.displayName = 'Checkbox'\n"],"names":["Checkbox","forwardRef","className","label","description","id","checked","props","ref","checkboxId","jsxs","cn","jsx","CheckIcon"],"mappings":";;;;AAUO,MAAMA,IAAWC;AAAA,EACtB,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,GAAa,IAAAC,GAAI,SAAAC,GAAS,GAAGC,EAAA,GAASC,MAAQ;AACjE,UAAMC,IAAaJ,MAAMF,KAAA,gBAAAA,EAAO,cAAc,QAAQ,QAAQ;AAE9D,WACE,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASD;AAAA,QACT,WAAWE,EAAG,+CAA+CT,CAAS;AAAA,QAEtE,UAAA;AAAA,UAAA,gBAAAQ,EAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,YAAA,gBAAAE;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAAJ;AAAA,gBACA,MAAK;AAAA,gBACL,IAAIC;AAAA,gBACJ,SAAAH;AAAA,gBACA,WAAU;AAAA,gBACT,GAAGC;AAAA,cAAA;AAAA,YAAA;AAAA,YAEN,gBAAAK;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWD;AAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACAL,IACI,sCACA;AAAA,gBAAA;AAAA,gBAGL,UAAAA,KAAW,gBAAAM,EAACC,GAAA,EAAU,WAAU,yBAAA,CAAyB;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5D,GACF;AAAA,WACEV,KAASC,MACT,gBAAAM,EAAC,OAAA,EAAI,WAAU,iBACZ,UAAA;AAAA,YAAAP,KACC,gBAAAS,EAAC,QAAA,EAAK,WAAU,sCAAsC,UAAAT,GAAM;AAAA,YAE7DC,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAAR,EAAA,CAAY;AAAA,UAAA,EAAA,CAE1D;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEAJ,EAAS,cAAc;"}

package/dist/index23.js

@@ -0,0 +1,82 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { Fragment as i } from "react";
+import { Transition as v, Dialog as N, TransitionChild as o, DialogPanel as y, DialogTitle as b } from "@headlessui/react";
+import { ExclamationTriangleIcon as g } from "@heroicons/react/24/outline";
+import { cn as s } from "./index3.js";
+import { Button as c } from "./index17.js";
+function D({
+  open: d,
+  onClose: l,
+  onConfirm: m,
+  title: f,
+  message: r,
+  confirmText: h = "Confirm",
+  cancelText: p = "Cancel",
+  showIcon: t = !1,
+  destructive: x = !1,
+  isLoading: n = !1,
+  className: u
+}) {
+  return /* @__PURE__ */ e(v, { show: d, as: i, children: /* @__PURE__ */ a(N, { onClose: l, className: "relative z-50", children: [
+    /* @__PURE__ */ e(
+      o,
+      {
+        as: i,
+        enter: "ease-out duration-300",
+        enterFrom: "opacity-0",
+        enterTo: "opacity-100",
+        leave: "ease-in duration-200",
+        leaveFrom: "opacity-100",
+        leaveTo: "opacity-0",
+        children: /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50", "aria-hidden": "true" })
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ e(
+      o,
+      {
+        as: i,
+        enter: "ease-out duration-300",
+        enterFrom: "opacity-0 scale-95",
+        enterTo: "opacity-100 scale-100",
+        leave: "ease-in duration-200",
+        leaveFrom: "opacity-100 scale-100",
+        leaveTo: "opacity-0 scale-95",
+        children: /* @__PURE__ */ a(
+          y,
+          {
+            className: s(
+              "w-full max-w-md bg-white rounded-2xl shadow-xl p-6",
+              "transform transition-all",
+              u
+            ),
+            children: [
+              /* @__PURE__ */ a("div", { className: s(t && "flex gap-4"), children: [
+                t && /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e("div", { className: "rounded-full bg-amber-100 p-2", children: /* @__PURE__ */ e(g, { className: "h-6 w-6 text-amber-600" }) }) }),
+                /* @__PURE__ */ a("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ e(b, { className: "text-lg font-semibold text-slate-900 mb-2", children: f }),
+                  r && /* @__PURE__ */ e("div", { className: "text-sm text-slate-600 mb-6", children: r })
+                ] })
+              ] }),
+              /* @__PURE__ */ a("div", { className: "flex justify-end gap-3 mt-6", children: [
+                /* @__PURE__ */ e(c, { variant: "outline", onClick: l, disabled: n, children: p }),
+                /* @__PURE__ */ e(
+                  c,
+                  {
+                    variant: x ? "danger" : "primary",
+                    onClick: m,
+                    isLoading: n,
+                    children: h
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      }
+    ) })
+  ] }) });
+}
+export {
+  D as ConfirmModal
+};
+//# sourceMappingURL=index23.js.map