@nextui-org/theme 2.2.10 → 2.2.11

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.
@@ -5,11 +5,11 @@ import {
5
5
  // src/components/date-input.ts
6
6
  var dateInput = tv({
7
7
  slots: {
8
- base: "group/dateinput flex flex-col",
8
+ base: "group flex flex-col",
9
9
  label: [
10
10
  "block subpixel-antialiased text-small text-default-600",
11
- "group-data-[required=true]/dateinput:after:content-['*'] group-data-[required=true]/dateinput:after:text-danger group-data-[required=true]/dateinput:after:ml-0.5",
12
- "group-data-[invalid=true]/dateinput:text-danger"
11
+ "group-data-[required=true]:after:content-['*'] group-data-[required=true]:after:text-danger group-data-[required=true]:after:ml-0.5",
12
+ "group-data-[invalid=true]:text-danger"
13
13
  ],
14
14
  inputWrapper: [
15
15
  "relative px-3 gap-3 w-full inline-flex flex-row items-center",
@@ -18,10 +18,10 @@ var dateInput = tv({
18
18
  input: "flex h-full gap-x-0.5 w-full font-normal",
19
19
  innerWrapper: [
20
20
  "flex items-center text-default-400 w-full gap-x-2 h-6",
21
- "group-data-[invalid=true]/dateinput:text-danger"
21
+ "group-data-[invalid=true]:text-danger"
22
22
  ],
23
23
  segment: [
24
- "group/dateinput first:-ml-0.5 [&:not(:first-child)]:-ml-1 px-0.5 my-auto box-content tabular-nums text-start",
24
+ "group first:-ml-0.5 [&:not(:first-child)]:-ml-1 px-0.5 my-auto box-content tabular-nums text-start",
25
25
  "inline-block outline-none focus:shadow-sm rounded-md",
26
26
  "text-foreground-500 data-[editable=true]:text-foreground",
27
27
  "data-[editable=true]:data-[placeholder=true]:text-foreground-500",
@@ -29,7 +29,7 @@ var dateInput = tv({
29
29
  "data-[invalid=true]:focus:bg-danger-400/50 dark:data-[invalid=true]:focus:bg-danger-400/20",
30
30
  "data-[invalid=true]:data-[editable=true]:focus:text-danger"
31
31
  ],
32
- helperWrapper: "hidden group-data-[has-helper=true]/dateinput:flex p-1 relative flex-col gap-1.5",
32
+ helperWrapper: "hidden group-data-[has-helper=true]:flex p-1 relative flex-col gap-1.5",
33
33
  description: "text-tiny text-foreground-400",
34
34
  errorMessage: "text-tiny text-danger"
35
35
  },
@@ -40,9 +40,9 @@ var dateInput = tv({
40
40
  "bg-default-100",
41
41
  "hover:bg-default-200",
42
42
  "focus-within:hover:bg-default-100",
43
- "group-data-[invalid=true]/dateinput:bg-danger-50",
44
- "group-data-[invalid=true]/dateinput:hover:bg-danger-100",
45
- "group-data-[invalid=true]/dateinput:focus-within:hover:bg-danger-50"
43
+ "group-data-[invalid=true]:bg-danger-50",
44
+ "group-data-[invalid=true]:hover:bg-danger-100",
45
+ "group-data-[invalid=true]:focus-within:hover:bg-danger-50"
46
46
  ]
47
47
  },
48
48
  faded: {
@@ -51,9 +51,9 @@ var dateInput = tv({
51
51
  "border-medium",
52
52
  "border-default-200",
53
53
  "hover:border-default-400",
54
- "group-data-[invalid=true]/dateinput:bg-danger-50",
55
- "group-data-[invalid=true]/dateinput:hover:bg-danger-100",
56
- "group-data-[invalid=true]/dateinput:focus-within:hover:bg-danger-50"
54
+ "group-data-[invalid=true]:bg-danger-50",
55
+ "group-data-[invalid=true]:hover:bg-danger-100",
56
+ "group-data-[invalid=true]:focus-within:hover:bg-danger-50"
57
57
  ]
58
58
  },
59
59
  bordered: {
@@ -63,9 +63,9 @@ var dateInput = tv({
63
63
  "hover:border-default-400",
64
64
  "focus-within:border-default-foreground",
65
65
  "focus-within:hover:border-default-foreground",
66
- "group-data-[invalid=true]/dateinput:border-danger",
67
- "group-data-[invalid=true]/dateinput:hover:border-danger",
68
- "group-data-[invalid=true]/dateinput:focus-within:hover:border-danger"
66
+ "group-data-[invalid=true]:border-danger",
67
+ "group-data-[invalid=true]:hover:border-danger",
68
+ "group-data-[invalid=true]:focus-within:hover:border-danger"
69
69
  ]
70
70
  },
71
71
  underlined: {
@@ -90,7 +90,7 @@ var dateInput = tv({
90
90
  "after:-bottom-[2px]",
91
91
  "after:h-[2px]",
92
92
  "focus-within:after:w-full",
93
- "group-data-[invalid=true]/dateinput:after:bg-danger"
93
+ "group-data-[invalid=true]:after:bg-danger"
94
94
  ]
95
95
  }
96
96
  },
@@ -8,7 +8,7 @@ import {
8
8
  // src/components/toggle.ts
9
9
  var toggle = tv({
10
10
  slots: {
11
- base: "group/toggle relative max-w-fit inline-flex items-center justify-start cursor-pointer touch-none tap-highlight-transparent select-none",
11
+ base: "group relative max-w-fit inline-flex items-center justify-start cursor-pointer touch-none tap-highlight-transparent select-none",
12
12
  wrapper: [
13
13
  "px-1",
14
14
  "relative",
@@ -40,37 +40,37 @@ var toggle = tv({
40
40
  color: {
41
41
  default: {
42
42
  wrapper: [
43
- "group-data-[selected=true]/toggle:bg-default-400",
44
- "group-data-[selected=true]/toggle:text-default-foreground"
43
+ "group-data-[selected=true]:bg-default-400",
44
+ "group-data-[selected=true]:text-default-foreground"
45
45
  ]
46
46
  },
47
47
  primary: {
48
48
  wrapper: [
49
- "group-data-[selected=true]/toggle:bg-primary",
50
- "group-data-[selected=true]/toggle:text-primary-foreground"
49
+ "group-data-[selected=true]:bg-primary",
50
+ "group-data-[selected=true]:text-primary-foreground"
51
51
  ]
52
52
  },
53
53
  secondary: {
54
54
  wrapper: [
55
- "group-data-[selected=true]/toggle:bg-secondary",
56
- "group-data-[selected=true]/toggle:text-secondary-foreground"
55
+ "group-data-[selected=true]:bg-secondary",
56
+ "group-data-[selected=true]:text-secondary-foreground"
57
57
  ]
58
58
  },
59
59
  success: {
60
60
  wrapper: [
61
- "group-data-[selected=true]/toggle:bg-success",
62
- "group-data-[selected=true]/toggle:text-success-foreground"
61
+ "group-data-[selected=true]:bg-success",
62
+ "group-data-[selected=true]:text-success-foreground"
63
63
  ]
64
64
  },
65
65
  warning: {
66
66
  wrapper: [
67
- "group-data-[selected=true]/toggle:bg-warning",
68
- "group-data-[selected=true]/toggle:text-warning-foreground"
67
+ "group-data-[selected=true]:bg-warning",
68
+ "group-data-[selected=true]:text-warning-foreground"
69
69
  ]
70
70
  },
71
71
  danger: {
72
72
  wrapper: [
73
- "group-data-[selected=true]/toggle:bg-danger",
73
+ "group-data-[selected=true]:bg-danger",
74
74
  "data-[selected=true]:text-danger-foreground"
75
75
  ]
76
76
  }
@@ -80,7 +80,7 @@ var toggle = tv({
80
80
  wrapper: "w-10 h-6 mr-2 rtl:ml-2 rtl:mr-[unset]",
81
81
  thumb: [
82
82
  "w-4 h-4 text-tiny",
83
- "group-data-[selected=true]/toggle:ml-4 rtl:group-data-[selected=true]/toggle:ml-0 rtl:group-data-[selected=true]/toggle:mr-4"
83
+ "group-data-[selected=true]:ml-4 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-4"
84
84
  ],
85
85
  endContent: "text-tiny",
86
86
  startContent: "text-tiny",
@@ -90,7 +90,7 @@ var toggle = tv({
90
90
  wrapper: "w-12 h-7 mr-2 rtl:ml-2 rtl:mr-[unset]",
91
91
  thumb: [
92
92
  "w-5 h-5 text-small",
93
- "group-data-[selected=true]/toggle:ml-5 rtl:group-data-[selected=true]/toggle:ml-0 rtl:group-data-[selected=true]/toggle:mr-5"
93
+ "group-data-[selected=true]:ml-5 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-5"
94
94
  ],
95
95
  endContent: "text-small",
96
96
  startContent: "text-small",
@@ -100,7 +100,7 @@ var toggle = tv({
100
100
  wrapper: "w-14 h-8 mr-2 rtl:ml-2 rtl:mr-[unset]",
101
101
  thumb: [
102
102
  "w-6 h-6 text-medium",
103
- "group-data-[selected=true]/toggle:ml-6 rtl:group-data-[selected=true]/toggle:ml-0 rtl:group-data-[selected=true]/toggle:mr-6"
103
+ "group-data-[selected=true]:ml-6 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-6"
104
104
  ],
105
105
  endContent: "text-medium",
106
106
  startContent: "text-medium",
@@ -124,14 +124,14 @@ var toggle = tv({
124
124
  "opacity-0",
125
125
  "scale-50",
126
126
  "transition-transform-opacity",
127
- "group-data-[selected=true]/toggle:scale-100",
128
- "group-data-[selected=true]/toggle:opacity-100"
127
+ "group-data-[selected=true]:scale-100",
128
+ "group-data-[selected=true]:opacity-100"
129
129
  ],
130
130
  endContent: [
131
131
  "opacity-100",
132
132
  "transition-transform-opacity",
133
- "group-data-[selected=true]/toggle:translate-x-3",
134
- "group-data-[selected=true]/toggle:opacity-0"
133
+ "group-data-[selected=true]:translate-x-3",
134
+ "group-data-[selected=true]:opacity-0"
135
135
  ]
136
136
  }
137
137
  }
@@ -146,30 +146,21 @@ var toggle = tv({
146
146
  disableAnimation: false,
147
147
  size: "sm",
148
148
  class: {
149
- thumb: [
150
- "group-data-[pressed=true]/toggle:w-5",
151
- "group-data-[selected]/toggle:group-data-[pressed]/toggle:ml-3"
152
- ]
149
+ thumb: ["group-data-[pressed=true]:w-5", "group-data-[selected]:group-data-[pressed]:ml-3"]
153
150
  }
154
151
  },
155
152
  {
156
153
  disableAnimation: false,
157
154
  size: "md",
158
155
  class: {
159
- thumb: [
160
- "group-data-[pressed=true]/toggle:w-6",
161
- "group-data-[selected]/toggle:group-data-[pressed]/toggle:ml-4"
162
- ]
156
+ thumb: ["group-data-[pressed=true]:w-6", "group-data-[selected]:group-data-[pressed]:ml-4"]
163
157
  }
164
158
  },
165
159
  {
166
160
  disableAnimation: false,
167
161
  size: "lg",
168
162
  class: {
169
- thumb: [
170
- "group-data-[pressed=true]/toggle:w-7",
171
- "group-data-[selected]/toggle:group-data-[pressed]/toggle:ml-5"
172
- ]
163
+ thumb: ["group-data-[pressed=true]:w-7", "group-data-[selected]:group-data-[pressed]:ml-5"]
173
164
  }
174
165
  }
175
166
  ]
@@ -8,7 +8,7 @@ import {
8
8
  // src/components/radio.ts
9
9
  var radio = tv({
10
10
  slots: {
11
- base: "group/radio relative max-w-fit inline-flex items-center justify-start cursor-pointer tap-highlight-transparent p-2 -m-2 select-none",
11
+ base: "group relative max-w-fit inline-flex items-center justify-start cursor-pointer tap-highlight-transparent p-2 -m-2 select-none",
12
12
  wrapper: [
13
13
  "relative",
14
14
  "inline-flex",
@@ -21,7 +21,7 @@ var radio = tv({
21
21
  "box-border",
22
22
  "border-default",
23
23
  "rounded-full",
24
- "group-data-[hover-unselected=true]/radio:bg-default-100",
24
+ "group-data-[hover-unselected=true]:bg-default-100",
25
25
  ...groupDataFocusVisibleClasses
26
26
  ],
27
27
  labelWrapper: "flex flex-col ml-1",
@@ -33,8 +33,8 @@ var radio = tv({
33
33
  "scale-0",
34
34
  "origin-center",
35
35
  "rounded-full",
36
- "group-data-[selected=true]/radio:opacity-100",
37
- "group-data-[selected=true]/radio:scale-100"
36
+ "group-data-[selected=true]:opacity-100",
37
+ "group-data-[selected=true]:scale-100"
38
38
  ],
39
39
  label: "relative text-foreground select-none",
40
40
  description: "relative text-foreground-400"
@@ -43,27 +43,27 @@ var radio = tv({
43
43
  color: {
44
44
  default: {
45
45
  control: "bg-default-500 text-default-foreground",
46
- wrapper: "group-data-[selected=true]/radio:border-default-500"
46
+ wrapper: "group-data-[selected=true]:border-default-500"
47
47
  },
48
48
  primary: {
49
49
  control: "bg-primary text-primary-foreground",
50
- wrapper: "group-data-[selected=true]/radio:border-primary"
50
+ wrapper: "group-data-[selected=true]:border-primary"
51
51
  },
52
52
  secondary: {
53
53
  control: "bg-secondary text-secondary-foreground",
54
- wrapper: "group-data-[selected=true]/radio:border-secondary"
54
+ wrapper: "group-data-[selected=true]:border-secondary"
55
55
  },
56
56
  success: {
57
57
  control: "bg-success text-success-foreground",
58
- wrapper: "group-data-[selected=true]/radio:border-success"
58
+ wrapper: "group-data-[selected=true]:border-success"
59
59
  },
60
60
  warning: {
61
61
  control: "bg-warning text-warning-foreground",
62
- wrapper: "group-data-[selected=true]/radio:border-warning"
62
+ wrapper: "group-data-[selected=true]:border-warning"
63
63
  },
64
64
  danger: {
65
65
  control: "bg-danger text-danger-foreground",
66
- wrapper: "group-data-[selected=true]/radio:border-danger"
66
+ wrapper: "group-data-[selected=true]:border-danger"
67
67
  }
68
68
  },
69
69
  size: {
@@ -97,7 +97,7 @@ var radio = tv({
97
97
  isInvalid: {
98
98
  true: {
99
99
  control: "bg-danger text-danger-foreground",
100
- wrapper: "border-danger group-data-[selected=true]/radio:border-danger",
100
+ wrapper: "border-danger group-data-[selected=true]:border-danger",
101
101
  label: "text-danger",
102
102
  description: "text-danger-300"
103
103
  }
@@ -106,7 +106,7 @@ var radio = tv({
106
106
  true: {},
107
107
  false: {
108
108
  wrapper: [
109
- "group-data-[pressed=true]/radio:scale-95",
109
+ "group-data-[pressed=true]:scale-95",
110
110
  "transition-transform-colors",
111
111
  "motion-reduce:transition-none"
112
112
  ],
@@ -8,7 +8,7 @@ import {
8
8
  // src/components/checkbox.ts
9
9
  var checkbox = tv({
10
10
  slots: {
11
- base: "group/checkbox relative max-w-fit inline-flex items-center justify-start cursor-pointer tap-highlight-transparent p-2 -m-2 select-none",
11
+ base: "group relative max-w-fit inline-flex items-center justify-start cursor-pointer tap-highlight-transparent p-2 -m-2 select-none",
12
12
  wrapper: [
13
13
  "relative",
14
14
  "inline-flex",
@@ -29,12 +29,12 @@ var checkbox = tv({
29
29
  "after:scale-50",
30
30
  "after:opacity-0",
31
31
  "after:origin-center",
32
- "group-data-[selected=true]/checkbox:after:scale-100",
33
- "group-data-[selected=true]/checkbox:after:opacity-100",
34
- "group-data-[hover=true]/checkbox:before:bg-default-100",
32
+ "group-data-[selected=true]:after:scale-100",
33
+ "group-data-[selected=true]:after:opacity-100",
34
+ "group-data-[hover=true]:before:bg-default-100",
35
35
  ...groupDataFocusVisibleClasses
36
36
  ],
37
- icon: "z-10 w-4 h-3 opacity-0 group-data-[selected=true]/checkbox:opacity-100",
37
+ icon: "z-10 w-4 h-3 opacity-0 group-data-[selected=true]:opacity-100",
38
38
  label: "relative text-foreground select-none"
39
39
  },
40
40
  variants: {
@@ -130,8 +130,8 @@ var checkbox = tv({
130
130
  "before:bg-foreground",
131
131
  "before:w-0",
132
132
  "before:h-0.5",
133
- "group-data-[selected=true]/checkbox:opacity-60",
134
- "group-data-[selected=true]/checkbox:before:w-full"
133
+ "group-data-[selected=true]:opacity-60",
134
+ "group-data-[selected=true]:before:w-full"
135
135
  ]
136
136
  }
137
137
  },
@@ -155,7 +155,7 @@ var checkbox = tv({
155
155
  false: {
156
156
  wrapper: [
157
157
  "before:transition-colors",
158
- "group-data-[pressed=true]/checkbox:scale-95",
158
+ "group-data-[pressed=true]:scale-95",
159
159
  "transition-transform",
160
160
  "after:transition-transform-opacity",
161
161
  "after:!ease-linear",
@@ -8,7 +8,7 @@ import {
8
8
  // src/components/select.ts
9
9
  var select = tv({
10
10
  slots: {
11
- base: ["group/select inline-flex flex-col relative w-full"],
11
+ base: ["group inline-flex flex-col relative w-full"],
12
12
  label: [
13
13
  "block",
14
14
  "absolute",
@@ -39,7 +39,7 @@ var select = tv({
39
39
  trigger: [
40
40
  "bg-default-100",
41
41
  "data-[hover=true]:bg-default-200",
42
- "group-data-[focus=true]/select:bg-default-100"
42
+ "group-data-[focus=true]:bg-default-100"
43
43
  ]
44
44
  },
45
45
  faded: {
@@ -50,7 +50,7 @@ var select = tv({
50
50
  "border-default-200",
51
51
  "data-[hover=true]:border-default-400"
52
52
  ],
53
- value: "group-data-[has-value=true]/select:text-default-foreground"
53
+ value: "group-data-[has-value=true]:text-default-foreground"
54
54
  },
55
55
  bordered: {
56
56
  trigger: [
@@ -87,7 +87,7 @@ var select = tv({
87
87
  "data-[open=true]:after:w-full",
88
88
  "data-[focus=true]:after:w-full"
89
89
  ],
90
- value: "group-data-[has-value=true]/select:text-default-foreground"
90
+ value: "group-data-[has-value=true]:text-default-foreground"
91
91
  }
92
92
  },
93
93
  color: {
@@ -218,7 +218,7 @@ var select = tv({
218
218
  variant: "flat",
219
219
  color: "default",
220
220
  class: {
221
- value: "group-data-[has-value=true]/select:text-default-foreground",
221
+ value: "group-data-[has-value=true]:text-default-foreground",
222
222
  trigger: ["bg-default-100", "data-[hover=true]:bg-default-50"]
223
223
  }
224
224
  },
@@ -230,7 +230,7 @@ var select = tv({
230
230
  "bg-primary-100",
231
231
  "text-primary",
232
232
  "data-[hover=true]:bg-primary-50",
233
- "group-data-[focus=true]/select:bg-primary-50"
233
+ "group-data-[focus=true]:bg-primary-50"
234
234
  ],
235
235
  value: "text-primary",
236
236
  label: "text-primary"
@@ -244,7 +244,7 @@ var select = tv({
244
244
  "bg-secondary-100",
245
245
  "text-secondary",
246
246
  "data-[hover=true]:bg-secondary-50",
247
- "group-data-[focus=true]/select:bg-secondary-50"
247
+ "group-data-[focus=true]:bg-secondary-50"
248
248
  ],
249
249
  value: "text-secondary",
250
250
  label: "text-secondary"
@@ -259,7 +259,7 @@ var select = tv({
259
259
  "text-success-600",
260
260
  "dark:text-success",
261
261
  "data-[hover=true]:bg-success-50",
262
- "group-data-[focus=true]/select:bg-success-50"
262
+ "group-data-[focus=true]:bg-success-50"
263
263
  ],
264
264
  value: "text-success-600 dark:text-success",
265
265
  label: "text-success-600 dark:text-success"
@@ -274,7 +274,7 @@ var select = tv({
274
274
  "text-warning-600",
275
275
  "dark:text-warning",
276
276
  "data-[hover=true]:bg-warning-50",
277
- "group-data-[focus=true]/select:bg-warning-50"
277
+ "group-data-[focus=true]:bg-warning-50"
278
278
  ],
279
279
  value: "text-warning-600 dark:text-warning",
280
280
  label: "text-warning-600 dark:text-warning"
@@ -289,7 +289,7 @@ var select = tv({
289
289
  "text-danger",
290
290
  "dark:text-danger-500",
291
291
  "data-[hover=true]:bg-danger-50",
292
- "group-data-[focus=true]/select:bg-danger-50"
292
+ "group-data-[focus=true]:bg-danger-50"
293
293
  ],
294
294
  value: "text-danger dark:text-danger-500",
295
295
  label: "text-danger dark:text-danger-500"
@@ -339,7 +339,7 @@ var select = tv({
339
339
  variant: "underlined",
340
340
  color: "default",
341
341
  class: {
342
- value: "group-data-[has-value=true]/select:text-foreground"
342
+ value: "group-data-[has-value=true]:text-foreground"
343
343
  }
344
344
  },
345
345
  {
@@ -426,14 +426,14 @@ var select = tv({
426
426
  labelPlacement: "inside",
427
427
  color: "default",
428
428
  class: {
429
- label: "group-data-[filled=true]/select:text-default-600"
429
+ label: "group-data-[filled=true]:text-default-600"
430
430
  }
431
431
  },
432
432
  {
433
433
  labelPlacement: "outside",
434
434
  color: "default",
435
435
  class: {
436
- label: "group-data-[filled=true]/select:text-foreground"
436
+ label: "group-data-[filled=true]:text-foreground"
437
437
  }
438
438
  },
439
439
  {
@@ -486,7 +486,7 @@ var select = tv({
486
486
  trigger: [
487
487
  "bg-danger-50",
488
488
  "data-[hover=true]:bg-danger-100",
489
- "group-data-[focus=true]/select:bg-danger-50"
489
+ "group-data-[focus=true]:bg-danger-50"
490
490
  ]
491
491
  }
492
492
  },
@@ -494,7 +494,7 @@ var select = tv({
494
494
  isInvalid: true,
495
495
  variant: "bordered",
496
496
  class: {
497
- trigger: "!border-danger group-data-[focus=true]/select:border-danger"
497
+ trigger: "!border-danger group-data-[focus=true]:border-danger"
498
498
  }
499
499
  },
500
500
  {
@@ -531,19 +531,13 @@ var select = tv({
531
531
  isMultiline: false,
532
532
  class: {
533
533
  base: "group relative justify-end",
534
- label: [
535
- "pb-0",
536
- "z-20",
537
- "top-1/2",
538
- "-translate-y-1/2",
539
- "group-data-[filled=true]/select:start-0"
540
- ]
534
+ label: ["pb-0", "z-20", "top-1/2", "-translate-y-1/2", "group-data-[filled=true]:start-0"]
541
535
  }
542
536
  },
543
537
  {
544
538
  labelPlacement: ["inside"],
545
539
  class: {
546
- label: "group-data-[filled=true]/select:scale-85"
540
+ label: "group-data-[filled=true]:scale-85"
547
541
  }
548
542
  },
549
543
  {
@@ -558,10 +552,8 @@ var select = tv({
558
552
  isMultiline: false,
559
553
  size: "sm",
560
554
  class: {
561
- label: [
562
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px)]"
563
- ],
564
- innerWrapper: "group-data-[has-label=true]/select:pt-4"
555
+ label: ["group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px)]"],
556
+ innerWrapper: "group-data-[has-label=true]:pt-4"
565
557
  }
566
558
  },
567
559
  {
@@ -570,9 +562,9 @@ var select = tv({
570
562
  size: "md",
571
563
  class: {
572
564
  label: [
573
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px)]"
565
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px)]"
574
566
  ],
575
- innerWrapper: "group-data-[has-label=true]/select:pt-4"
567
+ innerWrapper: "group-data-[has-label=true]:pt-4"
576
568
  }
577
569
  },
578
570
  {
@@ -582,9 +574,9 @@ var select = tv({
582
574
  class: {
583
575
  label: [
584
576
  "text-medium",
585
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px)]"
577
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px)]"
586
578
  ],
587
- innerWrapper: "group-data-[has-label=true]/select:pt-5"
579
+ innerWrapper: "group-data-[has-label=true]:pt-5"
588
580
  }
589
581
  },
590
582
  {
@@ -594,7 +586,7 @@ var select = tv({
594
586
  size: "sm",
595
587
  class: {
596
588
  label: [
597
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px_-_theme(borderWidth.medium))]"
589
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px_-_theme(borderWidth.medium))]"
598
590
  ]
599
591
  }
600
592
  },
@@ -605,7 +597,7 @@ var select = tv({
605
597
  size: "md",
606
598
  class: {
607
599
  label: [
608
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px_-_theme(borderWidth.medium))]"
600
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px_-_theme(borderWidth.medium))]"
609
601
  ]
610
602
  }
611
603
  },
@@ -617,7 +609,7 @@ var select = tv({
617
609
  class: {
618
610
  label: [
619
611
  "text-medium",
620
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px_-_theme(borderWidth.medium))]"
612
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px_-_theme(borderWidth.medium))]"
621
613
  ]
622
614
  }
623
615
  },
@@ -627,9 +619,7 @@ var select = tv({
627
619
  isMultiline: false,
628
620
  size: "sm",
629
621
  class: {
630
- label: [
631
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_5px)]"
632
- ]
622
+ label: ["group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_5px)]"]
633
623
  }
634
624
  },
635
625
  {
@@ -639,7 +629,7 @@ var select = tv({
639
629
  size: "md",
640
630
  class: {
641
631
  label: [
642
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_3.5px)]"
632
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_3.5px)]"
643
633
  ]
644
634
  }
645
635
  },
@@ -651,7 +641,7 @@ var select = tv({
651
641
  class: {
652
642
  label: [
653
643
  "text-medium",
654
- "group-data-[filled=true]/select:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_4px)]"
644
+ "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_4px)]"
655
645
  ]
656
646
  }
657
647
  },
@@ -663,7 +653,7 @@ var select = tv({
663
653
  label: [
664
654
  "start-2",
665
655
  "text-tiny",
666
- "group-data-[filled=true]/select:-translate-y-[calc(100%_+_theme(fontSize.tiny)/2_+_16px)]"
656
+ "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.tiny)/2_+_16px)]"
667
657
  ],
668
658
  base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_8px)]"
669
659
  }
@@ -676,7 +666,7 @@ var select = tv({
676
666
  label: [
677
667
  "start-3",
678
668
  "text-small",
679
- "group-data-[filled=true]/select:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_20px)]"
669
+ "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_20px)]"
680
670
  ],
681
671
  base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_10px)]"
682
672
  }
@@ -689,7 +679,7 @@ var select = tv({
689
679
  label: [
690
680
  "start-3",
691
681
  "text-medium",
692
- "group-data-[filled=true]/select:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_24px)]"
682
+ "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_24px)]"
693
683
  ],
694
684
  base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_12px)]"
695
685
  }