@dalexto/lexsys-registry 0.0.2 → 0.0.4

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.
Files changed (77) hide show
  1. package/README.md +1 -0
  2. package/dist/index.js +53 -52
  3. package/dist/items/empty.d.ts +7 -0
  4. package/dist/items/index.d.ts +2 -0
  5. package/dist/items/table.d.ts +7 -0
  6. package/dist/registry.types.d.ts +0 -1
  7. package/package.json +1 -1
  8. package/templates/blocks/AuthForm/AuthForm.tsx +3 -3
  9. package/templates/blocks/AuthForm/AuthForm.variants.ts +3 -3
  10. package/templates/blocks/CommandPalette/CommandPalette.tsx +14 -14
  11. package/templates/blocks/CommandPalette/CommandPalette.types.ts +3 -9
  12. package/templates/blocks/CommandPalette/CommandPalette.variants.ts +13 -14
  13. package/templates/blocks/Empty/Empty.tsx +91 -0
  14. package/templates/blocks/Empty/Empty.types.ts +8 -0
  15. package/templates/blocks/Empty/Empty.variants.ts +51 -0
  16. package/templates/blocks/FormField/FormField.tsx +2 -6
  17. package/templates/blocks/FormField/FormField.variants.ts +2 -2
  18. package/templates/blocks/SettingsPanel/SettingsPanel.tsx +2 -2
  19. package/templates/blocks/SettingsPanel/SettingsPanel.variants.ts +2 -2
  20. package/templates/blocks/Sidebar/Sidebar.tsx +45 -85
  21. package/templates/blocks/Sidebar/Sidebar.types.ts +2 -7
  22. package/templates/blocks/Sidebar/Sidebar.variants.ts +36 -40
  23. package/templates/primitives/Accordion/Accordion.variants.ts +7 -7
  24. package/templates/primitives/Alert/Alert.variants.ts +7 -7
  25. package/templates/primitives/AlertDialog/AlertDialog.variants.ts +16 -16
  26. package/templates/primitives/Autocomplete/Autocomplete.variants.ts +49 -49
  27. package/templates/primitives/Avatar/Avatar.variants.ts +10 -10
  28. package/templates/primitives/Badge/Badge.variants.ts +14 -14
  29. package/templates/primitives/Button/Button.variants.ts +26 -26
  30. package/templates/primitives/Card/Card.tsx +19 -1
  31. package/templates/primitives/Card/Card.types.ts +1 -0
  32. package/templates/primitives/Card/Card.variants.ts +14 -11
  33. package/templates/primitives/Checkbox/Checkbox.variants.ts +11 -15
  34. package/templates/primitives/CheckboxGroup/CheckboxGroup.variants.ts +2 -2
  35. package/templates/primitives/Collapsible/Collapsible.variants.ts +10 -10
  36. package/templates/primitives/Combobox/Combobox.variants.ts +58 -58
  37. package/templates/primitives/ContextMenu/ContextMenu.variants.ts +1 -1
  38. package/templates/primitives/Dialog/Dialog.variants.ts +16 -16
  39. package/templates/primitives/Drawer/Drawer.types.ts +3 -1
  40. package/templates/primitives/Drawer/Drawer.variants.ts +37 -37
  41. package/templates/primitives/Field/Field.variants.ts +22 -22
  42. package/templates/primitives/Fieldset/Fieldset.variants.ts +8 -8
  43. package/templates/primitives/Form/Form.variants.ts +1 -1
  44. package/templates/primitives/Input/Input.variants.ts +11 -11
  45. package/templates/primitives/Menu/Menu.variants.ts +25 -25
  46. package/templates/primitives/Menubar/Menubar.variants.ts +1 -1
  47. package/templates/primitives/Meter/Meter.variants.ts +11 -11
  48. package/templates/primitives/NavigationMenu/NavigationMenu.variants.ts +2 -2
  49. package/templates/primitives/NumberField/NumberField.variants.ts +25 -25
  50. package/templates/primitives/OtpField/OtpField.variants.ts +12 -12
  51. package/templates/primitives/Popover/Popover.variants.ts +18 -20
  52. package/templates/primitives/PreviewCard/PreviewCard.variants.ts +1 -1
  53. package/templates/primitives/Progress/Progress.variants.ts +8 -8
  54. package/templates/primitives/RadioGroup/RadioGroup.variants.ts +14 -14
  55. package/templates/primitives/ScrollArea/ScrollArea.variants.ts +3 -3
  56. package/templates/primitives/Select/Select.tsx +29 -29
  57. package/templates/primitives/Select/Select.types.ts +4 -4
  58. package/templates/primitives/Select/Select.variants.ts +44 -59
  59. package/templates/primitives/Separator/Separator.variants.ts +3 -3
  60. package/templates/primitives/Slider/Slider.tsx +14 -14
  61. package/templates/primitives/Slider/Slider.variants.ts +17 -26
  62. package/templates/primitives/Switch/Switch.types.ts +2 -2
  63. package/templates/primitives/Switch/Switch.variants.ts +13 -13
  64. package/templates/primitives/Table/Table.tsx +121 -0
  65. package/templates/primitives/Table/Table.types.ts +68 -0
  66. package/templates/primitives/Table/Table.variants.ts +51 -0
  67. package/templates/primitives/Tabs/Tabs.variants.ts +8 -8
  68. package/templates/primitives/Textarea/Textarea.variants.ts +11 -11
  69. package/templates/primitives/Toast/Toast.variants.ts +20 -20
  70. package/templates/primitives/Toggle/Toggle.variants.ts +9 -9
  71. package/templates/primitives/ToggleGroup/ToggleGroup.variants.ts +5 -5
  72. package/templates/primitives/Toolbar/Toolbar.variants.ts +18 -18
  73. package/templates/primitives/Tooltip/Tooltip.variants.ts +5 -5
  74. package/templates/styles/theme.css +301 -299
  75. package/templates/styles/tokens.css +1495 -1441
  76. package/templates/templates/DashboardShell/DashboardShell.tsx +10 -10
  77. package/templates/templates/DashboardShell/DashboardShell.variants.ts +10 -10
package/templates/primitives/Drawer/Drawer.variants.ts CHANGED
@@ -9,33 +9,33 @@ import { disabledStateClasses } from "@/lib/utils"
9
9
 
