@vaneui/ui 0.2.1-alpha.20250901145552.64cbaea → 0.2.1-alpha.20250904211915.5efd1b4
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.
- package/dist/components/ui/theme/appearance/genericVariantTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/borderTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/directionTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/displayTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/hideTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/itemsTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/justifyTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/overflowTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/positionTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/ringTheme.d.ts +0 -1
- package/dist/components/ui/theme/layout/wrapTheme.d.ts +0 -1
- package/dist/components/ui/theme/list/listStyleTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/breakpointTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/gapTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/paddingTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/plTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/pxTheme.d.ts +0 -1
- package/dist/components/ui/theme/size/pyTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/fontFamilyTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/fontStyleTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/fontWeightTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/textAlignTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/textDecorationTheme.d.ts +0 -1
- package/dist/components/ui/theme/typography/textTransformTheme.d.ts +0 -1
- package/dist/index.esm.js +146 -182
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +146 -182
- package/dist/index.js.map +1 -1
- package/dist/ui.css +1 -1
- package/dist/vars.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -124,7 +124,13 @@ class HideTheme extends BaseTheme {
|
|
|
124
124
|
super();
|
|
125
125
|
ComponentKeys.hide.forEach((key) => {
|
|
126
126
|
var _a;
|
|
127
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
127
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
128
|
+
xsHide: "max-xs:hidden",
|
|
129
|
+
smHide: "max-sm:hidden",
|
|
130
|
+
mdHide: "max-md:hidden",
|
|
131
|
+
lgHide: "max-lg:hidden",
|
|
132
|
+
xlHide: "max-xl:hidden"
|
|
133
|
+
}[key];
|
|
128
134
|
});
|
|
129
135
|
}
|
|
130
136
|
getClasses(extractedKeys) {
|
|
@@ -132,20 +138,19 @@ class HideTheme extends BaseTheme {
|
|
|
132
138
|
return [key ? this[key] : ''];
|
|
133
139
|
}
|
|
134
140
|
}
|
|
135
|
-
HideTheme.defaultClasses = {
|
|
136
|
-
xsHide: "max-xs:hidden",
|
|
137
|
-
smHide: "max-sm:hidden",
|
|
138
|
-
mdHide: "max-md:hidden",
|
|
139
|
-
lgHide: "max-lg:hidden",
|
|
140
|
-
xlHide: "max-xl:hidden"
|
|
141
|
-
};
|
|
142
141
|
|
|
143
142
|
class ItemsTheme extends BaseTheme {
|
|
144
143
|
constructor(initialConfig) {
|
|
145
144
|
super();
|
|
146
145
|
ComponentKeys.items.forEach((key) => {
|
|
147
146
|
var _a;
|
|
148
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
147
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
148
|
+
itemsStart: "items-start",
|
|
149
|
+
itemsEnd: "items-end",
|
|
150
|
+
itemsCenter: "items-center",
|
|
151
|
+
itemsBaseline: "items-baseline",
|
|
152
|
+
itemsStretch: "items-stretch",
|
|
153
|
+
}[key];
|
|
149
154
|
});
|
|
150
155
|
}
|
|
151
156
|
getClasses(extractedKeys) {
|
|
@@ -153,20 +158,22 @@ class ItemsTheme extends BaseTheme {
|
|
|
153
158
|
return [pickedKey && this[pickedKey] ? this[pickedKey] : ''];
|
|
154
159
|
}
|
|
155
160
|
}
|
|
156
|
-
ItemsTheme.defaultClasses = {
|
|
157
|
-
itemsStart: "items-start",
|
|
158
|
-
itemsEnd: "items-end",
|
|
159
|
-
itemsCenter: "items-center",
|
|
160
|
-
itemsBaseline: "items-baseline",
|
|
161
|
-
itemsStretch: "items-stretch",
|
|
162
|
-
};
|
|
163
161
|
|
|
164
162
|
class JustifyTheme extends BaseTheme {
|
|
165
163
|
constructor(initialConfig) {
|
|
166
164
|
super();
|
|
167
165
|
ComponentKeys.justify.forEach((key) => {
|
|
168
166
|
var _a;
|
|
169
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
167
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
168
|
+
justifyStart: "justify-start",
|
|
169
|
+
justifyEnd: "justify-end",
|
|
170
|
+
justifyCenter: "justify-center",
|
|
171
|
+
justifyBetween: "justify-between",
|
|
172
|
+
justifyAround: "justify-around",
|
|
173
|
+
justifyEvenly: "justify-evenly",
|
|
174
|
+
justifyStretch: "justify-stretch",
|
|
175
|
+
justifyBaseline: "justify-baseline",
|
|
176
|
+
}[key];
|
|
170
177
|
});
|
|
171
178
|
}
|
|
172
179
|
getClasses(extractedKeys) {
|
|
@@ -174,23 +181,19 @@ class JustifyTheme extends BaseTheme {
|
|
|
174
181
|
return [key ? this[key] : ''];
|
|
175
182
|
}
|
|
176
183
|
}
|
|
177
|
-
JustifyTheme.defaultClasses = {
|
|
178
|
-
justifyStart: "justify-start",
|
|
179
|
-
justifyEnd: "justify-end",
|
|
180
|
-
justifyCenter: "justify-center",
|
|
181
|
-
justifyBetween: "justify-between",
|
|
182
|
-
justifyAround: "justify-around",
|
|
183
|
-
justifyEvenly: "justify-evenly",
|
|
184
|
-
justifyStretch: "justify-stretch",
|
|
185
|
-
justifyBaseline: "justify-baseline",
|
|
186
|
-
};
|
|
187
184
|
|
|
188
185
|
class PositionTheme extends BaseTheme {
|
|
189
186
|
constructor(initialConfig) {
|
|
190
187
|
super();
|
|
191
188
|
ComponentKeys.position.forEach((key) => {
|
|
192
189
|
var _a;
|
|
193
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
190
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
191
|
+
relative: "relative",
|
|
192
|
+
absolute: "absolute",
|
|
193
|
+
fixed: "fixed",
|
|
194
|
+
sticky: "sticky",
|
|
195
|
+
static: "static"
|
|
196
|
+
}[key];
|
|
194
197
|
});
|
|
195
198
|
}
|
|
196
199
|
getClasses(extractedKeys) {
|
|
@@ -198,20 +201,16 @@ class PositionTheme extends BaseTheme {
|
|
|
198
201
|
return [key ? this[key] : ''];
|
|
199
202
|
}
|
|
200
203
|
}
|
|
201
|
-
PositionTheme.defaultClasses = {
|
|
202
|
-
relative: "relative",
|
|
203
|
-
absolute: "absolute",
|
|
204
|
-
fixed: "fixed",
|
|
205
|
-
sticky: "sticky",
|
|
206
|
-
static: "static"
|
|
207
|
-
};
|
|
208
204
|
|
|
209
205
|
class FontStyleTheme extends BaseTheme {
|
|
210
206
|
constructor(initial) {
|
|
211
207
|
super();
|
|
212
208
|
ComponentKeys.fontStyle.forEach((key) => {
|
|
213
209
|
var _a;
|
|
214
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
210
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
211
|
+
italic: "italic",
|
|
212
|
+
notItalic: "not-italic",
|
|
213
|
+
}[key];
|
|
215
214
|
});
|
|
216
215
|
}
|
|
217
216
|
getClasses(extractedKeys) {
|
|
@@ -219,17 +218,17 @@ class FontStyleTheme extends BaseTheme {
|
|
|
219
218
|
return [key ? this[key] : '']; // No default for font style
|
|
220
219
|
}
|
|
221
220
|
}
|
|
222
|
-
FontStyleTheme.defaultClasses = {
|
|
223
|
-
italic: "italic",
|
|
224
|
-
notItalic: "not-italic",
|
|
225
|
-
};
|
|
226
221
|
|
|
227
222
|
class FontFamilyTheme extends BaseTheme {
|
|
228
223
|
constructor(initial) {
|
|
229
224
|
super();
|
|
230
225
|
ComponentKeys.fontFamily.forEach((key) => {
|
|
231
226
|
var _a;
|
|
232
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
227
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
228
|
+
sans: "font-sans",
|
|
229
|
+
serif: "font-serif",
|
|
230
|
+
mono: "font-mono",
|
|
231
|
+
}[key];
|
|
233
232
|
});
|
|
234
233
|
}
|
|
235
234
|
getClasses(extractedKeys) {
|
|
@@ -239,18 +238,23 @@ class FontFamilyTheme extends BaseTheme {
|
|
|
239
238
|
return [this[key]];
|
|
240
239
|
}
|
|
241
240
|
}
|
|
242
|
-
FontFamilyTheme.defaultClasses = {
|
|
243
|
-
sans: "font-sans",
|
|
244
|
-
serif: "font-serif",
|
|
245
|
-
mono: "font-mono",
|
|
246
|
-
};
|
|
247
241
|
|
|
248
242
|
class FontWeightTheme extends BaseTheme {
|
|
249
243
|
constructor(initial) {
|
|
250
244
|
super();
|
|
251
245
|
ComponentKeys.fontWeight.forEach((key) => {
|
|
252
246
|
var _a;
|
|
253
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
247
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
248
|
+
thin: "font-thin",
|
|
249
|
+
extralight: "font-extralight",
|
|
250
|
+
light: "font-light",
|
|
251
|
+
normal: "font-normal",
|
|
252
|
+
medium: "font-medium",
|
|
253
|
+
semibold: "font-semibold",
|
|
254
|
+
bold: "font-bold",
|
|
255
|
+
extrabold: "font-extrabold",
|
|
256
|
+
black: "font-black",
|
|
257
|
+
}[key];
|
|
254
258
|
});
|
|
255
259
|
}
|
|
256
260
|
getClasses(extractedKeys) {
|
|
@@ -260,24 +264,18 @@ class FontWeightTheme extends BaseTheme {
|
|
|
260
264
|
return [this[key]];
|
|
261
265
|
}
|
|
262
266
|
}
|
|
263
|
-
FontWeightTheme.defaultClasses = {
|
|
264
|
-
thin: "font-thin",
|
|
265
|
-
extralight: "font-extralight",
|
|
266
|
-
light: "font-light",
|
|
267
|
-
normal: "font-normal",
|
|
268
|
-
medium: "font-medium",
|
|
269
|
-
semibold: "font-semibold",
|
|
270
|
-
bold: "font-bold",
|
|
271
|
-
extrabold: "font-extrabold",
|
|
272
|
-
black: "font-black",
|
|
273
|
-
};
|
|
274
267
|
|
|
275
268
|
class TextDecorationTheme extends BaseTheme {
|
|
276
269
|
constructor(initial) {
|
|
277
270
|
super();
|
|
278
271
|
ComponentKeys.textDecoration.forEach((key) => {
|
|
279
272
|
var _a;
|
|
280
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
273
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
274
|
+
underline: "underline",
|
|
275
|
+
lineThrough: "line-through",
|
|
276
|
+
noUnderline: "no-underline",
|
|
277
|
+
overline: "overline",
|
|
278
|
+
}[key];
|
|
281
279
|
});
|
|
282
280
|
}
|
|
283
281
|
getClasses(extractedKeys) {
|
|
@@ -285,19 +283,18 @@ class TextDecorationTheme extends BaseTheme {
|
|
|
285
283
|
return [key ? this[key] : '']; // No default for text decoration
|
|
286
284
|
}
|
|
287
285
|
}
|
|
288
|
-
TextDecorationTheme.defaultClasses = {
|
|
289
|
-
underline: "underline",
|
|
290
|
-
lineThrough: "line-through",
|
|
291
|
-
noUnderline: "no-underline",
|
|
292
|
-
overline: "overline",
|
|
293
|
-
};
|
|
294
286
|
|
|
295
287
|
class TextTransformTheme extends BaseTheme {
|
|
296
288
|
constructor(initial) {
|
|
297
289
|
super();
|
|
298
290
|
ComponentKeys.textTransform.forEach((key) => {
|
|
299
291
|
var _a;
|
|
300
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
292
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
293
|
+
uppercase: "uppercase",
|
|
294
|
+
lowercase: "lowercase",
|
|
295
|
+
capitalize: "capitalize",
|
|
296
|
+
normalCase: "normal-case",
|
|
297
|
+
}[key];
|
|
301
298
|
});
|
|
302
299
|
}
|
|
303
300
|
getClasses(extractedKeys) {
|
|
@@ -305,19 +302,18 @@ class TextTransformTheme extends BaseTheme {
|
|
|
305
302
|
return [key ? this[key] : '']; // No default for text transform
|
|
306
303
|
}
|
|
307
304
|
}
|
|
308
|
-
TextTransformTheme.defaultClasses = {
|
|
309
|
-
uppercase: "uppercase",
|
|
310
|
-
lowercase: "lowercase",
|
|
311
|
-
capitalize: "capitalize",
|
|
312
|
-
normalCase: "normal-case",
|
|
313
|
-
};
|
|
314
305
|
|
|
315
306
|
class TextAlignTheme extends BaseTheme {
|
|
316
307
|
constructor(initial) {
|
|
317
308
|
super();
|
|
318
309
|
ComponentKeys.textAlign.forEach((key) => {
|
|
319
310
|
var _a;
|
|
320
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
311
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
312
|
+
textLeft: "text-left",
|
|
313
|
+
textCenter: "text-center",
|
|
314
|
+
textRight: "text-right",
|
|
315
|
+
textJustify: "text-justify",
|
|
316
|
+
}[key];
|
|
321
317
|
});
|
|
322
318
|
}
|
|
323
319
|
getClasses(extractedKeys) {
|
|
@@ -325,19 +321,25 @@ class TextAlignTheme extends BaseTheme {
|
|
|
325
321
|
return [key ? this[key] : '']; // No default for text align
|
|
326
322
|
}
|
|
327
323
|
}
|
|
328
|
-
TextAlignTheme.defaultClasses = {
|
|
329
|
-
textLeft: "text-left",
|
|
330
|
-
textCenter: "text-center",
|
|
331
|
-
textRight: "text-right",
|
|
332
|
-
textJustify: "text-justify",
|
|
333
|
-
};
|
|
334
324
|
|
|
335
325
|
class DisplayTheme extends BaseTheme {
|
|
336
326
|
constructor(initialConfig) {
|
|
337
327
|
super();
|
|
338
328
|
ComponentKeys.display.forEach((key) => {
|
|
339
329
|
var _a;
|
|
340
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
330
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
331
|
+
inline: "inline",
|
|
332
|
+
block: "block",
|
|
333
|
+
inlineBlock: "inline-block",
|
|
334
|
+
flex: "flex",
|
|
335
|
+
inlineFlex: "inline-flex",
|
|
336
|
+
grid: "grid",
|
|
337
|
+
inlineGrid: "inline-grid",
|
|
338
|
+
contents: "contents",
|
|
339
|
+
table: "table",
|
|
340
|
+
tableCell: "table-cell",
|
|
341
|
+
hidden: "hidden"
|
|
342
|
+
}[key];
|
|
341
343
|
});
|
|
342
344
|
}
|
|
343
345
|
getClasses(extractedKeys) {
|
|
@@ -345,19 +347,6 @@ class DisplayTheme extends BaseTheme {
|
|
|
345
347
|
return [key && this[key] ? this[key] : ''];
|
|
346
348
|
}
|
|
347
349
|
}
|
|
348
|
-
DisplayTheme.defaultClasses = {
|
|
349
|
-
inline: "inline",
|
|
350
|
-
block: "block",
|
|
351
|
-
inlineBlock: "inline-block",
|
|
352
|
-
flex: "flex",
|
|
353
|
-
inlineFlex: "inline-flex",
|
|
354
|
-
grid: "grid",
|
|
355
|
-
inlineGrid: "inline-grid",
|
|
356
|
-
contents: "contents",
|
|
357
|
-
table: "table",
|
|
358
|
-
tableCell: "table-cell",
|
|
359
|
-
hidden: "hidden"
|
|
360
|
-
};
|
|
361
350
|
|
|
362
351
|
const CLASS_PART_SEPARATOR = '-';
|
|
363
352
|
const createClassGroupUtils = config => {
|
|
@@ -3075,7 +3064,23 @@ class OverflowTheme extends BaseTheme {
|
|
|
3075
3064
|
super();
|
|
3076
3065
|
ComponentKeys.overflow.forEach((key) => {
|
|
3077
3066
|
var _a;
|
|
3078
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
3067
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
3068
|
+
overflowAuto: 'overflow-auto',
|
|
3069
|
+
overflowHidden: 'overflow-hidden',
|
|
3070
|
+
overflowClip: 'overflow-clip',
|
|
3071
|
+
overflowVisible: 'overflow-visible',
|
|
3072
|
+
overflowScroll: 'overflow-scroll',
|
|
3073
|
+
overflowXAuto: 'overflow-x-auto',
|
|
3074
|
+
overflowYAuto: 'overflow-y-auto',
|
|
3075
|
+
overflowXHidden: 'overflow-x-hidden',
|
|
3076
|
+
overflowYHidden: 'overflow-y-hidden',
|
|
3077
|
+
overflowXClip: 'overflow-x-clip',
|
|
3078
|
+
overflowYClip: 'overflow-y-clip',
|
|
3079
|
+
overflowXVisible: 'overflow-x-visible',
|
|
3080
|
+
overflowYVisible: 'overflow-y-visible',
|
|
3081
|
+
overflowXScroll: 'overflow-x-scroll',
|
|
3082
|
+
overflowYScroll: 'overflow-y-scroll',
|
|
3083
|
+
}[key];
|
|
3079
3084
|
});
|
|
3080
3085
|
}
|
|
3081
3086
|
getClasses(extractedKeys) {
|
|
@@ -3083,23 +3088,6 @@ class OverflowTheme extends BaseTheme {
|
|
|
3083
3088
|
return [key && this[key] ? this[key] : ''];
|
|
3084
3089
|
}
|
|
3085
3090
|
}
|
|
3086
|
-
OverflowTheme.defaultClasses = {
|
|
3087
|
-
overflowAuto: 'overflow-auto',
|
|
3088
|
-
overflowHidden: 'overflow-hidden',
|
|
3089
|
-
overflowClip: 'overflow-clip',
|
|
3090
|
-
overflowVisible: 'overflow-visible',
|
|
3091
|
-
overflowScroll: 'overflow-scroll',
|
|
3092
|
-
overflowXAuto: 'overflow-x-auto',
|
|
3093
|
-
overflowYAuto: 'overflow-y-auto',
|
|
3094
|
-
overflowXHidden: 'overflow-x-hidden',
|
|
3095
|
-
overflowYHidden: 'overflow-y-hidden',
|
|
3096
|
-
overflowXClip: 'overflow-x-clip',
|
|
3097
|
-
overflowYClip: 'overflow-y-clip',
|
|
3098
|
-
overflowXVisible: 'overflow-x-visible',
|
|
3099
|
-
overflowYVisible: 'overflow-y-visible',
|
|
3100
|
-
overflowXScroll: 'overflow-x-scroll',
|
|
3101
|
-
overflowYScroll: 'overflow-y-scroll',
|
|
3102
|
-
};
|
|
3103
3091
|
|
|
3104
3092
|
/**
|
|
3105
3093
|
* Pick the first truthy key from props using a ComponentKeys category name.
|
|
@@ -3239,12 +3227,11 @@ class SizeTheme extends BaseTheme {
|
|
|
3239
3227
|
class GapTheme extends BaseTheme {
|
|
3240
3228
|
constructor(sizeMap) {
|
|
3241
3229
|
super();
|
|
3242
|
-
this.defaultClasses = {
|
|
3243
|
-
xs: 'gap-2', sm: 'gap-3', md: 'gap-4', lg: 'gap-5', xl: 'gap-6'
|
|
3244
|
-
};
|
|
3245
3230
|
ComponentKeys.size.forEach((key) => {
|
|
3246
3231
|
var _a;
|
|
3247
|
-
this[key] = (_a = sizeMap === null || sizeMap === void 0 ? void 0 : sizeMap[key]) !== null && _a !== void 0 ? _a :
|
|
3232
|
+
this[key] = (_a = sizeMap === null || sizeMap === void 0 ? void 0 : sizeMap[key]) !== null && _a !== void 0 ? _a : {
|
|
3233
|
+
xs: 'gap-2', sm: 'gap-3', md: 'gap-4', lg: 'gap-5', xl: 'gap-6'
|
|
3234
|
+
}[key];
|
|
3248
3235
|
});
|
|
3249
3236
|
}
|
|
3250
3237
|
getClasses(extractedKeys) {
|
|
@@ -3313,14 +3300,13 @@ class RadiusTheme extends BaseTheme {
|
|
|
3313
3300
|
class BorderTheme extends BaseTheme {
|
|
3314
3301
|
constructor(initial) {
|
|
3315
3302
|
super();
|
|
3316
|
-
this.defaultClasses = {
|
|
3317
|
-
base: "border",
|
|
3318
|
-
hover: "",
|
|
3319
|
-
active: "",
|
|
3320
|
-
};
|
|
3321
3303
|
ComponentKeys.mode.forEach((key) => {
|
|
3322
3304
|
var _a;
|
|
3323
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
3305
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
3306
|
+
base: "border",
|
|
3307
|
+
hover: "",
|
|
3308
|
+
active: "",
|
|
3309
|
+
}[key];
|
|
3324
3310
|
});
|
|
3325
3311
|
}
|
|
3326
3312
|
getClasses(extractedKeys) {
|
|
@@ -3340,14 +3326,13 @@ class BorderTheme extends BaseTheme {
|
|
|
3340
3326
|
class RingTheme extends BaseTheme {
|
|
3341
3327
|
constructor(initial) {
|
|
3342
3328
|
super();
|
|
3343
|
-
this.defaultClasses = {
|
|
3344
|
-
base: "ring ring-inset",
|
|
3345
|
-
hover: "hover:ring hover:ring-inset",
|
|
3346
|
-
active: "active:ring active:ring-inset",
|
|
3347
|
-
};
|
|
3348
3329
|
ComponentKeys.mode.forEach((key) => {
|
|
3349
3330
|
var _a;
|
|
3350
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
3331
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
3332
|
+
base: "ring ring-inset",
|
|
3333
|
+
hover: "hover:ring hover:ring-inset",
|
|
3334
|
+
active: "active:ring active:ring-inset",
|
|
3335
|
+
}[key];
|
|
3351
3336
|
});
|
|
3352
3337
|
}
|
|
3353
3338
|
getClasses(extractedKeys) {
|
|
@@ -3367,12 +3352,11 @@ class RingTheme extends BaseTheme {
|
|
|
3367
3352
|
class PaddingTheme extends BaseTheme {
|
|
3368
3353
|
constructor(initial) {
|
|
3369
3354
|
super();
|
|
3370
|
-
this.defaultClasses = {
|
|
3371
|
-
xs: "", sm: "", md: "", lg: "", xl: ""
|
|
3372
|
-
};
|
|
3373
3355
|
ComponentKeys.size.forEach((key) => {
|
|
3374
3356
|
var _a;
|
|
3375
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
3357
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
3358
|
+
xs: "", sm: "", md: "", lg: "", xl: ""
|
|
3359
|
+
}[key];
|
|
3376
3360
|
});
|
|
3377
3361
|
}
|
|
3378
3362
|
getClasses(extractedKeys) {
|
|
@@ -3395,13 +3379,12 @@ class PaddingTheme extends BaseTheme {
|
|
|
3395
3379
|
class PxTheme extends PaddingTheme {
|
|
3396
3380
|
constructor(sizeMap) {
|
|
3397
3381
|
super(sizeMap);
|
|
3398
|
-
this.defaultClasses = {
|
|
3399
|
-
xs: "px-2", sm: "px-4", md: "px-6", lg: "px-8", xl: "px-10"
|
|
3400
|
-
};
|
|
3401
3382
|
// Override with PxTheme's default classes if no custom sizeMap provided
|
|
3402
3383
|
if (!sizeMap) {
|
|
3403
3384
|
ComponentKeys.size.forEach((key) => {
|
|
3404
|
-
this[key] =
|
|
3385
|
+
this[key] = {
|
|
3386
|
+
xs: "px-2", sm: "px-4", md: "px-6", lg: "px-8", xl: "px-10"
|
|
3387
|
+
}[key];
|
|
3405
3388
|
});
|
|
3406
3389
|
}
|
|
3407
3390
|
}
|
|
@@ -3410,13 +3393,12 @@ class PxTheme extends PaddingTheme {
|
|
|
3410
3393
|
class PyTheme extends PaddingTheme {
|
|
3411
3394
|
constructor(sizeMap) {
|
|
3412
3395
|
super(sizeMap);
|
|
3413
|
-
this.defaultClasses = {
|
|
3414
|
-
xs: "py-2", sm: "py-4", md: "py-6", lg: "py-8", xl: "py-10"
|
|
3415
|
-
};
|
|
3416
3396
|
// Override with PyTheme's default classes if no custom sizeMap provided
|
|
3417
3397
|
if (!sizeMap) {
|
|
3418
3398
|
ComponentKeys.size.forEach((key) => {
|
|
3419
|
-
this[key] =
|
|
3399
|
+
this[key] = {
|
|
3400
|
+
xs: "py-2", sm: "py-4", md: "py-6", lg: "py-8", xl: "py-10"
|
|
3401
|
+
}[key];
|
|
3420
3402
|
});
|
|
3421
3403
|
}
|
|
3422
3404
|
}
|
|
@@ -3865,16 +3847,6 @@ class GenericVariantTheme extends BaseTheme {
|
|
|
3865
3847
|
})
|
|
3866
3848
|
});
|
|
3867
3849
|
}
|
|
3868
|
-
static createSimpleBgAppearanceTheme() {
|
|
3869
|
-
return new GenericVariantTheme({
|
|
3870
|
-
outline: AppearanceTheme.createTheme({
|
|
3871
|
-
base: backgroundAppearanceClasses,
|
|
3872
|
-
}),
|
|
3873
|
-
filled: AppearanceTheme.createTheme({
|
|
3874
|
-
base: filledBackgroundAppearanceClasses,
|
|
3875
|
-
})
|
|
3876
|
-
});
|
|
3877
|
-
}
|
|
3878
3850
|
static createSimpleUIElementBgAppearanceTheme() {
|
|
3879
3851
|
return new GenericVariantTheme({
|
|
3880
3852
|
outline: AppearanceTheme.createTheme({
|
|
@@ -3922,7 +3894,11 @@ class WrapTheme extends BaseTheme {
|
|
|
3922
3894
|
super();
|
|
3923
3895
|
ComponentKeys.wrap.forEach((key) => {
|
|
3924
3896
|
var _a;
|
|
3925
|
-
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a :
|
|
3897
|
+
this[key] = (_a = initialConfig === null || initialConfig === void 0 ? void 0 : initialConfig[key]) !== null && _a !== void 0 ? _a : {
|
|
3898
|
+
flexWrap: "flex-wrap",
|
|
3899
|
+
flexNoWrap: "flex-nowrap",
|
|
3900
|
+
flexWrapReverse: "flex-wrap-reverse"
|
|
3901
|
+
}[key];
|
|
3926
3902
|
});
|
|
3927
3903
|
}
|
|
3928
3904
|
getClasses(extractedKeys) {
|
|
@@ -3930,17 +3906,17 @@ class WrapTheme extends BaseTheme {
|
|
|
3930
3906
|
return key ? [this[key]] : [];
|
|
3931
3907
|
}
|
|
3932
3908
|
}
|
|
3933
|
-
WrapTheme.defaultClasses = {
|
|
3934
|
-
flexWrap: "flex-wrap",
|
|
3935
|
-
flexNoWrap: "flex-nowrap",
|
|
3936
|
-
flexWrapReverse: "flex-wrap-reverse"
|
|
3937
|
-
};
|
|
3938
3909
|
|
|
3939
3910
|
class DirectionTheme extends BaseTheme {
|
|
3940
3911
|
constructor(initial) {
|
|
3941
3912
|
super();
|
|
3942
3913
|
ComponentKeys.flexDirection.forEach((key) => {
|
|
3943
|
-
this[key] = (initial === null || initial === void 0 ? void 0 : initial[key]) ||
|
|
3914
|
+
this[key] = (initial === null || initial === void 0 ? void 0 : initial[key]) || {
|
|
3915
|
+
row: "flex-row",
|
|
3916
|
+
column: "flex-col",
|
|
3917
|
+
rowReverse: "flex-row-reverse",
|
|
3918
|
+
columnReverse: "flex-col-reverse",
|
|
3919
|
+
}[key];
|
|
3944
3920
|
});
|
|
3945
3921
|
}
|
|
3946
3922
|
getClasses(extractedKeys) {
|
|
@@ -3959,12 +3935,6 @@ class DirectionTheme extends BaseTheme {
|
|
|
3959
3935
|
return direction ? [this[direction]] : [];
|
|
3960
3936
|
}
|
|
3961
3937
|
}
|
|
3962
|
-
DirectionTheme.defaultClasses = {
|
|
3963
|
-
row: "flex-row",
|
|
3964
|
-
column: "flex-col",
|
|
3965
|
-
rowReverse: "flex-row-reverse",
|
|
3966
|
-
columnReverse: "flex-col-reverse",
|
|
3967
|
-
};
|
|
3968
3938
|
|
|
3969
3939
|
/**
|
|
3970
3940
|
* Default props for all components using the existing ThemeDefaults type
|
|
@@ -4369,13 +4339,12 @@ const mergeDefaults = (baseDefaults, overrideDefaults) => {
|
|
|
4369
4339
|
class PlTheme extends PaddingTheme {
|
|
4370
4340
|
constructor(sizeMap) {
|
|
4371
4341
|
super(sizeMap);
|
|
4372
|
-
this.defaultClasses = {
|
|
4373
|
-
xs: "pl-2", sm: "pl-4", md: "pl-6", lg: "pl-8", xl: "pl-10"
|
|
4374
|
-
};
|
|
4375
4342
|
// Override with PlTheme's default classes if no custom sizeMap provided
|
|
4376
4343
|
if (!sizeMap) {
|
|
4377
4344
|
ComponentKeys.size.forEach((key) => {
|
|
4378
|
-
this[key] =
|
|
4345
|
+
this[key] = {
|
|
4346
|
+
xs: "pl-2", sm: "pl-4", md: "pl-6", lg: "pl-8", xl: "pl-10"
|
|
4347
|
+
}[key];
|
|
4379
4348
|
});
|
|
4380
4349
|
}
|
|
4381
4350
|
}
|
|
@@ -4386,16 +4355,12 @@ class ListStyleTheme extends BaseTheme {
|
|
|
4386
4355
|
super();
|
|
4387
4356
|
ComponentKeys.listStyle.forEach((key) => {
|
|
4388
4357
|
var _a;
|
|
4389
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
4358
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
4359
|
+
disc: 'list-disc',
|
|
4360
|
+
decimal: 'list-decimal',
|
|
4361
|
+
}[key];
|
|
4390
4362
|
});
|
|
4391
4363
|
}
|
|
4392
|
-
getDefaultClass(key) {
|
|
4393
|
-
const defaultClasses = {
|
|
4394
|
-
disc: 'list-disc',
|
|
4395
|
-
decimal: 'list-decimal',
|
|
4396
|
-
};
|
|
4397
|
-
return defaultClasses[key];
|
|
4398
|
-
}
|
|
4399
4364
|
getClasses(extractedKeys) {
|
|
4400
4365
|
const listStyle = extractedKeys === null || extractedKeys === void 0 ? void 0 : extractedKeys.listStyle;
|
|
4401
4366
|
if (listStyle !== undefined) {
|
|
@@ -4488,7 +4453,13 @@ class BreakpointTheme extends BaseTheme {
|
|
|
4488
4453
|
super();
|
|
4489
4454
|
ComponentKeys.breakpoint.forEach((key) => {
|
|
4490
4455
|
var _a;
|
|
4491
|
-
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a :
|
|
4456
|
+
this[key] = (_a = initial === null || initial === void 0 ? void 0 : initial[key]) !== null && _a !== void 0 ? _a : {
|
|
4457
|
+
xsCol: "max-xs:flex-col",
|
|
4458
|
+
smCol: "max-sm:flex-col",
|
|
4459
|
+
mdCol: "max-md:flex-col",
|
|
4460
|
+
lgCol: "max-lg:flex-col",
|
|
4461
|
+
xlCol: "max-xl:flex-col"
|
|
4462
|
+
}[key];
|
|
4492
4463
|
});
|
|
4493
4464
|
}
|
|
4494
4465
|
getClasses(extractedKeys) {
|
|
@@ -4498,13 +4469,6 @@ class BreakpointTheme extends BaseTheme {
|
|
|
4498
4469
|
return [this[key] || ''];
|
|
4499
4470
|
}
|
|
4500
4471
|
}
|
|
4501
|
-
BreakpointTheme.defaultClasses = {
|
|
4502
|
-
xsCol: "max-xs:flex-col",
|
|
4503
|
-
smCol: "max-sm:flex-col",
|
|
4504
|
-
mdCol: "max-md:flex-col",
|
|
4505
|
-
lgCol: "max-lg:flex-col",
|
|
4506
|
-
xlCol: "max-xl:flex-col"
|
|
4507
|
-
};
|
|
4508
4472
|
|
|
4509
4473
|
const defaultCardTheme = new ComponentTheme("div", "", {
|
|
4510
4474
|
size: {
|