@axtec/components 0.1.5 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/README.md +6 -0
  2. package/dist/components/OptionDivider/OptionDivider.d.ts +5 -0
  3. package/dist/components/OptionDivider/index.d.ts +1 -0
  4. package/dist/components/SelectionCard/SelectionCard.d.ts +13 -0
  5. package/dist/components/SelectionCard/index.d.ts +1 -0
  6. package/dist/components/index.d.ts +2 -0
  7. package/dist/index.css +1 -1
  8. package/dist/index.js +106 -102
  9. package/dist/index.js.map +1 -1
  10. package/dist/index12.js +1 -1
  11. package/dist/index3.js +2 -2
  12. package/dist/index43.js +12 -14
  13. package/dist/index43.js.map +1 -1
  14. package/dist/index44.js +11 -87
  15. package/dist/index44.js.map +1 -1
  16. package/dist/index45.js +91 -69
  17. package/dist/index45.js.map +1 -1
  18. package/dist/index46.js +68 -121
  19. package/dist/index46.js.map +1 -1
  20. package/dist/index47.js +118 -36
  21. package/dist/index47.js.map +1 -1
  22. package/dist/index48.js +40 -44
  23. package/dist/index48.js.map +1 -1
  24. package/dist/index49.js +44 -56
  25. package/dist/index49.js.map +1 -1
  26. package/dist/index50.js +56 -16
  27. package/dist/index50.js.map +1 -1
  28. package/dist/index51.js +16 -65
  29. package/dist/index51.js.map +1 -1
  30. package/dist/index52.js +62 -51
  31. package/dist/index52.js.map +1 -1
  32. package/dist/index53.js +54 -37
  33. package/dist/index53.js.map +1 -1
  34. package/dist/index54.js +37 -66
  35. package/dist/index54.js.map +1 -1
  36. package/dist/index55.js +63 -19
  37. package/dist/index55.js.map +1 -1
  38. package/dist/index56.js +19 -101
  39. package/dist/index56.js.map +1 -1
  40. package/dist/index57.js +99 -213
  41. package/dist/index57.js.map +1 -1
  42. package/dist/index58.js +67 -62
  43. package/dist/index58.js.map +1 -1
  44. package/dist/index59.js +206 -224
  45. package/dist/index59.js.map +1 -1
  46. package/dist/index60.js +62 -96
  47. package/dist/index60.js.map +1 -1
  48. package/dist/index61.js +233 -33
  49. package/dist/index61.js.map +1 -1
  50. package/dist/index62.js +98 -14
  51. package/dist/index62.js.map +1 -1
  52. package/dist/index63.js +35 -59
  53. package/dist/index63.js.map +1 -1
  54. package/dist/index64.js +16 -59
  55. package/dist/index64.js.map +1 -1
  56. package/dist/index65.js +57 -72
  57. package/dist/index65.js.map +1 -1
  58. package/dist/index66.js +58 -106
  59. package/dist/index66.js.map +1 -1
  60. package/dist/index67.js +70 -43
  61. package/dist/index67.js.map +1 -1
  62. package/dist/index68.js +101 -40
  63. package/dist/index68.js.map +1 -1
  64. package/dist/index69.js +44 -72
  65. package/dist/index69.js.map +1 -1
  66. package/dist/index70.js +47 -53
  67. package/dist/index70.js.map +1 -1
  68. package/dist/index71.js +70 -62
  69. package/dist/index71.js.map +1 -1
  70. package/dist/index72.js +46 -28
  71. package/dist/index72.js.map +1 -1
  72. package/dist/index73.js +67 -13
  73. package/dist/index73.js.map +1 -1
  74. package/dist/index74.js +35 -2263
  75. package/dist/index74.js.map +1 -1
  76. package/dist/index75.js +17 -0
  77. package/dist/index75.js.map +1 -0
  78. package/dist/index76.js +2267 -0
  79. package/dist/index76.js.map +1 -0
  80. package/package.json +1 -1
