@kopexa/theme 1.4.3 → 1.5.0

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.
@@ -0,0 +1,324 @@
1
+ import {
2
+ colorVariants
3
+ } from "./chunk-67PPUTSS.mjs";
4
+
5
+ // src/components/chip.ts
6
+ import { tv } from "tailwind-variants";
7
+ var chip = tv({
8
+ slots: {
9
+ root: [
10
+ "relative",
11
+ "max-w-fit",
12
+ "min-w-min",
13
+ "inline-flex",
14
+ "items-center",
15
+ "justify-between",
16
+ "box-border",
17
+ "whitespace-nowrap",
18
+ "isolate"
19
+ ],
20
+ content: "flex-1 text-inherit font-normal",
21
+ indicator: "relative flex size-2 ml-1",
22
+ indicatorPulse: "absolute inline-flex h-full w-full animate-ping rounded-full opacity-75",
23
+ indicatorDot: "relative inline-flex size-2 rounded-full",
24
+ status: "flex items-center gap-2 border-r pr-1 font-medium ml-1",
25
+ closeButton: [
26
+ "z-10 appearance-none outline-none select-none transition-opacity",
27
+ "opacity-70 hover:opacity-100 cursor-pointer active:opacity-50"
28
+ ]
29
+ },
30
+ variants: {
31
+ variant: {
32
+ solid: {},
33
+ bordered: {
34
+ root: "border-2 bg-transparent"
35
+ },
36
+ faded: {
37
+ root: "border-2"
38
+ },
39
+ flat: {}
40
+ },
41
+ color: {
42
+ default: {
43
+ status: "border-default-200 dark:border-default-700"
44
+ },
45
+ primary: {
46
+ status: "border-primary-200 dark:border-primary-700"
47
+ },
48
+ secondary: {
49
+ status: "border-secondary-200 dark:border-secondary-700"
50
+ },
51
+ success: {
52
+ status: "border-success-200 dark:border-success-700"
53
+ },
54
+ destructive: {
55
+ status: "border-destructive-200 dark:border-destructive-700"
56
+ },
57
+ warning: {
58
+ status: "border-warning-200 dark:border-warning-700"
59
+ }
60
+ },
61
+ indicatorColor: {
62
+ default: {
63
+ indicatorDot: "bg-accent"
64
+ },
65
+ primary: {
66
+ indicatorDot: "bg-primary"
67
+ },
68
+ secondary: {
69
+ indicatorDot: "bg-secondary"
70
+ },
71
+ success: {
72
+ indicatorDot: "bg-success"
73
+ },
74
+ warning: {
75
+ indicatorDot: "bg-warning"
76
+ },
77
+ destructive: {
78
+ indicatorDot: "bg-destructive"
79
+ },
80
+ info: {
81
+ indicatorDot: "bg-info"
82
+ }
83
+ },
84
+ indicator: {
85
+ true: {},
86
+ false: {}
87
+ },
88
+ indicatorVariant: {
89
+ pulse: {}
90
+ },
91
+ size: {
92
+ sm: {
93
+ root: "px-1 h-6 text-[11px] [&_svg]:size-3",
94
+ status: "text-[11px]",
95
+ content: "px-1",
96
+ closeButton: ["[&_svg]:size-3", "px-1"]
97
+ },
98
+ md: {
99
+ root: "px-1 h-7 text-sm [&_svg]:size-4",
100
+ status: "text-sm",
101
+ content: "px-2",
102
+ closeButton: ["[&_svg]:size-4", "px-2"]
103
+ },
104
+ lg: {
105
+ root: "px-2 h-8 text-md [&_svg]:size-5",
106
+ status: "text-md",
107
+ content: "px-2",
108
+ closeButton: ["[&_svg]:size-5", "px-2"]
109
+ }
110
+ },
111
+ isCloseable: {
112
+ true: {},
113
+ false: {}
114
+ },
115
+ radius: {
116
+ none: {
117
+ root: "rounded-none"
118
+ },
119
+ sm: {
120
+ root: "rounded-sm"
121
+ },
122
+ md: {
123
+ root: "rounded-md"
124
+ },
125
+ lg: {
126
+ root: "rounded-lg"
127
+ },
128
+ full: {
129
+ root: "rounded-full"
130
+ }
131
+ },
132
+ disabled: {
133
+ true: {
134
+ root: "opacity-50 pointer-events-none"
135
+ },
136
+ false: {}
137
+ }
138
+ },
139
+ defaultVariants: {
140
+ color: "default",
141
+ variant: "solid",
142
+ size: "sm",
143
+ radius: "full",
144
+ indicatorVariant: "pulse",
145
+ indicatorColor: "success"
146
+ },
147
+ compoundVariants: [
148
+ // solid / color
149
+ {
150
+ variant: "solid",
151
+ color: "default",
152
+ class: {
153
+ root: colorVariants.solid.default
154
+ }
155
+ },
156
+ {
157
+ variant: "solid",
158
+ color: "primary",
159
+ class: {
160
+ root: colorVariants.solid.primary
161
+ }
162
+ },
163
+ {
164
+ variant: "solid",
165
+ color: "secondary",
166
+ class: {
167
+ root: colorVariants.solid.secondary
168
+ }
169
+ },
170
+ {
171
+ variant: "solid",
172
+ color: "success",
173
+ class: {
174
+ root: colorVariants.solid.success
175
+ }
176
+ },
177
+ {
178
+ variant: "solid",
179
+ color: "warning",
180
+ class: {
181
+ root: colorVariants.solid.warning
182
+ }
183
+ },
184
+ {
185
+ variant: "solid",
186
+ color: "destructive",
187
+ class: {
188
+ root: colorVariants.solid.destructive
189
+ }
190
+ },
191
+ // bordered / color
192
+ {
193
+ variant: "bordered",
194
+ color: "default",
195
+ class: {
196
+ root: colorVariants.outline.default
197
+ }
198
+ },
199
+ {
200
+ variant: "bordered",
201
+ color: "primary",
202
+ class: {
203
+ root: colorVariants.outline.primary
204
+ }
205
+ },
206
+ {
207
+ variant: "bordered",
208
+ color: "secondary",
209
+ class: {
210
+ root: colorVariants.outline.secondary
211
+ }
212
+ },
213
+ {
214
+ variant: "bordered",
215
+ color: "success",
216
+ class: {
217
+ root: colorVariants.outline.success
218
+ }
219
+ },
220
+ {
221
+ variant: "bordered",
222
+ color: "warning",
223
+ class: {
224
+ root: colorVariants.outline.warning
225
+ }
226
+ },
227
+ {
228
+ variant: "bordered",
229
+ color: "destructive",
230
+ class: {
231
+ root: colorVariants.outline.destructive
232
+ }
233
+ },
234
+ {
235
+ variant: "flat",
236
+ color: "default",
237
+ class: {
238
+ root: colorVariants.flat.default
239
+ }
240
+ },
241
+ {
242
+ variant: "flat",
243
+ color: "primary",
244
+ class: {
245
+ root: colorVariants.flat.primary
246
+ }
247
+ },
248
+ {
249
+ variant: "flat",
250
+ color: "secondary",
251
+ class: {
252
+ root: colorVariants.flat.secondary
253
+ }
254
+ },
255
+ {
256
+ variant: "flat",
257
+ color: "success",
258
+ class: {
259
+ root: colorVariants.flat.success
260
+ }
261
+ },
262
+ {
263
+ variant: "flat",
264
+ color: "warning",
265
+ class: {
266
+ root: colorVariants.flat.warning
267
+ }
268
+ },
269
+ {
270
+ variant: "flat",
271
+ color: "destructive",
272
+ class: {
273
+ root: colorVariants.flat.destructive
274
+ }
275
+ },
276
+ // faded / color
277
+ {
278
+ variant: "faded",
279
+ color: "default",
280
+ class: {
281
+ root: colorVariants.faded.default
282
+ }
283
+ },
284
+ {
285
+ variant: "faded",
286
+ color: "primary",
287
+ class: {
288
+ root: colorVariants.faded.primary
289
+ }
290
+ },
291
+ {
292
+ variant: "faded",
293
+ color: "secondary",
294
+ class: {
295
+ root: colorVariants.faded.secondary
296
+ }
297
+ },
298
+ {
299
+ variant: "faded",
300
+ color: "success",
301
+ class: {
302
+ root: colorVariants.faded.success
303
+ }
304
+ },
305
+ {
306
+ variant: "faded",
307
+ color: "warning",
308
+ class: {
309
+ root: colorVariants.faded.warning
310
+ }
311
+ },
312
+ {
313
+ variant: "faded",
314
+ color: "destructive",
315
+ class: {
316
+ root: colorVariants.faded.destructive
317
+ }
318
+ }
319
+ ]
320
+ });
321
+
322
+ export {
323
+ chip
324
+ };
@@ -0,0 +1,53 @@
1
+ // src/utils/variants.ts
2
+ var solid = {
3
+ default: "bg-accent text-accent-foreground",
4
+ primary: "bg-primary text-primary-foreground",
5
+ secondary: "bg-secondary text-secondary-foreground",
6
+ destructive: "bg-destructive text-destructive-foreground",
7
+ warning: "bg-warning text-warning-foreground",
8
+ success: "bg-success text-success-foreground"
9
+ };
10
+ var outline = {
11
+ default: "bg-transparent border border-accent text-accent-foreground",
12
+ primary: "bg-transparent border-primary text-primary",
13
+ secondary: "bg-transparent border-secondary text-secondary-foreground",
14
+ destructive: "bg-transparent border-destructive text-destructive",
15
+ warning: "bg-transparent border-warning text-warning",
16
+ success: "bg-transparent border-success text-success"
17
+ };
18
+ var flat = {
19
+ default: "bg-accent/40 text-accent-700",
20
+ primary: "bg-primary/20 text-primary-600",
21
+ secondary: "bg-secondary/20 text-secondary-600",
22
+ success: "bg-success/20 text-success-700 dark:text-success",
23
+ warning: "bg-warning/20 text-warning-700 dark:text-warning",
24
+ destructive: "bg-danger/20 text-danger-600 dark:text-danger-500",
25
+ foreground: "bg-foreground/10 text-foreground"
26
+ };
27
+ var faded = {
28
+ default: "border-default bg-accent/30 text-default-foreground",
29
+ primary: "border-default bg-accent/30 text-primary",
30
+ secondary: "border-default bg-accent/30 text-secondary-foreground",
31
+ success: "border-default bg-accent/30 text-success",
32
+ warning: "border-default bg-accent/30 text-warning",
33
+ destructive: "border-default bg-accent/30 text-danger",
34
+ foreground: "border-default bg-accent/30 text-foreground"
35
+ };
36
+ var ghost = {
37
+ primary: "bg-transparent text-primary",
38
+ secondary: "bg-transparent text-secondary",
39
+ destructive: "bg-transparent text-destructive",
40
+ warning: "bg-transparent text-warning",
41
+ success: "bg-transparent text-success"
42
+ };
43
+ var colorVariants = {
44
+ solid,
45
+ ghost,
46
+ outline,
47
+ flat,
48
+ faded
49
+ };
50
+
51
+ export {
52
+ colorVariants
53
+ };
@@ -0,0 +1,17 @@
1
+ // src/components/alert-dialog.ts
2
+ import { tv } from "tailwind-variants";
3
+ var alertDialog = tv({
4
+ slots: {
5
+ overlay: "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
6
+ content: "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
7
+ header: "flex flex-col gap-2 text-center sm:text-left",
8
+ footer: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
9
+ title: "text-lg font-semibold",
10
+ description: "text-muted-foreground text-sm",
11
+ action: ""
12
+ }
13
+ });
14
+
15
+ export {
16
+ alertDialog
17
+ };
@@ -1,9 +1,9 @@
1
- import {
2
- colorVariants
3
- } from "./chunk-U6ONJKJY.mjs";
4
1
  import {
5
2
  focusVisibleClasses
6
3
  } from "./chunk-2C5EQ4P3.mjs";