10
10
  export const drawerTriggerVariants = cva(
11
11
  [
12
- "inline-flex h-(--lsys-drawer-trigger-height) items-center justify-center rounded-(--lsys-drawer-trigger-radius)",
13
- "bg-(--lsys-drawer-trigger-background) px-(--lsys-drawer-trigger-padding-x) text-(--lsys-drawer-trigger-foreground)",
14
- "text-(length:--lsys-drawer-trigger-font-size) font-(--lsys-drawer-trigger-font-weight) leading-(--lsys-drawer-trigger-font-line-height)",
15
- "transition-colors duration-(--lsys-drawer-transition-duration) ease-(--lsys-drawer-transition-easing)",
16
- "outline-none hover:bg-(--lsys-drawer-trigger-hover-background) focus-visible:ring-(length:--lsys-drawer-focus-ring-width) focus-visible:ring-(--lsys-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lsys-drawer-focus-ring-offset) focus-visible:ring-offset-(--lsys-drawer-focus-ring-offset-color)",
12
+ "inline-flex h-(--lex-drawer-trigger-height) items-center justify-center rounded-(--lex-drawer-trigger-radius)",
13
+ "bg-(--lex-drawer-trigger-background) px-(--lex-drawer-trigger-padding-x) text-(--lex-drawer-trigger-foreground)",
14
+ "text-(length:--lex-drawer-trigger-font-size) font-(--lex-drawer-trigger-font-weight) leading-(--lex-drawer-trigger-font-line-height)",
15
+ "transition-colors duration-(--lex-drawer-transition-duration) ease-(--lex-drawer-transition-easing)",
16
+ "outline-none hover:bg-(--lex-drawer-trigger-hover-background) focus-visible:ring-(length:--lex-drawer-focus-ring-width) focus-visible:ring-(--lex-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lex-drawer-focus-ring-offset) focus-visible:ring-offset-(--lex-drawer-focus-ring-offset-color)",
17
17
  disabledStateClasses,
18
18
  ].join(" "),
19
19
  )
20
20
 
21
21
  export const drawerIndentBackgroundVariants = cva(
22
- "fixed inset-0 z-(--lsys-drawer-indent-z-index) bg-(--lsys-drawer-indent-background) opacity-0 transition-opacity duration-(--lsys-drawer-transition-duration) ease-(--lsys-drawer-transition-easing) data-[active]:opacity-100",
22
+ "fixed inset-0 z-(--lex-drawer-indent-z-index) bg-(--lex-drawer-indent-background) opacity-0 transition-opacity duration-(--lex-drawer-transition-duration) ease-(--lex-drawer-transition-easing) data-[active]:opacity-100",
23
23
  )
24
24
 
25
25
  export const drawerIndentVariants = cva(
26
- "min-h-(--lsys-drawer-viewport-max-height) origin-top overflow-hidden transition-[border-radius,transform] duration-(--lsys-drawer-transition-duration) ease-(--lsys-drawer-transition-easing) data-[active]:scale-(--lsys-drawer-indent-scale) data-[active]:rounded-(--lsys-drawer-indent-radius)",
26
+ "min-h-(--lex-drawer-viewport-max-height) origin-top overflow-hidden transition-[border-radius,transform] duration-(--lex-drawer-transition-duration) ease-(--lex-drawer-transition-easing) data-[active]:scale-(--lex-drawer-indent-scale) data-[active]:rounded-(--lex-drawer-indent-radius)",
27
27
  )
28
28
 
29
29
  export const drawerBackdropVariants = cva(
30
30
  [
31
- "fixed inset-0 z-(--lsys-drawer-backdrop-z-index) bg-(--lsys-drawer-backdrop-background) opacity-(--lsys-drawer-backdrop-opacity)",
32
- "transition-opacity duration-(--lsys-drawer-transition-duration) ease-(--lsys-drawer-transition-easing)",
31
+ "fixed inset-0 z-(--lex-drawer-backdrop-z-index) bg-(--lex-drawer-backdrop-background) opacity-(--lex-drawer-backdrop-opacity)",
32
+ "transition-opacity duration-(--lex-drawer-transition-duration) ease-(--lex-drawer-transition-easing)",
33
33
  "data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
34
34
  ].join(" "),
35
35
  )
36
36
 