package/dist/index62.js CHANGED
@@ -1,21 +1,105 @@
1
- import { jsx as o } from "react/jsx-runtime";
2
- import { cn as n } from "./index3.js";
3
- function m({
4
- children: t,
5
- className: e
6
- }) {
7
- return /* @__PURE__ */ o(
8
- "h3",
1
+ import { jsx as g, jsxs as s } from "react/jsx-runtime";
2
+ import { cn as t } from "./index3.js";
3
+ const i = {
4
+ // Heat levels (lead scoring)
5
+ hot: {
6
+ color: "bg-red-500",
7
+ text: "text-red-600",
8
+ label: "Hot"
9
+ },
10
+ warm: {
11
+ color: "bg-orange-500",
12
+ text: "text-orange-600",
13
+ label: "Warm"
14
+ },
15
+ neutral: {
16
+ color: "bg-emerald-500",
17
+ text: "text-emerald-600",
18
+ label: "Neutral"
19
+ },
20
+ cold: {
21
+ color: "bg-sky-500",
22
+ text: "text-sky-600",
23
+ label: "Cold"
24
+ },
25
+ // Confidence levels
26
+ high: {
27
+ color: "bg-green-500",
28
+ text: "text-green-600",
29
+ label: "High"
30
+ },
31
+ medium: {
32
+ color: "bg-amber-500",
33
+ text: "text-amber-600",
34
+ label: "Medium"
35
+ },
36
+ low: {
37
+ color: "bg-red-500",
38
+ text: "text-red-600",
39
+ label: "Low"
40
+ }
41
+ }, m = {
42
+ sm: {
43
+ dot: "w-1.5 h-1.5",
44
+ text: "text-xs",
45
+ gap: "gap-1.5"
46
+ },
47
+ md: {
48
+ dot: "w-2 h-2",
49
+ text: "text-sm",
50
+ gap: "gap-2"
51
+ }
52
+ }, f = ({
53
+ level: r,
54
+ label: o,
55
+ variant: a = "default",
56
+ size: d = "sm",
57
+ className: l
58
+ }) => {
59
+ const e = i[r], n = m[d];
60
+ return a === "dot" ? /* @__PURE__ */ g(
61
+ "div",
9
62
  {
10
- className: n(
11
- "text-lg font-semibold text-slate-900",
12
- e
63
+ className: t("rounded-full", n.dot, e.color, l),
64
+ title: o || e.label
65
+ }
66
+ ) : /* @__PURE__ */ s("div", { className: t("flex items-center", n.gap, l), children: [
67
+ /* @__PURE__ */ g("div", { className: t("rounded-full", n.dot, e.color) }),
68
+ /* @__PURE__ */ g("span", { className: t("font-medium", n.text, e.text), children: o || e.label })
69
+ ] });
70
+ }, x = {
71
+ hot: "bg-red-100 text-red-700 ring-1 ring-red-600/20",
72
+ warm: "bg-orange-100 text-orange-700 ring-1 ring-orange-600/20",
73
+ neutral: "bg-emerald-100 text-emerald-700 ring-1 ring-emerald-600/20",
74
+ cold: "bg-sky-100 text-sky-700 ring-1 ring-sky-600/20",
75
+ high: "bg-green-100 text-green-700 ring-1 ring-green-600/20",
76
+ medium: "bg-amber-100 text-amber-700 ring-1 ring-amber-600/20",
77
+ low: "bg-red-100 text-red-700 ring-1 ring-red-600/20"
78
+ }, c = {
79
+ sm: "px-2 py-0.5 text-xs",
80
+ md: "px-2.5 py-1 text-sm"
81
+ }, p = ({
82
+ level: r,
83
+ label: o,
84
+ size: a = "sm",
85
+ className: d
86
+ }) => {
87
+ const l = i[r];
88
+ return /* @__PURE__ */ g(
89
+ "span",
90
+ {
91
+ className: t(
92
+ "inline-flex items-center font-medium rounded-full",
93
+ x[r],
94
+ c[a],
95
+ d
13
96
  ),
14
- children: t
97
+ children: o || l.label
15
98
  }
16
99
  );
17
- }
100
+ };
18
101
  export {
19
- m as SubsectionHeading
102
+ p as StatusBadge,
103
+ f as StatusIndicator
20
104
  };
21
105
  //# sourceMappingURL=index62.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index62.js","sources":["../src/components/Typography/SubsectionHeading.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface SubsectionHeadingProps {\n children: ReactNode\n className?: string\n}\n\nexport function SubsectionHeading({\n children,\n className,\n}: SubsectionHeadingProps) {\n return (\n <h3\n className={cn(\n 'text-lg font-semibold text-slate-900',\n className\n )}\n >\n {children}\n </h3>\n )\n}\n"],"names":["SubsectionHeading","children","className","jsx","cn"],"mappings":";;AAQO,SAASA,EAAkB;AAAA,EAChC,UAAAC;AAAA,EACA,WAAAC;AACF,GAA2B;AACzB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1
+ {"version":3,"file":"index62.js","sources":["../src/components/StatusIndicator/StatusIndicator.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport type StatusLevel = 'hot' | 'warm' | 'neutral' | 'cold' | 'high' | 'medium' | 'low'\n\nexport interface StatusIndicatorProps {\n /** The status level */\n level: StatusLevel\n /** Optional custom label (defaults based on level) */\n label?: string\n /** Show as dot + text (default) or just dot */\n variant?: 'default' | 'dot'\n /** Size of the indicator */\n size?: 'sm' | 'md'\n className?: string\n}\n\nconst levelConfig: Record<StatusLevel, { color: string; text: string; label: string }> = {\n // Heat levels (lead scoring)\n hot: {\n color: 'bg-red-500',\n text: 'text-red-600',\n label: 'Hot',\n },\n warm: {\n color: 'bg-orange-500',\n text: 'text-orange-600',\n label: 'Warm',\n },\n neutral: {\n color: 'bg-emerald-500',\n text: 'text-emerald-600',\n label: 'Neutral',\n },\n cold: {\n color: 'bg-sky-500',\n text: 'text-sky-600',\n label: 'Cold',\n },\n // Confidence levels\n high: {\n color: 'bg-green-500',\n text: 'text-green-600',\n label: 'High',\n },\n medium: {\n color: 'bg-amber-500',\n text: 'text-amber-600',\n label: 'Medium',\n },\n low: {\n color: 'bg-red-500',\n text: 'text-red-600',\n label: 'Low',\n },\n}\n\nconst sizeStyles = {\n sm: {\n dot: 'w-1.5 h-1.5',\n text: 'text-xs',\n gap: 'gap-1.5',\n },\n md: {\n dot: 'w-2 h-2',\n text: 'text-sm',\n gap: 'gap-2',\n },\n}\n\nexport const StatusIndicator = ({\n level,\n label,\n variant = 'default',\n size = 'sm',\n className,\n}: StatusIndicatorProps) => {\n const config = levelConfig[level]\n const sizes = sizeStyles[size]\n\n if (variant === 'dot') {\n return (\n <div\n className={cn('rounded-full', sizes.dot, config.color, className)}\n title={label || config.label}\n />\n )\n }\n\n return (\n <div className={cn('flex items-center', sizes.gap, className)}>\n <div className={cn('rounded-full', sizes.dot, config.color)} />\n <span className={cn('font-medium', sizes.text, config.text)}>\n {label || config.label}\n </span>\n </div>\n )\n}\n\n/** Badge variant for use in tables/lists */\nexport interface StatusBadgeProps {\n level: StatusLevel\n label?: string\n size?: 'sm' | 'md'\n className?: string\n}\n\nconst badgeConfig: Record<StatusLevel, string> = {\n hot: 'bg-red-100 text-red-700 ring-1 ring-red-600/20',\n warm: 'bg-orange-100 text-orange-700 ring-1 ring-orange-600/20',\n neutral: 'bg-emerald-100 text-emerald-700 ring-1 ring-emerald-600/20',\n cold: 'bg-sky-100 text-sky-700 ring-1 ring-sky-600/20',\n high: 'bg-green-100 text-green-700 ring-1 ring-green-600/20',\n medium: 'bg-amber-100 text-amber-700 ring-1 ring-amber-600/20',\n low: 'bg-red-100 text-red-700 ring-1 ring-red-600/20',\n}\n\nconst badgeSizeStyles = {\n sm: 'px-2 py-0.5 text-xs',\n md: 'px-2.5 py-1 text-sm',\n}\n\nexport const StatusBadge = ({\n level,\n label,\n size = 'sm',\n className,\n}: StatusBadgeProps) => {\n const config = levelConfig[level]\n\n return (\n <span\n className={cn(\n 'inline-flex items-center font-medium rounded-full',\n badgeConfig[level],\n badgeSizeStyles[size],\n className\n )}\n >\n {label || config.label}\n </span>\n )\n}\n"],"names":["levelConfig","sizeStyles","StatusIndicator","level","label","variant","size","className","config","sizes","jsx","cn","jsxs","badgeConfig","badgeSizeStyles","StatusBadge"],"mappings":";;AAgBA,MAAMA,IAAmF;AAAA;AAAA,EAEvF,KAAK;AAAA,IACH,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,SAAS;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA;AAAA,EAGT,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,KAAK;AAAA,IACH,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAEX,GAEMC,IAAa;AAAA,EACjB,IAAI;AAAA,IACF,KAAK;AAAA,IACL,MAAM;AAAA,IACN,KAAK;AAAA,EAAA;AAAA,EAEP,IAAI;AAAA,IACF,KAAK;AAAA,IACL,MAAM;AAAA,IACN,KAAK;AAAA,EAAA;AAET,GAEaC,IAAkB,CAAC;AAAA,EAC9B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC;AACF,MAA4B;AAC1B,QAAMC,IAASR,EAAYG,CAAK,GAC1BM,IAAQR,EAAWK,CAAI;AAE7B,SAAID,MAAY,QAEZ,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAG,gBAAgBF,EAAM,KAAKD,EAAO,OAAOD,CAAS;AAAA,MAChE,OAAOH,KAASI,EAAO;AAAA,IAAA;AAAA,EAAA,IAM3B,gBAAAI,EAAC,SAAI,WAAWD,EAAG,qBAAqBF,EAAM,KAAKF,CAAS,GAC1D,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWC,EAAG,gBAAgBF,EAAM,KAAKD,EAAO,KAAK,GAAG;AAAA,IAC7D,gBAAAE,EAAC,QAAA,EAAK,WAAWC,EAAG,eAAeF,EAAM,MAAMD,EAAO,IAAI,GACvD,UAAAJ,KAASI,EAAO,MAAA,CACnB;AAAA,EAAA,GACF;AAEJ,GAUMK,IAA2C;AAAA,EAC/C,KAAK;AAAA,EACL,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,KAAK;AACP,GAEMC,IAAkB;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAc,CAAC;AAAA,EAC1B,OAAAZ;AAAA,EACA,OAAAC;AAAA,EACA,MAAAE,IAAO;AAAA,EACP,WAAAC;AACF,MAAwB;AACtB,QAAMC,IAASR,EAAYG,CAAK;AAEhC,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAE,EAAYV,CAAK;AAAA,QACjBW,EAAgBR,CAAI;AAAA,QACpBC;AAAA,MAAA;AAAA,MAGD,eAASC,EAAO;AAAA,IAAA;AAAA,EAAA;AAGvB;"}
package/dist/index63.js CHANGED
@@ -1,63 +1,39 @@
1
- import { jsxs as f, jsx as i } from "react/jsx-runtime";
2
- import { useState as y } from "react";
3
- import { cn as r } from "./index3.js";
4
- const h = {
5
- sm: "text-sm py-2",
6
- md: "text-base py-3",
7
- lg: "text-lg py-4"
8
- }, g = ({
9
- tabs: s,
10
- defaultIndex: c = 0,
11
- onChange: d,
12
- size: m = "md",
13
- variant: l = "underline",
14
- className: p,
15
- headerClassName: n,
16
- contentClassName: b
17
- }) => {
18
- var a;
19
- const [o, x] = y(c), u = (e) => {
20
- var t;
21
- (t = s[e]) != null && t.disabled || (x(e), d == null || d(e));
22
- };
23
- return /* @__PURE__ */ f("div", { className: r("flex flex-col", p), children: [
24
- /* @__PURE__ */ i(
25
- "div",
26
- {
27
- className: r(
28
- "flex",
29
- l === "underline" && "border-b border-slate-200",
30
- l === "pills" && "gap-2 p-1 bg-slate-100 rounded-lg",
31
- n
32
- ),
33
- children: s.map((e, t) => /* @__PURE__ */ i(
34
- "button",
35
- {
36
- onClick: () => u(t),
37
- disabled: e.disabled,
38
- className: r(
39
- "px-4 font-semibold transition-colors whitespace-nowrap",
40
- h[m],
41
- l === "underline" && [
42
- "border-b-2 -mb-px",
43
- t === o ? "border-primary-500 text-primary-500" : "border-transparent text-slate-500 hover:text-slate-700"
44
- ],
45
- l === "pills" && [
46
- "rounded-md",
47
- t === o ? "bg-white text-primary-500 shadow-sm" : "text-slate-500 hover:text-slate-700"
48
- ],
49
- e.disabled && "opacity-50 cursor-not-allowed"
50
- ),
51
- children: e.label
52
- },
53
- t
54
- ))
55
- }
1
+ import { jsxs as c, jsx as r } from "react/jsx-runtime";
2
+ import { cn as s } from "./index3.js";
3
+ import { CheckIcon as p } from "@heroicons/react/24/outline";
4
+ const l = ({
5
+ text: a,
6
+ isCompleted: t = !1,
7
+ isDisabled: e = !1,
8
+ height: n = 45,
9
+ className: m
10
+ }) => /* @__PURE__ */ c(
11
+ "div",
12
+ {
13
+ className: s(
14
+ "flex items-center justify-between px-4 rounded-md",
15
+ !e && !t && "bg-primary-50",
16
+ e && "bg-transparent",
17
+ t && "bg-transparent",
18
+ m
56
19
  ),
57
- /* @__PURE__ */ i("div", { className: r("flex-1 py-4", b), children: (a = s[o]) == null ? void 0 : a.content })
58
- ] });
59
- };
20
+ style: { height: `${n}px` },
21
+ children: [
22
+ /* @__PURE__ */ r(
23
+ "span",
24
+ {
25
+ className: s(
26
+ "text-sm",
27
+ e ? "text-slate-500" : "text-primary-500"
28
+ ),
29
+ children: a
30
+ }
31
+ ),
32
+ t && /* @__PURE__ */ r(p, { className: "w-5 h-5 text-slate-900" })
33
+ ]
34
+ }
35
+ );
60
36
  export {
61
- g as TabView
37
+ l as StepList
62
38
  };
63
39
  //# sourceMappingURL=index63.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index63.js","sources":["../src/components/TabView/TabView.tsx"],"sourcesContent":["import { useState, type ReactNode, type ReactElement } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface TabViewTab {\n label: string | ReactNode\n content: ReactElement\n disabled?: boolean\n}\n\nexport interface TabViewProps {\n tabs: TabViewTab[]\n defaultIndex?: number\n onChange?: (index: number) => void\n size?: 'sm' | 'md' | 'lg'\n variant?: 'underline' | 'pills'\n className?: string\n headerClassName?: string\n contentClassName?: string\n}\n\nconst sizeStyles = {\n sm: 'text-sm py-2',\n md: 'text-base py-3',\n lg: 'text-lg py-4',\n}\n\nexport const TabView = ({\n tabs,\n defaultIndex = 0,\n onChange,\n size = 'md',\n variant = 'underline',\n className,\n headerClassName,\n contentClassName,\n}: TabViewProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultIndex)\n\n const handleTabClick = (index: number) => {\n if (tabs[index]?.disabled) return\n setActiveIndex(index)\n onChange?.(index)\n }\n\n return (\n <div className={cn('flex flex-col', className)}>\n {/* Tab Headers */}\n <div\n className={cn(\n 'flex',\n variant === 'underline' && 'border-b border-slate-200',\n variant === 'pills' && 'gap-2 p-1 bg-slate-100 rounded-lg',\n headerClassName\n )}\n >\n {tabs.map((tab, index) => (\n <button\n key={index}\n onClick={() => handleTabClick(index)}\n disabled={tab.disabled}\n className={cn(\n 'px-4 font-semibold transition-colors whitespace-nowrap',\n sizeStyles[size],\n variant === 'underline' && [\n 'border-b-2 -mb-px',\n index === activeIndex\n ? 'border-primary-500 text-primary-500'\n : 'border-transparent text-slate-500 hover:text-slate-700',\n ],\n variant === 'pills' && [\n 'rounded-md',\n index === activeIndex\n ? 'bg-white text-primary-500 shadow-sm'\n : 'text-slate-500 hover:text-slate-700',\n ],\n tab.disabled && 'opacity-50 cursor-not-allowed'\n )}\n >\n {tab.label}\n </button>\n ))}\n </div>\n\n {/* Tab Content */}\n <div className={cn('flex-1 py-4', contentClassName)}>\n {tabs[activeIndex]?.content}\n </div>\n </div>\n )\n}\n"],"names":["sizeStyles","TabView","tabs","defaultIndex","onChange","size","variant","className","headerClassName","contentClassName","activeIndex","setActiveIndex","useState","handleTabClick","index","_a","cn","jsx","tab"],"mappings":";;;AAoBA,MAAMA,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAU,CAAC;AAAA,EACtB,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AACF,MAAoB;;AAClB,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAST,CAAY,GAErDU,IAAiB,CAACC,MAAkB;;AACxC,KAAIC,IAAAb,EAAKY,CAAK,MAAV,QAAAC,EAAa,aACjBJ,EAAeG,CAAK,GACpBV,KAAA,QAAAA,EAAWU;AAAA,EACb;AAEA,2BACG,OAAA,EAAI,WAAWE,EAAG,iBAAiBT,CAAS,GAE3C,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD;AAAA,UACT;AAAA,UACAV,MAAY,eAAe;AAAA,UAC3BA,MAAY,WAAW;AAAA,UACvBE;AAAA,QAAA;AAAA,QAGD,UAAAN,EAAK,IAAI,CAACgB,GAAKJ,MACd,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,SAAS,MAAMJ,EAAeC,CAAK;AAAA,YACnC,UAAUI,EAAI;AAAA,YACd,WAAWF;AAAA,cACT;AAAA,cACAhB,EAAWK,CAAI;AAAA,cACfC,MAAY,eAAe;AAAA,gBACzB;AAAA,gBACAQ,MAAUJ,IACN,wCACA;AAAA,cAAA;AAAA,cAENJ,MAAY,WAAW;AAAA,gBACrB;AAAA,gBACAQ,MAAUJ,IACN,wCACA;AAAA,cAAA;AAAA,cAENQ,EAAI,YAAY;AAAA,YAAA;AAAA,YAGjB,UAAAA,EAAI;AAAA,UAAA;AAAA,UArBAJ;AAAA,QAAA,CAuBR;AAAA,MAAA;AAAA,IAAA;AAAA,IAIH,gBAAAG,EAAC,OAAA,EAAI,WAAWD,EAAG,eAAeP,CAAgB,GAC/C,WAAAM,IAAAb,EAAKQ,CAAW,MAAhB,gBAAAK,EAAmB,QAAA,CACtB;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"index63.js","sources":["../src/components/StepList/StepList.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport { CheckIcon } from '@heroicons/react/24/outline'\n\nexport interface StepListProps {\n text: string\n isCompleted?: boolean\n isDisabled?: boolean\n height?: number\n className?: string\n}\n\nexport const StepList = ({\n text,\n isCompleted = false,\n isDisabled = false,\n height = 45,\n className,\n}: StepListProps) => {\n return (\n <div\n className={cn(\n 'flex items-center justify-between px-4 rounded-md',\n !isDisabled && !isCompleted && 'bg-primary-50',\n isDisabled && 'bg-transparent',\n isCompleted && 'bg-transparent',\n className\n )}\n style={{ height: `${height}px` }}\n >\n <span\n className={cn(\n 'text-sm',\n isDisabled ? 'text-slate-500' : 'text-primary-500'\n )}\n >\n {text}\n </span>\n {isCompleted && (\n <CheckIcon className=\"w-5 h-5 text-slate-900\" />\n )}\n </div>\n )\n}\n"],"names":["StepList","text","isCompleted","isDisabled","height","className","jsxs","cn","jsx","CheckIcon"],"mappings":";;;AAWO,MAAMA,IAAW,CAAC;AAAA,EACvB,MAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,YAAAC,IAAa;AAAA,EACb,QAAAC,IAAS;AAAA,EACT,WAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACA,CAACJ,KAAc,CAACD,KAAe;AAAA,MAC/BC,KAAc;AAAA,MACdD,KAAe;AAAA,MACfG;AAAA,IAAA;AAAA,IAEF,OAAO,EAAE,QAAQ,GAAGD,CAAM,KAAA;AAAA,IAE1B,UAAA;AAAA,MAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWD;AAAA,YACT;AAAA,YACAJ,IAAa,mBAAmB;AAAA,UAAA;AAAA,UAGjC,UAAAF;AAAA,QAAA;AAAA,MAAA;AAAA,MAEFC,KACC,gBAAAM,EAACC,GAAA,EAAU,WAAU,yBAAA,CAAyB;AAAA,IAAA;AAAA,EAAA;AAAA;"}
package/dist/index64.js CHANGED
@@ -1,64 +1,21 @@
1
- import { jsx as e, jsxs as o } from "react/jsx-runtime";
2
- import { cn as t } from "./index3.js";
3
- function N({
4
- columns: l,
5
- data: h,
6
- keyExtractor: p,
7
- striped: i = !1,
8
- hoverable: b = !0,
9
- compact: s = !1,
10
- className: n,
11
- emptyMessage: x = "No data available"
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import { cn as n } from "./index3.js";
3
+ function m({
4
+ children: t,
5
+ className: e
12
6
  }) {
13
- return /* @__PURE__ */ e("div", { className: t("overflow-x-auto", n), children: /* @__PURE__ */ o("table", { className: "w-full text-left", children: [
14
- /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { className: "border-b border-slate-200 bg-slate-50", children: l.map((a) => /* @__PURE__ */ e(
15
- "th",
16
- {
17
- className: t(
18
- "font-semibold text-slate-700 text-sm",
19
- s ? "px-4 py-2" : "px-6 py-3",
20
- a.headerClassName
21
- ),
22
- children: a.header
23
- },
24
- a.key
25
- )) }) }),
26
- /* @__PURE__ */ e("tbody", { children: h.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
27
- "td",
28
- {
29
- colSpan: l.length,
30
- className: t(
31
- "text-center text-slate-500",
32
- s ? "px-4 py-8" : "px-6 py-12"
33
- ),
34
- children: x
35
- }
36
- ) }) : h.map((a, d) => /* @__PURE__ */ e(
37
- "tr",
38
- {
39
- className: t(
40
- "border-b border-slate-100 transition-colors duration-150",
41
- i && d % 2 === 1 && "bg-slate-50",
42
- b && "hover:bg-slate-50"
43
- ),
44
- children: l.map((r) => /* @__PURE__ */ e(
45
- "td",
46
- {
47
- className: t(
48
- "text-slate-900",
49
- s ? "px-4 py-2" : "px-6 py-4",
50
- r.className
51
- ),
52
- children: r.render ? r.render(a, d) : a[r.key]
53
- },
54
- r.key
55
- ))
56
- },
57
- p(a, d)
58
- )) })
59
- ] }) });
7
+ return /* @__PURE__ */ o(
8
+ "h3",
9
+ {
10
+ className: n(
11
+ "text-lg font-semibold text-slate-900",
12
+ e
13
+ ),
14
+ children: t
15
+ }
16
+ );
60
17
  }
