@unocss/preset-mini 0.22.7 → 0.24.2

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/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @unocss/preset-mini
2
2
 
3
- The minimal preset for [UnoCSS](https://github.com/antfu/unocss).
3
+ The minimal preset for [UnoCSS](https://github.com/unocss/unocss).
4
4
 
5
5
  ## Installation
6
6
 
@@ -82,31 +82,28 @@ const borderColorResolver = (direction) => ([, body], { theme }) => {
82
82
  const data = utilities.parseColor(body, theme);
83
83
  if (!data)
84
84
  return;
85
- const { alpha, opacity, color, rgba } = data;
86
- if (!color)
87
- return;
88
- if (rgba) {
85
+ const { alpha, color, cssColor } = data;
86
+ if (cssColor) {
89
87
  if (alpha != null) {
90
88
  return {
91
- [`border${direction}-color`]: `rgba(${rgba.join(",")})`
89
+ [`border${direction}-color`]: utilities.colorToString(cssColor, alpha)
90
+ };
91
+ }
92
+ if (direction === "") {
93
+ return {
94
+ "--un-border-opacity": cssColor.alpha ?? 1,
95
+ [`border${direction}-color`]: utilities.colorToString(cssColor, `var(--un-border${direction}-opacity)`)
92
96
  };
93
97
  } else {
94
- if (direction === "") {
95
- return {
96
- "--un-border-opacity": (opacity && utilities.handler.cssvar(opacity)) ?? 1,
97
- [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
98
- };
99
- } else {
100
- return {
101
- "--un-border-opacity": (opacity && utilities.handler.cssvar(opacity)) ?? 1,
102
- [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
103
- [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
104
- };
105
- }
98
+ return {
99
+ "--un-border-opacity": cssColor.alpha ?? 1,
100
+ [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
101
+ [`border${direction}-color`]: utilities.colorToString(cssColor, `var(--un-border${direction}-opacity)`)
102
+ };
106
103
  }
107
- } else {
104
+ } else if (color) {
108
105
  return {
109
- [`border${direction}-color`]: color.replace("%alpha", `${alpha || 1}`)
106
+ [`border${direction}-color`]: color.replace("%alpha", `${alpha ?? 1}`)
110
107
  };
111
108
  }
112
109
  };
@@ -155,6 +152,7 @@ const bgColors = [
155
152
  const transitionPropertyGroup = {
156
153
  all: "all",
157
154
  colors: ["color", "background-color", "border-color", "text-decoration-color", "fill", "stroke"].join(","),
155
+ none: "none",
158
156
  opacity: "opacity",
159
157
  shadow: "box-shadow",
160
158
  transform: "transform"
@@ -177,8 +175,6 @@ const transitions = [
177
175
  [/^(?:transition-)?delay-(.+)$/, ([, d]) => ({ "transition-delay": utilities.handler.bracket.cssvar.time(d) })],
178
176
  [/^(?:transition-)?ease(?:-(.+))?$/, ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar(d) })],
179
177
  [/^(?:transition-)?property-(.+)$/, ([, v]) => ({ "transition-property": utilities.handler.global(v) || transitionProperty(v) })],
180
- ["transition-property-none", { "transition-property": "none" }],
181
- ["property-none", { "transition-property": "none" }],
182
178
  ["transition-none", { transition: "none" }]
183
179
  ];
184
180
 
@@ -205,117 +201,6 @@ const flex = [
205
201
  ["flex-nowrap", { "flex-wrap": "nowrap" }]
206
202
  ];
207
203
 
208
- const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
209
- const displays = [
210
- ["inline", { display: "inline" }],
211
- ["block", { display: "block" }],
212
- ["inline-block", { display: "inline-block" }],
213
- ["contents", { display: "contents" }],
214
- ["flow-root", { display: "flow-root" }],
215
- ["list-item", { display: "list-item" }],
216
- ["hidden", { display: "none" }]
217
- ];
218
- const appearances = [
219
- ["visible", { visibility: "visible" }],
220
- ["invisible", { visibility: "hidden" }],
221
- ["backface-visible", { "backface-visibility": "visible" }],
222
- ["backface-hidden", { "backface-visibility": "hidden" }]
223
- ];
224
- const cursors = [
225
- [/^cursor-(.+)$/, ([, c]) => ({ cursor: utilities.handler.bracket.cssvar(c) || c })]
226
- ];
227
- const pointerEvents = [
228
- ["pointer-events-auto", { "pointer-events": "auto" }],
229
- ["pointer-events-none", { "pointer-events": "none" }]
230
- ];
231
- const resizes = [
232
- ["resize-x", { resize: "horizontal" }],
233
- ["resize-y", { resize: "vertical" }],
234
- ["resize", { resize: "both" }],
235
- ["resize-none", { resize: "none" }]
236
- ];
237
- const userSelects = [
238
- ["select-auto", { "user-select": "auto" }],
239
- ["select-all", { "user-select": "all" }],
240
- ["select-text", { "user-select": "text" }],
241
- ["select-none", { "user-select": "none" }]
242
- ];
243
- const whitespaces = [
244
- [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
245
- ];
246
- const contents = [
247
- ["content-empty", { content: '""' }],
248
- ["content-none", { content: '""' }]
249
- ];
250
- const breaks = [
251
- ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
252
- ["break-words", { "overflow-wrap": "break-word" }],
253
- ["break-all", { "word-break": "break-all" }]
254
- ];
255
- const textOverflows = [
256
- ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
257
- ["text-ellipsis", { "text-overflow": "ellipsis" }],
258
- ["text-clip", { "text-overflow": "clip" }]
259
- ];
260
- const textTransforms = [
261
- ["case-upper", { "text-transform": "uppercase" }],
262
- ["case-lower", { "text-transform": "lowercase" }],
263
- ["case-capital", { "text-transform": "capitalize" }],
264
- ["case-normal", { "text-transform": "none" }]
265
- ];
266
- const fontStyles = [
267
- ["italic", { "font-style": "italic" }],
268
- ["not-italic", { "font-style": "normal" }]
269
- ];
270
- const fontSmoothings = [
271
- ["antialiased", {
272
- "-webkit-font-smoothing": "antialiased",
273
- "-moz-osx-font-smoothing": "grayscale",
274
- "font-smoothing": "grayscale"
275
- }],
276
- ["subpixel-antialiased", {
277
- "-webkit-font-smoothing": "auto",
278
- "-moz-osx-font-smoothing": "auto",
279
- "font-smoothing": "auto"
280
- }]
281
- ];
282
-
283
- const shadowBase = {
284
- [core.CONTROL_SHORTCUT_NO_MERGE]: "",
285
- "--un-ring-offset-shadow": "0 0 #0000",
286
- "--un-ring-shadow": "0 0 #0000",
287
- "--un-shadow-inset": varEmpty,
288
- "--un-shadow": "0 0 #0000"
289
- };
290
- const colorableShadows = (shadows, colorVar) => {
291
- const colored = [];
292
- shadows = core.toArray(shadows);
293
- for (let i = 0; i < shadows.length; i++) {
294
- const [size, color] = shadows[i].split(/\s(\S+)$/);
295
- if (color.split("(").length !== color.split(")").length)
296
- return shadows;
297
- colored.push(`${size} var(${colorVar}, ${color})`);
298
- }
299
- return colored;
300
- };
301
- const boxShadows = [
302
- [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
303
- const v = theme.boxShadow?.[d || "DEFAULT"];
304
- if (v) {
305
- return [
306
- shadowBase,
307
- {
308
- "--un-shadow": colorableShadows(v, "--un-shadow-color").join(","),
309
- "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
310
- }
311
- ];
312
- }
313
- }],
314
- [/^shadow-(.+)$/, utilities.colorResolver("--un-shadow-color", "shadow")],
315
- [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": utilities.handler.bracket.percent(opacity) })],
316
- ["shadow-inset", { "--un-shadow-inset": "inset" }]
317
- ];
318
-
319
204
  const weightMap = {
320
205
  thin: "100",
321
206
  extralight: "200",
@@ -371,7 +256,7 @@ const textShadows = [
371
256
  const v = theme.textShadow?.[s || "DEFAULT"];
372
257
  if (v != null) {
373
258
  return {
374
- "--un-text-shadow": colorableShadows(v, "--un-text-shadow-color").join(","),
259
+ "--un-text-shadow": utilities.colorableShadows(v, "--un-text-shadow-color").join(","),
375
260
  "text-shadow": "var(--un-text-shadow)"
376
261
  };
377
262
  }
@@ -540,14 +425,114 @@ const floats = [
540
425
  ["clear-none", { clear: "none" }]
541
426
  ];
542
427
  const zIndexes = [
543
- [/^z-(.+)$/, ([, v]) => ({ "z-index": utilities.handler.bracket.cssvar.number(v) })],
544
- ["z-auto", { "z-index": "auto" }]
428
+ [/^z-(.+)$/, ([, v]) => ({ "z-index": utilities.handler.bracket.cssvar.auto.number(v) })]
545
429
  ];
546
430
  const boxSizing = [
547
431
  ["box-border", { "box-sizing": "border-box" }],
548
432
  ["box-content", { "box-sizing": "content-box" }]
549
433
  ];
550
434
 
435
+ const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
436
+ const displays = [
437
+ ["inline", { display: "inline" }],
438
+ ["block", { display: "block" }],
439
+ ["inline-block", { display: "inline-block" }],
440
+ ["contents", { display: "contents" }],
441
+ ["flow-root", { display: "flow-root" }],
442
+ ["list-item", { display: "list-item" }],
443
+ ["hidden", { display: "none" }],
444
+ [/^display-(.+)$/, ([, c]) => ({ display: utilities.handler.bracket.cssvar(c) || c })]
445
+ ];
446
+ const appearances = [
447
+ ["visible", { visibility: "visible" }],
448
+ ["invisible", { visibility: "hidden" }],
449
+ ["backface-visible", { "backface-visibility": "visible" }],
450
+ ["backface-hidden", { "backface-visibility": "hidden" }]
451
+ ];
452
+ const cursors = [
453
+ [/^cursor-(.+)$/, ([, c]) => ({ cursor: utilities.handler.bracket.cssvar(c) || c })]
454
+ ];
455
+ const pointerEvents = [
456
+ ["pointer-events-auto", { "pointer-events": "auto" }],
457
+ ["pointer-events-none", { "pointer-events": "none" }]
458
+ ];
459
+ const resizes = [
460
+ ["resize-x", { resize: "horizontal" }],
461
+ ["resize-y", { resize: "vertical" }],
462
+ ["resize", { resize: "both" }],
463
+ ["resize-none", { resize: "none" }]
464
+ ];
465
+ const userSelects = [
466
+ ["select-auto", { "user-select": "auto" }],
467
+ ["select-all", { "user-select": "all" }],
468
+ ["select-text", { "user-select": "text" }],
469
+ ["select-none", { "user-select": "none" }]
470
+ ];
471
+ const whitespaces = [
472
+ [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
473
+ ];
474
+ const contents = [
475
+ ["content-empty", { content: '""' }],
476
+ ["content-none", { content: '""' }]
477
+ ];
478
+ const breaks = [
479
+ ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
480
+ ["break-words", { "overflow-wrap": "break-word" }],
481
+ ["break-all", { "word-break": "break-all" }]
482
+ ];
483
+ const textOverflows = [
484
+ ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
485
+ ["text-ellipsis", { "text-overflow": "ellipsis" }],
486
+ ["text-clip", { "text-overflow": "clip" }]
487
+ ];
488
+ const textTransforms = [
489
+ ["case-upper", { "text-transform": "uppercase" }],
490
+ ["case-lower", { "text-transform": "lowercase" }],
491
+ ["case-capital", { "text-transform": "capitalize" }],
492
+ ["case-normal", { "text-transform": "none" }]
493
+ ];
494
+ const fontStyles = [
495
+ ["italic", { "font-style": "italic" }],
496
+ ["not-italic", { "font-style": "normal" }]
497
+ ];
498
+ const fontSmoothings = [
499
+ ["antialiased", {
500
+ "-webkit-font-smoothing": "antialiased",
501
+ "-moz-osx-font-smoothing": "grayscale",
502
+ "font-smoothing": "grayscale"
503
+ }],
504
+ ["subpixel-antialiased", {
505
+ "-webkit-font-smoothing": "auto",
506
+ "-moz-osx-font-smoothing": "auto",
507
+ "font-smoothing": "auto"
508
+ }]
509
+ ];
510
+
511
+ const shadowBase = {
512
+ [core.CONTROL_SHORTCUT_NO_MERGE]: "",
513
+ "--un-ring-offset-shadow": "0 0 #0000",
514
+ "--un-ring-shadow": "0 0 #0000",
515
+ "--un-shadow-inset": varEmpty,
516
+ "--un-shadow": "0 0 #0000"
517
+ };
518
+ const boxShadows = [
519
+ [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
520
+ const v = theme.boxShadow?.[d || "DEFAULT"];
521
+ if (v) {
522
+ return [
523
+ shadowBase,
524
+ {
525
+ "--un-shadow": utilities.colorableShadows(v, "--un-shadow-color").join(","),
526
+ "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
527
+ }
528
+ ];
529
+ }
530
+ }],
531
+ [/^shadow-(.+)$/, utilities.colorResolver("--un-shadow-color", "shadow")],
532
+ [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": utilities.handler.bracket.percent(opacity) })],
533
+ ["shadow-inset", { "--un-shadow-inset": "inset" }]
534
+ ];
535
+
551
536
  const ringBase = {
552
537
  ...shadowBase,
553
538
  "--un-ring-inset": varEmpty,
@@ -823,11 +808,7 @@ ${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
823
808
  ];
824
809
 
825
810
  const textDecorations = [
826
- ["underline", { "text-decoration-line": "underline" }],
827
- ["overline", { "text-decoration-line": "overline" }],
828
- ["line-through", { "text-decoration-line": "line-through" }],
829
- ["decoration-underline", { "text-decoration-line": "underline" }],
830
- ["decoration-line-through", { "text-decoration-line": "line-through" }],
811
+ [/^(?:decoration-)?(underline|overline|line-through)$/, ([, s]) => ({ "text-decoration-line": s })],
831
812
  [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s]) => ({ "text-decoration-thickness": utilities.handler.bracket.cssvar.px(s) })],
832
813
  [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s })],
833
814
  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
@@ -932,7 +913,6 @@ exports.borders = borders;
932
913
  exports.boxShadows = boxShadows;
933
914
  exports.boxSizing = boxSizing;
934
915
  exports.breaks = breaks;
935
- exports.colorableShadows = colorableShadows;
936
916
  exports.contents = contents;
937
917
  exports.cssProperty = cssProperty;
938
918
  exports.cssVariables = cssVariables;
@@ -1,5 +1,5 @@
1
- import { h as handler, c as colorResolver, d as directionMap, p as parseColor, a as cornerMap, i as insetMap, b as directionSize, e as positionMap, x as xyzMap } from './utilities.mjs';
2
- import { CONTROL_SHORTCUT_NO_MERGE, toArray } from '@unocss/core';
1
+ import { h as handler, c as colorResolver, d as directionMap, p as parseColor, a as colorToString, b as cornerMap, e as colorableShadows, i as insetMap, f as directionSize, g as positionMap, x as xyzMap } from './utilities.mjs';
2
+ import { toArray, CONTROL_SHORTCUT_NO_MERGE } from '@unocss/core';
3
3
 
4
4
  const verticalAlignAlias = {
5
5
  mid: "middle",
@@ -80,31 +80,28 @@ const borderColorResolver = (direction) => ([, body], { theme }) => {
80
80
  const data = parseColor(body, theme);
81
81
  if (!data)
82
82
  return;
83
- const { alpha, opacity, color, rgba } = data;
84
- if (!color)
85
- return;
86
- if (rgba) {
83
+ const { alpha, color, cssColor } = data;
84
+ if (cssColor) {
87
85
  if (alpha != null) {
88
86
  return {
89
- [`border${direction}-color`]: `rgba(${rgba.join(",")})`
87
+ [`border${direction}-color`]: colorToString(cssColor, alpha)
88
+ };
89
+ }
90
+ if (direction === "") {
91
+ return {
92
+ "--un-border-opacity": cssColor.alpha ?? 1,
93
+ [`border${direction}-color`]: colorToString(cssColor, `var(--un-border${direction}-opacity)`)
90
94
  };
91
95
  } else {
92
- if (direction === "") {
93
- return {
94
- "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
95
- [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
96
- };
97
- } else {
98
- return {
99
- "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
100
- [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
101
- [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
102
- };
103
- }
96
+ return {
97
+ "--un-border-opacity": cssColor.alpha ?? 1,
98
+ [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
99
+ [`border${direction}-color`]: colorToString(cssColor, `var(--un-border${direction}-opacity)`)
100
+ };
104
101
  }
105
- } else {
102
+ } else if (color) {
106
103
  return {
107
- [`border${direction}-color`]: color.replace("%alpha", `${alpha || 1}`)
104
+ [`border${direction}-color`]: color.replace("%alpha", `${alpha ?? 1}`)
108
105
  };
109
106
  }
110
107
  };
@@ -153,6 +150,7 @@ const bgColors = [
153
150
  const transitionPropertyGroup = {
154
151
  all: "all",
155
152
  colors: ["color", "background-color", "border-color", "text-decoration-color", "fill", "stroke"].join(","),
153
+ none: "none",
156
154
  opacity: "opacity",
157
155
  shadow: "box-shadow",
158
156
  transform: "transform"
@@ -175,8 +173,6 @@ const transitions = [
175
173
  [/^(?:transition-)?delay-(.+)$/, ([, d]) => ({ "transition-delay": handler.bracket.cssvar.time(d) })],
176
174
  [/^(?:transition-)?ease(?:-(.+))?$/, ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? handler.bracket.cssvar(d) })],
177
175
  [/^(?:transition-)?property-(.+)$/, ([, v]) => ({ "transition-property": handler.global(v) || transitionProperty(v) })],
178
- ["transition-property-none", { "transition-property": "none" }],
179
- ["property-none", { "transition-property": "none" }],
180
176
  ["transition-none", { transition: "none" }]
181
177
  ];
182
178
 
@@ -203,117 +199,6 @@ const flex = [
203
199
  ["flex-nowrap", { "flex-wrap": "nowrap" }]
204
200
  ];
205
201
 
206
- const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
207
- const displays = [
208
- ["inline", { display: "inline" }],
209
- ["block", { display: "block" }],
210
- ["inline-block", { display: "inline-block" }],
211
- ["contents", { display: "contents" }],
212
- ["flow-root", { display: "flow-root" }],
213
- ["list-item", { display: "list-item" }],
214
- ["hidden", { display: "none" }]
215
- ];
216
- const appearances = [
217
- ["visible", { visibility: "visible" }],
218
- ["invisible", { visibility: "hidden" }],
219
- ["backface-visible", { "backface-visibility": "visible" }],
220
- ["backface-hidden", { "backface-visibility": "hidden" }]
221
- ];
222
- const cursors = [
223
- [/^cursor-(.+)$/, ([, c]) => ({ cursor: handler.bracket.cssvar(c) || c })]
224
- ];
225
- const pointerEvents = [
226
- ["pointer-events-auto", { "pointer-events": "auto" }],
227
- ["pointer-events-none", { "pointer-events": "none" }]
228
- ];
229
- const resizes = [
230
- ["resize-x", { resize: "horizontal" }],
231
- ["resize-y", { resize: "vertical" }],
232
- ["resize", { resize: "both" }],
233
- ["resize-none", { resize: "none" }]
234
- ];
235
- const userSelects = [
236
- ["select-auto", { "user-select": "auto" }],
237
- ["select-all", { "user-select": "all" }],
238
- ["select-text", { "user-select": "text" }],
239
- ["select-none", { "user-select": "none" }]
240
- ];
241
- const whitespaces = [
242
- [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
243
- ];
244
- const contents = [
245
- ["content-empty", { content: '""' }],
246
- ["content-none", { content: '""' }]
247
- ];
248
- const breaks = [
249
- ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
250
- ["break-words", { "overflow-wrap": "break-word" }],
251
- ["break-all", { "word-break": "break-all" }]
252
- ];
253
- const textOverflows = [
254
- ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
255
- ["text-ellipsis", { "text-overflow": "ellipsis" }],
256
- ["text-clip", { "text-overflow": "clip" }]
257
- ];
258
- const textTransforms = [
259
- ["case-upper", { "text-transform": "uppercase" }],
260
- ["case-lower", { "text-transform": "lowercase" }],
261
- ["case-capital", { "text-transform": "capitalize" }],
262
- ["case-normal", { "text-transform": "none" }]
263
- ];
264
- const fontStyles = [
265
- ["italic", { "font-style": "italic" }],
266
- ["not-italic", { "font-style": "normal" }]
267
- ];
268
- const fontSmoothings = [
269
- ["antialiased", {
270
- "-webkit-font-smoothing": "antialiased",
271
- "-moz-osx-font-smoothing": "grayscale",
272
- "font-smoothing": "grayscale"
273
- }],
274
- ["subpixel-antialiased", {
275
- "-webkit-font-smoothing": "auto",
276
- "-moz-osx-font-smoothing": "auto",
277
- "font-smoothing": "auto"
278
- }]
279
- ];
280
-
281
- const shadowBase = {
282
- [CONTROL_SHORTCUT_NO_MERGE]: "",
283
- "--un-ring-offset-shadow": "0 0 #0000",
284
- "--un-ring-shadow": "0 0 #0000",
285
- "--un-shadow-inset": varEmpty,
286
- "--un-shadow": "0 0 #0000"
287
- };
288
- const colorableShadows = (shadows, colorVar) => {
289
- const colored = [];
290
- shadows = toArray(shadows);
291
- for (let i = 0; i < shadows.length; i++) {
292
- const [size, color] = shadows[i].split(/\s(\S+)$/);
293
- if (color.split("(").length !== color.split(")").length)
294
- return shadows;
295
- colored.push(`${size} var(${colorVar}, ${color})`);
296
- }
297
- return colored;
298
- };
299
- const boxShadows = [
300
- [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
301
- const v = theme.boxShadow?.[d || "DEFAULT"];
302
- if (v) {
303
- return [
304
- shadowBase,
305
- {
306
- "--un-shadow": colorableShadows(v, "--un-shadow-color").join(","),
307
- "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
308
- }
309
- ];
310
- }
311
- }],
312
- [/^shadow-(.+)$/, colorResolver("--un-shadow-color", "shadow")],
313
- [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": handler.bracket.percent(opacity) })],
314
- ["shadow-inset", { "--un-shadow-inset": "inset" }]
315
- ];
316
-
317
202
  const weightMap = {
318
203
  thin: "100",
319
204
  extralight: "200",
@@ -538,14 +423,114 @@ const floats = [
538
423
  ["clear-none", { clear: "none" }]
539
424
  ];
540
425
  const zIndexes = [
541
- [/^z-(.+)$/, ([, v]) => ({ "z-index": handler.bracket.cssvar.number(v) })],
542
- ["z-auto", { "z-index": "auto" }]
426
+ [/^z-(.+)$/, ([, v]) => ({ "z-index": handler.bracket.cssvar.auto.number(v) })]
543
427
  ];
544
428
  const boxSizing = [
545
429
  ["box-border", { "box-sizing": "border-box" }],
546
430
  ["box-content", { "box-sizing": "content-box" }]
547
431
  ];
548
432
 
433
+ const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
434
+ const displays = [
435
+ ["inline", { display: "inline" }],
436
+ ["block", { display: "block" }],
437
+ ["inline-block", { display: "inline-block" }],
438
+ ["contents", { display: "contents" }],
439
+ ["flow-root", { display: "flow-root" }],
440
+ ["list-item", { display: "list-item" }],
441
+ ["hidden", { display: "none" }],
442
+ [/^display-(.+)$/, ([, c]) => ({ display: handler.bracket.cssvar(c) || c })]
443
+ ];
444
+ const appearances = [
445
+ ["visible", { visibility: "visible" }],
446
+ ["invisible", { visibility: "hidden" }],
447
+ ["backface-visible", { "backface-visibility": "visible" }],
448
+ ["backface-hidden", { "backface-visibility": "hidden" }]
449
+ ];
450
+ const cursors = [
451
+ [/^cursor-(.+)$/, ([, c]) => ({ cursor: handler.bracket.cssvar(c) || c })]
452
+ ];
453
+ const pointerEvents = [
454
+ ["pointer-events-auto", { "pointer-events": "auto" }],
455
+ ["pointer-events-none", { "pointer-events": "none" }]
456
+ ];
457
+ const resizes = [
458
+ ["resize-x", { resize: "horizontal" }],
459
+ ["resize-y", { resize: "vertical" }],
460
+ ["resize", { resize: "both" }],
461
+ ["resize-none", { resize: "none" }]
462
+ ];
463
+ const userSelects = [
464
+ ["select-auto", { "user-select": "auto" }],
465
+ ["select-all", { "user-select": "all" }],
466
+ ["select-text", { "user-select": "text" }],
467
+ ["select-none", { "user-select": "none" }]
468
+ ];
469
+ const whitespaces = [
470
+ [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
471
+ ];
472
+ const contents = [
473
+ ["content-empty", { content: '""' }],
474
+ ["content-none", { content: '""' }]
475
+ ];
476
+ const breaks = [
477
+ ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
478
+ ["break-words", { "overflow-wrap": "break-word" }],
479
+ ["break-all", { "word-break": "break-all" }]
480
+ ];
481
+ const textOverflows = [
482
+ ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
483
+ ["text-ellipsis", { "text-overflow": "ellipsis" }],
484
+ ["text-clip", { "text-overflow": "clip" }]
485
+ ];
486
+ const textTransforms = [
487
+ ["case-upper", { "text-transform": "uppercase" }],
488
+ ["case-lower", { "text-transform": "lowercase" }],
489
+ ["case-capital", { "text-transform": "capitalize" }],
490
+ ["case-normal", { "text-transform": "none" }]
491
+ ];
492
+ const fontStyles = [
493
+ ["italic", { "font-style": "italic" }],
494
+ ["not-italic", { "font-style": "normal" }]
495
+ ];
496
+ const fontSmoothings = [
497
+ ["antialiased", {
498
+ "-webkit-font-smoothing": "antialiased",
499
+ "-moz-osx-font-smoothing": "grayscale",
500
+ "font-smoothing": "grayscale"
501
+ }],
502
+ ["subpixel-antialiased", {
503
+ "-webkit-font-smoothing": "auto",
504
+ "-moz-osx-font-smoothing": "auto",
505
+ "font-smoothing": "auto"
506
+ }]
507
+ ];
508
+
509
+ const shadowBase = {
510
+ [CONTROL_SHORTCUT_NO_MERGE]: "",
511
+ "--un-ring-offset-shadow": "0 0 #0000",
512
+ "--un-ring-shadow": "0 0 #0000",
513
+ "--un-shadow-inset": varEmpty,
514
+ "--un-shadow": "0 0 #0000"
515
+ };
516
+ const boxShadows = [
517
+ [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
518
+ const v = theme.boxShadow?.[d || "DEFAULT"];
519
+ if (v) {
520
+ return [
521
+ shadowBase,
522
+ {
523
+ "--un-shadow": colorableShadows(v, "--un-shadow-color").join(","),
524
+ "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
525
+ }
526
+ ];
527
+ }
528
+ }],
529
+ [/^shadow-(.+)$/, colorResolver("--un-shadow-color", "shadow")],
530
+ [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": handler.bracket.percent(opacity) })],
531
+ ["shadow-inset", { "--un-shadow-inset": "inset" }]
532
+ ];
533
+
549
534
  const ringBase = {
550
535
  ...shadowBase,
551
536
  "--un-ring-inset": varEmpty,
@@ -821,11 +806,7 @@ ${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
821
806
  ];
822
807
 
823
808
  const textDecorations = [
824
- ["underline", { "text-decoration-line": "underline" }],
825
- ["overline", { "text-decoration-line": "overline" }],
826
- ["line-through", { "text-decoration-line": "line-through" }],
827
- ["decoration-underline", { "text-decoration-line": "underline" }],
828
- ["decoration-line-through", { "text-decoration-line": "line-through" }],
809
+ [/^(?:decoration-)?(underline|overline|line-through)$/, ([, s]) => ({ "text-decoration-line": s })],
829
810
  [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s]) => ({ "text-decoration-thickness": handler.bracket.cssvar.px(s) })],
830
811
  [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s })],
831
812
  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
@@ -921,4 +902,4 @@ const rules = [
921
902
  questionMark
922
903
  ].flat(1);
923
904
 
924
- export { textShadows as $, colorableShadows as A, boxShadows as B, sizes as C, aspectRatio as D, paddings as E, margins as F, varEmpty as G, displays as H, appearances as I, cursors as J, pointerEvents as K, resizes as L, userSelects as M, whitespaces as N, contents as O, breaks as P, textOverflows as Q, textTransforms as R, fontStyles as S, fontSmoothings as T, svgUtilities as U, transforms as V, transitions as W, fonts as X, tabSizes as Y, textIndents as Z, textStrokes as _, appearance as a, cssVariables as a0, cssProperty as a1, textDecorations as a2, borders as b, opacity as c, textColors as d, bgColors as e, flex as f, gaps as g, grids as h, overflows as i, justifies as j, orders as k, alignments as l, placements as m, insets as n, outline as o, positions as p, floats as q, rules as r, boxSizing as s, textAligns as t, questionMark as u, verticalAligns as v, willChange as w, rings as x, shadowBase as y, zIndexes as z };
905
+ export { cssVariables as $, boxShadows as A, sizes as B, aspectRatio as C, paddings as D, margins as E, varEmpty as F, displays as G, appearances as H, cursors as I, pointerEvents as J, resizes as K, userSelects as L, whitespaces as M, contents as N, breaks as O, textOverflows as P, textTransforms as Q, fontStyles as R, fontSmoothings as S, svgUtilities as T, transforms as U, transitions as V, fonts as W, tabSizes as X, textIndents as Y, textStrokes as Z, textShadows as _, appearance as a, cssProperty as a0, textDecorations as a1, borders as b, opacity as c, textColors as d, bgColors as e, flex as f, gaps as g, grids as h, overflows as i, justifies as j, orders as k, alignments as l, placements as m, insets as n, outline as o, positions as p, floats as q, rules as r, boxSizing as s, textAligns as t, questionMark as u, verticalAligns as v, willChange as w, rings as x, shadowBase as y, zIndexes as z };