@zentauri-ui/zentauri-components 0.0.8 → 0.0.9

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 (132) hide show
  1. package/README.md +27 -2
  2. package/dist/ui/accordion.cjs +311 -0
  3. package/dist/ui/accordion.cjs.map +1 -0
  4. package/dist/ui/accordion.d.cts +70 -0
  5. package/dist/ui/accordion.d.ts +70 -0
  6. package/dist/ui/accordion.js +286 -0
  7. package/dist/ui/accordion.js.map +1 -0
  8. package/dist/ui/alert.cjs +257 -0
  9. package/dist/ui/alert.cjs.map +1 -0
  10. package/dist/ui/alert.d.cts +66 -0
  11. package/dist/ui/alert.d.ts +66 -0
  12. package/dist/ui/alert.js +224 -0
  13. package/dist/ui/alert.js.map +1 -0
  14. package/dist/ui/badge.cjs +192 -0
  15. package/dist/ui/badge.cjs.map +1 -0
  16. package/dist/ui/badge.d.cts +37 -0
  17. package/dist/ui/badge.d.ts +37 -0
  18. package/dist/ui/badge.js +165 -0
  19. package/dist/ui/badge.js.map +1 -0
  20. package/dist/ui/buttons.cjs +202 -0
  21. package/dist/ui/buttons.cjs.map +1 -0
  22. package/dist/ui/buttons.d.cts +27 -0
  23. package/dist/ui/buttons.d.ts +27 -0
  24. package/dist/ui/buttons.js +176 -0
  25. package/dist/ui/buttons.js.map +1 -0
  26. package/dist/ui/card.cjs +293 -0
  27. package/dist/ui/card.cjs.map +1 -0
  28. package/dist/ui/card.d.cts +77 -0
  29. package/dist/ui/card.d.ts +77 -0
  30. package/dist/ui/card.js +258 -0
  31. package/dist/ui/card.js.map +1 -0
  32. package/dist/ui/divider.cjs +229 -0
  33. package/dist/ui/divider.cjs.map +1 -0
  34. package/dist/ui/divider.d.cts +39 -0
  35. package/dist/ui/divider.d.ts +39 -0
  36. package/dist/ui/divider.js +200 -0
  37. package/dist/ui/divider.js.map +1 -0
  38. package/dist/ui/drawer.cjs +408 -0
  39. package/dist/ui/drawer.cjs.map +1 -0
  40. package/dist/ui/drawer.d.cts +81 -0
  41. package/dist/ui/drawer.d.ts +81 -0
  42. package/dist/ui/drawer.js +383 -0
  43. package/dist/ui/drawer.js.map +1 -0
  44. package/dist/ui/dropdown.cjs +302 -0
  45. package/dist/ui/dropdown.cjs.map +1 -0
  46. package/dist/ui/dropdown.d.cts +50 -0
  47. package/dist/ui/dropdown.d.ts +50 -0
  48. package/dist/ui/dropdown.js +278 -0
  49. package/dist/ui/dropdown.js.map +1 -0
  50. package/dist/ui/empty-state.cjs +186 -0
  51. package/dist/ui/empty-state.cjs.map +1 -0
  52. package/dist/ui/empty-state.d.cts +55 -0
  53. package/dist/ui/empty-state.d.ts +55 -0
  54. package/dist/ui/empty-state.js +154 -0
  55. package/dist/ui/empty-state.js.map +1 -0
  56. package/dist/ui/index.d.cts +27 -1164
  57. package/dist/ui/index.d.ts +27 -1164
  58. package/dist/ui/inputs.cjs +458 -0
  59. package/dist/ui/inputs.cjs.map +1 -0
  60. package/dist/ui/inputs.d.cts +35 -0
  61. package/dist/ui/inputs.d.ts +35 -0
  62. package/dist/ui/inputs.js +432 -0
  63. package/dist/ui/inputs.js.map +1 -0
  64. package/dist/ui/modal.cjs +406 -0
  65. package/dist/ui/modal.cjs.map +1 -0
  66. package/dist/ui/modal.d.cts +84 -0
  67. package/dist/ui/modal.d.ts +84 -0
  68. package/dist/ui/modal.js +384 -0
  69. package/dist/ui/modal.js.map +1 -0
  70. package/dist/ui/pagination.cjs +523 -0
  71. package/dist/ui/pagination.cjs.map +1 -0
  72. package/dist/ui/pagination.d.cts +114 -0
  73. package/dist/ui/pagination.d.ts +114 -0
  74. package/dist/ui/pagination.js +494 -0
  75. package/dist/ui/pagination.js.map +1 -0
  76. package/dist/ui/progress.cjs +268 -0
  77. package/dist/ui/progress.cjs.map +1 -0
  78. package/dist/ui/progress.d.cts +61 -0
  79. package/dist/ui/progress.d.ts +61 -0
  80. package/dist/ui/progress.js +237 -0
  81. package/dist/ui/progress.js.map +1 -0
  82. package/dist/ui/select.cjs +360 -0
  83. package/dist/ui/select.cjs.map +1 -0
  84. package/dist/ui/select.d.cts +73 -0
  85. package/dist/ui/select.d.ts +73 -0
  86. package/dist/ui/select.js +327 -0
  87. package/dist/ui/select.js.map +1 -0
  88. package/dist/ui/skeleton.cjs +576 -0
  89. package/dist/ui/skeleton.cjs.map +1 -0
  90. package/dist/ui/skeleton.d.cts +90 -0
  91. package/dist/ui/skeleton.d.ts +90 -0
  92. package/dist/ui/skeleton.js +544 -0
  93. package/dist/ui/skeleton.js.map +1 -0
  94. package/dist/ui/spinner.cjs +219 -0
  95. package/dist/ui/spinner.cjs.map +1 -0
  96. package/dist/ui/spinner.d.cts +27 -0
  97. package/dist/ui/spinner.d.ts +27 -0
  98. package/dist/ui/spinner.js +193 -0
  99. package/dist/ui/spinner.js.map +1 -0
  100. package/dist/ui/table.cjs +328 -0
  101. package/dist/ui/table.cjs.map +1 -0
  102. package/dist/ui/table.d.cts +81 -0
  103. package/dist/ui/table.d.ts +81 -0
  104. package/dist/ui/table.js +293 -0
  105. package/dist/ui/table.js.map +1 -0
  106. package/dist/ui/tabs.cjs +300 -0
  107. package/dist/ui/tabs.cjs.map +1 -0
  108. package/dist/ui/tabs.d.cts +58 -0
  109. package/dist/ui/tabs.d.ts +58 -0
  110. package/dist/ui/tabs.js +274 -0
  111. package/dist/ui/tabs.js.map +1 -0
  112. package/dist/ui/toast.cjs +285 -0
  113. package/dist/ui/toast.cjs.map +1 -0
  114. package/dist/ui/toast.d.cts +86 -0
  115. package/dist/ui/toast.d.ts +86 -0
  116. package/dist/ui/toast.js +258 -0
  117. package/dist/ui/toast.js.map +1 -0
  118. package/dist/ui/toggle.cjs +185 -0
  119. package/dist/ui/toggle.cjs.map +1 -0
  120. package/dist/ui/toggle.d.cts +37 -0
  121. package/dist/ui/toggle.d.ts +37 -0
  122. package/dist/ui/toggle.js +158 -0
  123. package/dist/ui/toggle.js.map +1 -0
  124. package/dist/ui/tooltip.cjs +242 -0
  125. package/dist/ui/tooltip.cjs.map +1 -0
  126. package/dist/ui/tooltip.d.cts +46 -0
  127. package/dist/ui/tooltip.d.ts +46 -0
  128. package/dist/ui/tooltip.js +214 -0
  129. package/dist/ui/tooltip.js.map +1 -0
  130. package/dist/variants-1Bx3BEeS.d.cts +8 -0
  131. package/dist/variants-1Bx3BEeS.d.ts +8 -0
  132. package/package.json +7 -3