61
18
  export {
62
- N as Table
19
+ m as SubsectionHeading
63
20
  };
64
21
  //# sourceMappingURL=index64.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index64.js","sources":["../src/components/Table/Table.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface TableColumn<T> {\n key: string\n header: string\n render?: (item: T, index: number) => ReactNode\n className?: string\n headerClassName?: string\n}\n\nexport interface TableProps<T> {\n columns: TableColumn<T>[]\n data: T[]\n keyExtractor: (item: T, index: number) => string | number\n striped?: boolean\n hoverable?: boolean\n compact?: boolean\n className?: string\n emptyMessage?: string\n}\n\nexport function Table<T>({\n columns,\n data,\n keyExtractor,\n striped = false,\n hoverable = true,\n compact = false,\n className,\n emptyMessage = 'No data available',\n}: TableProps<T>) {\n return (\n <div className={cn('overflow-x-auto', className)}>\n <table className=\"w-full text-left\">\n <thead>\n <tr className=\"border-b border-slate-200 bg-slate-50\">\n {columns.map((column) => (\n <th\n key={column.key}\n className={cn(\n 'font-semibold text-slate-700 text-sm',\n compact ? 'px-4 py-2' : 'px-6 py-3',\n column.headerClassName\n )}\n >\n {column.header}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {data.length === 0 ? (\n <tr>\n <td\n colSpan={columns.length}\n className={cn(\n 'text-center text-slate-500',\n compact ? 'px-4 py-8' : 'px-6 py-12'\n )}\n >\n {emptyMessage}\n </td>\n </tr>\n ) : (\n data.map((item, index) => (\n <tr\n key={keyExtractor(item, index)}\n className={cn(\n 'border-b border-slate-100 transition-colors duration-150',\n striped && index % 2 === 1 && 'bg-slate-50',\n hoverable && 'hover:bg-slate-50'\n )}\n >\n {columns.map((column) => (\n <td\n key={column.key}\n className={cn(\n 'text-slate-900',\n compact ? 'px-4 py-2' : 'px-6 py-4',\n column.className\n )}\n >\n {column.render\n ? column.render(item, index)\n : (item as Record<string, unknown>)[column.key] as ReactNode}\n </td>\n ))}\n </tr>\n ))\n )}\n </tbody>\n </table>\n </div>\n )\n}\n"],"names":["Table","columns","data","keyExtractor","striped","hoverable","compact","className","emptyMessage","jsx","cn","jsxs","column","item","index"],"mappings":";;AAsBO,SAASA,EAAS;AAAA,EACvB,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,GAAkB;AAChB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,mBAAmBH,CAAS,GAC7C,UAAA,gBAAAI,EAAC,SAAA,EAAM,WAAU,oBACf,UAAA;AAAA,IAAA,gBAAAF,EAAC,SAAA,EACC,4BAAC,MAAA,EAAG,WAAU,yCACX,UAAAR,EAAQ,IAAI,CAACW,MACZ,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWC;AAAA,UACT;AAAA,UACAJ,IAAU,cAAc;AAAA,UACxBM,EAAO;AAAA,QAAA;AAAA,QAGR,UAAAA,EAAO;AAAA,MAAA;AAAA,MAPHA,EAAO;AAAA,IAAA,CASf,GACH,EAAA,CACF;AAAA,sBACC,SAAA,EACE,UAAAV,EAAK,WAAW,sBACd,MAAA,EACC,UAAA,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASR,EAAQ;AAAA,QACjB,WAAWS;AAAA,UACT;AAAA,UACAJ,IAAU,cAAc;AAAA,QAAA;AAAA,QAGzB,UAAAE;AAAA,MAAA;AAAA,IAAA,GAEL,IAEAN,EAAK,IAAI,CAACW,GAAMC,MACd,gBAAAL;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWC;AAAA,UACT;AAAA,UACAN,KAAWU,IAAQ,MAAM,KAAK;AAAA,UAC9BT,KAAa;AAAA,QAAA;AAAA,QAGd,UAAAJ,EAAQ,IAAI,CAACW,MACZ,gBAAAH;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAWC;AAAA,cACT;AAAA,cACAJ,IAAU,cAAc;AAAA,cACxBM,EAAO;AAAA,YAAA;AAAA,YAGR,UAAAA,EAAO,SACJA,EAAO,OAAOC,GAAMC,CAAK,IACxBD,EAAiCD,EAAO,GAAG;AAAA,UAAA;AAAA,UAT3CA,EAAO;AAAA,QAAA,CAWf;AAAA,MAAA;AAAA,MApBIT,EAAaU,GAAMC,CAAK;AAAA,IAAA,CAsBhC,EAAA,CAEL;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}
