vunor 0.2.0 → 0.2.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/dist/theme.d.mts +4 -5
- package/dist/theme.mjs +206 -142
- package/package.json +1 -1
package/dist/theme.d.mts
CHANGED
|
@@ -16,7 +16,7 @@ interface TVunorUnoPresetOpts {
|
|
|
16
16
|
regular: number;
|
|
17
17
|
dense: number;
|
|
18
18
|
};
|
|
19
|
-
typography?: Record<TTypographyNames, TTypography
|
|
19
|
+
typography?: Partial<Record<TTypographyNames, TTypography>>;
|
|
20
20
|
layers?: {
|
|
21
21
|
reverseDark?: boolean;
|
|
22
22
|
reverseLight?: boolean;
|
|
@@ -333,6 +333,9 @@ declare const presetVunor: PresetFactory<TVunorTheme, TVunorUnoPresetOpts & {
|
|
|
333
333
|
palette?: TVunorPaletteOptions;
|
|
334
334
|
}>;
|
|
335
335
|
//#endregion
|
|
336
|
+
//#region src/theme/shortcuts/raw.d.ts
|
|
337
|
+
declare const rawVunorShortcuts: TVunorShortcut[];
|
|
338
|
+
//#endregion
|
|
336
339
|
//#region src/theme/utils/shortcut-obj.d.ts
|
|
337
340
|
/**
|
|
338
341
|
* Build uno shortcut from vunor shortcut object
|
|
@@ -354,10 +357,6 @@ declare const componentClasses: Record<string, string[]>;
|
|
|
354
357
|
declare function getComponentClasses(...components: string[]): string[];
|
|
355
358
|
//#endregion
|
|
356
359
|
//#region src/theme.d.ts
|
|
357
|
-
/**
|
|
358
|
-
* Array of raw vunor shortcuts (not merged)
|
|
359
|
-
*/
|
|
360
|
-
declare const rawVunorShortcuts: TVunorShortcut[];
|
|
361
360
|
/**
|
|
362
361
|
* Vunor shortcuts (merged version of rawVunorShortcuts)
|
|
363
362
|
*/
|
package/dist/theme.mjs
CHANGED
|
@@ -232,18 +232,21 @@ const shortcuts = [
|
|
|
232
232
|
];
|
|
233
233
|
//#endregion
|
|
234
234
|
//#region src/theme/shortcuts/btn.ts
|
|
235
|
+
const btnSquare = "size-fingertip px-0";
|
|
236
|
+
const btnRound = "px-fingertip-half rounded-fingertip-half";
|
|
235
237
|
const btn = defineShortcuts({
|
|
236
238
|
"btn": {
|
|
237
239
|
"": "h-fingertip flex items-center justify-center px-$m gap-$xs select-none fw-bold tracking-wide relative",
|
|
238
|
-
"[&.btn-round]:":
|
|
239
|
-
"[&.btn-square]:":
|
|
240
|
+
"[&.btn-round]:": btnRound,
|
|
241
|
+
"[&.btn-square]:": btnSquare,
|
|
240
242
|
"[&.btn-round.btn-square]:": "px-0",
|
|
241
243
|
"disabled:": "opacity-80 cursor-not-allowed",
|
|
242
244
|
"[&>span]:data-[loading]:": "opacity-0 pointer-events-none",
|
|
243
245
|
"[&>div:not(.loading-indicator-wrapper)]:data-[loading]:": "opacity-0 pointer-events-none",
|
|
244
246
|
"[&>.loading-indicator-wrapper]:": "absolute left-0 top-0 right-0 bottom-0 flex items-center justify-center cursor-wait"
|
|
245
247
|
},
|
|
246
|
-
"btn-
|
|
248
|
+
"btn-round": { "": btnRound },
|
|
249
|
+
"btn-square": { "": btnSquare },
|
|
247
250
|
"btn-label": {
|
|
248
251
|
"": "lh-1em ellipsis whitespace-nowrap overflow-x-clip overflow-y-visible",
|
|
249
252
|
"group-[.btn-square]/btn:": "hidden"
|
|
@@ -358,132 +361,137 @@ const disabledSoft = defineShortcuts({ "disabled-soft": {
|
|
|
358
361
|
"data-[disabled]:": disabledPaint
|
|
359
362
|
} });
|
|
360
363
|
//#endregion
|
|
361
|
-
//#region src/theme/shortcuts/
|
|
362
|
-
const
|
|
363
|
-
|
|
364
|
-
"":
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
"":
|
|
371
|
-
|
|
372
|
-
|
|
364
|
+
//#region src/theme/shortcuts/raw.ts
|
|
365
|
+
const rawVunorShortcuts = [
|
|
366
|
+
defineShortcuts({
|
|
367
|
+
"i8": {
|
|
368
|
+
"": "h-fingertip min-w-3em flex items-center select-none relative icon-current content-box disabled-soft",
|
|
369
|
+
"data-[type=textarea]:": "min-h-fingertip h-auto items-start",
|
|
370
|
+
"data-[active=true]:": "icon-current-hl",
|
|
371
|
+
"focus-within:": "icon-current-hl",
|
|
372
|
+
"[&.i8-flat]:": { "": "border-b-width-[var(--i8-border-width,1px)]" },
|
|
373
|
+
"[&.i8-filled]:": {
|
|
374
|
+
"": "i8-apply-bg current-outline-hl i8-apply-border rounded-r1 i8-apply-border",
|
|
375
|
+
"data-[active=true]:": "current-border-hl outline i8-apply-outline",
|
|
376
|
+
"focus-within:": "current-border-hl outline i8-apply-outline"
|
|
377
|
+
},
|
|
378
|
+
"[&.i8-transparent]:": "bg-transparent!",
|
|
379
|
+
"[&.i8-round]:": {
|
|
380
|
+
"": "i8-apply-bg current-outline-hl rounded-fingertip-half i8-apply-border",
|
|
381
|
+
"data-[active=true]:": "current-border-hl outline i8-apply-outline",
|
|
382
|
+
"focus-within:": "current-border-hl outline i8-apply-outline"
|
|
383
|
+
},
|
|
384
|
+
"group-[[data-error=true]]/i8:": { "": "current-border-error-500 current-outline-error-500 border-opacity-100 border-current" }
|
|
373
385
|
},
|
|
374
|
-
"
|
|
375
|
-
|
|
376
|
-
"": "
|
|
377
|
-
"
|
|
378
|
-
"
|
|
386
|
+
"i8-bare": {
|
|
387
|
+
"": "i8-apply-bg i8-apply-border current-outline-hl rounded-r1 outline-none text-current placeholder:text-current/50 disabled-soft",
|
|
388
|
+
"hover:": "border-current-hover",
|
|
389
|
+
"focus:": "current-border-hl outline i8-apply-outline",
|
|
390
|
+
"data-[error=true]:": "current-border-error-500 current-outline-error-500 border-current"
|
|
379
391
|
},
|
|
380
|
-
"
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
"": "i8-apply-bg i8-apply-border current-outline-hl rounded-r1 outline-none text-current placeholder:text-current/50 disabled-soft",
|
|
384
|
-
"hover:": "border-current-hover",
|
|
385
|
-
"focus:": "current-border-hl outline i8-apply-outline",
|
|
386
|
-
"data-[error=true]:": "current-border-error-500 current-outline-error-500 border-current"
|
|
387
|
-
},
|
|
388
|
-
"i8-loading": {
|
|
389
|
-
"": "text-current-icon pl-$m",
|
|
390
|
-
"last:": "pr-$m"
|
|
391
|
-
},
|
|
392
|
-
"i8-icon-wrap": "size-fingertip flex items-center justify-center",
|
|
393
|
-
"i8-underline": {
|
|
394
|
-
"group-[.i8-filled]/i8:": "hidden",
|
|
395
|
-
"": "absolute left-50% h-2px right-50% bottom-[-1px] pointer-events-none transition-all transition-duration-300 will-change-left will-change-right bg-current-hl",
|
|
396
|
-
"group-[[data-active=true]]/i8:": "left-0 right-0"
|
|
397
|
-
},
|
|
398
|
-
"segmented": {
|
|
399
|
-
"": {
|
|
400
|
-
"first-of-type:": "rounded-r-0!",
|
|
401
|
-
"last-of-type:": "rounded-lt-0! rounded-lb-0!",
|
|
402
|
-
"not-last-of-type:not-first-of-type:": "rounded-0!",
|
|
403
|
-
"not-first-of-type:": "border-l-0! border-l-grey-500/20",
|
|
404
|
-
"data-[active=true]:": "z-2"
|
|
392
|
+
"i8-loading": {
|
|
393
|
+
"": "text-current-icon pl-$m",
|
|
394
|
+
"last:": "pr-$m"
|
|
405
395
|
},
|
|
406
|
-
"
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
"
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
"
|
|
423
|
-
"
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
"
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
"
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
"
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
"": "
|
|
466
|
-
"
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
"": "
|
|
474
|
-
"
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
"
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
396
|
+
"i8-icon-wrap": "size-fingertip flex items-center justify-center",
|
|
397
|
+
"i8-underline": {
|
|
398
|
+
"group-[.i8-filled]/i8:": "hidden",
|
|
399
|
+
"": "absolute left-50% h-2px right-50% bottom-[-1px] pointer-events-none transition-all transition-duration-300 will-change-left will-change-right bg-current-hl",
|
|
400
|
+
"group-[[data-active=true]]/i8:": "left-0 right-0"
|
|
401
|
+
},
|
|
402
|
+
"segmented": {
|
|
403
|
+
"": {
|
|
404
|
+
"first-of-type:": "rounded-r-0!",
|
|
405
|
+
"last-of-type:": "rounded-lt-0! rounded-lb-0!",
|
|
406
|
+
"not-last-of-type:not-first-of-type:": "rounded-0!",
|
|
407
|
+
"not-first-of-type:": "border-l-0! border-l-grey-500/20",
|
|
408
|
+
"data-[active=true]:": "z-2"
|
|
409
|
+
},
|
|
410
|
+
"[&.i8-flat]:": { "not-first-of-type:": "ml-$xs" }
|
|
411
|
+
},
|
|
412
|
+
"i8-input-wrapper": { "": "relative w-full h-full" },
|
|
413
|
+
"i8-input": {
|
|
414
|
+
"": "w-full outline-none h-full bg-transparent",
|
|
415
|
+
"group-[.i8-filled]/i8:[&:not([data-has-prepend=true])]:": "pl-$m",
|
|
416
|
+
"group-[.i8-filled]/i8:[&:not([data-has-append=true])]:": "pr-$m",
|
|
417
|
+
"selection:": "bg-scope-color-500 text-white",
|
|
418
|
+
"group-[.i8-round]/i8:[&:not([data-has-prepend=true])]:": "pl-fingertip-half",
|
|
419
|
+
"group-[.i8-round]/i8:[&:not([data-has-append=true])]:": "pr-fingertip-half",
|
|
420
|
+
"group-[[data-has-label]]/i8:": "pt-$m",
|
|
421
|
+
"group-[.segmented.i8-round:not(:first-child)]/i8:[&:not([data-has-prepend=true])]:": "pl-$m",
|
|
422
|
+
"group-[.segmented.i8-round:not(:last-child)]/i8:[&:not([data-has-append=true])]:": "pr-$m"
|
|
423
|
+
},
|
|
424
|
+
"i8-textarea": {
|
|
425
|
+
"": "w-full outline-none h-full bg-transparent text-body",
|
|
426
|
+
"group-[.i8-filled]/i8:[&:not([data-has-prepend=true])]:": "pl-$m",
|
|
427
|
+
"group-[.i8-filled]/i8:[&:not([data-has-append=true])]:": "pr-$m",
|
|
428
|
+
"selection:": "bg-scope-color-500 text-white",
|
|
429
|
+
"group-[.i8-round]/i8:[&:not([data-has-prepend=true])]:": "pl-fingertip-half",
|
|
430
|
+
"group-[.i8-round]/i8:[&:not([data-has-append=true])]:": "pr-fingertip-half",
|
|
431
|
+
"group-[.segmented.i8-round:not(:first-child)]/i8:[&:not([data-has-prepend=true])]:": "pl-$m",
|
|
432
|
+
"group-[.segmented.i8-round:not(:last-child)]/i8:[&:not([data-has-append=true])]:": "pr-$m"
|
|
433
|
+
},
|
|
434
|
+
"i8-ta-wrapper": {
|
|
435
|
+
"": "w-full pt-0.75em",
|
|
436
|
+
"group-[[data-has-label]]/i8:": "mt-$m"
|
|
437
|
+
},
|
|
438
|
+
"i8-label": {
|
|
439
|
+
"": "absolute top-0 h-fingertip text-body text-grey-400 lh-fingertip transition-all transition-duration-300 truncate text-ellipsis overflow-hidden max-w-70%",
|
|
440
|
+
"group-[:focus-within]/i8:": "h-[2em] lh-2em text-label font-size-[0.7em] text-current-hl",
|
|
441
|
+
"group-[[data-active=true]]/i8:": "h-[2em] lh-2em text-label font-size-[0.7em] text-current-hl",
|
|
442
|
+
"group-[[data-has-placeholder]]/i8:": "h-[2em] lh-2em text-label font-size-[0.7em]",
|
|
443
|
+
"group-[[data-has-value]]/i8:": "h-[2em] lh-2em text-label font-size-[0.7em]"
|
|
444
|
+
},
|
|
445
|
+
"i8-label-wrapper": {
|
|
446
|
+
"": "pointer-events-none absolute left-0 right-0 bottom-0 top-0",
|
|
447
|
+
"group-[.i8-filled]/i8:data-[has-prepend=true]": "pl-0",
|
|
448
|
+
"group-[.i8-filled]/i8:data-[has-append=true]": "pr-0",
|
|
449
|
+
"group-[.i8-filled]/i8:": "px-$m",
|
|
450
|
+
"group-[.i8-round]/i8:[&:not([data-has-prepend=true])]:": "pl-fingertip-half",
|
|
451
|
+
"group-[.i8-round]/i8:[&:not([data-has-append=true])]:": "pr-fingertip-half",
|
|
452
|
+
"group-[.segmented.i8-round:not(:first-child)]/i8:[&:not([data-has-prepend=true])]:": "pl-$m",
|
|
453
|
+
"group-[.segmented.i8-round:not(:last-child)]/i8:[&:not([data-has-append=true])]:": "pr-$m"
|
|
454
|
+
},
|
|
455
|
+
"i8-hint": { "": "text-caption pt-$xs text-grey-400 flex-1" },
|
|
456
|
+
"i8-counter": { "": "text-caption pt-$xs text-grey-400" },
|
|
457
|
+
"i8-hint-wrapper": {
|
|
458
|
+
"": "relative flex justify-between",
|
|
459
|
+
"group-[.i8-round]/i8:": "px-fingertip-half",
|
|
460
|
+
"group-[.i8-filled]/i8:": "px-$m"
|
|
461
|
+
},
|
|
462
|
+
"i8-hint-wrapper-stack": { "": "relative flex justify-between" },
|
|
463
|
+
"i8-stack-label": { "": "relative pb-$xxs" },
|
|
464
|
+
"i8-prepend": {
|
|
465
|
+
"": "flex items-center",
|
|
466
|
+
"group-[[data-type=textarea]]/i8:": "my-$m"
|
|
467
|
+
},
|
|
468
|
+
"i8-append": {
|
|
469
|
+
"": "flex items-center",
|
|
470
|
+
"group-[[data-type=textarea]]/i8:": "my-$m"
|
|
471
|
+
},
|
|
472
|
+
"i8-before": {
|
|
473
|
+
"": "h-fingertip flex items-center icon-current",
|
|
474
|
+
"group-[[data-group-active=true]]/i8:": "icon-current-hl"
|
|
475
|
+
},
|
|
476
|
+
"i8-after": {
|
|
477
|
+
"": "h-fingertip flex items-center icon-current",
|
|
478
|
+
"group-[[data-group-active=true]]/i8:": "icon-current-hl"
|
|
479
|
+
},
|
|
480
|
+
"i8-icon-clickable": {
|
|
481
|
+
"[&>.i8-icon-wrap]:": "cursor-pointer",
|
|
482
|
+
"[&>.i8-icon-wrap:hover]:": "current-icon-hl icon-current"
|
|
483
|
+
}
|
|
484
|
+
}),
|
|
485
|
+
c8,
|
|
486
|
+
btn,
|
|
487
|
+
defineShortcuts({
|
|
488
|
+
"menu-root": "flex flex-col overflow-hidden",
|
|
489
|
+
"menu-item": "justify-start c8-flat gap-$m w-full fw-400"
|
|
490
|
+
}),
|
|
491
|
+
popupCard,
|
|
492
|
+
disabledSoft,
|
|
493
|
+
...shortcuts
|
|
494
|
+
];
|
|
487
495
|
//#endregion
|
|
488
496
|
//#region src/theme/utils/shortcut-obj.ts
|
|
489
497
|
/**
|
|
@@ -580,6 +588,9 @@ const componentClasses = {
|
|
|
580
588
|
AppToasts: [
|
|
581
589
|
"[grid-area:_action]",
|
|
582
590
|
"[grid-area:_title]",
|
|
591
|
+
"btn",
|
|
592
|
+
"btn-icon",
|
|
593
|
+
"btn-label",
|
|
583
594
|
"c8-flat",
|
|
584
595
|
"fw-$bold",
|
|
585
596
|
"icon-color",
|
|
@@ -592,18 +603,28 @@ const componentClasses = {
|
|
|
592
603
|
"toasts-viewport"
|
|
593
604
|
],
|
|
594
605
|
Button: [
|
|
606
|
+
"btn",
|
|
607
|
+
"btn-icon",
|
|
608
|
+
"btn-label",
|
|
595
609
|
"icon-color",
|
|
596
610
|
"icon-size",
|
|
597
611
|
"loading-indicator",
|
|
598
612
|
"loading-indicator-ring"
|
|
599
613
|
],
|
|
600
614
|
ButtonBase: [
|
|
615
|
+
"btn",
|
|
616
|
+
"btn-icon",
|
|
617
|
+
"btn-label",
|
|
601
618
|
"icon-color",
|
|
602
619
|
"icon-size",
|
|
603
620
|
"loading-indicator",
|
|
604
621
|
"loading-indicator-ring"
|
|
605
622
|
],
|
|
606
623
|
Calendar: [
|
|
624
|
+
"btn",
|
|
625
|
+
"btn-icon",
|
|
626
|
+
"btn-label",
|
|
627
|
+
"btn-square",
|
|
607
628
|
"c8-flat",
|
|
608
629
|
"calendar-cell",
|
|
609
630
|
"calendar-grid-row",
|
|
@@ -750,6 +771,10 @@ const componentClasses = {
|
|
|
750
771
|
"absolute",
|
|
751
772
|
"blur",
|
|
752
773
|
"bottom-0",
|
|
774
|
+
"btn",
|
|
775
|
+
"btn-icon",
|
|
776
|
+
"btn-label",
|
|
777
|
+
"btn-square",
|
|
753
778
|
"c8-flat",
|
|
754
779
|
"calendar-cell",
|
|
755
780
|
"calendar-grid-row",
|
|
@@ -820,6 +845,10 @@ const componentClasses = {
|
|
|
820
845
|
"absolute",
|
|
821
846
|
"blur",
|
|
822
847
|
"bottom-0",
|
|
848
|
+
"btn",
|
|
849
|
+
"btn-icon",
|
|
850
|
+
"btn-label",
|
|
851
|
+
"btn-square",
|
|
823
852
|
"c8-flat",
|
|
824
853
|
"calendar-cell",
|
|
825
854
|
"calendar-grid-row",
|
|
@@ -877,6 +906,10 @@ const componentClasses = {
|
|
|
877
906
|
"px-0"
|
|
878
907
|
],
|
|
879
908
|
DatePickerPopup: [
|
|
909
|
+
"btn",
|
|
910
|
+
"btn-icon",
|
|
911
|
+
"btn-label",
|
|
912
|
+
"btn-square",
|
|
880
913
|
"c8-flat",
|
|
881
914
|
"calendar-cell",
|
|
882
915
|
"calendar-grid-row",
|
|
@@ -911,6 +944,10 @@ const componentClasses = {
|
|
|
911
944
|
"border-b",
|
|
912
945
|
"border-grey-500/30",
|
|
913
946
|
"border-grey-500/50",
|
|
947
|
+
"btn",
|
|
948
|
+
"btn-icon",
|
|
949
|
+
"btn-label",
|
|
950
|
+
"btn-square",
|
|
914
951
|
"c8-flat",
|
|
915
952
|
"card",
|
|
916
953
|
"checkbox",
|
|
@@ -1018,6 +1055,9 @@ const componentClasses = {
|
|
|
1018
1055
|
],
|
|
1019
1056
|
Dialog: [
|
|
1020
1057
|
"b",
|
|
1058
|
+
"btn",
|
|
1059
|
+
"btn-icon",
|
|
1060
|
+
"btn-label",
|
|
1021
1061
|
"c8-filled",
|
|
1022
1062
|
"c8-flat",
|
|
1023
1063
|
"card",
|
|
@@ -1143,6 +1183,9 @@ const componentClasses = {
|
|
|
1143
1183
|
"b",
|
|
1144
1184
|
"blur",
|
|
1145
1185
|
"bottom-0",
|
|
1186
|
+
"btn",
|
|
1187
|
+
"btn-icon",
|
|
1188
|
+
"btn-label",
|
|
1146
1189
|
"cursor-pointer",
|
|
1147
1190
|
"flex",
|
|
1148
1191
|
"flex-grow",
|
|
@@ -1176,6 +1219,8 @@ const componentClasses = {
|
|
|
1176
1219
|
"loading-indicator-ring",
|
|
1177
1220
|
"max-w-100%",
|
|
1178
1221
|
"mb-$s",
|
|
1222
|
+
"menu-item",
|
|
1223
|
+
"menu-root",
|
|
1179
1224
|
"overflow-hidden",
|
|
1180
1225
|
"overflow-x-hidden",
|
|
1181
1226
|
"overflow-y-auto",
|
|
@@ -1200,14 +1245,21 @@ const componentClasses = {
|
|
|
1200
1245
|
"whitespace-nowrap"
|
|
1201
1246
|
],
|
|
1202
1247
|
MenuItem: [
|
|
1248
|
+
"btn",
|
|
1249
|
+
"btn-icon",
|
|
1250
|
+
"btn-label",
|
|
1203
1251
|
"icon-color",
|
|
1204
1252
|
"icon-size",
|
|
1205
1253
|
"loading-indicator",
|
|
1206
1254
|
"loading-indicator-ring",
|
|
1255
|
+
"menu-item",
|
|
1207
1256
|
"scope-grey"
|
|
1208
1257
|
],
|
|
1209
1258
|
OverflowContainer: ["flex", "whitespace-nowrap"],
|
|
1210
1259
|
Pagination: [
|
|
1260
|
+
"btn",
|
|
1261
|
+
"btn-icon",
|
|
1262
|
+
"btn-square",
|
|
1211
1263
|
"c8-flat",
|
|
1212
1264
|
"flex",
|
|
1213
1265
|
"gap-1",
|
|
@@ -1220,6 +1272,9 @@ const componentClasses = {
|
|
|
1220
1272
|
"size-fingertip"
|
|
1221
1273
|
],
|
|
1222
1274
|
Popover: [
|
|
1275
|
+
"btn",
|
|
1276
|
+
"btn-icon",
|
|
1277
|
+
"btn-label",
|
|
1223
1278
|
"icon-color",
|
|
1224
1279
|
"icon-size",
|
|
1225
1280
|
"loading-indicator",
|
|
@@ -2075,7 +2130,22 @@ const defaultTypography = {
|
|
|
2075
2130
|
"caption": font(400, 600, k$1(-.5), k$1(.5), -.007),
|
|
2076
2131
|
"overline": font(400, 600, k$1(-.5), k$1(.5), .0618)
|
|
2077
2132
|
};
|
|
2078
|
-
|
|
2133
|
+
/**
|
|
2134
|
+
* Builds the UnoCSS `fontSize` theme entry for one typography level.
|
|
2135
|
+
*
|
|
2136
|
+
* Takes the whole {@link TTypography} rather than its numeric fields: this
|
|
2137
|
+
* function owns the shape of the emitted tuple, so fields that carry no
|
|
2138
|
+
* geometry (`font`, `css`) reach the output instead of being dropped at a call
|
|
2139
|
+
* site that can only forward numbers.
|
|
2140
|
+
*/
|
|
2141
|
+
function buildFontTheme(t, defaults) {
|
|
2142
|
+
const size = t.size || 1;
|
|
2143
|
+
const w = t.weight || 400;
|
|
2144
|
+
const wBold = t.boldWeight || 700;
|
|
2145
|
+
const lh = t.height || 1;
|
|
2146
|
+
const ls = t.spacing || 0;
|
|
2147
|
+
const actualFontHeightFactor = t.actualHeightFactor || defaults.actualHeightFactor;
|
|
2148
|
+
const actualFontHeightTopBottomRatio = t.actualHeightTopBottomRatio || defaults.actualHeightTopBottomRatio;
|
|
2079
2149
|
const correctedSize = size * actualFontHeightFactor;
|
|
2080
2150
|
const m = (lh * size - correctedSize) / size;
|
|
2081
2151
|
const half = correctedSize / 2;
|
|
@@ -2096,7 +2166,9 @@ function buildFontTheme(size, w, wBold, lh, ls, actualFontHeightFactor = 1, actu
|
|
|
2096
2166
|
"--font-tc": `${-mt}em`,
|
|
2097
2167
|
"font-weight": w,
|
|
2098
2168
|
"line-height": `${lh}em`,
|
|
2099
|
-
"letter-spacing": `${ls}em
|
|
2169
|
+
"letter-spacing": `${ls}em`,
|
|
2170
|
+
...t.font && { "font-family": t.font },
|
|
2171
|
+
...t.css
|
|
2100
2172
|
}]
|
|
2101
2173
|
};
|
|
2102
2174
|
}
|
|
@@ -2200,8 +2272,12 @@ const themeFactory = (opts) => {
|
|
|
2200
2272
|
"line-height": "var(--card-heading-lh)",
|
|
2201
2273
|
"letter-spacing": "var(--card-heading-ls)"
|
|
2202
2274
|
}] };
|
|
2203
|
-
for (const [name, val] of Object.entries(opts.typography))
|
|
2204
|
-
|
|
2275
|
+
for (const [name, val] of Object.entries(opts.typography)) {
|
|
2276
|
+
if (!val) continue;
|
|
2277
|
+
const ft = buildFontTheme(val, {
|
|
2278
|
+
actualHeightFactor: opts.actualFontHeightFactor,
|
|
2279
|
+
actualHeightTopBottomRatio: opts.actualFontHeightTopBottomRatio
|
|
2280
|
+
});
|
|
2205
2281
|
fontSize[name] = ft.theme;
|
|
2206
2282
|
spacing[name] = `${ft.size}em`;
|
|
2207
2283
|
}
|
|
@@ -2372,18 +2448,6 @@ function getFixedWind() {
|
|
|
2372
2448
|
//#endregion
|
|
2373
2449
|
//#region src/theme.ts
|
|
2374
2450
|
/**
|
|
2375
|
-
* Array of raw vunor shortcuts (not merged)
|
|
2376
|
-
*/
|
|
2377
|
-
const rawVunorShortcuts = [
|
|
2378
|
-
i8,
|
|
2379
|
-
c8,
|
|
2380
|
-
btn,
|
|
2381
|
-
menu,
|
|
2382
|
-
popupCard,
|
|
2383
|
-
disabledSoft,
|
|
2384
|
-
...shortcuts
|
|
2385
|
-
];
|
|
2386
|
-
/**
|
|
2387
2451
|
* Vunor shortcuts (merged version of rawVunorShortcuts)
|
|
2388
2452
|
*/
|
|
2389
2453
|
const mergedVunorShortcuts = mergeVunorShortcuts(rawVunorShortcuts);
|