4
+ import {
5
+ colorVariants
6
+ } from "./chunk-67PPUTSS.mjs";
7
7
 
8
8
  // src/components/button.ts
9
9
  import { tv } from "tailwind-variants";
@@ -0,0 +1,68 @@
1
+ import * as tailwind_variants from 'tailwind-variants';
2
+ import { VariantProps } from 'tailwind-variants';
3
+
4
+ declare const alertDialog: tailwind_variants.TVReturnType<{
5
+ [key: string]: {
6
+ [key: string]: tailwind_variants.ClassValue | {
7
+ overlay?: tailwind_variants.ClassValue;
8
+ content?: tailwind_variants.ClassValue;
9
+ header?: tailwind_variants.ClassValue;
10
+ footer?: tailwind_variants.ClassValue;
11
+ title?: tailwind_variants.ClassValue;
12
+ description?: tailwind_variants.ClassValue;
13
+ action?: tailwind_variants.ClassValue;
14
+ };
15
+ };
16
+ } | {
17
+ [x: string]: {
18
+ [x: string]: tailwind_variants.ClassValue | {
19
+ overlay?: tailwind_variants.ClassValue;
20
+ content?: tailwind_variants.ClassValue;
21
+ header?: tailwind_variants.ClassValue;
22
+ footer?: tailwind_variants.ClassValue;
23
+ title?: tailwind_variants.ClassValue;
24
+ description?: tailwind_variants.ClassValue;
25
+ action?: tailwind_variants.ClassValue;
26
+ };
27
+ };
28
+ } | {}, {
29
+ overlay: string;
30
+ content: string;
31
+ header: string;
32
+ footer: string;
33
+ title: string;
34
+ description: string;
35
+ action: string;
36
+ }, undefined, {
37
+ [key: string]: {
38
+ [key: string]: tailwind_variants.ClassValue | {
39
+ overlay?: tailwind_variants.ClassValue;
40
+ content?: tailwind_variants.ClassValue;
41
+ header?: tailwind_variants.ClassValue;
42
+ footer?: tailwind_variants.ClassValue;
43
+ title?: tailwind_variants.ClassValue;
44
+ description?: tailwind_variants.ClassValue;
45
+ action?: tailwind_variants.ClassValue;
46
+ };
47
+ };
48
+ } | {}, {
49
+ overlay: string;
50
+ content: string;
51
+ header: string;
52
+ footer: string;
53
+ title: string;
54
+ description: string;
55
+ action: string;
56
+ }, tailwind_variants.TVReturnType<unknown, {
57
+ overlay: string;
58
+ content: string;
59
+ header: string;
60
+ footer: string;
61
+ title: string;
62
+ description: string;
63
+ action: string;
64
+ }, undefined, unknown, unknown, undefined>>;
65
+ type AlertDialogVariants = VariantProps<typeof alertDialog>;
66
+ type AlertDialogSlots = keyof ReturnType<typeof alertDialog>;
67
+
68
+ export { type AlertDialogSlots, type AlertDialogVariants, alertDialog };
@@ -0,0 +1,68 @@
1
+ import * as tailwind_variants from 'tailwind-variants';
2
+ import { VariantProps } from 'tailwind-variants';
3
+
4
+ declare const alertDialog: tailwind_variants.TVReturnType<{
5
+ [key: string]: {
6
+ [key: string]: tailwind_variants.ClassValue | {
7
+ overlay?: tailwind_variants.ClassValue;
8
+ content?: tailwind_variants.ClassValue;
9
+ header?: tailwind_variants.ClassValue;
10
+ footer?: tailwind_variants.ClassValue;
11
+ title?: tailwind_variants.ClassValue;
12
+ description?: tailwind_variants.ClassValue;
13
+ action?: tailwind_variants.ClassValue;
14
+ };
15
+ };
16
+ } | {
17
+ [x: string]: {
18
+ [x: string]: tailwind_variants.ClassValue | {
19
+ overlay?: tailwind_variants.ClassValue;
20
+ content?: tailwind_variants.ClassValue;
21
+ header?: tailwind_variants.ClassValue;
22
+ footer?: tailwind_variants.ClassValue;
23
+ title?: tailwind_variants.ClassValue;
24
+ description?: tailwind_variants.ClassValue;
25
+ action?: tailwind_variants.ClassValue;
26
+ };
27
+ };
28
+ } | {}, {
29
+ overlay: string;
30
+ content: string;
31
+ header: string;
32
+ footer: string;
33
+ title: string;
34
+ description: string;
35
+ action: string;
36
+ }, undefined, {
37
+ [key: string]: {
38
+ [key: string]: tailwind_variants.ClassValue | {
39
+ overlay?: tailwind_variants.ClassValue;
40
+ content?: tailwind_variants.ClassValue;
41
+ header?: tailwind_variants.ClassValue;
42
+ footer?: tailwind_variants.ClassValue;
43
+ title?: tailwind_variants.ClassValue;
44
+ description?: tailwind_variants.ClassValue;
45
+ action?: tailwind_variants.ClassValue;
46
+ };
47
+ };
48
+ } | {}, {
49
+ overlay: string;
50
+ content: string;
51
+ header: string;
52
+ footer: string;
53
+ title: string;
54
+ description: string;
55
+ action: string;
56
+ }, tailwind_variants.TVReturnType<unknown, {
57
+ overlay: string;
58
+ content: string;
59
+ header: string;
60
+ footer: string;
61
+ title: string;
62
+ description: string;
63
+ action: string;
64
+ }, undefined, unknown, unknown, undefined>>;
65
+ type AlertDialogVariants = VariantProps<typeof alertDialog>;
66
+ type AlertDialogSlots = keyof ReturnType<typeof alertDialog>;
67
+
68
+ export { type AlertDialogSlots, type AlertDialogVariants, alertDialog };
@@ -0,0 +1,41 @@
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/components/alert-dialog.ts
21
+ var alert_dialog_exports = {};
22
+ __export(alert_dialog_exports, {
23
+ alertDialog: () => alertDialog
24
+ });
25
+ module.exports = __toCommonJS(alert_dialog_exports);
26
+ var import_tailwind_variants = require("tailwind-variants");
27
+ var alertDialog = (0, import_tailwind_variants.tv)({
28
+ slots: {
29
+ overlay: "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
30
+ content: "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
31
+ header: "flex flex-col gap-2 text-center sm:text-left",
32
+ footer: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
33
+ title: "text-lg font-semibold",
34
+ description: "text-muted-foreground text-sm",
35
+ action: ""
36
+ }
37
+ });
38
+ // Annotate the CommonJS export names for ESM import in node:
39
+ 0 && (module.exports = {
40
+ alertDialog
41
+ });
@@ -0,0 +1,6 @@
1
+ import {
2
+ alertDialog
3
+ } from "../chunk-CPEP2RO4.mjs";
4
+ export {
5
+ alertDialog
6
+ };
@@ -33,6 +33,7 @@ var focusVisibleClasses = [
33
33
 
34
34
  // src/utils/variants.ts
35
35
  var solid = {
36
+ default: "bg-accent text-accent-foreground",
36
37
  primary: "bg-primary text-primary-foreground",
37
38
  secondary: "bg-secondary text-secondary-foreground",
38
39
  destructive: "bg-destructive text-destructive-foreground",
@@ -40,12 +41,31 @@ var solid = {
40
41
  success: "bg-success text-success-foreground"
41
42
  };
42
43
  var outline = {
44
+ default: "bg-transparent border border-accent text-accent-foreground",
43
45
  primary: "bg-transparent border-primary text-primary",
44
- secondary: "bg-transparent border-secondary text-secondary",
46
+ secondary: "bg-transparent border-secondary text-secondary-foreground",
45
47
  destructive: "bg-transparent border-destructive text-destructive",
46
48
  warning: "bg-transparent border-warning text-warning",
47
49
  success: "bg-transparent border-success text-success"
48
50
  };
51
+ var flat = {
52
+ default: "bg-accent/40 text-accent-700",
53
+ primary: "bg-primary/20 text-primary-600",
54
+ secondary: "bg-secondary/20 text-secondary-600",
55
+ success: "bg-success/20 text-success-700 dark:text-success",
56
+ warning: "bg-warning/20 text-warning-700 dark:text-warning",
57
+ destructive: "bg-danger/20 text-danger-600 dark:text-danger-500",
58
+ foreground: "bg-foreground/10 text-foreground"
59
+ };
60
+ var faded = {
61
+ default: "border-default bg-accent/30 text-default-foreground",
62
+ primary: "border-default bg-accent/30 text-primary",
63
+ secondary: "border-default bg-accent/30 text-secondary-foreground",
64
+ success: "border-default bg-accent/30 text-success",
65
+ warning: "border-default bg-accent/30 text-warning",
66
+ destructive: "border-default bg-accent/30 text-danger",
67
+ foreground: "border-default bg-accent/30 text-foreground"
68
+ };
49
69
  var ghost = {
50
70
  primary: "bg-transparent text-primary",
51
71
  secondary: "bg-transparent text-secondary",
@@ -56,7 +76,9 @@ var ghost = {
56
76
  var colorVariants = {
57
77
  solid,
58
78
  ghost,
59
- outline
79
+ outline,
80
+ flat,
81
+ faded
60
82
  };
61
83
 
62
84
  // src/components/button.ts
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  button
3
- } from "../chunk-25CHZW25.mjs";
4
- import "../chunk-U6ONJKJY.mjs";
3
+ } from "../chunk-KE2E5LGH.mjs";
5
4
  import "../chunk-2C5EQ4P3.mjs";
5
+ import "../chunk-67PPUTSS.mjs";
6
6
  export {
7
7
  button
8
8
  };