@unocss/preset-mini 0.23.0 → 0.24.3

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
 
@@ -103,6 +103,7 @@ const breakpoints = {
103
103
  "xl": "1280px",
104
104
  "2xl": "1536px"
105
105
  };
106
+ const verticalBreakpoints = { ...breakpoints };
106
107
  const borderRadius = {
107
108
  "DEFAULT": "0.25rem",
108
109
  "none": "0px",
@@ -204,6 +205,7 @@ const theme = {
204
205
  fontFamily,
205
206
  fontSize,
206
207
  breakpoints,
208
+ verticalBreakpoints,
207
209
  borderRadius,
208
210
  lineHeight,
209
211
  letterSpacing,
@@ -235,5 +237,6 @@ exports.textIndent = textIndent;
235
237
  exports.textShadow = textShadow;
236
238
  exports.textStrokeWidth = textStrokeWidth;
237
239
  exports.theme = theme;
240
+ exports.verticalBreakpoints = verticalBreakpoints;
238
241
  exports.width = width;
239
242
  exports.wordSpacing = wordSpacing;
@@ -101,6 +101,7 @@ const breakpoints = {
101
101
  "xl": "1280px",
102
102
  "2xl": "1536px"
103
103
  };
104
+ const verticalBreakpoints = { ...breakpoints };
104
105
  const borderRadius = {
105
106
  "DEFAULT": "0.25rem",
106
107
  "none": "0px",
@@ -202,6 +203,7 @@ const theme = {
202
203
  fontFamily,
203
204
  fontSize,
204
205
  breakpoints,
206
+ verticalBreakpoints,
205
207
  borderRadius,
206
208
  lineHeight,
207
209
  letterSpacing,
@@ -215,4 +217,4 @@ const theme = {
215
217
  easing
216
218
  };
217
219
 
218
- export { fontSize as a, blur as b, textIndent as c, dropShadow as d, textStrokeWidth as e, fontFamily as f, textShadow as g, letterSpacing as h, breakpoints as i, borderRadius as j, boxShadow as k, lineHeight as l, easing as m, baseSize as n, width as o, maxWidth as p, height as q, maxHeight as r, theme as t, wordSpacing as w };
220
+ export { fontSize as a, blur as b, textIndent as c, dropShadow as d, textStrokeWidth as e, fontFamily as f, textShadow as g, letterSpacing as h, breakpoints as i, borderRadius as j, boxShadow as k, lineHeight as l, easing as m, baseSize as n, width as o, maxWidth as p, height as q, maxHeight as r, theme as t, verticalBreakpoints as v, wordSpacing as w };
@@ -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
  };
@@ -204,118 +201,6 @@ const flex = [
204
201
  ["flex-nowrap", { "flex-wrap": "nowrap" }]
205
202
  ];
206
203
 
207
- const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
208
- const displays = [
209
- ["inline", { display: "inline" }],
210
- ["block", { display: "block" }],
211
- ["inline-block", { display: "inline-block" }],
212
- ["contents", { display: "contents" }],
213
- ["flow-root", { display: "flow-root" }],
214
- ["list-item", { display: "list-item" }],
215
- ["hidden", { display: "none" }],
216
- [/^display-(.+)$/, ([, c]) => ({ display: utilities.handler.bracket.cssvar(c) || c })]
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
  }
@@ -547,6 +432,107 @@ const boxSizing = [
547
432
  ["box-content", { "box-sizing": "content-box" }]
548
433
  ];
549
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
+
550
536
  const ringBase = {
551
537
  ...shadowBase,
552
538
  "--un-ring-inset": varEmpty,
@@ -605,6 +591,7 @@ function getSizeValue(minmax, hw, theme, prop) {
605
591
  const sizes = [
606
592
  [/^(min-|max-)?([wh])-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
607
593
  [/^(min-|max-)?(block|inline)-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
594
+ [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] })],
608
595
  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] })]
609
596
  ];
610
597
  function getAspectRatio(prop) {
@@ -927,7 +914,6 @@ exports.borders = borders;
927
914
  exports.boxShadows = boxShadows;
928
915
  exports.boxSizing = boxSizing;
929
916
  exports.breaks = breaks;
930
- exports.colorableShadows = colorableShadows;
931
917
  exports.contents = contents;
932
918
  exports.cssProperty = cssProperty;
933
919
  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
  };
@@ -202,118 +199,6 @@ const flex = [
202
199
  ["flex-nowrap", { "flex-wrap": "nowrap" }]
203
200
  ];
204
201
 
205
- const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
206
- const displays = [
207
- ["inline", { display: "inline" }],
208
- ["block", { display: "block" }],
209
- ["inline-block", { display: "inline-block" }],
210
- ["contents", { display: "contents" }],
211
- ["flow-root", { display: "flow-root" }],
212
- ["list-item", { display: "list-item" }],
213
- ["hidden", { display: "none" }],
214
- [/^display-(.+)$/, ([, c]) => ({ display: handler.bracket.cssvar(c) || c })]
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",
@@ -545,6 +430,107 @@ const boxSizing = [
545
430
  ["box-content", { "box-sizing": "content-box" }]
546
431
  ];
547
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
+
548
534
  const ringBase = {
549
535
  ...shadowBase,
550
536
  "--un-ring-inset": varEmpty,
@@ -603,6 +589,7 @@ function getSizeValue(minmax, hw, theme, prop) {
603
589
  const sizes = [
604
590
  [/^(min-|max-)?([wh])-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
605
591
  [/^(min-|max-)?(block|inline)-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
592
+ [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] })],
606
593
  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] })]
607
594
  ];
608
595
  function getAspectRatio(prop) {
@@ -916,4 +903,4 @@ const rules = [
916
903
  questionMark
917
904
  ].flat(1);
918
905
 
919
- 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 };
906
+ 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 };