@kopexa/theme 1.6.8 → 1.6.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 (14) hide show
  1. package/dist/{chunk-5DF3M5JP.mjs → chunk-MWG2OZMD.mjs} +10 -12
  2. package/dist/{chunk-J4JIYTOU.mjs → chunk-TJDRYBGW.mjs} +27 -7
  3. package/dist/components/dialog.js +10 -12
  4. package/dist/components/dialog.mjs +1 -1
  5. package/dist/components/drawer.d.mts +27 -15
  6. package/dist/components/drawer.d.ts +27 -15
  7. package/dist/components/drawer.js +36 -18
  8. package/dist/components/drawer.mjs +2 -2
  9. package/dist/components/index.js +36 -18
  10. package/dist/components/index.mjs +2 -2
  11. package/dist/index.css +2 -2
  12. package/dist/index.js +36 -18
  13. package/dist/index.mjs +2 -2
  14. package/package.json +1 -1
package/dist/{chunk-5DF3M5JP.mjs → chunk-MWG2OZMD.mjs} RENAMED
@@ -2,22 +2,20 @@
2
2
  import { tv } from "tailwind-variants";
3
3
  var dialog = tv({
4
4
  slots: {
5
- overlay: ["fixed inset-0 z-50 bg-black/25"],
5
+ overlay: [
6
+ "fixed inset-0 z-50 bg-black/25",
7
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
8
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
9
+ ],
6
10
  content: [
7
11
  "flex flex-col",
8
12
  "bg-background fixed top-[50%] left-[50%] z-50",
9
13
  "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
10
14
  "border shadow-lg",
11
- // mobile animation vars
12
- "[--scale-enter:100%]",
13
- "[--scale-exit:100%]",
14
- "[--slide-enter:0px]",
15
- "[--slide-exit:80px]",
16
- // tablet/desktop animation vars
17
- "sm:[--scale-enter:100%]",
18
- "sm:[--scale-exit:103%]",
19
- "sm:[--slide-enter:0px]",
20
- "sm:[--slide-exit:0px]"
15
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
16
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
17
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
18
+ "duration-200 sm:max-w-lg"
21
19
  ],
22
20
  close: [
23
21
  "ring-offset-background focus:ring-ring",
@@ -65,7 +63,7 @@ var dialog = tv({
65
63
  full: {
66
64
  content: [
67
65
  "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
68
- "translate-0"
66
+ "translate-0 sm:max-w-[calc(100%-1rem)]"
69
67
  ]
70
68
  }
71
69
  },
package/dist/{chunk-J4JIYTOU.mjs → chunk-TJDRYBGW.mjs} RENAMED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  dialog
3
- } from "./chunk-5DF3M5JP.mjs";
3
+ } from "./chunk-MWG2OZMD.mjs";
4
4
 
5
5
  // src/components/drawer.ts
6
6
  import { tv } from "tailwind-variants";
@@ -9,7 +9,9 @@ var drawer = tv({
9
9
  overlay: dialog.slots.overlay,
10
10
  content: [
11
11
  "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
12
- "outline-hidden"
12
+ "outline-hidden",
13
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
14
+ "transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500"
13
15
  ],
14
16
  close: dialog.slots.close,
15
17
  closeTrigger: dialog.slots.closeTrigger,
@@ -52,17 +54,35 @@ var drawer = tv({
52
54
  content: "max-w-6xl"
53
55
  },
54
56
  full: {
55
- content: "max-w-full max-h-full h-[calc(100dvh_-_1rem)] !inset-2"
57
+ content: ["max-w-full h-[calc(100dvh_-_1rem)] !inset-2"]
56
58
  }
57
59
  },
58
60
  placement: {
59
- top: {},
60
- bottom: {},
61
+ top: {
62
+ content: [
63
+ "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
64
+ "inset-x-2 top-2 w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)] mx-auto h-auto border-b",
65
+ "max-w-[calc(100svw-1rem)]"
66
+ ]
67
+ },
68
+ bottom: {
69
+ content: [
70
+ "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
71
+ "inset-x-2 bottom-2 h-auto border-t",
72
+ "max-w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)]"
73
+ ]
74
+ },
61
75
  left: {
62
- content: "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]"
76
+ content: [
77
+ "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]",
78
+ "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"
79
+ ]
63
80
  },
64
81
  right: {
65
- content: "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l"
82
+ content: [
83
+ "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l",
84
+ "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
85
+ ]
66
86
  }
67
87
  },
68
88
  radius: {
package/dist/components/dialog.js CHANGED
@@ -26,22 +26,20 @@ module.exports = __toCommonJS(dialog_exports);
26
26
  var import_tailwind_variants = require("tailwind-variants");
27
27
  var dialog = (0, import_tailwind_variants.tv)({
28
28
  slots: {
29
- overlay: ["fixed inset-0 z-50 bg-black/25"],
29
+ overlay: [
30
+ "fixed inset-0 z-50 bg-black/25",
31
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
32
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
33
+ ],
30
34
  content: [
31
35
  "flex flex-col",
32
36
  "bg-background fixed top-[50%] left-[50%] z-50",
33
37
  "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
34
38
  "border shadow-lg",
35
- // mobile animation vars
36
- "[--scale-enter:100%]",
37
- "[--scale-exit:100%]",
38
- "[--slide-enter:0px]",
39
- "[--slide-exit:80px]",
40
- // tablet/desktop animation vars
41
- "sm:[--scale-enter:100%]",
42
- "sm:[--scale-exit:103%]",
43
- "sm:[--slide-enter:0px]",
44
- "sm:[--slide-exit:0px]"
39
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
40
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
41
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
42
+ "duration-200 sm:max-w-lg"
45
43
  ],
46
44
  close: [
47
45
  "ring-offset-background focus:ring-ring",
@@ -89,7 +87,7 @@ var dialog = (0, import_tailwind_variants.tv)({
89
87
  full: {
90
88
  content: [
91
89
  "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
92
- "translate-0"
90
+ "translate-0 sm:max-w-[calc(100%-1rem)]"
93
91
  ]
94
92
  }
95
93
  },
package/dist/components/dialog.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  dialog
3
- } from "../chunk-5DF3M5JP.mjs";
3
+ } from "../chunk-MWG2OZMD.mjs";
4
4
  export {
5
5
  dialog
6
6
  };
package/dist/components/drawer.d.mts CHANGED
@@ -34,17 +34,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
34
34
  content: string;
35
35
  };
36
36
  full: {
37
- content: string;
37
+ content: string[];
38
38
  };
39
39
  };
40
40
  placement: {
41
- top: {};
42
- bottom: {};
41
+ top: {
42
+ content: string[];
43
+ };
44
+ bottom: {
45
+ content: string[];
46
+ };
43
47
  left: {
44
- content: string;
48
+ content: string[];
45
49
  };
46
50
  right: {
47
- content: string;
51
+ content: string[];
48
52
  };
49
53
  };
50
54
  radius: {
@@ -102,17 +106,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
102
106
  content: string;
103
107
  };
104
108
  full: {
105
- content: string;
109
+ content: string[];
106
110
  };
107
111
  };
108
112
  placement: {
109
- top: {};
110
- bottom: {};
113
+ top: {
114
+ content: string[];
115
+ };
116
+ bottom: {
117
+ content: string[];
118
+ };
111
119
  left: {
112
- content: string;
120
+ content: string[];
113
121
  };
114
122
  right: {
115
- content: string;
123
+ content: string[];
116
124
  };
117
125
  };
118
126
  radius: {
@@ -170,17 +178,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
170
178
  content: string;
171
179
  };
172
180
  full: {
173
- content: string;
181
+ content: string[];
174
182
  };
175
183
  };
176
184
  placement: {
177
- top: {};
178
- bottom: {};
185
+ top: {
186
+ content: string[];
187
+ };
188
+ bottom: {
189
+ content: string[];
190
+ };
179
191
  left: {
180
- content: string;
192
+ content: string[];
181
193
  };
182
194
  right: {
183
- content: string;
195
+ content: string[];
184
196
  };
185
197
  };
186
198
  radius: {
package/dist/components/drawer.d.ts CHANGED
@@ -34,17 +34,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
34
34
  content: string;
35
35
  };
36
36
  full: {
37
- content: string;
37
+ content: string[];
38
38
  };
39
39
  };
40
40
  placement: {
41
- top: {};
42
- bottom: {};
41
+ top: {
42
+ content: string[];
43
+ };
44
+ bottom: {
45
+ content: string[];
46
+ };
43
47
  left: {
44
- content: string;
48
+ content: string[];
45
49
  };
46
50
  right: {
47
- content: string;
51
+ content: string[];
48
52
  };
49
53
  };
50
54
  radius: {
@@ -102,17 +106,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
102
106
  content: string;
103
107
  };
104
108
  full: {
105
- content: string;
109
+ content: string[];
106
110
  };
107
111
  };
108
112
  placement: {
109
- top: {};
110
- bottom: {};
113
+ top: {
114
+ content: string[];
115
+ };
116
+ bottom: {
117
+ content: string[];
118
+ };
111
119
  left: {
112
- content: string;
120
+ content: string[];
113
121
  };
114
122
  right: {
115
- content: string;
123
+ content: string[];
116
124
  };
117
125
  };
118
126
  radius: {
@@ -170,17 +178,21 @@ declare const drawer: tailwind_variants.TVReturnType<{
170
178
  content: string;
171
179
  };
172
180
  full: {
173
- content: string;
181
+ content: string[];
174
182
  };
175
183
  };
176
184
  placement: {
177
- top: {};
178
- bottom: {};
185
+ top: {
186
+ content: string[];
187
+ };
188
+ bottom: {
189
+ content: string[];
190
+ };
179
191
  left: {
180
- content: string;
192
+ content: string[];
181
193
  };
182
194
  right: {
183
- content: string;
195
+ content: string[];
184
196
  };
185
197
  };
186
198
  radius: {
package/dist/components/drawer.js CHANGED
@@ -29,22 +29,20 @@ var import_tailwind_variants2 = require("tailwind-variants");
29
29
  var import_tailwind_variants = require("tailwind-variants");
30
30
  var dialog = (0, import_tailwind_variants.tv)({
31
31
  slots: {
32
- overlay: ["fixed inset-0 z-50 bg-black/25"],
32
+ overlay: [
33
+ "fixed inset-0 z-50 bg-black/25",
34
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
35
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
36
+ ],
33
37
  content: [
34
38
  "flex flex-col",
35
39
  "bg-background fixed top-[50%] left-[50%] z-50",
36
40
  "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
37
41
  "border shadow-lg",
38
- // mobile animation vars
39
- "[--scale-enter:100%]",
40
- "[--scale-exit:100%]",
41
- "[--slide-enter:0px]",
42
- "[--slide-exit:80px]",
43
- // tablet/desktop animation vars
44
- "sm:[--scale-enter:100%]",
45
- "sm:[--scale-exit:103%]",
46
- "sm:[--slide-enter:0px]",
47
- "sm:[--slide-exit:0px]"
42
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
43
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
44
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
45
+ "duration-200 sm:max-w-lg"
48
46
  ],
49
47
  close: [
50
48
  "ring-offset-background focus:ring-ring",
@@ -92,7 +90,7 @@ var dialog = (0, import_tailwind_variants.tv)({
92
90
  full: {
93
91
  content: [
94
92
  "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
95
- "translate-0"
93
+ "translate-0 sm:max-w-[calc(100%-1rem)]"
96
94
  ]
97
95
  }
98
96
  },
@@ -123,7 +121,9 @@ var drawer = (0, import_tailwind_variants2.tv)({
123
121
  overlay: dialog.slots.overlay,
124
122
  content: [
125
123
  "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
126
- "outline-hidden"
124
+ "outline-hidden",
125
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
126
+ "transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500"
127
127
  ],
128
128
  close: dialog.slots.close,
129
129
  closeTrigger: dialog.slots.closeTrigger,
@@ -166,17 +166,35 @@ var drawer = (0, import_tailwind_variants2.tv)({
166
166
  content: "max-w-6xl"
167
167
  },
168
168
  full: {
169
- content: "max-w-full max-h-full h-[calc(100dvh_-_1rem)] !inset-2"
169
+ content: ["max-w-full h-[calc(100dvh_-_1rem)] !inset-2"]
170
170
  }
171
171
  },
172
172
  placement: {
173
- top: {},
174
- bottom: {},
173
+ top: {
174
+ content: [
175
+ "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
176
+ "inset-x-2 top-2 w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)] mx-auto h-auto border-b",
177
+ "max-w-[calc(100svw-1rem)]"
178
+ ]
179
+ },
180
+ bottom: {
181
+ content: [
182
+ "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
183
+ "inset-x-2 bottom-2 h-auto border-t",
184
+ "max-w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)]"
185
+ ]
186
+ },
175
187
  left: {
176
- content: "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]"
188
+ content: [
189
+ "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]",
190
+ "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"
191
+ ]
177
192
  },
178
193
  right: {
179
- content: "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l"
194
+ content: [
195
+ "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l",
196
+ "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
197
+ ]
180
198
  }
181
199
  },
182
200
  radius: {
package/dist/components/drawer.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  drawer
3
- } from "../chunk-J4JIYTOU.mjs";
4
- import "../chunk-5DF3M5JP.mjs";
3
+ } from "../chunk-TJDRYBGW.mjs";
4
+ import "../chunk-MWG2OZMD.mjs";
5
5
  export {
6
6
  drawer
7
7
  };
package/dist/components/index.js CHANGED
@@ -1335,22 +1335,20 @@ var dataTable = (0, import_tailwind_variants13.tv)({
1335
1335
  var import_tailwind_variants14 = require("tailwind-variants");
1336
1336
  var dialog = (0, import_tailwind_variants14.tv)({
1337
1337
  slots: {
1338
- overlay: ["fixed inset-0 z-50 bg-black/25"],
1338
+ overlay: [
1339
+ "fixed inset-0 z-50 bg-black/25",
1340
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1341
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
1342
+ ],
1339
1343
  content: [
1340
1344
  "flex flex-col",
1341
1345
  "bg-background fixed top-[50%] left-[50%] z-50",
1342
1346
  "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
1343
1347
  "border shadow-lg",
1344
- // mobile animation vars
1345
- "[--scale-enter:100%]",
1346
- "[--scale-exit:100%]",
1347
- "[--slide-enter:0px]",
1348
- "[--slide-exit:80px]",
1349
- // tablet/desktop animation vars
1350
- "sm:[--scale-enter:100%]",
1351
- "sm:[--scale-exit:103%]",
1352
- "sm:[--slide-enter:0px]",
1353
- "sm:[--slide-exit:0px]"
1348
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1349
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1350
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
1351
+ "duration-200 sm:max-w-lg"
1354
1352
  ],
1355
1353
  close: [
1356
1354
  "ring-offset-background focus:ring-ring",
@@ -1398,7 +1396,7 @@ var dialog = (0, import_tailwind_variants14.tv)({
1398
1396
  full: {
1399
1397
  content: [
1400
1398
  "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
1401
- "translate-0"
1399
+ "translate-0 sm:max-w-[calc(100%-1rem)]"
1402
1400
  ]
1403
1401
  }
1404
1402
  },
@@ -1430,7 +1428,9 @@ var drawer = (0, import_tailwind_variants15.tv)({
1430
1428
  overlay: dialog.slots.overlay,
1431
1429
  content: [
1432
1430
  "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
1433
- "outline-hidden"
1431
+ "outline-hidden",
1432
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1433
+ "transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500"
1434
1434
  ],
1435
1435
  close: dialog.slots.close,
1436
1436
  closeTrigger: dialog.slots.closeTrigger,
@@ -1473,17 +1473,35 @@ var drawer = (0, import_tailwind_variants15.tv)({
1473
1473
  content: "max-w-6xl"
1474
1474
  },
1475
1475
  full: {
1476
- content: "max-w-full max-h-full h-[calc(100dvh_-_1rem)] !inset-2"
1476
+ content: ["max-w-full h-[calc(100dvh_-_1rem)] !inset-2"]
1477
1477
  }
1478
1478
  },
1479
1479
  placement: {
1480
- top: {},
1481
- bottom: {},
1480
+ top: {
1481
+ content: [
1482
+ "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
1483
+ "inset-x-2 top-2 w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)] mx-auto h-auto border-b",
1484
+ "max-w-[calc(100svw-1rem)]"
1485
+ ]
1486
+ },
1487
+ bottom: {
1488
+ content: [
1489
+ "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
1490
+ "inset-x-2 bottom-2 h-auto border-t",
1491
+ "max-w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)]"
1492
+ ]
1493
+ },
1482
1494
  left: {
1483
- content: "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]"
1495
+ content: [
1496
+ "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]",
1497
+ "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"
1498
+ ]
1484
1499
  },
1485
1500
  right: {
1486
- content: "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l"
1501
+ content: [
1502
+ "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l",
1503
+ "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
1504
+ ]
1487
1505
  }
1488
1506
  },
1489
1507
  radius: {
package/dist/components/index.mjs CHANGED
@@ -85,10 +85,10 @@ import {
85
85
  } from "../chunk-GNYTZGE5.mjs";
86
86
  import {
87
87
  drawer
88
- } from "../chunk-J4JIYTOU.mjs";
88
+ } from "../chunk-TJDRYBGW.mjs";
89
89
  import {
90
90
  dialog
91
- } from "../chunk-5DF3M5JP.mjs";
91
+ } from "../chunk-MWG2OZMD.mjs";
92
92
  import {
93
93
  accordion
94
94
  } from "../chunk-TLCFFCOP.mjs";
package/dist/index.css CHANGED
@@ -39,8 +39,8 @@
39
39
  --sidebar-foreground: var(--color-white);
40
40
  --sidebar-primary: oklch(0.205 0 0);
41
41
  --sidebar-primary-foreground: var(--color-white);
42
- --sidebar-accent:var(--color-default-200);
43
- --sidebar-accent-foreground: oklch(0.205 0 0);
42
+ --sidebar-accent:var(--color-primary-700);
43
+ --sidebar-accent-foreground: var(--color-primary-50);
44
44
  --sidebar-border: var(--color-default-200);
45
45
  --sidebar-ring: oklch(0.708 0 0);
46
46
  }
package/dist/index.js CHANGED
@@ -1335,22 +1335,20 @@ var dataTable = (0, import_tailwind_variants13.tv)({
1335
1335
  var import_tailwind_variants14 = require("tailwind-variants");
1336
1336
  var dialog = (0, import_tailwind_variants14.tv)({
1337
1337
  slots: {
1338
- overlay: ["fixed inset-0 z-50 bg-black/25"],
1338
+ overlay: [
1339
+ "fixed inset-0 z-50 bg-black/25",
1340
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1341
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
1342
+ ],
1339
1343
  content: [
1340
1344
  "flex flex-col",
1341
1345
  "bg-background fixed top-[50%] left-[50%] z-50",
1342
1346
  "w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
1343
1347
  "border shadow-lg",
1344
- // mobile animation vars
1345
- "[--scale-enter:100%]",
1346
- "[--scale-exit:100%]",
1347
- "[--slide-enter:0px]",
1348
- "[--slide-exit:80px]",
1349
- // tablet/desktop animation vars
1350
- "sm:[--scale-enter:100%]",
1351
- "sm:[--scale-exit:103%]",
1352
- "sm:[--slide-enter:0px]",
1353
- "sm:[--slide-exit:0px]"
1348
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1349
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1350
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
1351
+ "duration-200 sm:max-w-lg"
1354
1352
  ],
1355
1353
  close: [
1356
1354
  "ring-offset-background focus:ring-ring",
@@ -1398,7 +1396,7 @@ var dialog = (0, import_tailwind_variants14.tv)({
1398
1396
  full: {
1399
1397
  content: [
1400
1398
  "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
1401
- "translate-0"
1399
+ "translate-0 sm:max-w-[calc(100%-1rem)]"
1402
1400
  ]
1403
1401
  }
1404
1402
  },
@@ -1430,7 +1428,9 @@ var drawer = (0, import_tailwind_variants15.tv)({
1430
1428
  overlay: dialog.slots.overlay,
1431
1429
  content: [
1432
1430
  "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
1433
- "outline-hidden"
1431
+ "outline-hidden",
1432
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
1433
+ "transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500"
1434
1434
  ],
1435
1435
  close: dialog.slots.close,
1436
1436
  closeTrigger: dialog.slots.closeTrigger,
@@ -1473,17 +1473,35 @@ var drawer = (0, import_tailwind_variants15.tv)({
1473
1473
  content: "max-w-6xl"
1474
1474
  },
1475
1475
  full: {
1476
- content: "max-w-full max-h-full h-[calc(100dvh_-_1rem)] !inset-2"
1476
+ content: ["max-w-full h-[calc(100dvh_-_1rem)] !inset-2"]
1477
1477
  }
1478
1478
  },
1479
1479
  placement: {
1480
- top: {},
1481
- bottom: {},
1480
+ top: {
1481
+ content: [
1482
+ "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
1483
+ "inset-x-2 top-2 w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)] mx-auto h-auto border-b",
1484
+ "max-w-[calc(100svw-1rem)]"
1485
+ ]
1486
+ },
1487
+ bottom: {
1488
+ content: [
1489
+ "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
1490
+ "inset-x-2 bottom-2 h-auto border-t",
1491
+ "max-w-[calc(100svw-1rem)] max-h-[calc(100dvh-1rem)]"
1492
+ ]
1493
+ },
1482
1494
  left: {
1483
- content: "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]"
1495
+ content: [
1496
+ "inset-y-2 ms-2 left-0 border-r h-[calc(100dvh_-_1rem)]",
1497
+ "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"
1498
+ ]
1484
1499
  },
1485
1500
  right: {
1486
- content: "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l"
1501
+ content: [
1502
+ "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l",
1503
+ "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
1504
+ ]
1487
1505
  }
1488
1506
  },
1489
1507
  radius: {
package/dist/index.mjs CHANGED
@@ -86,10 +86,10 @@ import {
86
86
  } from "./chunk-GNYTZGE5.mjs";
87
87
  import {
88
88
  drawer
89
- } from "./chunk-J4JIYTOU.mjs";
89
+ } from "./chunk-TJDRYBGW.mjs";
90
90
  import {
91
91
  dialog
92
- } from "./chunk-5DF3M5JP.mjs";
92
+ } from "./chunk-MWG2OZMD.mjs";
93
93
  import {
94
94
  accordion
95
95
  } from "./chunk-TLCFFCOP.mjs";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kopexa/theme",
3
- "version": "1.6.8",
3
+ "version": "1.6.9",
4
4
  "description": "The default theme for Kopexa components",
5
5
  "keywords": [
6
6
  "theme",