unplugin-docubook 1.1.2 → 1.2.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/README.md +303 -16
- package/dist/components/index.cjs +56 -53
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.js +56 -53
- package/dist/components/index.js.map +1 -1
- package/dist/components/theme.css +121 -0
- package/dist/components/theme.css.map +1 -0
- package/package.json +3 -2
package/dist/components/index.js
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
"use client";
|
|
1
3
|
var __defProp = Object.defineProperty;
|
|
2
4
|
var __defProps = Object.defineProperties;
|
|
3
5
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
@@ -154,37 +156,38 @@ var themeTokens = {
|
|
|
154
156
|
var componentStyles = {
|
|
155
157
|
// Button variations
|
|
156
158
|
button: {
|
|
157
|
-
base: "inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
|
|
159
|
+
base: "inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 focus-visible:ring-offset-[hsl(var(--background))] disabled:pointer-events-none disabled:opacity-50",
|
|
158
160
|
sizes: {
|
|
159
161
|
sm: "h-8 px-3 text-xs",
|
|
160
162
|
md: "h-9 px-4 py-2 text-sm",
|
|
161
163
|
lg: "h-10 px-6 text-base"
|
|
162
164
|
},
|
|
163
165
|
variations: {
|
|
164
|
-
primary: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
165
|
-
accent: "bg-accent text-accent-foreground hover:bg-accent/90",
|
|
166
|
-
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
|
|
167
|
-
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
168
|
-
link: "text-primary underline-offset-4 hover:underline"
|
|
166
|
+
primary: "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] hover:bg-[hsl(var(--primary))]/90",
|
|
167
|
+
accent: "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))] hover:bg-[hsl(var(--accent))]/90",
|
|
168
|
+
outline: "border border-[hsl(var(--input))] bg-[hsl(var(--background))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
|
|
169
|
+
ghost: "hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
|
|
170
|
+
link: "text-[hsl(var(--primary))] underline-offset-4 hover:underline"
|
|
169
171
|
}
|
|
170
172
|
},
|
|
171
173
|
// Card variations
|
|
172
174
|
card: {
|
|
173
|
-
base: "rounded-lg border bg-card text-card-foreground shadow-sm",
|
|
175
|
+
base: "rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] text-[hsl(var(--card-foreground))] shadow-sm",
|
|
174
176
|
header: "flex flex-col space-y-1.5 p-6",
|
|
175
177
|
content: "p-6 pt-0",
|
|
176
178
|
footer: "flex items-center p-6 pt-0",
|
|
177
179
|
title: "text-2xl font-semibold leading-none tracking-tight",
|
|
178
|
-
description: "text-sm text-muted-foreground"
|
|
180
|
+
description: "text-sm text-[hsl(var(--muted-foreground))]"
|
|
179
181
|
},
|
|
180
182
|
// Note/Alert variations
|
|
183
|
+
// Using HSL variables with proper semantic color classes
|
|
181
184
|
note: {
|
|
182
|
-
base: "relative w-full rounded-lg border p-4",
|
|
185
|
+
base: "relative w-full rounded-lg border p-4 border-l-4",
|
|
183
186
|
variants: {
|
|
184
|
-
note: "bg-[var(--
|
|
185
|
-
danger: "bg-[var(--
|
|
186
|
-
warning: "bg-[var(--
|
|
187
|
-
success: "bg-[var(--
|
|
187
|
+
note: "bg-[hsl(var(--note-bg))] border-[hsl(var(--note-border))] border-l-[hsl(var(--note-accent))] text-[hsl(var(--note-text))]",
|
|
188
|
+
danger: "bg-[hsl(var(--danger-bg))] border-[hsl(var(--danger-border))] border-l-[hsl(var(--danger-accent))] text-[hsl(var(--danger-text))]",
|
|
189
|
+
warning: "bg-[hsl(var(--warning-bg))] border-[hsl(var(--warning-border))] border-l-[hsl(var(--warning-accent))] text-[hsl(var(--warning-text))]",
|
|
190
|
+
success: "bg-[hsl(var(--success-bg))] border-[hsl(var(--success-border))] border-l-[hsl(var(--success-accent))] text-[hsl(var(--success-text))]"
|
|
188
191
|
},
|
|
189
192
|
icon: "absolute left-4 top-4 h-5 w-5",
|
|
190
193
|
content: "pl-8",
|
|
@@ -193,133 +196,133 @@ var componentStyles = {
|
|
|
193
196
|
},
|
|
194
197
|
// Accordion
|
|
195
198
|
accordion: {
|
|
196
|
-
base: "rounded-lg border bg-card",
|
|
197
|
-
item: "border-b last:border-b-0",
|
|
198
|
-
trigger: "flex w-full items-center justify-between p-4 font-medium transition-all hover:bg-muted [&[data-state=open]>svg]:rotate-180",
|
|
199
|
+
base: "rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))]",
|
|
200
|
+
item: "border-b border-[hsl(var(--border))] last:border-b-0",
|
|
201
|
+
trigger: "flex w-full items-center justify-between p-4 font-medium transition-all hover:bg-[hsl(var(--muted))] [&[data-state=open]>svg]:rotate-180",
|
|
199
202
|
content: "overflow-hidden transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
|
|
200
203
|
contentInner: "p-4 pt-0"
|
|
201
204
|
},
|
|
202
205
|
// Tooltip
|
|
203
206
|
tooltip: {
|
|
204
|
-
content: "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm
|
|
207
|
+
content: "z-50 overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md px-3 py-1.5 text-sm animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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"
|
|
205
208
|
},
|
|
206
209
|
// Kbd
|
|
207
210
|
kbd: {
|
|
208
|
-
base: "pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded border bg-muted px-1.5 font-mono text-[10px] font-medium text-muted-foreground opacity-100"
|
|
211
|
+
base: "pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded border border-[hsl(var(--border))] bg-[hsl(var(--muted))] px-1.5 font-mono text-[10px] font-medium text-[hsl(var(--muted-foreground))] opacity-100"
|
|
209
212
|
},
|
|
210
213
|
// Stepper
|
|
211
214
|
stepper: {
|
|
212
215
|
base: "flex w-full items-start gap-2",
|
|
213
216
|
item: "flex-1",
|
|
214
217
|
trigger: "flex items-center gap-2",
|
|
215
|
-
indicator: "flex h-8 w-8 items-center justify-center rounded-full border text-sm font-medium",
|
|
218
|
+
indicator: "flex h-8 w-8 items-center justify-center rounded-full border border-[hsl(var(--border))] text-sm font-medium",
|
|
216
219
|
title: "text-sm font-medium",
|
|
217
|
-
description: "text-xs text-muted-foreground",
|
|
218
|
-
separator: "flex-1 h-[1px] bg-border mt-4"
|
|
220
|
+
description: "text-xs text-[hsl(var(--muted-foreground))]",
|
|
221
|
+
separator: "flex-1 h-[1px] bg-[hsl(var(--border))] mt-4"
|
|
219
222
|
},
|
|
220
223
|
// File Tree
|
|
221
224
|
fileTree: {
|
|
222
|
-
base: "rounded-lg border bg-card p-4",
|
|
225
|
+
base: "rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4",
|
|
223
226
|
folder: "font-medium",
|
|
224
|
-
file: "text-muted-foreground",
|
|
225
|
-
indent: "ml-4 pl-4 border-l"
|
|
227
|
+
file: "text-[hsl(var(--muted-foreground))]",
|
|
228
|
+
indent: "ml-4 pl-4 border-l border-[hsl(var(--border))]"
|
|
226
229
|
},
|
|
227
230
|
// Copy button
|
|
228
231
|
copy: {
|
|
229
|
-
base: "absolute right-4 top-4 inline-flex h-6 w-6 items-center justify-center rounded-md border bg-background text-foreground opacity-0 transition-opacity hover:bg-muted focus:outline-none group-hover:opacity-100",
|
|
232
|
+
base: "absolute right-4 top-4 inline-flex h-6 w-6 items-center justify-center rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))] text-[hsl(var(--foreground))] opacity-0 transition-opacity hover:bg-[hsl(var(--muted))] focus:outline-none group-hover:opacity-100",
|
|
230
233
|
icon: "h-3 w-3"
|
|
231
234
|
},
|
|
232
235
|
// Pre (code block)
|
|
233
236
|
pre: {
|
|
234
|
-
base: "relative mb-4 mt-6 overflow-x-auto rounded-lg border bg-muted p-4 font-mono text-sm",
|
|
237
|
+
base: "relative mb-4 mt-6 overflow-x-auto rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--muted))] p-4 font-mono text-sm",
|
|
235
238
|
withCopy: "pr-12"
|
|
236
239
|
},
|
|
237
240
|
// Release
|
|
238
241
|
release: {
|
|
239
242
|
base: "space-y-4",
|
|
240
243
|
version: "text-2xl font-bold",
|
|
241
|
-
date: "text-sm text-muted-foreground",
|
|
244
|
+
date: "text-sm text-[hsl(var(--muted-foreground))]",
|
|
242
245
|
changes: "space-y-2",
|
|
243
246
|
changeItem: "flex items-start gap-2",
|
|
244
|
-
badge: "inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-semibold transition-colors",
|
|
247
|
+
badge: "inline-flex items-center rounded-full border border-[hsl(var(--border))] px-2 py-0.5 text-xs font-semibold transition-colors",
|
|
245
248
|
badgeVariants: {
|
|
246
|
-
major: "bg-
|
|
247
|
-
minor: "bg-
|
|
248
|
-
patch: "bg-
|
|
249
|
+
major: "bg-[hsl(var(--destructive))]/10 text-[hsl(var(--destructive))] border-[hsl(var(--destructive))]/20",
|
|
250
|
+
minor: "bg-[hsl(var(--primary))]/10 text-[hsl(var(--primary))] border-[hsl(var(--primary))]/20",
|
|
251
|
+
patch: "bg-[hsl(var(--success))]/10 text-[hsl(var(--success))] border-[hsl(var(--success))]/20"
|
|
249
252
|
}
|
|
250
253
|
},
|
|
251
254
|
// YouTube
|
|
252
255
|
youtube: {
|
|
253
|
-
container: "relative aspect-video w-full overflow-hidden rounded-lg border",
|
|
256
|
+
container: "relative aspect-video w-full overflow-hidden rounded-lg border border-[hsl(var(--border))]",
|
|
254
257
|
iframe: "absolute inset-0 h-full w-full"
|
|
255
258
|
},
|
|
256
259
|
// Image
|
|
257
260
|
image: {
|
|
258
|
-
base: "rounded-lg border",
|
|
259
|
-
caption: "mt-2 text-center text-sm text-muted-foreground"
|
|
261
|
+
base: "rounded-lg border border-[hsl(var(--border))]",
|
|
262
|
+
caption: "mt-2 text-center text-sm text-[hsl(var(--muted-foreground))]"
|
|
260
263
|
},
|
|
261
264
|
// Link
|
|
262
265
|
link: {
|
|
263
|
-
base: "font-medium text-primary underline underline-offset-4 hover:text-primary/80"
|
|
266
|
+
base: "font-medium text-[hsl(var(--primary))] underline underline-offset-4 hover:text-[hsl(var(--primary))]/80"
|
|
264
267
|
},
|
|
265
268
|
// Tabs (Radix UI)
|
|
266
269
|
tabs: {
|
|
267
270
|
root: "w-full",
|
|
268
|
-
list: "inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
|
|
269
|
-
trigger: "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
|
|
270
|
-
content: "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
|
|
271
|
+
list: "inline-flex h-9 items-center justify-center rounded-lg bg-[hsl(var(--muted))] p-1 text-[hsl(var(--muted-foreground))]",
|
|
272
|
+
trigger: "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-[hsl(var(--background))] transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-[hsl(var(--background))] data-[state=active]:text-[hsl(var(--foreground))] data-[state=active]:shadow-sm",
|
|
273
|
+
content: "mt-2 ring-offset-[hsl(var(--background))] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2"
|
|
271
274
|
},
|
|
272
275
|
// Collapsible
|
|
273
276
|
collapsible: {
|
|
274
277
|
base: "",
|
|
275
|
-
trigger: "flex w-full items-center justify-between p-4 font-medium transition-all hover:bg-muted [&[data-state=open]>svg]:rotate-180",
|
|
278
|
+
trigger: "flex w-full items-center justify-between p-4 font-medium transition-all hover:bg-[hsl(var(--muted))] [&[data-state=open]>svg]:rotate-180",
|
|
276
279
|
content: "overflow-hidden transition-all data-[state=closed]:animate-collapse-up data-[state=open]:animate-collapse-down"
|
|
277
280
|
},
|
|
278
281
|
// Dialog
|
|
279
282
|
dialog: {
|
|
280
283
|
overlay: "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
|
281
|
-
content: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
|
|
284
|
+
content: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-[hsl(var(--border))] bg-[hsl(var(--background))] p-6 shadow-lg duration-200 data-[state=open]:animate-in 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
|
|
282
285
|
header: "flex flex-col space-y-1.5 text-center sm:text-left",
|
|
283
286
|
footer: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
|
284
287
|
title: "text-lg font-semibold leading-none tracking-tight",
|
|
285
|
-
description: "text-sm text-muted-foreground",
|
|
286
|
-
close: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
|
|
288
|
+
description: "text-sm text-[hsl(var(--muted-foreground))]",
|
|
289
|
+
close: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-[hsl(var(--background))] transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))] focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-[hsl(var(--accent))] data-[state=open]:text-[hsl(var(--muted-foreground))]"
|
|
287
290
|
},
|
|
288
291
|
// Dropdown Menu
|
|
289
292
|
dropdownMenu: {
|
|
290
|
-
content: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover
|
|
291
|
-
item: "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
292
|
-
separator: "-mx-1 my-1 h-px bg-
|
|
293
|
+
content: "z-50 min-w-[8rem] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md data-[state=open]:animate-in 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",
|
|
294
|
+
item: "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-[hsl(var(--accent))] focus:text-[hsl(var(--accent-foreground))] data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
295
|
+
separator: "-mx-1 my-1 h-px bg-[hsl(var(--border))]",
|
|
293
296
|
label: "px-2 py-1.5 text-sm font-semibold"
|
|
294
297
|
},
|
|
295
298
|
// Select
|
|
296
299
|
select: {
|
|
297
|
-
trigger: "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
298
|
-
content: "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in 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",
|
|
300
|
+
trigger: "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-[hsl(var(--background))] placeholder:text-[hsl(var(--muted-foreground))] focus:outline-none focus:ring-1 focus:ring-[hsl(var(--ring))] disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
301
|
+
content: "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md data-[state=open]:animate-in 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",
|
|
299
302
|
viewport: "p-1",
|
|
300
|
-
item: "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
303
|
+
item: "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-[hsl(var(--accent))] focus:text-[hsl(var(--accent-foreground))] data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
301
304
|
itemIndicator: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center",
|
|
302
305
|
groupLabel: "px-2 py-1.5 text-sm font-semibold"
|
|
303
306
|
},
|
|
304
307
|
// Checkbox
|
|
305
308
|
checkbox: {
|
|
306
|
-
base: "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
|
309
|
+
base: "peer h-4 w-4 shrink-0 rounded-sm border border-[hsl(var(--primary))] ring-offset-[hsl(var(--background))] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-[hsl(var(--primary))] data-[state=checked]:text-[hsl(var(--primary-foreground))]",
|
|
307
310
|
indicator: "flex items-center justify-center text-current"
|
|
308
311
|
},
|
|
309
312
|
// Switch
|
|
310
313
|
switch: {
|
|
311
|
-
base: "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
|
|
312
|
-
thumb: "pointer-events-none block h-4 w-4 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
|
|
314
|
+
base: "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 focus-visible:ring-offset-[hsl(var(--background))] disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-[hsl(var(--primary))] data-[state=unchecked]:bg-[hsl(var(--input))]",
|
|
315
|
+
thumb: "pointer-events-none block h-4 w-4 rounded-full bg-[hsl(var(--background))] shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0"
|
|
313
316
|
},
|
|
314
317
|
// Radio Group
|
|
315
318
|
radioGroup: {
|
|
316
319
|
root: "grid gap-2",
|
|
317
|
-
item: "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
|
320
|
+
item: "aspect-square h-4 w-4 rounded-full border border-[hsl(var(--primary))] text-[hsl(var(--primary))] ring-offset-[hsl(var(--background))] focus:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
|
318
321
|
indicator: "flex items-center justify-center"
|
|
319
322
|
},
|
|
320
323
|
// Separator
|
|
321
324
|
separator: {
|
|
322
|
-
base: "bg-border shrink-0",
|
|
325
|
+
base: "bg-[hsl(var(--border))] shrink-0",
|
|
323
326
|
horizontal: "h-[1px] w-full",
|
|
324
327
|
vertical: "h-full w-[1px]"
|
|
325
328
|
}
|