37
37
  export const drawerViewportVariants = cva(
38
- "fixed inset-0 z-(--lsys-drawer-viewport-z-index) flex overflow-hidden p-(--lsys-drawer-viewport-padding)",
38
+ "fixed inset-0 z-(--lex-drawer-viewport-z-index) flex overflow-hidden p-(--lex-drawer-viewport-padding)",
39
39
  {
40
40
  variants: {
41
41
  side: {
@@ -53,19 +53,19 @@ export const drawerViewportVariants = cva(
53
53
 
54
54
  export const drawerPopupVariants = cva(
55
55
  [
56
- "relative flex bg-(--lsys-drawer-popup-background) text-(--lsys-drawer-popup-foreground) shadow-(--lsys-drawer-popup-shadow) outline-none",
57
- "border border-(--lsys-drawer-popup-border-color) transition-[opacity,transform] duration-[calc(var(--lsys-drawer-transition-duration)*var(--drawer-swipe-strength,1))] ease-(--lsys-drawer-transition-easing)",
56
+ "relative flex bg-(--lex-drawer-popup-background) text-(--lex-drawer-popup-foreground) shadow-(--lex-drawer-popup-shadow) outline-none",
57
+ "border border-(--lex-drawer-popup-border-color) transition-[opacity,transform] duration-[calc(var(--lex-drawer-transition-duration)*var(--drawer-swipe-strength,1))] ease-(--lex-drawer-transition-easing)",
58
58
  "data-[swiping]:transition-none",
59
59
  ].join(" "),
60
60
  {
61
61
  variants: {
62
62
  side: {
63
63
  bottom:
64
- "max-h-[calc(var(--lsys-drawer-viewport-max-height)-(var(--lsys-drawer-viewport-padding)*2))] w-[min(calc(100vw-(var(--lsys-drawer-viewport-inset)*2)),var(--lsys-drawer-popup-max-width))] translate-y-[calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px))] rounded-t-(--lsys-drawer-popup-radius) data-[ending-style]:translate-y-full data-[starting-style]:translate-y-full",
65
- top: "max-h-[calc(var(--lsys-drawer-viewport-max-height)-(var(--lsys-drawer-viewport-padding)*2))] w-[min(calc(100vw-(var(--lsys-drawer-viewport-inset)*2)),var(--lsys-drawer-popup-max-width))] translate-y-[var(--drawer-swipe-movement-y,0px)] rounded-b-(--lsys-drawer-popup-radius) data-[ending-style]:-translate-y-full data-[starting-style]:-translate-y-full",
64
+ "max-h-[calc(var(--lex-drawer-viewport-max-height)-(var(--lex-drawer-viewport-padding)*2))] w-[min(calc(100vw-(var(--lex-drawer-viewport-inset)*2)),var(--lex-drawer-popup-max-width))] translate-y-[calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y,0px))] rounded-t-(--lex-drawer-popup-radius) data-[ending-style]:translate-y-full data-[starting-style]:translate-y-full",
65
+ top: "max-h-[calc(var(--lex-drawer-viewport-max-height)-(var(--lex-drawer-viewport-padding)*2))] w-[min(calc(100vw-(var(--lex-drawer-viewport-inset)*2)),var(--lex-drawer-popup-max-width))] translate-y-[var(--drawer-swipe-movement-y,0px)] rounded-b-(--lex-drawer-popup-radius) data-[ending-style]:-translate-y-full data-[starting-style]:-translate-y-full",
66
66
  right:
67
- "h-full max-w-[calc(100vw-(var(--lsys-drawer-viewport-inset)*2))] translate-x-[var(--drawer-swipe-movement-x,0px)] rounded-l-(--lsys-drawer-popup-radius) data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full",
68
- left: "h-full max-w-[calc(100vw-(var(--lsys-drawer-viewport-inset)*2))] translate-x-[var(--drawer-swipe-movement-x,0px)] rounded-r-(--lsys-drawer-popup-radius) data-[ending-style]:-translate-x-full data-[starting-style]:-translate-x-full",
67
+ "h-full max-w-[calc(100vw-(var(--lex-drawer-viewport-inset)*2))] translate-x-[var(--drawer-swipe-movement-x,0px)] rounded-l-(--lex-drawer-popup-radius) data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full",
68
+ left: "h-full max-w-[calc(100vw-(var(--lex-drawer-viewport-inset)*2))] translate-x-[var(--drawer-swipe-movement-x,0px)] rounded-r-(--lex-drawer-popup-radius) data-[ending-style]:-translate-x-full data-[starting-style]:-translate-x-full",
69
69
  },
70
70
  size: {
71
71
  sm: "",
@@ -78,43 +78,43 @@ export const drawerPopupVariants = cva(
78
78
  {
79
79
  side: ["bottom", "top"],
80
80
  size: "sm",
81
- class: "min-h-(--lsys-drawer-popup-height-sm)",
81
+ class: "min-h-(--lex-drawer-popup-height-sm)",
82
82
  },
83
83
  {
84
84
  side: ["bottom", "top"],
85
85
  size: "md",
86
- class: "min-h-(--lsys-drawer-popup-height-md)",
86
+ class: "min-h-(--lex-drawer-popup-height-md)",
87
87
  },
88
88
  {
89
89
  side: ["bottom", "top"],
90
90
  size: "lg",
91
- class: "min-h-(--lsys-drawer-popup-height-lg)",
91
+ class: "min-h-(--lex-drawer-popup-height-lg)",
92
92
  },
93
93
  {
94
94
  side: ["bottom", "top"],
95
95
  size: "full",
96
96
  class:
97
- "min-h-[calc(var(--lsys-drawer-viewport-max-height)-(var(--lsys-drawer-viewport-padding)*2))]",
97
+ "min-h-[calc(var(--lex-drawer-viewport-max-height)-(var(--lex-drawer-viewport-padding)*2))]",
98
98
  },
99
99
  {
100
100
  side: ["left", "right"],
101
101
  size: "sm",
102
- class: "w-(--lsys-drawer-popup-width-sm)",
102
+ class: "w-(--lex-drawer-popup-width-sm)",
103
103
  },
104
104
  {
105
105
  side: ["left", "right"],
106
106
  size: "md",
107
- class: "w-(--lsys-drawer-popup-width-md)",
107
+ class: "w-(--lex-drawer-popup-width-md)",
108
108
  },
109
109
  {
110
110
  side: ["left", "right"],
111
111
  size: "lg",
112
- class: "w-(--lsys-drawer-popup-width-lg)",
112
+ class: "w-(--lex-drawer-popup-width-lg)",
113
113
  },
114
114
  {
115
115
  side: ["left", "right"],
116
116
  size: "full",
117
- class: "w-[calc(100vw-(var(--lsys-drawer-viewport-inset)*2))]",
117
+ class: "w-[calc(100vw-(var(--lex-drawer-viewport-inset)*2))]",
118
118
  },
119
119
  ],
120
120
  defaultVariants: {
@@ -125,22 +125,22 @@ export const drawerPopupVariants = cva(
125
125
  )
126
126
 
127
127
  export const drawerContentVariants = cva(
128
- "grid flex-1 content-start gap-(--lsys-drawer-content-gap) overflow-auto p-(--lsys-drawer-content-padding)",
128
+ "grid flex-1 content-start gap-(--lex-drawer-content-gap) overflow-auto p-(--lex-drawer-content-padding)",
129
129
  )
130
130
 
131
131
  export const drawerHandleVariants = cva(
132
- "mx-auto mt-(--lsys-drawer-handle-margin-top) h-(--lsys-drawer-handle-height) w-(--lsys-drawer-handle-width) shrink-0 rounded-(--lsys-drawer-handle-radius) bg-(--lsys-drawer-handle-background)",
132
+ "mx-auto mt-(--lex-drawer-handle-margin-top) h-(--lex-drawer-handle-height) w-(--lex-drawer-handle-width) shrink-0 rounded-(--lex-drawer-handle-radius) bg-(--lex-drawer-handle-background)",
133
133
  )
134
134
 
135
135
  export const drawerSwipeAreaVariants = cva(
136
- "fixed z-(--lsys-drawer-handle-z-index) data-[disabled]:pointer-events-none data-[disabled]:opacity-0",
136
+ "fixed z-(--lex-drawer-handle-z-index) data-[disabled]:pointer-events-none data-[disabled]:opacity-0",
137
137
  {
138
138
  variants: {
139
139
  side: {
140
- bottom: "inset-x-0 bottom-0 h-(--lsys-drawer-swipe-area-size)",
141
- top: "inset-x-0 top-0 h-(--lsys-drawer-swipe-area-size)",
142
- right: "inset-y-0 right-0 w-(--lsys-drawer-swipe-area-size)",
143
- left: "inset-y-0 left-0 w-(--lsys-drawer-swipe-area-size)",
140
+ bottom: "inset-x-0 bottom-0 h-(--lex-drawer-swipe-area-size)",
141
+ top: "inset-x-0 top-0 h-(--lex-drawer-swipe-area-size)",
142
+ right: "inset-y-0 right-0 w-(--lex-drawer-swipe-area-size)",
143
+ left: "inset-y-0 left-0 w-(--lex-drawer-swipe-area-size)",
144
144
  },
145
145
  },
146
146
  defaultVariants: {
@@ -150,18 +150,18 @@ export const drawerSwipeAreaVariants = cva(
150
150
  )
151
151
 
152
152
  export const drawerTitleVariants = cva(
153
- "pr-(--lsys-drawer-title-padding-end) text-(length:--lsys-drawer-title-font-size) font-(--lsys-drawer-title-font-weight) leading-(--lsys-drawer-title-font-line-height) text-(--lsys-drawer-title-foreground)",
153
+ "pr-(--lex-drawer-title-padding-end) text-(length:--lex-drawer-title-font-size) font-(--lex-drawer-title-font-weight) leading-(--lex-drawer-title-font-line-height) text-(--lex-drawer-title-foreground)",
154
154
  )
155
155
 
156
156
  export const drawerDescriptionVariants = cva(
157
- "text-(length:--lsys-drawer-description-font-size) font-(--lsys-drawer-description-font-weight) leading-(--lsys-drawer-description-font-line-height) text-(--lsys-drawer-description-foreground)",
157
+ "text-(length:--lex-drawer-description-font-size) font-(--lex-drawer-description-font-weight) leading-(--lex-drawer-description-font-line-height) text-(--lex-drawer-description-foreground)",
158
158
  )
159
159
 
160
160
  export const drawerCloseVariants = cva(
161
161
  [
162
- "absolute right-(--lsys-drawer-close-inset) top-(--lsys-drawer-close-inset) inline-flex size-(--lsys-drawer-close-size) items-center justify-center rounded-(--lsys-drawer-close-radius)",
163
- "text-(--lsys-drawer-close-foreground) outline-none transition-colors duration-(--lsys-drawer-transition-duration) ease-(--lsys-drawer-transition-easing)",
164
- "hover:bg-(--lsys-drawer-close-hover-background) focus-visible:ring-(length:--lsys-drawer-focus-ring-width) focus-visible:ring-(--lsys-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lsys-drawer-focus-ring-offset) focus-visible:ring-offset-(--lsys-drawer-focus-ring-offset-color)",
162
+ "absolute right-(--lex-drawer-close-inset) top-(--lex-drawer-close-inset) inline-flex size-(--lex-drawer-close-size) items-center justify-center rounded-(--lex-drawer-close-radius)",
163
+ "text-(--lex-drawer-close-foreground) outline-none transition-colors duration-(--lex-drawer-transition-duration) ease-(--lex-drawer-transition-easing)",
164
+ "hover:bg-(--lex-drawer-close-hover-background) focus-visible:ring-(length:--lex-drawer-focus-ring-width) focus-visible:ring-(--lex-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lex-drawer-focus-ring-offset) focus-visible:ring-offset-(--lex-drawer-focus-ring-offset-color)",
165
165
  disabledStateClasses,
166
166
  ].join(" "),
167
167
  )
@@ -169,7 +169,7 @@ export const drawerCloseVariants = cva(
169
169
  export const drawerCloseInlineVariants = cva(
170
170
  [
171
171
  "relative inline-flex w-auto items-center outline-none",
172
- "focus-visible:ring-(length:--lsys-drawer-focus-ring-width) focus-visible:ring-(--lsys-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lsys-drawer-focus-ring-offset) focus-visible:ring-offset-(--lsys-drawer-focus-ring-offset-color)",
172
+ "focus-visible:ring-(length:--lex-drawer-focus-ring-width) focus-visible:ring-(--lex-drawer-focus-ring-color) focus-visible:ring-offset-(length:--lex-drawer-focus-ring-offset) focus-visible:ring-offset-(--lex-drawer-focus-ring-offset-color)",
173
173
  disabledStateClasses,
174
174
  ].join(" "),
175
175
  )
package/templates/primitives/Field/Field.variants.ts CHANGED
@@ -9,27 +9,27 @@ import { disabledStateClasses } from "@/lib/utils"
9
9
 
10
10
  export const fieldVariants = cva(
11
11
  [
12
- "grid gap-(--lsys-field-gap) text-(--lsys-field-foreground)",
13
- "data-[disabled]:opacity-(--lsys-opacity-disabled)",
12
+ "grid gap-(--lex-field-gap) text-(--lex-field-foreground)",
13
+ "data-[disabled]:opacity-(--lex-opacity-disabled)",
14
14
  ].join(" "),
15
15
  )
16
16
 
17
17
  export const fieldLabelVariants = cva(
18
18
  [
19
- "w-fit text-(length:--lsys-field-label-font-size) font-(--lsys-field-label-font-weight) leading-(--lsys-field-label-font-line-height) tracking-(--lsys-field-label-font-letter-spacing)",
20
- "text-(--lsys-field-label-foreground) data-[invalid]:text-(--lsys-field-label-invalid-foreground) data-[disabled]:cursor-not-allowed",
19
+ "w-fit text-(length:--lex-field-label-font-size) font-(--lex-field-label-font-weight) leading-(--lex-field-label-font-line-height) tracking-(--lex-field-label-font-letter-spacing)",
20
+ "text-(--lex-field-label-foreground) data-[invalid]:text-(--lex-field-label-invalid-foreground) data-[disabled]:cursor-not-allowed",
21
21
  ].join(" "),
22
22
  )
23
23
 
24
24
  export const fieldControlVariants = cva(
25
25
  [
26
- "flex w-full min-w-0 border bg-(--lsys-field-control-background) text-(--lsys-field-control-foreground)",
27
- "rounded-(--lsys-field-control-radius) border-(--lsys-field-control-border-color)",
28
- "font-(family-name:--lsys-field-control-font-family) font-(--lsys-field-control-font-weight) leading-(--lsys-field-control-font-line-height) tracking-(--lsys-field-control-font-letter-spacing)",
29
- "placeholder:text-(--lsys-field-control-placeholder-color)",
30
- "transition-colors duration-(--lsys-field-transition-duration) ease-(--lsys-field-transition-easing)",
31
- "outline-none focus-visible:border-(--lsys-field-control-focus-border-color) focus-visible:ring-(length:--lsys-field-control-focus-ring-width) focus-visible:ring-(--lsys-field-control-focus-ring-color) focus-visible:ring-offset-(length:--lsys-field-control-focus-ring-offset) focus-visible:ring-offset-(--lsys-field-control-focus-ring-offset-color)",
32
- "data-[invalid]:border-(--lsys-field-control-invalid-border-color) data-[invalid]:ring-(--lsys-field-control-invalid-ring-color) aria-invalid:border-(--lsys-field-control-invalid-border-color) aria-invalid:ring-(--lsys-field-control-invalid-ring-color)",
26
+ "flex w-full min-w-0 border bg-(--lex-field-control-background) text-(--lex-field-control-foreground)",
27
+ "rounded-(--lex-field-control-radius) border-(--lex-field-control-border-color)",
28
+ "font-(family-name:--lex-field-control-font-family) font-(--lex-field-control-font-weight) leading-(--lex-field-control-font-line-height) tracking-(--lex-field-control-font-letter-spacing)",
29
+ "placeholder:text-(--lex-field-control-placeholder-color)",
30
+ "transition-colors duration-(--lex-field-transition-duration) ease-(--lex-field-transition-easing)",
31
+ "outline-none focus-visible:border-(--lex-field-control-focus-border-color) focus-visible:ring-(length:--lex-field-control-focus-ring-width) focus-visible:ring-(--lex-field-control-focus-ring-color) focus-visible:ring-offset-(length:--lex-field-control-focus-ring-offset) focus-visible:ring-offset-(--lex-field-control-focus-ring-offset-color)",
32
+ "data-[invalid]:border-(--lex-field-control-invalid-border-color) data-[invalid]:ring-(--lex-field-control-invalid-ring-color) aria-invalid:border-(--lex-field-control-invalid-border-color) aria-invalid:ring-(--lex-field-control-invalid-ring-color)",
33
33
  "disabled:cursor-not-allowed",
34
34
  disabledStateClasses,
35
35
  ].join(" "),
@@ -38,12 +38,12 @@ export const fieldControlVariants = cva(
38
38
  variant: {
39
39
  default: "",
40
40
  ghost:
41
- "border-transparent bg-transparent focus-visible:bg-(--lsys-field-control-background)",
41
+ "border-transparent bg-transparent focus-visible:bg-(--lex-field-control-background)",
42
42
  },
43
43
  size: {
44
- sm: "h-(--lsys-field-control-height-sm) px-(--lsys-field-control-padding-x-sm) text-(length:--lsys-field-control-font-size-sm)",
45
- md: "h-(--lsys-field-control-height-md) px-(--lsys-field-control-padding-x-md) text-(length:--lsys-field-control-font-size-md)",
46
- lg: "h-(--lsys-field-control-height-lg) px-(--lsys-field-control-padding-x-lg) text-(length:--lsys-field-control-font-size-lg)",
44
+ sm: "h-(--lex-field-control-height-sm) px-(--lex-field-control-padding-x-sm) text-(length:--lex-field-control-font-size-sm)",
45
+ md: "h-(--lex-field-control-height-md) px-(--lex-field-control-padding-x-md) text-(length:--lex-field-control-font-size-md)",
46
+ lg: "h-(--lex-field-control-height-lg) px-(--lex-field-control-padding-x-lg) text-(length:--lex-field-control-font-size-lg)",
47
47
  },
48
48
  },
49
49
  defaultVariants: {
@@ -55,23 +55,23 @@ export const fieldControlVariants = cva(
55
55
 
56
56
  export const fieldDescriptionVariants = cva(
57
57
  [
58
- "m-0 text-(length:--lsys-field-description-font-size) font-(--lsys-field-description-font-weight) leading-(--lsys-field-description-font-line-height) tracking-(--lsys-field-description-font-letter-spacing)",
59
- "text-(--lsys-field-description-foreground) data-[disabled]:opacity-(--lsys-opacity-disabled)",
58
+ "m-0 text-(length:--lex-field-description-font-size) font-(--lex-field-description-font-weight) leading-(--lex-field-description-font-line-height) tracking-(--lex-field-description-font-letter-spacing)",
59
+ "text-(--lex-field-description-foreground) data-[disabled]:opacity-(--lex-opacity-disabled)",
60
60
  ].join(" "),
61
61
  )
62
62
 
63
63
  export const fieldItemVariants = cva(
64
64
  [
65
- "grid gap-(--lsys-field-item-gap)",
66
- "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lsys-opacity-disabled)",
65
+ "grid gap-(--lex-field-item-gap)",
66
+ "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lex-opacity-disabled)",
67
67
  ].join(" "),
68
68
  )
69
69
 
70
70
  export const fieldErrorVariants = cva(
71
71
  [
72
- "m-0 text-(length:--lsys-field-error-font-size) font-(--lsys-field-error-font-weight) leading-(--lsys-field-error-font-line-height) tracking-(--lsys-field-error-font-letter-spacing)",
73
- "text-(--lsys-field-error-foreground) data-[disabled]:opacity-(--lsys-opacity-disabled)",
72
+ "m-0 text-(length:--lex-field-error-font-size) font-(--lex-field-error-font-weight) leading-(--lex-field-error-font-line-height) tracking-(--lex-field-error-font-letter-spacing)",
73
+ "text-(--lex-field-error-foreground) data-[disabled]:opacity-(--lex-opacity-disabled)",
74
74
  "data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
75
- "transition-opacity duration-(--lsys-field-transition-duration) ease-(--lsys-field-transition-easing)",
75
+ "transition-opacity duration-(--lex-field-transition-duration) ease-(--lex-field-transition-easing)",
76
76
  ].join(" "),
77
77
  )
package/templates/primitives/Fieldset/Fieldset.variants.ts CHANGED
@@ -8,17 +8,17 @@ import { cva } from "class-variance-authority"
8
8
 
9
9
  export const fieldsetVariants = cva(
10
10
  [
11
- "m-0 grid min-w-0 gap-(--lsys-fieldset-gap) rounded-(--lsys-fieldset-radius)",
12
- "border border-(--lsys-fieldset-border-color) p-(--lsys-fieldset-padding)",
13
- "bg-(--lsys-fieldset-background) text-(--lsys-fieldset-foreground)",
14
- "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lsys-opacity-disabled)",
11
+ "m-0 grid min-w-0 gap-(--lex-fieldset-gap) rounded-(--lex-fieldset-radius)",
12
+ "border border-(--lex-fieldset-border-color) p-(--lex-fieldset-padding)",
13
+ "bg-(--lex-fieldset-background) text-(--lex-fieldset-foreground)",
14
+ "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lex-opacity-disabled)",
15
15
  ].join(" "),
16
16
  {
17
17
  variants: {
18
18
  variant: {
19
19
  surface: "",
20
20
  plain:
21
- "border-transparent bg-transparent p-0 shadow-none data-[disabled]:opacity-(--lsys-opacity-disabled)",
21
+ "border-transparent bg-transparent p-0 shadow-none data-[disabled]:opacity-(--lex-opacity-disabled)",
22
22
  },
23
23
  },
24
24
  defaultVariants: {
@@ -29,9 +29,9 @@ export const fieldsetVariants = cva(
29
29
 
30
30
  export const fieldsetLegendVariants = cva(
31
31
  [
32
- "mb-(--lsys-fieldset-legend-margin-bottom) text-(length:--lsys-fieldset-legend-font-size)",
33
- "font-(--lsys-fieldset-legend-font-weight) leading-(--lsys-fieldset-legend-font-line-height)",
34
- "tracking-(--lsys-fieldset-legend-font-letter-spacing) text-(--lsys-fieldset-legend-foreground)",
32
+ "mb-(--lex-fieldset-legend-margin-bottom) text-(length:--lex-fieldset-legend-font-size)",
33
+ "font-(--lex-fieldset-legend-font-weight) leading-(--lex-fieldset-legend-font-line-height)",
34
+ "tracking-(--lex-fieldset-legend-font-letter-spacing) text-(--lex-fieldset-legend-foreground)",
35
35
  "data-[disabled]:cursor-not-allowed",
36
36
  ].join(" "),
37
37
  )
package/templates/primitives/Form/Form.variants.ts CHANGED
@@ -7,5 +7,5 @@
7
7
  import { cva } from "class-variance-authority"
8
8
 
9
9
  export const formVariants = cva(
10
- "grid gap-(--lsys-form-gap) text-(--lsys-form-foreground)",
10
+ "grid gap-(--lex-form-gap) text-(--lex-form-foreground)",
11
11
  )
package/templates/primitives/Input/Input.variants.ts CHANGED
@@ -9,14 +9,14 @@ import { disabledStateClasses, invalidStateClasses } from "@/lib/utils"
9
9
 
10
10
  export const inputVariants = cva(
11
11
  [
12
- "flex w-full min-w-0 border bg-(--lsys-input-background) text-(--lsys-input-foreground)",
13
- "rounded-(--lsys-input-radius) border-(--lsys-input-border-color)",
14
- "font-(family-name:--lsys-input-font-family) font-(--lsys-input-font-weight) leading-(--lsys-input-font-line-height) tracking-(--lsys-input-font-letter-spacing)",
15
- "placeholder:text-(--lsys-input-placeholder-color)",
16
- "transition-colors duration-(--lsys-input-transition-duration) ease-(--lsys-input-transition-easing)",
17
- "outline-none focus-visible:border-(--lsys-input-focus-border-color) focus-visible:ring-(length:--lsys-input-focus-ring-width) focus-visible:ring-(--lsys-input-focus-ring-color) focus-visible:ring-offset-(length:--lsys-input-focus-ring-offset) focus-visible:ring-offset-(--lsys-input-focus-ring-offset-color)",
12
+ "flex w-full min-w-0 border bg-(--lex-input-background) text-(--lex-input-foreground)",
13
+ "rounded-(--lex-input-radius) border-(--lex-input-border-color)",
14
+ "font-(family-name:--lex-input-font-family) font-(--lex-input-font-weight) leading-(--lex-input-font-line-height) tracking-(--lex-input-font-letter-spacing)",
15
+ "placeholder:text-(--lex-input-placeholder-color)",
16
+ "transition-colors duration-(--lex-input-transition-duration) ease-(--lex-input-transition-easing)",
17
+ "outline-none focus-visible:border-(--lex-input-focus-border-color) focus-visible:ring-(length:--lex-input-focus-ring-width) focus-visible:ring-(--lex-input-focus-ring-color) focus-visible:ring-offset-(length:--lex-input-focus-ring-offset) focus-visible:ring-offset-(--lex-input-focus-ring-offset-color)",
18
18
  "disabled:cursor-not-allowed",
19
- "read-only:cursor-default read-only:bg-(--lsys-color-background-subtle) read-only:text-(--lsys-color-text-secondary)",
19
+ "read-only:cursor-default read-only:bg-(--lex-color-background-subtle) read-only:text-(--lex-color-text-secondary)",
20
20
  disabledStateClasses,
21
21
  invalidStateClasses,
22
22
  ].join(" "),
@@ -25,12 +25,12 @@ export const inputVariants = cva(
25
25
  variant: {
26
26
  default: "",
27
27
  ghost:
28
- "border-transparent bg-transparent focus-visible:bg-(--lsys-input-background)",
28
+ "border-transparent bg-transparent focus-visible:bg-(--lex-input-background)",
29
29
  },
30
30
  size: {
31
- sm: "h-(--lsys-input-height-sm) px-(--lsys-input-padding-x-sm) text-(length:--lsys-input-font-size-sm)",
32
- md: "h-(--lsys-input-height-md) px-(--lsys-input-padding-x-md) text-(length:--lsys-input-font-size-md)",
33
- lg: "h-(--lsys-input-height-lg) px-(--lsys-input-padding-x-lg) text-(length:--lsys-input-font-size-lg)",
31
+ sm: "h-(--lex-input-height-sm) px-(--lex-input-padding-x-sm) text-(length:--lex-input-font-size-sm)",
32
+ md: "h-(--lex-input-height-md) px-(--lex-input-padding-x-md) text-(length:--lex-input-font-size-md)",
33
+ lg: "h-(--lex-input-height-lg) px-(--lex-input-padding-x-lg) text-(length:--lex-input-font-size-lg)",
34
34
  },
35
35
  },
36
36
  defaultVariants: {
package/templates/primitives/Menu/Menu.variants.ts CHANGED
@@ -8,66 +8,66 @@ import { cva } from "class-variance-authority"
8
8
 
9
9
  export const menuTriggerVariants = cva(
10
10
  [
11
- "inline-flex min-w-0 items-center justify-center gap-(--lsys-menu-trigger-gap) rounded-(--lsys-menu-trigger-radius) border",
12
- "h-(--lsys-menu-trigger-height) border-(--lsys-menu-trigger-border-color) bg-(--lsys-menu-trigger-background) px-(--lsys-menu-trigger-padding-x)",
13
- "text-(length:--lsys-menu-trigger-font-size) font-(--lsys-menu-trigger-font-weight) leading-(--lsys-menu-trigger-font-line-height) text-(--lsys-menu-trigger-foreground)",
14
- "transition-colors duration-(--lsys-menu-transition-duration) ease-(--lsys-menu-transition-easing)",
15
- "outline-none data-[popup-open]:border-(--lsys-menu-trigger-open-border-color) data-[popup-open]:bg-(--lsys-menu-trigger-open-background)",
16
- "data-[focused]:border-(--lsys-menu-focus-border-color) data-[focused]:ring-(length:--lsys-menu-focus-ring-width) data-[focused]:ring-(--lsys-menu-focus-ring-color) data-[focused]:ring-offset-(length:--lsys-menu-focus-ring-offset) data-[focused]:ring-offset-(--lsys-menu-focus-ring-offset-color)",
17
- "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lsys-opacity-disabled)",
11
+ "inline-flex min-w-0 items-center justify-center gap-(--lex-menu-trigger-gap) rounded-(--lex-menu-trigger-radius) border",
12
+ "h-(--lex-menu-trigger-height) border-(--lex-menu-trigger-border-color) bg-(--lex-menu-trigger-background) px-(--lex-menu-trigger-padding-x)",
13
+ "text-(length:--lex-menu-trigger-font-size) font-(--lex-menu-trigger-font-weight) leading-(--lex-menu-trigger-font-line-height) text-(--lex-menu-trigger-foreground)",
14
+ "transition-colors duration-(--lex-menu-transition-duration) ease-(--lex-menu-transition-easing)",
15
+ "outline-none data-[popup-open]:border-(--lex-menu-trigger-open-border-color) data-[popup-open]:bg-(--lex-menu-trigger-open-background)",
16
+ "data-[focused]:border-(--lex-menu-focus-border-color) data-[focused]:ring-(length:--lex-menu-focus-ring-width) data-[focused]:ring-(--lex-menu-focus-ring-color) data-[focused]:ring-offset-(length:--lex-menu-focus-ring-offset) data-[focused]:ring-offset-(--lex-menu-focus-ring-offset-color)",
17
+ "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--lex-opacity-disabled)",
18
18
  ].join(" "),
19
19
  )
20
20
 
21
21
  export const menuBackdropVariants = cva(
22
- "fixed inset-0 z-(--lsys-menu-backdrop-z-index) bg-(--lsys-menu-backdrop-background) opacity-(--lsys-menu-backdrop-opacity) data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
22
+ "fixed inset-0 z-(--lex-menu-backdrop-z-index) bg-(--lex-menu-backdrop-background) opacity-(--lex-menu-backdrop-opacity) data-[starting-style]:opacity-0 data-[ending-style]:opacity-0",
23
23
  )
24
24
 
25
- export const menuPositionerVariants = cva("z-(--lsys-menu-positioner-z-index)")
25
+ export const menuPositionerVariants = cva("z-(--lex-menu-positioner-z-index)")
26
26
 
27
27
  export const menuPopupVariants = cva(
28
28
  [
29
- "min-w-[var(--anchor-width)] max-w-(--lsys-menu-popup-max-width) rounded-(--lsys-menu-radius) border",
30
- "border-(--lsys-menu-popup-border-color) bg-(--lsys-menu-popup-background) text-(--lsys-menu-popup-foreground) shadow-(--lsys-menu-popup-shadow)",
29
+ "min-w-[var(--anchor-width)] max-w-(--lex-menu-popup-max-width) rounded-(--lex-menu-radius) border",
30
+ "border-(--lex-menu-popup-border-color) bg-(--lex-menu-popup-background) text-(--lex-menu-popup-foreground) shadow-(--lex-menu-popup-shadow)",
31
31
  "data-[starting-style]:scale-95 data-[starting-style]:opacity-0 data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
32
- "origin-[var(--transform-origin)] transition-[opacity,transform] duration-(--lsys-menu-transition-duration) ease-(--lsys-menu-transition-easing)",
32
+ "origin-[var(--transform-origin)] transition-[opacity,transform] duration-(--lex-menu-transition-duration) ease-(--lex-menu-transition-easing)",
33
33
  ].join(" "),
34
34
  )
35
35
 
36
36
  export const menuViewportVariants = cva(
37
- "grid max-h-(--lsys-menu-viewport-max-height) gap-(--lsys-menu-list-gap) overflow-y-auto p-(--lsys-menu-list-padding)",
37
+ "grid max-h-(--lex-menu-viewport-max-height) gap-(--lex-menu-list-gap) overflow-y-auto p-(--lex-menu-list-padding)",
38
38
  )
39
39
 
40
40
  export const menuItemVariants = cva(
41
41
  [
42
- "relative flex min-w-0 cursor-default select-none items-center gap-(--lsys-menu-item-gap) rounded-(--lsys-menu-item-radius)",
43
- "px-(--lsys-menu-item-padding-x) py-(--lsys-menu-item-padding-y) text-(length:--lsys-menu-item-font-size) font-(--lsys-menu-item-font-weight) leading-(--lsys-menu-item-font-line-height)",
44
- "text-(--lsys-menu-item-foreground) outline-none",
45
- "data-[highlighted]:bg-(--lsys-menu-item-highlight-background) data-[highlighted]:text-(--lsys-menu-item-highlight-foreground)",
46
- "data-[checked]:bg-(--lsys-menu-item-checked-background) data-[checked]:text-(--lsys-menu-item-checked-foreground)",
47
- "data-[disabled]:pointer-events-none data-[disabled]:opacity-(--lsys-opacity-disabled)",
42
+ "relative flex min-w-0 cursor-default select-none items-center gap-(--lex-menu-item-gap) rounded-(--lex-menu-item-radius)",
43
+ "px-(--lex-menu-item-padding-x) py-(--lex-menu-item-padding-y) text-(length:--lex-menu-item-font-size) font-(--lex-menu-item-font-weight) leading-(--lex-menu-item-font-line-height)",
44
+ "text-(--lex-menu-item-foreground) outline-none",
45
+ "data-[highlighted]:bg-(--lex-menu-item-highlight-background) data-[highlighted]:text-(--lex-menu-item-highlight-foreground)",
46
+ "data-[checked]:bg-(--lex-menu-item-checked-background) data-[checked]:text-(--lex-menu-item-checked-foreground)",
47
+ "data-[disabled]:pointer-events-none data-[disabled]:opacity-(--lex-opacity-disabled)",
48
48
  ].join(" "),
49
49
  )
50
50
 
51
51
  export const menuItemTextVariants = cva("min-w-0 flex-1 truncate")
52
52
 
53
53
  export const menuItemIndicatorVariants = cva(
54
- "inline-flex size-(--lsys-menu-item-indicator-size) shrink-0 items-center justify-center text-current",
54
+ "inline-flex size-(--lex-menu-item-indicator-size) shrink-0 items-center justify-center text-current",
55
55
  )
56
56
 
57
57
  export const menuSubmenuTriggerIconVariants = cva(
58
- "ml-auto inline-flex size-(--lsys-menu-submenu-icon-size) shrink-0 items-center justify-center text-current",
58
+ "ml-auto inline-flex size-(--lex-menu-submenu-icon-size) shrink-0 items-center justify-center text-current",
59
59
  )
60
60
 
61
61
  export const menuArrowVariants = cva(
62
- "size-(--lsys-menu-arrow-size) rotate-45 border border-(--lsys-menu-popup-border-color) bg-(--lsys-menu-popup-background)",
62
+ "size-(--lex-menu-arrow-size) rotate-45 border border-(--lex-menu-popup-border-color) bg-(--lex-menu-popup-background)",
63
63
  )
64
64
 
65
- export const menuGroupVariants = cva("grid gap-(--lsys-menu-group-gap)")
65
+ export const menuGroupVariants = cva("grid gap-(--lex-menu-group-gap)")
66
66
 
67
67
  export const menuGroupLabelVariants = cva(
68
- "px-(--lsys-menu-item-padding-x) py-(--lsys-menu-group-label-padding-y) text-(length:--lsys-menu-group-label-font-size) font-(--lsys-menu-group-label-font-weight) leading-(--lsys-menu-group-label-font-line-height) text-(--lsys-menu-group-label-foreground)",
68
+ "px-(--lex-menu-item-padding-x) py-(--lex-menu-group-label-padding-y) text-(length:--lex-menu-group-label-font-size) font-(--lex-menu-group-label-font-weight) leading-(--lex-menu-group-label-font-line-height) text-(--lex-menu-group-label-foreground)",
69
69
  )
70
70
 
71
71
  export const menuSeparatorVariants = cva(
72
- "my-(--lsys-menu-separator-margin-y) h-px bg-(--lsys-menu-separator-background)",
72
+ "my-(--lex-menu-separator-margin-y) h-px bg-(--lex-menu-separator-background)",
73
73
  )
package/templates/primitives/Menubar/Menubar.variants.ts CHANGED
@@ -7,7 +7,7 @@
7
7
  import { cva } from "class-variance-authority"
8
8
 
9
9
  export const menubarVariants = cva(
10
- "flex items-center gap-(--lsys-menu-list-gap) rounded-(--lsys-menu-radius) border border-(--lsys-menu-trigger-border-color) bg-(--lsys-menu-trigger-background) p-(--lsys-menu-list-padding)",
10
+ "flex items-center gap-(--lex-menu-list-gap) rounded-(--lex-menu-radius) border border-(--lex-menu-trigger-border-color) bg-(--lex-menu-trigger-background) p-(--lex-menu-list-padding)",
11
11
  {
12
12
  variants: {
13
13
  orientation: {
package/templates/primitives/Meter/Meter.variants.ts CHANGED
@@ -7,29 +7,29 @@
7
7
  import { cva } from "class-variance-authority"
8
8
 
9
9
  export const meterVariants = cva(
10
- "grid gap-(--lsys-meter-gap) text-(length:--lsys-meter-label-font-size) leading-(--lsys-meter-label-font-line-height) text-(--lsys-meter-label-foreground)",
10
+ "grid gap-(--lex-meter-gap) text-(length:--lex-meter-label-font-size) leading-(--lex-meter-label-font-line-height) text-(--lex-meter-label-foreground)",
11
11
  )
12
12
 
13
13
  export const meterHeaderVariants = cva(
14
- "flex items-center justify-between gap-(--lsys-meter-header-gap)",
14
+ "flex items-center justify-between gap-(--lex-meter-header-gap)",
15
15
  )
16
16
 
17
17
  export const meterLabelVariants = cva(
18
- "font-(--lsys-meter-label-font-weight) text-(--lsys-meter-label-foreground)",
18
+ "font-(--lex-meter-label-font-weight) text-(--lex-meter-label-foreground)",
19
19
  )
20
20
 
21
21
  export const meterValueVariants = cva(
22
- "font-(--lsys-meter-value-font-weight) text-(--lsys-meter-value-foreground)",
22
+ "font-(--lex-meter-value-font-weight) text-(--lex-meter-value-foreground)",
23
23
  )
24
24
 
25
25
  export const meterTrackVariants = cva(
26
- "overflow-hidden rounded-(--lsys-meter-track-radius) bg-(--lsys-meter-track-background)",
26
+ "overflow-hidden rounded-(--lex-meter-track-radius) bg-(--lex-meter-track-background)",
27
27
  {
28
28
  variants: {
29
29
  size: {
30
- sm: "h-(--lsys-meter-track-height-sm)",
31
- md: "h-(--lsys-meter-track-height-md)",
32
- lg: "h-(--lsys-meter-track-height-lg)",
30
+ sm: "h-(--lex-meter-track-height-sm)",
31
+ md: "h-(--lex-meter-track-height-md)",
32
+ lg: "h-(--lex-meter-track-height-lg)",
33
33
  },
34
34
  },
35
35
  defaultVariants: {
@@ -40,8 +40,8 @@ export const meterTrackVariants = cva(
40
40
 
41
41
  export const meterIndicatorVariants = cva(
42
42
  [
43
- "h-full bg-(--lsys-meter-indicator-background) transition-transform",
44
- "duration-(--lsys-meter-transition-duration) ease-(--lsys-meter-transition-easing)",
45
- "data-[complete]:bg-(--lsys-meter-indicator-background-complete)",
43
+ "h-full bg-(--lex-meter-indicator-background) transition-transform",
44
+ "duration-(--lex-meter-transition-duration) ease-(--lex-meter-transition-easing)",
45
+ "data-[complete]:bg-(--lex-meter-indicator-background-complete)",
46
46
  ].join(" "),
47
47
  )
package/templates/primitives/NavigationMenu/NavigationMenu.variants.ts CHANGED
@@ -30,11 +30,11 @@ export const navigationMenuRootVariants = cva(
30
30
  )
31
31
 
32
32
  export const navigationMenuListVariants = cva(
33
- "flex flex-1 list-none items-center justify-center gap-(--lsys-menu-list-gap) p-(--lsys-menu-list-padding)",
33
+ "flex flex-1 list-none items-center justify-center gap-(--lex-menu-list-gap) p-(--lex-menu-list-padding)",
34
34
  )
35
35
 
36
36
  export const navigationMenuItemVariants = cva("relative")
37
37
 
38
38
  export const navigationMenuContentVariants = cva(
39
- "grid gap-(--lsys-menu-list-gap) p-(--lsys-menu-list-padding)",
39
+ "grid gap-(--lex-menu-list-gap) p-(--lex-menu-list-padding)",
40
40
  )