@una-ui/preset 0.58.0 → 0.60.0

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/index.mjs CHANGED
@@ -3,7 +3,7 @@ import { colors } from '@unocss/preset-mini/colors';
3
3
  import { fonts } from '@unocss/preset-mini/rules';
4
4
  import { handler, parseColor } from '@unocss/preset-mini/utils';
5
5
  import { mergeDeep } from 'unocss';
6
- import { s as shortcuts } from './shared/preset.BHGEskTu.mjs';
6
+ import { s as shortcuts } from './shared/preset.ByWFih15.mjs';
7
7
 
8
8
  function presetUna(options = {
9
9
  // TODO: add options
@@ -12,6 +12,7 @@ function presetUna(options = {
12
12
  name: "@una-ui/preset",
13
13
  options,
14
14
  shortcuts,
15
+ separators: [":"],
15
16
  theme: mergeDeep(theme, {
16
17
  container: {
17
18
  center: true,
package/dist/prefixes.mjs CHANGED
@@ -88,6 +88,10 @@ const prefixes = [
88
88
  "form-item",
89
89
  "form-label",
90
90
  "form-message",
91
+ "hover-card",
92
+ "hover-card-arrow",
93
+ "hover-card-content",
94
+ "hover-card-trigger",
91
95
  "icon",
92
96
  "indicator",
93
97
  "input",
@@ -103,6 +107,11 @@ const prefixes = [
103
107
  "navigation-menu-list",
104
108
  "navigation-menu-trigger",
105
109
  "navigation-menu-viewport",
110
+ "number-field",
111
+ "number-field-content",
112
+ "number-field-decrement",
113
+ "number-field-increment",
114
+ "number-field-input",
106
115
  "pagination",
107
116
  "pagination-ellipsis",
108
117
  "pagination-selected",
@@ -520,6 +520,8 @@ const staticGeneral = {
520
520
  "bg-accent-foreground": "bg-$c-accent-foreground",
521
521
  "bg-popover": "bg-$c-popover",
522
522
  "bg-popover-foreground": "bg-$c-popover-foreground",
523
+ "fill-base": "fill-$c-background",
524
+ "stroke-base": "stroke-$c-border",
523
525
  // transition
524
526
  "transition-base": "transition-all duration-100 ease-out",
525
527
  // overrides
@@ -535,6 +537,27 @@ const general = [
535
537
  staticIcons
536
538
  ];
537
539
 
540
+ const staticHoverCard = {
541
+ // configurations
542
+ "hover-card": "",
543
+ "hover-card-default-variant": "outline-gray",
544
+ // components
545
+ "hover-card-trigger": "",
546
+ "hover-card-content": "bg-base text-popover animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 rounded-md border p-4 shadow-md outline-hidden",
547
+ "hover-card-arrow": "!bg-transparent !border-none -mt-1px fill-base stroke-base",
548
+ // static variants
549
+ "hover-card-soft-gray": "bg-muted border border-base",
550
+ "hover-card-outline-gray": "bg-base border border-base"
551
+ };
552
+ const dynamicHoverCard = [
553
+ [/^hover-card-soft(-(\S+))?$/, ([, , c = "gray"]) => `bg-${c}-50 fill-${c}-50 stroke-${c}-200 border-${c}-200 dark:(bg-${c}-900 border-${c}-700/58 fill-${c}-900 stroke-${c}-700/58)`],
554
+ [/^hover-card-outline(-(\S+))?$/, ([, , c = "gray"]) => `border stroke-${c}-200 border-${c}-200 dark:(border-${c}-700/58 stroke-${c}-700/58)`]
555
+ ];
556
+ const hoverCard = [
557
+ ...dynamicHoverCard,
558
+ staticHoverCard
559
+ ];
560
+
538
561
  const staticIcon = {
539
562
  // base
540
563
  "icon-base": "flex-none"
@@ -603,7 +626,7 @@ const staticInput = {
603
626
  const dynamicInput = [
604
627
  // config
605
628
  [/^input-focus(-(\S+))?$/, ([, , c = "primary"]) => `focus-visible:ring-${c}-500 dark:focus-visible:ring-${c}-400 focus-visible:ring-1`],
606
- [/^input-status(-(\S+))?$/, ([, , c = "info"]) => `text-${c}-700 dark:text-${c}-200 placeholder-${c}-500 dark:placeholder-${c}-400`],
629
+ [/^input-status(-(\S+))?$/, ([, , c = "info"]) => `text-${c}-700 dark:text-${c}-200 placeholder:text-${c}-500 dark:placeholder:text-${c}-400`],
607
630
  // variants
608
631
  [/^input-outline(-(\S+))?$/, ([, , c = "primary"]) => `border border-input input-focus-${c}`],
609
632
  [/^input-solid(-(\S+))?$/, ([, , c = "primary"]) => `input-focus-${c} border border-${c}-500 dark:border-${c}-400`]
@@ -688,6 +711,23 @@ const navigationMenu = [
688
711
  staticNavigationMenu
689
712
  ];
690
713
 
714
+ const staticNumberField = {
715
+ // base
716
+ "number-field": "grid gap-1.5",
717
+ "number-field-content": "relative [&>[data-slot=input]]:has-[[data-slot=increment]]:pr-1.25em [&>[data-slot=input]]:has-[[data-slot=decrement]]:pl-1.25em",
718
+ "number-field-decrement": "grid place-items-center absolute top-1/2 -translate-y-1/2 left-0 p-0.75em disabled:cursor-not-allowed disabled:opacity-20",
719
+ "number-field-input": "flex w-full rounded-md bg-transparent h-2.5714285714285716em py-0.2857142857142857em text-0.875em text-center shadow-sm transition-colors placeholder:text-muted disabled:n-disabled focus-visible:outline-none",
720
+ "number-field-increment": "grid place-items-center absolute top-1/2 -translate-y-1/2 right-0 disabled:cursor-not-allowed disabled:opacity-20 p-0.75em"
721
+ };
722
+ const dynamicNumberField = [
723
+ // dynamic preset
724
+ [/^number-field-([^-]+)-([^-]+)$/, ([, v = "outline", c = "primary"]) => `input-${v}-${c}`]
725
+ ];
726
+ const numberField = [
727
+ ...dynamicNumberField,
728
+ staticNumberField
729
+ ];
730
+
691
731
  const staticPagination = {
692
732
  // configurations
693
733
  "pagination": "overflow-hidden",
@@ -1044,38 +1084,27 @@ const slider = [
1044
1084
 
1045
1085
  const staticSwitch = {
1046
1086
  // base
1047
- "switch": "bg-brand switch-focus h-1.25em w-2.25em switch-disabled inline-flex shrink-0 cursor-pointer items-center border-2 border-transparent rounded-full shadow-sm",
1087
+ "switch": "h-1.25em w-2.25em switch-disabled inline-flex shrink-0 cursor-pointer items-center border-2 border-transparent rounded-full shadow-sm transition-colors",
1048
1088
  "switch-disabled": "data-[disabled]:n-disabled",
1049
- "switch-focus": "focus-visible:ring-brand focus-visible:ring-offset-base transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
1050
1089
  // thumb
1051
- "switch-thumb": "square-1em flex items-center justify-center absolute pointer-events-none block border border-base rounded-full bg-base shadow-lg ring-0 transition-transform",
1090
+ "switch-thumb": "square-1em flex items-center justify-center pointer-events-none block rounded-full bg-base shadow-lg ring-0 transition-transform",
1052
1091
  "switch-thumb-checked": "translate-x-1.01em",
1053
1092
  "switch-thumb-unchecked": "translate-x-0.03em",
1054
- // icon
1093
+ // icons
1055
1094
  "switch-icon": "text-0.7em",
1056
1095
  "switch-icon-unchecked": "text-muted",
1057
1096
  "switch-icon-checked": "text-muted",
1058
1097
  // loading
1059
1098
  "switch-loading-icon": "text-gray animate-spin text-0.8em",
1060
- "switch-loading-icon-name": "i-loading"
1099
+ "switch-loading-icon-name": "i-loading",
1100
+ "switch-focus-gray": "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-base focus-visible:ring-offset-2 focus-visible:ring-offset-background"
1061
1101
  };
1062
1102
  const dynamicSwitch = [
1063
- [
1064
- /^switch-checked(?:-([^-]+))?(?:-([^-]+))?$/,
1065
- ([, color = "primary"], { theme }) => {
1066
- const parsedColor = parseColor$1(color, theme);
1067
- if ((parsedColor?.cssColor?.type === "rgb" || parsedColor?.cssColor?.type === "rgba") && parsedColor.cssColor.components)
1068
- return `data-[state=checked]:n-${color}-600 dark:data-[state=checked]:n-${color}-500`;
1069
- }
1070
- ],
1071
- [
1072
- /^switch-unchecked(?:-([^-]+))?(?:-([^-]+))?$/,
1073
- ([, color = "gray"], { theme }) => {
1074
- const parsedColor = parseColor$1(color, theme);
1075
- if ((parsedColor?.cssColor?.type === "rgb" || parsedColor?.cssColor?.type === "rgba") && parsedColor.cssColor.components)
1076
- return `data-[state=unchecked]:n-${color}-200 dark:data-[state=unchecked]:n-${color}-700/58`;
1077
- }
1078
- ]
1103
+ // base
1104
+ [/^switch-focus(-(\S+))?$/, ([, , c = "primary"]) => `focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-${c}-600 dark:focus-visible:ring-${c}-500 focus-visible:ring-offset-2 focus-visible:ring-offset-background`],
1105
+ // variants
1106
+ [/^switch-checked(-(\S+))?$/, ([, , c = "primary"]) => `data-[state=checked]:switch-focus-${c} data-[state=checked]:bg-${c}-600 dark:data-[state=checked]:bg-${c}-500`],
1107
+ [/^switch-unchecked(-(\S+))?$/, ([, , c = "gray"]) => `data-[state=unchecked]:switch-focus-${c} data-[state=unchecked]:bg-${c}-200 dark:data-[state=unchecked]:bg-${c}-700/58`]
1079
1108
  ];
1080
1109
  const _switch = [
1081
1110
  ...dynamicSwitch,
@@ -1245,12 +1274,14 @@ const shortcuts = [
1245
1274
  ...sheet,
1246
1275
  ...scrollArea,
1247
1276
  ...navigationMenu,
1277
+ ...numberField,
1248
1278
  ...sidebar,
1249
1279
  ...aspectRatio,
1250
1280
  ...resizable,
1251
1281
  ...alertDialog,
1252
1282
  ...combobox,
1253
- ...drawer
1283
+ ...drawer,
1284
+ ...hoverCard
1254
1285
  ];
1255
1286
 
1256
1287
  export { shortcuts as s };
@@ -1,3 +1,3 @@
1
- export { s as shortcuts } from './shared/preset.BHGEskTu.mjs';
1
+ export { s as shortcuts } from './shared/preset.ByWFih15.mjs';
2
2
  import '@unocss/preset-mini/utils';
3
3
  import '@unocss/preset-mini';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@una-ui/preset",
3
- "version": "0.58.0",
3
+ "version": "0.60.0",
4
4
  "description": "The default preset for @una-ui",
5
5
  "author": "Phojie Rengel <phojrengel@gmail.com>",
6
6
  "license": "MIT",