@@ -0,0 +1,293 @@
1
+ "use client";
2
+
3
+
4
+ // src/ui/table/table.tsx
5
+ import { createContext, useContext, useMemo } from "react";
6
+ import { motion } from "framer-motion";
7
+
8
+ // src/lib/utils.ts
9
+ import { clsx } from "clsx";
10
+ import { twMerge } from "tailwind-merge";
11
+ function cn(...inputs) {
12
+ return twMerge(clsx(inputs));
13
+ }
14
+
15
+ // src/ui/table/animations.ts
16
+ var tableAnimationPresets = {
17
+ none: {},
18
+ hover: {
19
+ whileHover: { backgroundColor: "rgba(255,255,255,0.05)" },
20
+ transition: { duration: 0.15 }
21
+ }
22
+ };
23
+
24
+ // src/ui/table/variants.ts
25
+ import { cva } from "class-variance-authority";
26
+ var tableVariants = cva(
27
+ "w-full table-auto border-collapse caption-bottom text-sm text-slate-200 md:table-fixed",
28
+ {
29
+ variants: {
30
+ appearance: {
31
+ default: "",
32
+ striped: "",
33
+ bordered: "border border-white/10",
34
+ ghost: "",
35
+ sky: "border border-sky-600",
36
+ rose: "border border-rose-600",
37
+ purple: "border border-purple-600",
38
+ pink: "border border-pink-600",
39
+ orange: "border border-orange-600",
40
+ yellow: "border border-yellow-600",
41
+ teal: "border border-teal-600",
42
+ indigo: "border border-indigo-600",
43
+ emerald: "border border-emerald-600",
44
+ gray: "border border-gray-600",
45
+ amber: "border border-amber-600",
46
+ violet: "border border-violet-600"
47
+ },
48
+ size: {
49
+ sm: "text-xs",
50
+ md: "text-sm",
51
+ lg: "text-base"
52
+ },
53
+ stickyHeader: {
54
+ true: "",
55
+ false: ""
56
+ }
57
+ },
58
+ defaultVariants: {
59
+ appearance: "default",
60
+ size: "md",
61
+ stickyHeader: false
62
+ }
63
+ }
64
+ );
65
+ var tableRowVariants = cva(
66
+ "border-b border-white/5 transition-colors data-[state=selected]:bg-white/[0.06]",
67
+ {
68
+ variants: {
69
+ appearance: {
70
+ default: "",
71
+ striped: "odd:bg-white/[0.03]",
72
+ bordered: "",
73
+ ghost: "border-transparent hover:bg-white/[0.03]",
74
+ sky: "border-sky-600 hover:bg-sky-600",
75
+ rose: "border-rose-600 hover:bg-rose-900",
76
+ purple: "border-purple-600 hover:bg-purple-900",
77
+ pink: "border-pink-600 hover:bg-pink-900",
78
+ orange: "border-orange-600 hover:bg-orange-900",
79
+ yellow: "border-yellow-600 hover:bg-yellow-900",
80
+ teal: "border-teal-600 hover:bg-teal-900",
81
+ indigo: "border-indigo-600 hover:bg-indigo-900",
82
+ emerald: "border-emerald-600 hover:bg-emerald-900",
83
+ gray: "border-gray-600 hover:bg-gray-900",
84
+ amber: "border-amber-600 hover:bg-amber-900",
85
+ violet: "border-violet-600 hover:bg-violet-900"
86
+ }
87
+ },
88
+ defaultVariants: { appearance: "default" }
89
+ }
90
+ );
91
+ var tableCellVariants = cva("min-w-0 border p-3 align-middle break-words", {
92
+ variants: {
93
+ appearance: {
94
+ default: "border-white/10",
95
+ striped: "border-white/10",
96
+ bordered: "border-white/10",
97
+ ghost: "border-white/10",
98
+ sky: "border-sky-600",
99
+ rose: "border-rose-600",
100
+ purple: "border-purple-600",
101
+ pink: "border-pink-600",
102
+ orange: "border-orange-600",
103
+ yellow: "border-yellow-600",
104
+ teal: "border-teal-600",
105
+ indigo: "border-indigo-600",
106
+ emerald: "border-emerald-600",
107
+ gray: "border-gray-600",
108
+ amber: "border-amber-600",
109
+ violet: "border-violet-600"
110
+ },
111
+ size: {
112
+ sm: "p-2",
113
+ md: "p-3",
114
+ lg: "p-4"
115
+ },
116
+ textAlign: {
117
+ left: "text-left",
118
+ center: "text-center",
119
+ right: "text-right"
120
+ }
121
+ },
122
+ defaultVariants: { appearance: "default", size: "md" }
123
+ });
124
+
125
+ // src/ui/table/table.tsx
126
+ import { jsx } from "react/jsx-runtime";
127
+ var TableContext = createContext(null);
128
+ function useTableContext(component) {
129
+ const ctx = useContext(TableContext);
130
+ if (!ctx) {
131
+ throw new Error(`${component} must be used within <Table>`);
132
+ }
133
+ return ctx;
134
+ }
135
+ function Table(props) {
136
+ const {
137
+ className,
138
+ appearance = "default",
139
+ size = "md",
140
+ textAlign = "left",
141
+ stickyHeader = false,
142
+ rowAnimation = "none",
143
+ children,
144
+ ref,
145
+ ...rest
146
+ } = props;
147
+ const ctx = useMemo(
148
+ () => ({
149
+ appearance: appearance ?? "default",
150
+ size: size ?? "md",
151
+ stickyHeader: Boolean(stickyHeader),
152
+ rowAnimation,
153
+ textAlign
154
+ }),
155
+ [appearance, rowAnimation, size, stickyHeader, textAlign]
156
+ );
157
+ return /* @__PURE__ */ jsx(TableContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx("div", { "data-slot": "table-scroll", className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx(
158
+ "table",
159
+ {
160
+ ref,
161
+ "data-slot": "table",
162
+ role: "table",
163
+ className: cn(
164
+ tableVariants({ appearance, size, stickyHeader }),
165
+ "w-full min-w-0 table",
166
+ className
167
+ ),
168
+ ...rest,
169
+ children
170
+ }
171
+ ) }) });
172
+ }
173
+ Table.displayName = "Table";
174
+ function TableHeader({ className, children }) {
175
+ const { stickyHeader } = useTableContext("TableHeader");
176
+ const stickyClass = stickyHeader ? "sticky top-0 z-10 bg-slate-950/95 backdrop-blur" : "";
177
+ return /* @__PURE__ */ jsx("thead", { "data-slot": "table-header", className: cn(stickyClass, className), children });
178
+ }
179
+ TableHeader.displayName = "TableHeader";
180
+ function TableBody({ className, children }) {
181
+ return /* @__PURE__ */ jsx("tbody", { "data-slot": "table-body", className: cn(className), children });
182
+ }
183
+ TableBody.displayName = "TableBody";
184
+ function TableFooter({ className, children }) {
185
+ return /* @__PURE__ */ jsx(
186
+ "tfoot",
187
+ {
188
+ "data-slot": "table-footer",
189
+ className: cn(
190
+ "border-t border-white/10 bg-white/3 font-medium",
191
+ className
192
+ ),
193
+ children
194
+ }
195
+ );
196
+ }
197
+ TableFooter.displayName = "TableFooter";
198
+ function TableRow({
199
+ className,
200
+ children,
201
+ ref,
202
+ ...rest
203
+ }) {
204
+ const { appearance, rowAnimation } = useTableContext("TableRow");
205
+ const motionProps = tableAnimationPresets[rowAnimation];
206
+ return /* @__PURE__ */ jsx(
207
+ motion.tr,
208
+ {
209
+ ref,
210
+ "data-slot": "table-row",
211
+ className: cn(tableRowVariants({ appearance }), className),
212
+ initial: false,
213
+ ...motionProps,
214
+ ...rest,
215
+ children
216
+ }
217
+ );
218
+ }
219
+ TableRow.displayName = "TableRow";
220
+ function TableHead({
221
+ className,
222
+ children,
223
+ scope = "col",
224
+ sortDirection,
225
+ ref,
226
+ ...rest
227
+ }) {
228
+ const { appearance, size, textAlign } = useTableContext("TableHead");
229
+ return /* @__PURE__ */ jsx(
230
+ "th",
231
+ {
232
+ ref,
233
+ "data-slot": "table-head",
234
+ scope,
235
+ "aria-sort": sortDirection,
236
+ className: cn(
237
+ tableCellVariants({ appearance, size, textAlign }),
238
+ className
239
+ ),
240
+ ...rest,
241
+ children
242
+ }
243
+ );
244
+ }
245
+ TableHead.displayName = "TableHead";
246
+ function TableCell({
247
+ className,
248
+ children,
249
+ ref,
250
+ ...rest
251
+ }) {
252
+ const { appearance, size, textAlign } = useTableContext("TableCell");
253
+ return /* @__PURE__ */ jsx(
254
+ "td",
255
+ {
256
+ ref,
257
+ "data-slot": "table-cell",
258
+ className: cn(
259
+ tableCellVariants({ appearance, size, textAlign }),
260
+ className
261
+ ),
262
+ ...rest,
263
+ children
264
+ }
265
+ );
266
+ }
267
+ TableCell.displayName = "TableCell";
268
+ function TableCaption({ className, children }) {
269
+ return /* @__PURE__ */ jsx(
270
+ "caption",
271
+ {
272
+ "data-slot": "table-caption",
273
+ className: cn("mt-3 text-left text-xs text-slate-500", className),
274
+ children
275
+ }
276
+ );
277
+ }
278
+ TableCaption.displayName = "TableCaption";
279
+ export {
280
+ Table,
281
+ TableBody,
282
+ TableCaption,
283
+ TableCell,
284
+ TableFooter,
285
+ TableHead,
286
+ TableHeader,
287
+ TableRow,
288
+ tableAnimationPresets,
289
+ tableCellVariants,
290
+ tableRowVariants,
291
+ tableVariants
292
+ };
293
+ //# sourceMappingURL=table.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/ui/table/table.tsx","../../src/lib/utils.ts","../../src/ui/table/animations.ts","../../src/ui/table/variants.ts"],"sourcesContent":["\"use client\";\n\nimport { createContext, useContext, useMemo } from \"react\";\nimport { motion } from \"framer-motion\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport { tableAnimationPresets } from \"./animations\";\nimport type {\n TableCellProps,\n TableHeadCellProps,\n TableProps,\n TableSectionProps,\n} from \"./types\";\nimport { tableCellVariants, tableRowVariants, tableVariants } from \"./variants\";\n\ntype TableCtx = {\n appearance: NonNullable<TableProps[\"appearance\"]>;\n size: NonNullable<TableProps[\"size\"]>;\n stickyHeader: boolean;\n rowAnimation: NonNullable<TableProps[\"rowAnimation\"]>;\n textAlign: NonNullable<TableCellProps[\"textAlign\"]>;\n};\n\nconst TableContext = createContext<TableCtx | null>(null);\n\nfunction useTableContext(component: string): TableCtx {\n const ctx = useContext(TableContext);\n if (!ctx) {\n throw new Error(`${component} must be used within <Table>`);\n }\n return ctx;\n}\n\nexport function Table(props: TableProps) {\n const {\n className,\n appearance = \"default\",\n size = \"md\",\n textAlign = \"left\",\n stickyHeader = false,\n rowAnimation = \"none\",\n children,\n ref,\n ...rest\n } = props;\n const ctx = useMemo(\n () => ({\n appearance: appearance ?? \"default\",\n size: size ?? \"md\",\n stickyHeader: Boolean(stickyHeader),\n rowAnimation,\n textAlign,\n }),\n [appearance, rowAnimation, size, stickyHeader, textAlign],\n );\n\n return (\n <TableContext.Provider value={ctx}>\n <div data-slot=\"table-scroll\" className=\"relative w-full overflow-auto\">\n <table\n ref={ref}\n data-slot=\"table\"\n role=\"table\"\n className={cn(\n tableVariants({ appearance, size, stickyHeader }),\n \"w-full min-w-0 table\",\n className,\n )}\n {...rest}\n >\n {children}\n </table>\n </div>\n </TableContext.Provider>\n );\n}\n\nTable.displayName = \"Table\";\n\nexport function TableHeader({ className, children }: TableSectionProps) {\n const { stickyHeader } = useTableContext(\"TableHeader\");\n const stickyClass = stickyHeader ? \"sticky top-0 z-10 bg-slate-950/95 backdrop-blur\" : \"\";\n return (\n <thead data-slot=\"table-header\" className={cn(stickyClass, className)}>\n {children}\n </thead>\n );\n}\n\nTableHeader.displayName = \"TableHeader\";\n\nexport function TableBody({ className, children }: TableSectionProps) {\n return (\n <tbody data-slot=\"table-body\" className={cn(className)}>\n {children}\n </tbody>\n );\n}\n\nTableBody.displayName = \"TableBody\";\n\nexport function TableFooter({ className, children }: TableSectionProps) {\n return (\n <tfoot\n data-slot=\"table-footer\"\n className={cn(\n \"border-t border-white/10 bg-white/3 font-medium\",\n className,\n )}\n >\n {children}\n </tfoot>\n );\n}\n\nTableFooter.displayName = \"TableFooter\";\n\nexport function TableRow({\n className,\n children,\n ref,\n ...rest\n}: TableSectionProps & { ref?: React.Ref<HTMLTableRowElement> }) {\n const { appearance, rowAnimation } = useTableContext(\"TableRow\");\n const motionProps = tableAnimationPresets[rowAnimation];\n\n return (\n <motion.tr\n ref={ref}\n data-slot=\"table-row\"\n className={cn(tableRowVariants({ appearance }), className)}\n initial={false}\n {...motionProps}\n {...rest}\n >\n {children}\n </motion.tr>\n );\n}\n\nTableRow.displayName = \"TableRow\";\n\nexport function TableHead({\n className,\n children,\n scope = \"col\",\n sortDirection,\n ref,\n ...rest\n}: TableHeadCellProps) {\n const { appearance, size, textAlign } = useTableContext(\"TableHead\");\n return (\n <th\n ref={ref}\n data-slot=\"table-head\"\n scope={scope}\n aria-sort={sortDirection}\n className={cn(\n tableCellVariants({ appearance, size, textAlign }),\n className,\n )}\n {...rest}\n >\n {children}\n </th>\n );\n}\n\nTableHead.displayName = \"TableHead\";\n\nexport function TableCell({\n className,\n children,\n ref,\n ...rest\n}: TableCellProps) {\n const { appearance, size, textAlign } = useTableContext(\"TableCell\");\n return (\n <td\n ref={ref}\n data-slot=\"table-cell\"\n className={cn(\n tableCellVariants({ appearance, size, textAlign }),\n className,\n )}\n {...rest}\n >\n {children}\n </td>\n );\n}\n\nTableCell.displayName = \"TableCell\";\n\nexport function TableCaption({ className, children }: TableSectionProps) {\n return (\n <caption\n data-slot=\"table-caption\"\n className={cn(\"mt-3 text-left text-xs text-slate-500\", className)}\n >\n {children}\n </caption>\n );\n}\n\nTableCaption.displayName = \"TableCaption\";\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}","import type { HTMLMotionProps } from \"framer-motion\";\n\nimport type { TableAnimation } from \"./types\";\n\ntype TablePresetMotionProps = Pick<HTMLMotionProps<\"tr\">, \"whileHover\" | \"transition\">;\n\nexport type TableAnimationPresets = Record<TableAnimation, TablePresetMotionProps>;\n\nexport const tableAnimationPresets: TableAnimationPresets = {\n none: {},\n hover: {\n whileHover: { backgroundColor: \"rgba(255,255,255,0.05)\" },\n transition: { duration: 0.15 },\n },\n};\n","import { cva } from \"class-variance-authority\";\n\nexport const tableVariants = cva(\n \"w-full table-auto border-collapse caption-bottom text-sm text-slate-200 md:table-fixed\",\n {\n variants: {\n appearance: {\n default: \"\",\n striped: \"\",\n bordered: \"border border-white/10\",\n ghost: \"\",\n sky:'border border-sky-600',\n rose:'border border-rose-600',\n purple:'border border-purple-600',\n pink:'border border-pink-600',\n orange:'border border-orange-600',\n yellow:'border border-yellow-600',\n teal:'border border-teal-600',\n indigo:'border border-indigo-600',\n emerald:'border border-emerald-600',\n gray:'border border-gray-600',\n amber:'border border-amber-600',\n violet:'border border-violet-600',\n },\n size: {\n sm: \"text-xs\",\n md: \"text-sm\",\n lg: \"text-base\",\n },\n stickyHeader: {\n true: \"\",\n false: \"\",\n },\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n stickyHeader: false,\n },\n },\n);\n\nexport const tableRowVariants = cva(\n \"border-b border-white/5 transition-colors data-[state=selected]:bg-white/[0.06]\",\n {\n variants: {\n appearance: {\n default: \"\",\n striped: \"odd:bg-white/[0.03]\",\n bordered: \"\",\n ghost: \"border-transparent hover:bg-white/[0.03]\",\n sky:'border-sky-600 hover:bg-sky-600',\n rose:'border-rose-600 hover:bg-rose-900',\n purple:'border-purple-600 hover:bg-purple-900',\n pink:'border-pink-600 hover:bg-pink-900',\n orange:'border-orange-600 hover:bg-orange-900',\n yellow:'border-yellow-600 hover:bg-yellow-900',\n teal:'border-teal-600 hover:bg-teal-900',\n indigo:'border-indigo-600 hover:bg-indigo-900',\n emerald:'border-emerald-600 hover:bg-emerald-900',\n gray:'border-gray-600 hover:bg-gray-900',\n amber:'border-amber-600 hover:bg-amber-900',\n violet:'border-violet-600 hover:bg-violet-900',\n },\n },\n defaultVariants: { appearance: \"default\" },\n },\n);\n\nexport const tableCellVariants = cva(\"min-w-0 border p-3 align-middle break-words\", {\n variants: {\n appearance: {\n default: \"border-white/10\",\n striped: \"border-white/10\",\n bordered: \"border-white/10\",\n ghost: \"border-white/10\",\n sky: \"border-sky-600\",\n rose: \"border-rose-600\",\n purple: \"border-purple-600\",\n pink: \"border-pink-600\",\n orange: \"border-orange-600\",\n yellow: \"border-yellow-600\",\n teal: \"border-teal-600\",\n indigo: \"border-indigo-600\",\n emerald: \"border-emerald-600\",\n gray: \"border-gray-600\",\n amber: \"border-amber-600\",\n violet: \"border-violet-600\",\n },\n size: {\n sm: \"p-2\",\n md: \"p-3\",\n lg: \"p-4\",\n },\n textAlign: {\n left: \"text-left\",\n center: \"text-center\",\n right: \"text-right\",\n },\n },\n defaultVariants: { appearance: \"default\", size: \"md\" },\n});\n"],"mappings":"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","names":[]}
@@ -0,0 +1,300 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/ui/tabs/index.ts
21
+ var tabs_exports = {};
22
+ __export(tabs_exports, {
23
+ Tabs: () => Tabs,
24
+ TabsContent: () => TabsContent,
25
+ TabsList: () => TabsList,
26
+ TabsTrigger: () => TabsTrigger,
27
+ getTabsContentMotionProps: () => getTabsContentMotionProps,
28
+ tabsContentAnimationPresets: () => tabsContentAnimationPresets,
29
+ tabsListVariants: () => tabsListVariants,
30
+ tabsTriggerVariants: () => tabsTriggerVariants
31
+ });
32
+ module.exports = __toCommonJS(tabs_exports);
33
+
34
+ // src/ui/tabs/tabs.tsx
35
+ var import_framer_motion = require("framer-motion");
36
+ var import_react = require("react");
37
+
38
+ // src/lib/utils.ts
39
+ var import_clsx = require("clsx");
40
+ var import_tailwind_merge = require("tailwind-merge");
41
+ function cn(...inputs) {
42
+ return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
43
+ }
44
+
45
+ // src/ui/tabs/animations.ts
46
+ var easeOutExpo = [0.16, 1, 0.3, 1];
47
+ var tabsContentAnimationPresets = {
48
+ none: {},
49
+ fade: {
50
+ initial: { opacity: 0, y: 6 },
51
+ animate: { opacity: 1, y: 0 },
52
+ transition: { duration: 0.2, ease: easeOutExpo }
53
+ },
54
+ slide: {
55
+ initial: { opacity: 0, y: 8 },
56
+ animate: { opacity: 1, y: 0 },
57
+ transition: {
58
+ type: "spring",
59
+ stiffness: 420,
60
+ damping: 34,
61
+ mass: 0.82
62
+ }
63
+ }
64
+ };
65
+ function getTabsContentMotionProps(animation, orientation, reducedMotion) {
66
+ if (reducedMotion || animation === "none") {
67
+ return {};
68
+ }
69
+ if (animation === "fade") {
70
+ return tabsContentAnimationPresets.fade;
71
+ }
72
+ if (animation === "slide") {
73
+ const offset = 12;
74
+ return {
75
+ initial: orientation === "horizontal" ? { opacity: 0, x: offset, y: 0 } : { opacity: 0, x: 0, y: offset },
76
+ animate: { opacity: 1, x: 0, y: 0 },
77
+ transition: { duration: 0.22, ease: easeOutExpo }
78
+ };
79
+ }
80
+ return {};
81
+ }
82
+
83
+ // src/ui/tabs/variants.ts
84
+ var import_class_variance_authority = require("class-variance-authority");
85
+ var tabsListVariants = (0, import_class_variance_authority.cva)(
86
+ "flex items-center gap-1",
87
+ {
88
+ variants: {
89
+ variant: {
90
+ default: "bg-transparent",
91
+ underline: "border-b-2 border-transparent",
92
+ pills: "rounded-md"
93
+ },
94
+ size: {
95
+ sm: "text-sm p-1",
96
+ md: "text-base p-1.5",
97
+ lg: "text-lg p-2"
98
+ },
99
+ orientation: {
100
+ horizontal: "flex-row",
101
+ vertical: "flex-col"
102
+ }
103
+ },
104
+ defaultVariants: {
105
+ size: "md",
106
+ orientation: "horizontal"
107
+ }
108
+ }
109
+ );
110
+ var tabsTriggerVariants = (0, import_class_variance_authority.cva)(
111
+ "px-3 py-1.5 rounded-md transition-all focus:outline-none focus:ring-2 focus:ring-ring",
112
+ {
113
+ variants: {
114
+ appearance: {
115
+ default: "bg-transparent",
116
+ sky: "bg-sky-500/75",
117
+ rose: "bg-rose-500/75",
118
+ purple: "bg-purple-500/75",
119
+ pink: "bg-pink-500/75",
120
+ orange: "bg-orange-500/75",
121
+ yellow: "bg-yellow-500/75",
122
+ teal: "bg-teal-500/75",
123
+ indigo: "bg-indigo-500/75",
124
+ emerald: "bg-emerald-500/75",
125
+ gray: "bg-gray-500/75",
126
+ "gradient-blue": "bg-gradient-to-r from-blue-600 to-purple-600",
127
+ "gradient-green": "bg-gradient-to-r from-green-600 to-lime-600",
128
+ "gradient-red": "bg-gradient-to-r from-red-600 to-pink-600",
129
+ "gradient-yellow": "bg-gradient-to-r from-yellow-600 to-orange-600",
130
+ "gradient-purple": "bg-gradient-to-r from-purple-600 to-pink-600",
131
+ "gradient-teal": "bg-gradient-to-r from-teal-600 to-cyan-600",
132
+ "gradient-indigo": "bg-gradient-to-r from-indigo-600 to-purple-600",
133
+ "gradient-pink": "bg-gradient-to-r from-pink-600 to-rose-600",
134
+ "gradient-orange": "bg-gradient-to-r from-orange-600 to-red-600"
135
+ },
136
+ variant: {
137
+ default: "data-[state=active]:bg-background",
138
+ underline: "border-b-2 border-transparent data-[state=active]:border-primary rounded-none",
139
+ pills: "data-[state=active]:bg-primary data-[state=active]:text-white"
140
+ },
141
+ size: {
142
+ sm: "px-2 py-1",
143
+ md: "px-3 py-1.5",
144
+ lg: "px-4 py-2"
145
+ }
146
+ },
147
+ defaultVariants: {
148
+ appearance: "default",
149
+ variant: "default",
150
+ size: "md"
151
+ }
152
+ }
153
+ );
154
+
155
+ // src/ui/tabs/tabs.tsx
156
+ var import_jsx_runtime = require("react/jsx-runtime");
157
+ var TabsContext = (0, import_react.createContext)(null);
158
+ var useTabs = () => {
159
+ const ctx = (0, import_react.useContext)(TabsContext);
160
+ if (!ctx) throw new Error("Tabs components must be used within Tabs");
161
+ return ctx;
162
+ };
163
+ function Tabs({
164
+ value,
165
+ defaultValue,
166
+ onValueChange,
167
+ orientation = "horizontal",
168
+ children,
169
+ className
170
+ }) {
171
+ const [internalValue, setInternalValue] = (0, import_react.useState)(defaultValue);
172
+ const idPrefix = (0, import_react.useId)();
173
+ const isControlled = value !== void 0;
174
+ const currentValue = isControlled ? value : internalValue;
175
+ const setValue = (val) => {
176
+ if (!isControlled) setInternalValue(val);
177
+ onValueChange?.(val);
178
+ };
179
+ const tabTriggerId = (tabValue) => `${idPrefix}zentauri-tab-${tabValue}`;
180
+ const tabPanelId = (tabValue) => `${idPrefix}zentauri-panel-${tabValue}`;
181
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
182
+ TabsContext.Provider,
183
+ {
184
+ value: {
185
+ value: currentValue,
186
+ setValue,
187
+ orientation,
188
+ tabTriggerId,
189
+ tabPanelId
190
+ },
191
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { "data-slot": "tabs", className: cn("w-full", className), children })
192
+ }
193
+ );
194
+ }
195
+ function TabsList({
196
+ children,
197
+ className,
198
+ ...props
199
+ }) {
200
+ const { orientation, size } = useTabs();
201
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
202
+ "div",
203
+ {
204
+ role: "tablist",
205
+ "aria-orientation": orientation,
206
+ className: cn(tabsListVariants({ orientation, size }), className),
207
+ ...props,
208
+ children
209
+ }
210
+ );
211
+ }
212
+ function TabsTrigger({
213
+ value,
214
+ children,
215
+ disabled,
216
+ className,
217
+ ...props
218
+ }) {
219
+ const { value: activeValue, setValue, tabTriggerId, tabPanelId, size, appearance, variant } = useTabs();
220
+ const isActive = activeValue === value;
221
+ const handleKeyDown = (e) => {
222
+ const triggers = Array.from(
223
+ document.querySelectorAll('[role="tab"]')
224
+ );
225
+ const index = triggers.findIndex((el) => el === e.currentTarget);
226
+ if (e.key === "ArrowRight" || e.key === "ArrowDown") {
227
+ e.preventDefault();
228
+ triggers[index + 1]?.focus();
229
+ }
230
+ if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
231
+ e.preventDefault();
232
+ triggers[index - 1]?.focus();
233
+ }
234
+ if (e.key === "Home") {
235
+ e.preventDefault();
236
+ triggers[0]?.focus();
237
+ }
238
+ if (e.key === "End") {
239
+ e.preventDefault();
240
+ triggers[triggers.length - 1]?.focus();
241
+ }
242
+ };
243
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
244
+ "button",
245
+ {
246
+ id: tabTriggerId(value),
247
+ type: "button",
248
+ role: "tab",
249
+ "data-state": isActive ? "active" : "inactive",
250
+ "aria-selected": isActive,
251
+ "aria-controls": tabPanelId(value),
252
+ disabled,
253
+ onClick: () => setValue(value),
254
+ onKeyDown: handleKeyDown,
255
+ className: cn(tabsTriggerVariants({ size, appearance, variant }), className, "cursor-pointer"),
256
+ ...props,
257
+ children
258
+ }
259
+ );
260
+ }
261
+ function TabsContent({
262
+ value,
263
+ children,
264
+ className,
265
+ animation = "fade",
266
+ ...props
267
+ }) {
268
+ const { value: activeValue, orientation, tabTriggerId, tabPanelId } = useTabs();
269
+ const prefersReducedMotion = (0, import_framer_motion.useReducedMotion)();
270
+ if (activeValue !== value) return null;
271
+ const motionProps = getTabsContentMotionProps(
272
+ animation,
273
+ orientation,
274
+ Boolean(prefersReducedMotion)
275
+ );
276
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
277
+ import_framer_motion.motion.div,
278
+ {
279
+ id: tabPanelId(value),
280
+ role: "tabpanel",
281
+ "aria-labelledby": tabTriggerId(value),
282
+ ...props,
283
+ ...motionProps,
284
+ className: cn("mt-2", className),
285
+ children
286
+ }
287
+ );
288
+ }
289
+ // Annotate the CommonJS export names for ESM import in node:
290
+ 0 && (module.exports = {
291
+ Tabs,
292
+ TabsContent,
293
+ TabsList,
294
+ TabsTrigger,
295
+ getTabsContentMotionProps,
296
+ tabsContentAnimationPresets,
297
+ tabsListVariants,
298
+ tabsTriggerVariants
299
+ });
300
+ //# sourceMappingURL=tabs.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/ui/tabs/index.ts","../../src/ui/tabs/tabs.tsx","../../src/lib/utils.ts","../../src/ui/tabs/animations.ts","../../src/ui/tabs/variants.ts"],"sourcesContent":["export { Tabs, TabsContent, TabsList, TabsTrigger } from \"./tabs\";\nexport type {\n TabsContentProps,\n TabsListProps,\n TabsProps,\n TabsTriggerProps,\n} from \"./types\";\nexport {\n getTabsContentMotionProps,\n tabsContentAnimationPresets,\n} from \"./animations\";\nexport type { TabsAnimation } from \"./animations\";\nexport { tabsListVariants, tabsTriggerVariants } from \"./variants\";\n","\"use client\"\n\nimport { motion, useReducedMotion } from \"framer-motion\"\nimport {\n createContext,\n KeyboardEvent,\n useContext,\n useId,\n useState,\n} from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nimport { getTabsContentMotionProps } from \"./animations\"\nimport {\n TabsContentProps,\n TabsListProps,\n TabsProps,\n TabsTriggerProps,\n TabsValue,\n TabsContextType,\n} from \"./types\"\nimport { tabsListVariants, tabsTriggerVariants } from \"./variants\"\n\n\nexport const TabsContext = createContext<TabsContextType | null>(null)\n\nexport const useTabs = () => {\n const ctx = useContext(TabsContext)\n if (!ctx) throw new Error(\"Tabs components must be used within Tabs\")\n return ctx\n}\n\nexport function Tabs({\n value,\n defaultValue,\n onValueChange,\n orientation = \"horizontal\",\n children,\n className,\n}: TabsProps) {\n const [internalValue, setInternalValue] = useState(defaultValue)\n const idPrefix = useId()\n\n const isControlled = value !== undefined\n const currentValue = isControlled ? value : internalValue\n\n const setValue = (val: string) => {\n if (!isControlled) setInternalValue(val)\n onValueChange?.(val)\n }\n\n const tabTriggerId = (tabValue: TabsValue) =>\n `${idPrefix}zentauri-tab-${tabValue}`\n const tabPanelId = (tabValue: TabsValue) =>\n `${idPrefix}zentauri-panel-${tabValue}`\n\n return (\n <TabsContext.Provider\n value={{\n value: currentValue,\n setValue,\n orientation,\n tabTriggerId,\n tabPanelId,\n }}\n >\n <div data-slot=\"tabs\" className={cn(\"w-full\", className)}>\n {children}\n </div>\n </TabsContext.Provider>\n )\n}\n\nexport function TabsList({\n children,\n className,\n ...props\n}: TabsListProps) {\n const { orientation, size } = useTabs()\n\n return (\n <div\n role=\"tablist\"\n aria-orientation={orientation}\n className={cn(tabsListVariants({ orientation, size }), className)}\n {...props}\n >\n {children}\n </div>\n )\n}\n\nexport function TabsTrigger({\n value,\n children,\n disabled,\n className,\n ...props\n}: TabsTriggerProps) {\n const { value: activeValue, setValue, tabTriggerId, tabPanelId, size, appearance, variant } = useTabs()\n\n const isActive = activeValue === value\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n const triggers = Array.from(\n document.querySelectorAll('[role=\"tab\"]'),\n ) as HTMLElement[]\n\n const index = triggers.findIndex((el) => el === e.currentTarget)\n\n if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n e.preventDefault()\n triggers[index + 1]?.focus()\n }\n\n if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n e.preventDefault()\n triggers[index - 1]?.focus()\n }\n\n if (e.key === \"Home\") {\n e.preventDefault()\n triggers[0]?.focus()\n }\n\n if (e.key === \"End\") {\n e.preventDefault()\n triggers[triggers.length - 1]?.focus()\n }\n }\n\n return (\n <button\n id={tabTriggerId(value)}\n type=\"button\"\n role=\"tab\"\n data-state={isActive ? \"active\" : \"inactive\"}\n aria-selected={isActive}\n aria-controls={tabPanelId(value)}\n disabled={disabled}\n onClick={() => setValue(value)}\n onKeyDown={handleKeyDown}\n className={cn(tabsTriggerVariants({ size, appearance, variant }), className, \"cursor-pointer\")}\n {...props}\n >\n {children}\n </button>\n )\n}\n\nexport function TabsContent({\n value,\n children,\n className,\n animation = \"fade\",\n ...props\n}: TabsContentProps) {\n const { value: activeValue, orientation, tabTriggerId, tabPanelId } =\n useTabs()\n const prefersReducedMotion = useReducedMotion()\n\n if (activeValue !== value) return null\n\n const motionProps = getTabsContentMotionProps(\n animation,\n orientation,\n Boolean(prefersReducedMotion),\n )\n\n return (\n <motion.div\n id={tabPanelId(value)}\n role=\"tabpanel\"\n aria-labelledby={tabTriggerId(value)}\n {...props}\n {...motionProps}\n className={cn(\"mt-2\", className)}\n >\n {children}\n </motion.div>\n )\n}\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}","import type { HTMLMotionProps } from \"framer-motion\";\n\nexport type TabsAnimation = \"none\" | \"fade\" | \"slide\";\n\ntype TabsPresetMotionProps = Pick<\n HTMLMotionProps<\"div\">,\n \"initial\" | \"animate\" | \"transition\"\n>;\n\nexport type TabsAnimationPresets = Record<TabsAnimation, TabsPresetMotionProps>;\n\ntype TabsOrientation = \"horizontal\" | \"vertical\";\n\nconst easeOutExpo: [number, number, number, number] = [0.16, 1, 0.3, 1];\n\nexport const tabsContentAnimationPresets: TabsAnimationPresets = {\n none: {},\n fade: {\n initial: { opacity: 0, y: 6 },\n animate: { opacity: 1, y: 0 },\n transition: { duration: 0.2, ease: easeOutExpo },\n },\n slide: {\n initial: { opacity: 0, y: 8 },\n animate: { opacity: 1, y: 0 },\n transition: {\n type: \"spring\",\n stiffness: 420,\n damping: 34,\n mass: 0.82,\n },\n },\n};\n\nexport function getTabsContentMotionProps(\n animation: TabsAnimation,\n orientation: TabsOrientation,\n reducedMotion: boolean,\n): TabsPresetMotionProps {\n if (reducedMotion || animation === \"none\") {\n return {};\n }\n if (animation === \"fade\") {\n return tabsContentAnimationPresets.fade;\n }\n if (animation === \"slide\") {\n const offset = 12;\n return {\n initial:\n orientation === \"horizontal\"\n ? { opacity: 0, x: offset, y: 0 }\n : { opacity: 0, x: 0, y: offset },\n animate: { opacity: 1, x: 0, y: 0 },\n transition: { duration: 0.22, ease: easeOutExpo },\n };\n }\n return {};\n}\n","import { cva } from \"class-variance-authority\"\n\nexport const tabsListVariants = cva(\n \"flex items-center gap-1\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n underline: \"border-b-2 border-transparent\",\n pills: \"rounded-md\",\n },\n size: {\n sm: \"text-sm p-1\",\n md: \"text-base p-1.5\",\n lg: \"text-lg p-2\",\n },\n orientation: {\n horizontal: \"flex-row\",\n vertical: \"flex-col\",\n },\n },\n defaultVariants: {\n size: \"md\",\n orientation: \"horizontal\",\n },\n }\n)\n\nexport const tabsTriggerVariants = cva(\n \"px-3 py-1.5 rounded-md transition-all focus:outline-none focus:ring-2 focus:ring-ring\",\n {\n variants: {\n appearance: {\n default: \"bg-transparent\",\n sky: \"bg-sky-500/75\",\n rose: \"bg-rose-500/75\",\n purple: \"bg-purple-500/75\",\n pink: \"bg-pink-500/75\",\n orange: \"bg-orange-500/75\",\n yellow: \"bg-yellow-500/75\",\n teal: \"bg-teal-500/75\",\n indigo: \"bg-indigo-500/75\",\n emerald: \"bg-emerald-500/75\",\n gray: \"bg-gray-500/75\",\n \"gradient-blue\": \"bg-gradient-to-r from-blue-600 to-purple-600\",\n \"gradient-green\": \"bg-gradient-to-r from-green-600 to-lime-600\",\n \"gradient-red\": \"bg-gradient-to-r from-red-600 to-pink-600\",\n \"gradient-yellow\": \"bg-gradient-to-r from-yellow-600 to-orange-600\",\n \"gradient-purple\": \"bg-gradient-to-r from-purple-600 to-pink-600\",\n \"gradient-teal\": \"bg-gradient-to-r from-teal-600 to-cyan-600\",\n \"gradient-indigo\": \"bg-gradient-to-r from-indigo-600 to-purple-600\",\n \"gradient-pink\": \"bg-gradient-to-r from-pink-600 to-rose-600\",\n \"gradient-orange\": \"bg-gradient-to-r from-orange-600 to-red-600\",\n },\n variant: {\n default: \"data-[state=active]:bg-background\",\n underline:\n \"border-b-2 border-transparent data-[state=active]:border-primary rounded-none\",\n pills:\n \"data-[state=active]:bg-primary data-[state=active]:text-white\",\n },\n size: {\n sm: \"px-2 py-1\",\n md: \"px-3 py-1.5\",\n lg: \"px-4 py-2\",\n },\n },\n defaultVariants: {\n appearance: \"default\",\n variant: \"default\",\n size: \"md\",\n },\n }\n)"],"mappings":"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","names":[]}