1
+ {"version":3,"file":"index64.js","sources":["../src/components/Typography/SubsectionHeading.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface SubsectionHeadingProps {\n children: ReactNode\n className?: string\n}\n\nexport function SubsectionHeading({\n children,\n className,\n}: SubsectionHeadingProps) {\n return (\n <h3\n className={cn(\n 'text-lg font-semibold text-slate-900',\n className\n )}\n >\n {children}\n </h3>\n )\n}\n"],"names":["SubsectionHeading","children","className","jsx","cn"],"mappings":";;AAQO,SAASA,EAAkB;AAAA,EAChC,UAAAC;AAAA,EACA,WAAAC;AACF,GAA2B;AACzB,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/index65.js CHANGED
@@ -1,78 +1,63 @@
1
- import { jsxs as c, jsx as s } from "react/jsx-runtime";
2
- import { useState as u } from "react";
3
- import { TabGroup as f, TabList as m, Tab as x, TabPanels as g, TabPanel as h } from "@headlessui/react";
4
- import { cn as a } from "./index3.js";
5
- function j({
6
- items: t,
7
- defaultIndex: i = 0,
8
- onChange: l,
9
- variant: r = "underline",
10
- fullWidth: d = !1,
11
- className: n
12
- }) {
13
- const [b, p] = u(i);
14
- return /* @__PURE__ */ c(
15
- f,
16
- {
17
- selectedIndex: b,
18
- onChange: (e) => {
19
- p(e), l == null || l(e);
20
- },
21
- className: n,
22
- children: [
23
- /* @__PURE__ */ s(
24
- m,
25
- {
26
- className: a(
27
- "flex",
28
- r === "underline" && "border-b border-slate-200 gap-0",
29
- r === "pills" && "gap-2",
30
- r === "boxed" && "bg-slate-100 p-1 rounded-lg gap-1"
31
- ),
32
- children: t.map((e) => /* @__PURE__ */ s(
33
- x,
34
- {
35
- disabled: e.disabled,
36
- className: ({ selected: o }) => a(
37
- "font-medium text-sm transition-colors duration-200",
38
- "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2",
39
- d && "flex-1",
40
- e.disabled && "opacity-50 cursor-not-allowed",
41
- // Underline variant
42
- r === "underline" && [
43
- "px-4 py-3 -mb-px border-b-2",
44
- o ? "border-primary-500 text-primary-600" : "border-transparent text-slate-500 hover:text-slate-700 hover:border-slate-300"
45
- ],
46
- // Pills variant
47
- r === "pills" && [
48
- "px-4 py-2 rounded-lg",
49
- o ? "bg-primary-500 text-white" : "text-slate-600 hover:bg-slate-100"
50
- ],
51
- // Boxed variant
52
- r === "boxed" && [
53
- "px-4 py-2 rounded-md",
54
- o ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"
55
- ]
56
- ),
57
- children: e.label
58
- },
59
- e.key
60
- ))
61
- }
1
+ import { jsxs as f, jsx as i } from "react/jsx-runtime";
2
+ import { useState as y } from "react";
3
+ import { cn as r } from "./index3.js";
4
+ const h = {
5
+ sm: "text-sm py-2",
6
+ md: "text-base py-3",
7
+ lg: "text-lg py-4"
8
+ }, g = ({
9
+ tabs: s,
10
+ defaultIndex: c = 0,
11
+ onChange: d,
12
+ size: m = "md",
13
+ variant: l = "underline",
14
+ className: p,
15
+ headerClassName: n,
16
+ contentClassName: b
17
+ }) => {
18
+ var a;
19
+ const [o, x] = y(c), u = (e) => {
20
+ var t;
21
+ (t = s[e]) != null && t.disabled || (x(e), d == null || d(e));
22
+ };
23
+ return /* @__PURE__ */ f("div", { className: r("flex flex-col", p), children: [
24
+ /* @__PURE__ */ i(
25
+ "div",
26
+ {
27
+ className: r(
28
+ "flex",
29
+ l === "underline" && "border-b border-slate-200",
30
+ l === "pills" && "gap-2 p-1 bg-slate-100 rounded-lg",
31
+ n
62
32
  ),
63
- /* @__PURE__ */ s(g, { className: "mt-4", children: t.map((e) => /* @__PURE__ */ s(
64
- h,
33
+ children: s.map((e, t) => /* @__PURE__ */ i(
34
+ "button",
65
35
  {
66
- className: "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 rounded-lg",
67
- children: e.content
36
+ onClick: () => u(t),
37
+ disabled: e.disabled,
38
+ className: r(
39
+ "px-4 font-semibold transition-colors whitespace-nowrap",
40
+ h[m],
41
+ l === "underline" && [
42
+ "border-b-2 -mb-px",
43
+ t === o ? "border-primary-500 text-primary-500" : "border-transparent text-slate-500 hover:text-slate-700"
44
+ ],
45
+ l === "pills" && [
46
+ "rounded-md",
47
+ t === o ? "bg-white text-primary-500 shadow-sm" : "text-slate-500 hover:text-slate-700"
48
+ ],
49
+ e.disabled && "opacity-50 cursor-not-allowed"
50
+ ),
51
+ children: e.label
68
52
  },
69
- e.key
70
- )) })
71
- ]
72
- }
73
- );
74
- }
53
+ t
54
+ ))
55
+ }
56
+ ),
57
+ /* @__PURE__ */ i("div", { className: r("flex-1 py-4", b), children: (a = s[o]) == null ? void 0 : a.content })
58
+ ] });
59
+ };
75
60
  export {
76
- j as Tabs
61
+ g as TabView
77
62
  };
78
63
  //# sourceMappingURL=index65.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index65.js","sources":["../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react'\nimport { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface TabItem {\n key: string\n label: string\n content: ReactNode\n disabled?: boolean\n}\n\nexport interface TabsProps {\n items: TabItem[]\n defaultIndex?: number\n onChange?: (index: number) => void\n variant?: 'underline' | 'pills' | 'boxed'\n fullWidth?: boolean\n className?: string\n}\n\nexport function Tabs({\n items,\n defaultIndex = 0,\n onChange,\n variant = 'underline',\n fullWidth = false,\n className,\n}: TabsProps) {\n const [selectedIndex, setSelectedIndex] = useState(defaultIndex)\n\n const handleChange = (index: number) => {\n setSelectedIndex(index)\n onChange?.(index)\n }\n\n return (\n <TabGroup\n selectedIndex={selectedIndex}\n onChange={handleChange}\n className={className}\n >\n <TabList\n className={cn(\n 'flex',\n variant === 'underline' && 'border-b border-slate-200 gap-0',\n variant === 'pills' && 'gap-2',\n variant === 'boxed' && 'bg-slate-100 p-1 rounded-lg gap-1'\n )}\n >\n {items.map((item) => (\n <Tab\n key={item.key}\n disabled={item.disabled}\n className={({ selected }) =>\n cn(\n 'font-medium text-sm transition-colors duration-200',\n 'focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2',\n fullWidth && 'flex-1',\n item.disabled && 'opacity-50 cursor-not-allowed',\n\n // Underline variant\n variant === 'underline' && [\n 'px-4 py-3 -mb-px border-b-2',\n selected\n ? 'border-primary-500 text-primary-600'\n : 'border-transparent text-slate-500 hover:text-slate-700 hover:border-slate-300',\n ],\n\n // Pills variant\n variant === 'pills' && [\n 'px-4 py-2 rounded-lg',\n selected\n ? 'bg-primary-500 text-white'\n : 'text-slate-600 hover:bg-slate-100',\n ],\n\n // Boxed variant\n variant === 'boxed' && [\n 'px-4 py-2 rounded-md',\n selected\n ? 'bg-white text-slate-900 shadow-sm'\n : 'text-slate-600 hover:text-slate-900',\n ]\n )\n }\n >\n {item.label}\n </Tab>\n ))}\n </TabList>\n <TabPanels className=\"mt-4\">\n {items.map((item) => (\n <TabPanel\n key={item.key}\n className=\"focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 rounded-lg\"\n >\n {item.content}\n </TabPanel>\n ))}\n </TabPanels>\n </TabGroup>\n )\n}\n"],"names":["Tabs","items","defaultIndex","onChange","variant","fullWidth","className","selectedIndex","setSelectedIndex","useState","jsxs","TabGroup","index","jsx","TabList","cn","item","Tab","selected","TabPanels","TabPanel"],"mappings":";;;;AAqBO,SAASA,EAAK;AAAA,EACnB,OAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,WAAAC;AACF,GAAc;AACZ,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAASP,CAAY;AAO/D,SACE,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAAJ;AAAA,MACA,UARiB,CAACK,MAAkB;AACtC,QAAAJ,EAAiBI,CAAK,GACtBT,KAAA,QAAAA,EAAWS;AAAA,MACb;AAAA,MAMI,WAAAN;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAO;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWC;AAAA,cACT;AAAA,cACAX,MAAY,eAAe;AAAA,cAC3BA,MAAY,WAAW;AAAA,cACvBA,MAAY,WAAW;AAAA,YAAA;AAAA,YAGxB,UAAAH,EAAM,IAAI,CAACe,MACV,gBAAAH;AAAA,cAACI;AAAA,cAAA;AAAA,gBAEC,UAAUD,EAAK;AAAA,gBACf,WAAW,CAAC,EAAE,UAAAE,EAAA,MACZH;AAAA,kBACE;AAAA,kBACA;AAAA,kBACAV,KAAa;AAAA,kBACbW,EAAK,YAAY;AAAA;AAAA,kBAGjBZ,MAAY,eAAe;AAAA,oBACzB;AAAA,oBACAc,IACI,wCACA;AAAA,kBAAA;AAAA;AAAA,kBAINd,MAAY,WAAW;AAAA,oBACrB;AAAA,oBACAc,IACI,8BACA;AAAA,kBAAA;AAAA;AAAA,kBAINd,MAAY,WAAW;AAAA,oBACrB;AAAA,oBACAc,IACI,sCACA;AAAA,kBAAA;AAAA,gBACN;AAAA,gBAIH,UAAAF,EAAK;AAAA,cAAA;AAAA,cAnCDA,EAAK;AAAA,YAAA,CAqCb;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFG,GAAA,EAAU,WAAU,QAClB,UAAAlB,EAAM,IAAI,CAACe,MACV,gBAAAH;AAAA,UAACO;AAAA,UAAA;AAAA,YAEC,WAAU;AAAA,YAET,UAAAJ,EAAK;AAAA,UAAA;AAAA,UAHDA,EAAK;AAAA,QAAA,CAKb,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1
+ {"version":3,"file":"index65.js","sources":["../src/components/TabView/TabView.tsx"],"sourcesContent":["import { useState, type ReactNode, type ReactElement } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface TabViewTab {\n label: string | ReactNode\n content: ReactElement\n disabled?: boolean\n}\n\nexport interface TabViewProps {\n tabs: TabViewTab[]\n defaultIndex?: number\n onChange?: (index: number) => void\n size?: 'sm' | 'md' | 'lg'\n variant?: 'underline' | 'pills'\n className?: string\n headerClassName?: string\n contentClassName?: string\n}\n\nconst sizeStyles = {\n sm: 'text-sm py-2',\n md: 'text-base py-3',\n lg: 'text-lg py-4',\n}\n\nexport const TabView = ({\n tabs,\n defaultIndex = 0,\n onChange,\n size = 'md',\n variant = 'underline',\n className,\n headerClassName,\n contentClassName,\n}: TabViewProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultIndex)\n\n const handleTabClick = (index: number) => {\n if (tabs[index]?.disabled) return\n setActiveIndex(index)\n onChange?.(index)\n }\n\n return (\n <div className={cn('flex flex-col', className)}>\n {/* Tab Headers */}\n <div\n className={cn(\n 'flex',\n variant === 'underline' && 'border-b border-slate-200',\n variant === 'pills' && 'gap-2 p-1 bg-slate-100 rounded-lg',\n headerClassName\n )}\n >\n {tabs.map((tab, index) => (\n <button\n key={index}\n onClick={() => handleTabClick(index)}\n disabled={tab.disabled}\n className={cn(\n 'px-4 font-semibold transition-colors whitespace-nowrap',\n sizeStyles[size],\n variant === 'underline' && [\n 'border-b-2 -mb-px',\n index === activeIndex\n ? 'border-primary-500 text-primary-500'\n : 'border-transparent text-slate-500 hover:text-slate-700',\n ],\n variant === 'pills' && [\n 'rounded-md',\n index === activeIndex\n ? 'bg-white text-primary-500 shadow-sm'\n : 'text-slate-500 hover:text-slate-700',\n ],\n tab.disabled && 'opacity-50 cursor-not-allowed'\n )}\n >\n {tab.label}\n </button>\n ))}\n </div>\n\n {/* Tab Content */}\n <div className={cn('flex-1 py-4', contentClassName)}>\n {tabs[activeIndex]?.content}\n </div>\n </div>\n )\n}\n"],"names":["sizeStyles","TabView","tabs","defaultIndex","onChange","size","variant","className","headerClassName","contentClassName","activeIndex","setActiveIndex","useState","handleTabClick","index","_a","cn","jsx","tab"],"mappings":";;;AAoBA,MAAMA,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAU,CAAC;AAAA,EACtB,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AACF,MAAoB;;AAClB,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAST,CAAY,GAErDU,IAAiB,CAACC,MAAkB;;AACxC,KAAIC,IAAAb,EAAKY,CAAK,MAAV,QAAAC,EAAa,aACjBJ,EAAeG,CAAK,GACpBV,KAAA,QAAAA,EAAWU;AAAA,EACb;AAEA,2BACG,OAAA,EAAI,WAAWE,EAAG,iBAAiBT,CAAS,GAE3C,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD;AAAA,UACT;AAAA,UACAV,MAAY,eAAe;AAAA,UAC3BA,MAAY,WAAW;AAAA,UACvBE;AAAA,QAAA;AAAA,QAGD,UAAAN,EAAK,IAAI,CAACgB,GAAKJ,MACd,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,SAAS,MAAMJ,EAAeC,CAAK;AAAA,YACnC,UAAUI,EAAI;AAAA,YACd,WAAWF;AAAA,cACT;AAAA,cACAhB,EAAWK,CAAI;AAAA,cACfC,MAAY,eAAe;AAAA,gBACzB;AAAA,gBACAQ,MAAUJ,IACN,wCACA;AAAA,cAAA;AAAA,cAENJ,MAAY,WAAW;AAAA,gBACrB;AAAA,gBACAQ,MAAUJ,IACN,wCACA;AAAA,cAAA;AAAA,cAENQ,EAAI,YAAY;AAAA,YAAA;AAAA,YAGjB,UAAAA,EAAI;AAAA,UAAA;AAAA,UArBAJ;AAAA,QAAA,CAuBR;AAAA,MAAA;AAAA,IAAA;AAAA,IAIH,gBAAAG,EAAC,OAAA,EAAI,WAAWD,EAAG,eAAeP,CAAgB,GAC/C,WAAAM,IAAAb,EAAKQ,CAAW,MAAhB,gBAAAK,EAAmB,QAAA,CACtB;AAAA,EAAA,GACF;AAEJ;"}