@skybin-tech/nebula-ui 0.0.26 → 0.0.27
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/cjs/_virtual/_rolldown/runtime.cjs +24 -0
- package/dist/cjs/components/Accordion/Accordion.cjs +20 -10
- package/dist/cjs/components/Accordion/Accordion.cjs.map +1 -1
- package/dist/cjs/components/Alert/Alert.cjs +19 -9
- package/dist/cjs/components/Alert/Alert.cjs.map +1 -1
- package/dist/cjs/components/Avatar/Avatar.cjs +19 -9
- package/dist/cjs/components/Avatar/Avatar.cjs.map +1 -1
- package/dist/cjs/components/Badge/Badge.cjs +8 -7
- package/dist/cjs/components/Badge/Badge.cjs.map +1 -1
- package/dist/cjs/components/Button/Button.cjs +37 -47
- package/dist/cjs/components/Button/Button.cjs.map +1 -1
- package/dist/cjs/components/Card/Card.cjs +31 -12
- package/dist/cjs/components/Card/Card.cjs.map +1 -1
- package/dist/cjs/components/Checkbox/Checkbox.cjs +12 -7
- package/dist/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
- package/dist/cjs/components/DropdownMenu/DropdownMenu.cjs +55 -21
- package/dist/cjs/components/DropdownMenu/DropdownMenu.cjs.map +1 -1
- package/dist/cjs/components/Form/Checkbox.cjs +128 -142
- package/dist/cjs/components/Form/Checkbox.cjs.map +1 -1
- package/dist/cjs/components/Form/Form.cjs +106 -105
- package/dist/cjs/components/Form/Form.cjs.map +1 -1
- package/dist/cjs/components/Form/FormSwitch.cjs +126 -0
- package/dist/cjs/components/Form/FormSwitch.cjs.map +1 -0
- package/dist/cjs/components/Form/Radio.cjs +157 -172
- package/dist/cjs/components/Form/Radio.cjs.map +1 -1
- package/dist/cjs/components/Form/TextArea.cjs +137 -152
- package/dist/cjs/components/Form/TextArea.cjs.map +1 -1
- package/dist/cjs/components/Form/TextBox.cjs +184 -206
- package/dist/cjs/components/Form/TextBox.cjs.map +1 -1
- package/dist/cjs/components/Form/context.cjs +109 -122
- package/dist/cjs/components/Form/context.cjs.map +1 -1
- package/dist/cjs/components/Form/hooks.cjs +34 -24
- package/dist/cjs/components/Form/hooks.cjs.map +1 -1
- package/dist/cjs/components/Form/variants.cjs +14 -14
- package/dist/cjs/components/Form/variants.cjs.map +1 -1
- package/dist/cjs/components/Input/Input.cjs +11 -7
- package/dist/cjs/components/Input/Input.cjs.map +1 -1
- package/dist/cjs/components/Label/Label.cjs +11 -7
- package/dist/cjs/components/Label/Label.cjs.map +1 -1
- package/dist/cjs/components/Pagination/Pagination.cjs +58 -95
- package/dist/cjs/components/Pagination/Pagination.cjs.map +1 -1
- package/dist/cjs/components/Separator/Separator.cjs +11 -7
- package/dist/cjs/components/Separator/Separator.cjs.map +1 -1
- package/dist/cjs/components/Skeleton/Skeleton.cjs +7 -6
- package/dist/cjs/components/Skeleton/Skeleton.cjs.map +1 -1
- package/dist/cjs/components/Switch/Switch.cjs +14 -0
- package/dist/cjs/components/Switch/Switch.cjs.map +1 -0
- package/dist/cjs/components/Tabs/Tabs.cjs +23 -10
- package/dist/cjs/components/Tabs/Tabs.cjs.map +1 -1
- package/dist/cjs/components/Textarea/Textarea.cjs +11 -7
- package/dist/cjs/components/Textarea/Textarea.cjs.map +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.cjs +14 -10
- package/dist/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/dist/cjs/hooks/useDebounce.cjs +22 -14
- package/dist/cjs/hooks/useDebounce.cjs.map +1 -1
- package/dist/cjs/hooks/useToast.cjs +105 -84
- package/dist/cjs/hooks/useToast.cjs.map +1 -1
- package/dist/cjs/hooks/useToggle.cjs +15 -9
- package/dist/cjs/hooks/useToggle.cjs.map +1 -1
- package/dist/cjs/index.cjs +170 -170
- package/dist/cjs/primitives/accordion.cjs +38 -61
- package/dist/cjs/primitives/accordion.cjs.map +1 -1
- package/dist/cjs/primitives/alert.cjs +33 -63
- package/dist/cjs/primitives/alert.cjs.map +1 -1
- package/dist/cjs/primitives/avatar.cjs +29 -58
- package/dist/cjs/primitives/avatar.cjs.map +1 -1
- package/dist/cjs/primitives/badge.cjs +26 -27
- package/dist/cjs/primitives/badge.cjs.map +1 -1
- package/dist/cjs/primitives/button.cjs +44 -63
- package/dist/cjs/primitives/button.cjs.map +1 -1
- package/dist/cjs/primitives/calendar.cjs +41 -44
- package/dist/cjs/primitives/calendar.cjs.map +1 -1
- package/dist/cjs/primitives/card.cjs +39 -70
- package/dist/cjs/primitives/card.cjs.map +1 -1
- package/dist/cjs/primitives/checkbox.cjs +22 -45
- package/dist/cjs/primitives/checkbox.cjs.map +1 -1
- package/dist/cjs/primitives/command.cjs +65 -73
- package/dist/cjs/primitives/command.cjs.map +1 -1
- package/dist/cjs/primitives/dialog.cjs +55 -84
- package/dist/cjs/primitives/dialog.cjs.map +1 -1
- package/dist/cjs/primitives/dropdown-menu.cjs +82 -153
- package/dist/cjs/primitives/dropdown-menu.cjs.map +1 -1
- package/dist/cjs/primitives/input.cjs +17 -39
- package/dist/cjs/primitives/input.cjs.map +1 -1
- package/dist/cjs/primitives/label.cjs +19 -38
- package/dist/cjs/primitives/label.cjs.map +1 -1
- package/dist/cjs/primitives/popover.cjs +22 -42
- package/dist/cjs/primitives/popover.cjs.map +1 -1
- package/dist/cjs/primitives/radio-group.cjs +31 -50
- package/dist/cjs/primitives/radio-group.cjs.map +1 -1
- package/dist/cjs/primitives/scroll-area.cjs +33 -55
- package/dist/cjs/primitives/scroll-area.cjs.map +1 -1
- package/dist/cjs/primitives/select.cjs +76 -133
- package/dist/cjs/primitives/select.cjs.map +1 -1
- package/dist/cjs/primitives/separator.cjs +20 -42
- package/dist/cjs/primitives/separator.cjs.map +1 -1
- package/dist/cjs/primitives/skeleton.cjs +10 -12
- package/dist/cjs/primitives/skeleton.cjs.map +1 -1
- package/dist/cjs/primitives/sonner.cjs +16 -20
- package/dist/cjs/primitives/sonner.cjs.map +1 -1
- package/dist/cjs/primitives/switch.cjs +19 -45
- package/dist/cjs/primitives/switch.cjs.map +1 -1
- package/dist/cjs/primitives/table.cjs +52 -61
- package/dist/cjs/primitives/table.cjs.map +1 -1
- package/dist/cjs/primitives/tabs.cjs +30 -62
- package/dist/cjs/primitives/tabs.cjs.map +1 -1
- package/dist/cjs/primitives/textarea.cjs +15 -35
- package/dist/cjs/primitives/textarea.cjs.map +1 -1
- package/dist/cjs/primitives/textbox.cjs +17 -39
- package/dist/cjs/primitives/textbox.cjs.map +1 -1
- package/dist/cjs/primitives/toast.cjs +59 -107
- package/dist/cjs/primitives/toast.cjs.map +1 -1
- package/dist/cjs/primitives/toggle.cjs +39 -55
- package/dist/cjs/primitives/toggle.cjs.map +1 -1
- package/dist/cjs/primitives/tooltip.cjs +21 -41
- package/dist/cjs/primitives/tooltip.cjs.map +1 -1
- package/dist/cjs/utils/cn.cjs +11 -6
- package/dist/cjs/utils/cn.cjs.map +1 -1
- package/dist/components/Accordion/Accordion.js +20 -13
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Alert/Alert.js +19 -11
- package/dist/components/Alert/Alert.js.map +1 -1
- package/dist/components/Avatar/Avatar.js +19 -11
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Badge/Badge.d.ts +1 -1
- package/dist/components/Badge/Badge.d.ts.map +1 -1
- package/dist/components/Badge/Badge.js +8 -8
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/Button/Button.js +37 -48
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Card/Card.js +31 -17
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.js +12 -7
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.d.ts +4 -4
- package/dist/components/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.js +55 -35
- package/dist/components/DropdownMenu/DropdownMenu.js.map +1 -1
- package/dist/components/Form/Checkbox.js +126 -140
- package/dist/components/Form/Checkbox.js.map +1 -1
- package/dist/components/Form/Form.d.ts +1 -1
- package/dist/components/Form/Form.d.ts.map +1 -1
- package/dist/components/Form/Form.js +104 -103
- package/dist/components/Form/Form.js.map +1 -1
- package/dist/components/Form/{Switch.d.ts → FormSwitch.d.ts} +3 -3
- package/dist/components/Form/FormSwitch.d.ts.map +1 -0
- package/dist/components/Form/FormSwitch.js +126 -0
- package/dist/components/Form/FormSwitch.js.map +1 -0
- package/dist/components/Form/Radio.d.ts +1 -1
- package/dist/components/Form/Radio.d.ts.map +1 -1
- package/dist/components/Form/Radio.js +155 -171
- package/dist/components/Form/Radio.js.map +1 -1
- package/dist/components/Form/Select.d.ts +1 -1
- package/dist/components/Form/Select.d.ts.map +1 -1
- package/dist/components/Form/TextArea.js +134 -149
- package/dist/components/Form/TextArea.js.map +1 -1
- package/dist/components/Form/TextBox.js +179 -201
- package/dist/components/Form/TextBox.js.map +1 -1
- package/dist/components/Form/context.d.ts +3 -5
- package/dist/components/Form/context.d.ts.map +1 -1
- package/dist/components/Form/context.js +109 -125
- package/dist/components/Form/context.js.map +1 -1
- package/dist/components/Form/hooks.js +35 -28
- package/dist/components/Form/hooks.js.map +1 -1
- package/dist/components/Form/index.d.ts +2 -2
- package/dist/components/Form/index.d.ts.map +1 -1
- package/dist/components/Form/variants.js +15 -14
- package/dist/components/Form/variants.js.map +1 -1
- package/dist/components/Input/Input.js +11 -7
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/Label/Label.js +11 -7
- package/dist/components/Label/Label.js.map +1 -1
- package/dist/components/Pagination/Pagination.d.ts +5 -5
- package/dist/components/Pagination/Pagination.js +55 -83
- package/dist/components/Pagination/Pagination.js.map +1 -1
- package/dist/components/Separator/Separator.js +11 -7
- package/dist/components/Separator/Separator.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.d.ts +1 -1
- package/dist/components/Skeleton/Skeleton.d.ts.map +1 -1
- package/dist/components/Skeleton/Skeleton.js +7 -6
- package/dist/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/components/Switch/Switch.d.ts +4 -1
- package/dist/components/Switch/Switch.d.ts.map +1 -1
- package/dist/components/Switch/Switch.js +14 -0
- package/dist/components/Switch/Switch.js.map +1 -0
- package/dist/components/Switch/index.d.ts +1 -0
- package/dist/components/Switch/index.d.ts.map +1 -1
- package/dist/components/Tabs/Tabs.js +23 -13
- package/dist/components/Tabs/Tabs.js.map +1 -1
- package/dist/components/Textarea/Textarea.js +11 -7
- package/dist/components/Textarea/Textarea.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.js +14 -13
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/hooks/useDebounce.js +23 -15
- package/dist/hooks/useDebounce.js.map +1 -1
- package/dist/hooks/useToast.js +103 -69
- package/dist/hooks/useToast.js.map +1 -1
- package/dist/hooks/useToggle.js +16 -10
- package/dist/hooks/useToggle.js.map +1 -1
- package/dist/index.d.ts +4 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +29 -160
- package/dist/primitives/accordion.js +32 -43
- package/dist/primitives/accordion.js.map +1 -1
- package/dist/primitives/alert.js +30 -47
- package/dist/primitives/alert.js.map +1 -1
- package/dist/primitives/avatar.js +22 -38
- package/dist/primitives/avatar.js.map +1 -1
- package/dist/primitives/badge.d.ts +1 -1
- package/dist/primitives/badge.d.ts.map +1 -1
- package/dist/primitives/badge.js +23 -27
- package/dist/primitives/badge.js.map +1 -1
- package/dist/primitives/button.js +41 -46
- package/dist/primitives/button.js.map +1 -1
- package/dist/primitives/calendar.d.ts +1 -1
- package/dist/primitives/calendar.d.ts.map +1 -1
- package/dist/primitives/calendar.js +37 -42
- package/dist/primitives/calendar.js.map +1 -1
- package/dist/primitives/card.js +37 -58
- package/dist/primitives/card.js.map +1 -1
- package/dist/primitives/checkbox.js +17 -25
- package/dist/primitives/checkbox.js.map +1 -1
- package/dist/primitives/command.d.ts +2 -2
- package/dist/primitives/command.d.ts.map +1 -1
- package/dist/primitives/command.js +70 -71
- package/dist/primitives/command.js.map +1 -1
- package/dist/primitives/dialog.d.ts +2 -2
- package/dist/primitives/dialog.js +47 -70
- package/dist/primitives/dialog.js.map +1 -1
- package/dist/primitives/dropdown-menu.d.ts +1 -1
- package/dist/primitives/dropdown-menu.js +70 -140
- package/dist/primitives/dropdown-menu.js.map +1 -1
- package/dist/primitives/input.js +15 -22
- package/dist/primitives/input.js.map +1 -1
- package/dist/primitives/label.js +14 -18
- package/dist/primitives/label.js.map +1 -1
- package/dist/primitives/popover.js +17 -25
- package/dist/primitives/popover.js.map +1 -1
- package/dist/primitives/radio-group.js +25 -30
- package/dist/primitives/radio-group.js.map +1 -1
- package/dist/primitives/scroll-area.js +27 -35
- package/dist/primitives/scroll-area.js.map +1 -1
- package/dist/primitives/select.js +65 -116
- package/dist/primitives/select.js.map +1 -1
- package/dist/primitives/separator.js +15 -22
- package/dist/primitives/separator.js.map +1 -1
- package/dist/primitives/skeleton.d.ts +1 -1
- package/dist/primitives/skeleton.d.ts.map +1 -1
- package/dist/primitives/skeleton.js +10 -12
- package/dist/primitives/skeleton.js.map +1 -1
- package/dist/primitives/sonner.d.ts +1 -1
- package/dist/primitives/sonner.d.ts.map +1 -1
- package/dist/primitives/sonner.js +17 -21
- package/dist/primitives/sonner.js.map +1 -1
- package/dist/primitives/switch.js +14 -25
- package/dist/primitives/switch.js.map +1 -1
- package/dist/primitives/table.js +50 -51
- package/dist/primitives/table.js.map +1 -1
- package/dist/primitives/tabs.js +23 -43
- package/dist/primitives/tabs.js.map +1 -1
- package/dist/primitives/textarea.js +13 -18
- package/dist/primitives/textarea.js.map +1 -1
- package/dist/primitives/textbox.js +15 -22
- package/dist/primitives/textbox.js.map +1 -1
- package/dist/primitives/toast.js +48 -87
- package/dist/primitives/toast.js.map +1 -1
- package/dist/primitives/toggle.js +34 -36
- package/dist/primitives/toggle.js.map +1 -1
- package/dist/primitives/tooltip.js +16 -24
- package/dist/primitives/tooltip.js.map +1 -1
- package/dist/stories/Button.d.ts +1 -1
- package/dist/stories/Button.d.ts.map +1 -1
- package/dist/stories/Button.stories.d.ts +1 -1
- package/dist/stories/Header.d.ts +1 -1
- package/dist/stories/Header.d.ts.map +1 -1
- package/dist/stories/Header.stories.d.ts +1 -1
- package/dist/utils/cn.js +10 -5
- package/dist/utils/cn.js.map +1 -1
- package/package.json +44 -37
- package/dist/cjs/components/Form/Switch.cjs +0 -126
- package/dist/cjs/components/Form/Switch.cjs.map +0 -1
- package/dist/cjs/index.cjs.map +0 -1
- package/dist/components/Form/Switch.d.ts.map +0 -1
- package/dist/components/Form/Switch.js +0 -126
- package/dist/components/Form/Switch.js.map +0 -1
- package/dist/index.js.map +0 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skybin-tech/nebula-ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.27",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"author": "Anwar <anwar@skybin.io>",
|
|
6
6
|
"description": "Reusable React component library with form validation using shadcn/ui patterns, react-hook-form, and Zod",
|
|
@@ -271,6 +271,16 @@
|
|
|
271
271
|
"types": "./dist/components/Pagination/index.d.ts",
|
|
272
272
|
"default": "./dist/cjs/components/Pagination/index.cjs"
|
|
273
273
|
}
|
|
274
|
+
},
|
|
275
|
+
"./components/Switch": {
|
|
276
|
+
"import": {
|
|
277
|
+
"types": "./dist/components/Switch/index.d.ts",
|
|
278
|
+
"default": "./dist/components/Switch/index.js"
|
|
279
|
+
},
|
|
280
|
+
"require": {
|
|
281
|
+
"types": "./dist/components/Switch/index.d.ts",
|
|
282
|
+
"default": "./dist/cjs/components/Switch/index.cjs"
|
|
283
|
+
}
|
|
274
284
|
}
|
|
275
285
|
},
|
|
276
286
|
"typesVersions": {
|
|
@@ -349,6 +359,9 @@
|
|
|
349
359
|
],
|
|
350
360
|
"components/Pagination": [
|
|
351
361
|
"./dist/components/Pagination/index.d.ts"
|
|
362
|
+
],
|
|
363
|
+
"components/Switch": [
|
|
364
|
+
"./dist/components/Switch/index.d.ts"
|
|
352
365
|
]
|
|
353
366
|
}
|
|
354
367
|
},
|
|
@@ -410,68 +423,62 @@
|
|
|
410
423
|
}
|
|
411
424
|
},
|
|
412
425
|
"devDependencies": {
|
|
413
|
-
"@chromatic-com/storybook": "^5.2.1",
|
|
414
426
|
"@eslint/js": "^9.39.4",
|
|
415
427
|
"@hookform/resolvers": "^5.4.0",
|
|
416
|
-
"@radix-ui/react-
|
|
417
|
-
"@radix-ui/react-
|
|
418
|
-
"@radix-ui/react-
|
|
419
|
-
"@radix-ui/react-
|
|
420
|
-
"@radix-ui/react-
|
|
421
|
-
"@radix-ui/react-
|
|
422
|
-
"@radix-ui/react-
|
|
423
|
-
"@radix-ui/react-
|
|
424
|
-
"@radix-ui/react-
|
|
425
|
-
"@radix-ui/react-
|
|
428
|
+
"@radix-ui/react-accordion": "^1.2.15",
|
|
429
|
+
"@radix-ui/react-avatar": "^1.2.1",
|
|
430
|
+
"@radix-ui/react-checkbox": "^1.3.6",
|
|
431
|
+
"@radix-ui/react-dialog": "^1.1.18",
|
|
432
|
+
"@radix-ui/react-dropdown-menu": "2.1.19",
|
|
433
|
+
"@radix-ui/react-label": "^2.1.11",
|
|
434
|
+
"@radix-ui/react-popover": "^1.1.18",
|
|
435
|
+
"@radix-ui/react-radio-group": "^1.4.2",
|
|
436
|
+
"@radix-ui/react-scroll-area": "^1.2.13",
|
|
437
|
+
"@radix-ui/react-select": "^2.3.2",
|
|
438
|
+
"@radix-ui/react-separator": "^1.1.11",
|
|
426
439
|
"@radix-ui/react-slot": "^1.3.0",
|
|
427
|
-
"@radix-ui/react-switch": "^1.3.
|
|
428
|
-
"@radix-ui/react-toast": "^1.2.
|
|
429
|
-
"@radix-ui/react-toggle": "^1.1.
|
|
430
|
-
"@radix-ui/react-tooltip": "^1.2.
|
|
431
|
-
"@radix-ui/react-accordion": "^1.2.14",
|
|
440
|
+
"@radix-ui/react-switch": "^1.3.2",
|
|
441
|
+
"@radix-ui/react-toast": "^1.2.18",
|
|
442
|
+
"@radix-ui/react-toggle": "^1.1.13",
|
|
443
|
+
"@radix-ui/react-tooltip": "^1.2.11",
|
|
432
444
|
"@storybook/addon-a11y": "^10.4.6",
|
|
433
445
|
"@storybook/addon-docs": "^10.4.6",
|
|
434
446
|
"@storybook/addon-onboarding": "^10.4.6",
|
|
435
447
|
"@storybook/addon-vitest": "^10.4.6",
|
|
436
448
|
"@storybook/react-vite": "^10.4.6",
|
|
437
|
-
"@tailwindcss/vite": "^4.3.
|
|
438
|
-
"@types/
|
|
439
|
-
"@types/node": "^25.9.3",
|
|
449
|
+
"@tailwindcss/vite": "^4.3.2",
|
|
450
|
+
"@types/node": "^26.1.0",
|
|
440
451
|
"@types/react": "^19.2.17",
|
|
441
452
|
"@types/react-dom": "^19.2.3",
|
|
442
453
|
"@vitejs/plugin-react-swc": "^4.3.1",
|
|
443
|
-
"@vitest/browser-playwright": "
|
|
444
|
-
"@vitest/coverage-v8": "
|
|
454
|
+
"@vitest/browser-playwright": "4.1.9",
|
|
455
|
+
"@vitest/coverage-v8": "4.1.9",
|
|
445
456
|
"class-variance-authority": "^0.7.1",
|
|
446
457
|
"clsx": "^2.1.1",
|
|
447
458
|
"cmdk": "^1.1.1",
|
|
448
459
|
"date-fns": "^4.4.0",
|
|
449
|
-
"esbuild": "^0.28.1",
|
|
450
460
|
"eslint": "^9.39.4",
|
|
451
461
|
"eslint-plugin-react-hooks": "^7.1.1",
|
|
452
462
|
"eslint-plugin-react-refresh": "^0.5.3",
|
|
453
463
|
"eslint-plugin-storybook": "^10.4.6",
|
|
454
|
-
"
|
|
455
|
-
"
|
|
456
|
-
"lucide-react": "^1.20.0",
|
|
457
|
-
"playwright": "^1.61.0",
|
|
464
|
+
"globals": "^17.7.0",
|
|
465
|
+
"lucide-react": "^1.23.0",
|
|
458
466
|
"react": "^19.2.7",
|
|
459
467
|
"react-day-picker": "^10.0.1",
|
|
460
468
|
"react-dom": "^19.2.7",
|
|
461
|
-
"react-hook-form": "^7.
|
|
469
|
+
"react-hook-form": "^7.81.0",
|
|
462
470
|
"sonner": "^2.0.7",
|
|
463
471
|
"storybook": "^10.4.6",
|
|
464
472
|
"tailwind-merge": "^3.6.0",
|
|
465
|
-
"tailwindcss": "^4.3.
|
|
473
|
+
"tailwindcss": "^4.3.2",
|
|
466
474
|
"typescript": "~5.9.3",
|
|
467
|
-
"typescript-eslint": "^8.
|
|
468
|
-
"vite": "^8.
|
|
469
|
-
"vite-plugin-checker": "^0.14.
|
|
470
|
-
"vite-plugin-dts": "^5.0.
|
|
471
|
-
"vite-plugin-
|
|
472
|
-
"vite-plugin-eslint2": "^5.1.0",
|
|
475
|
+
"typescript-eslint": "^8.62.1",
|
|
476
|
+
"vite": "^8.1.3",
|
|
477
|
+
"vite-plugin-checker": "^0.14.4",
|
|
478
|
+
"vite-plugin-dts": "^5.0.3",
|
|
479
|
+
"vite-plugin-eslint2": "^5.3.0",
|
|
473
480
|
"vite-tsconfig-paths": "^6.1.1",
|
|
474
|
-
"vitest": "
|
|
481
|
+
"vitest": "4.1.9",
|
|
475
482
|
"zod": "^4.4.3"
|
|
476
483
|
},
|
|
477
484
|
"repository": {
|
|
@@ -492,6 +499,6 @@
|
|
|
492
499
|
],
|
|
493
500
|
"license": "MIT",
|
|
494
501
|
"dependencies": {
|
|
495
|
-
"@radix-ui/react-tabs": "^1.1.
|
|
502
|
+
"@radix-ui/react-tabs": "^1.1.16"
|
|
496
503
|
}
|
|
497
504
|
}
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
|
-
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
-
const React = require("react");
|
|
6
|
-
const reactHookForm = require("react-hook-form");
|
|
7
|
-
const classVarianceAuthority = require("class-variance-authority");
|
|
8
|
-
const cn = require("../../utils/cn.cjs");
|
|
9
|
-
const context = require("./context.cjs");
|
|
10
|
-
const _switch = require("../../primitives/switch.cjs");
|
|
11
|
-
const label = require("../../primitives/label.cjs");
|
|
12
|
-
const switchSizeVariants = classVarianceAuthority.cva(
|
|
13
|
-
"",
|
|
14
|
-
{
|
|
15
|
-
variants: {
|
|
16
|
-
size: {
|
|
17
|
-
sm: "h-5 w-9",
|
|
18
|
-
md: "h-6 w-11",
|
|
19
|
-
lg: "h-7 w-14"
|
|
20
|
-
}
|
|
21
|
-
},
|
|
22
|
-
defaultVariants: {
|
|
23
|
-
size: "md"
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
);
|
|
27
|
-
const labelVariants = classVarianceAuthority.cva(
|
|
28
|
-
"text-sm font-medium cursor-pointer select-none",
|
|
29
|
-
{
|
|
30
|
-
variants: {
|
|
31
|
-
disabled: {
|
|
32
|
-
true: "cursor-not-allowed opacity-50",
|
|
33
|
-
false: ""
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
defaultVariants: {
|
|
37
|
-
disabled: false
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
);
|
|
41
|
-
function SwitchInner({
|
|
42
|
-
name,
|
|
43
|
-
label: label$1,
|
|
44
|
-
helperText,
|
|
45
|
-
showError = true,
|
|
46
|
-
error: customError,
|
|
47
|
-
size,
|
|
48
|
-
className,
|
|
49
|
-
disabled,
|
|
50
|
-
id: providedId,
|
|
51
|
-
control: externalControl,
|
|
52
|
-
checkedText,
|
|
53
|
-
uncheckedText,
|
|
54
|
-
// Validation props
|
|
55
|
-
required,
|
|
56
|
-
validate,
|
|
57
|
-
...props
|
|
58
|
-
}, ref) {
|
|
59
|
-
const generatedId = React.useId();
|
|
60
|
-
const inputId = providedId ?? generatedId;
|
|
61
|
-
const formConfigContext = React.useContext(context.FormConfigContext);
|
|
62
|
-
const formConfig = formConfigContext ?? {};
|
|
63
|
-
const rhfContext = reactHookForm.useFormContext();
|
|
64
|
-
const control = externalControl ?? rhfContext?.control;
|
|
65
|
-
React.useEffect(() => {
|
|
66
|
-
if (formConfigContext?.registerFieldValidation) {
|
|
67
|
-
const rules = {};
|
|
68
|
-
if (required !== void 0) rules.required = required;
|
|
69
|
-
if (validate !== void 0) rules.validate = validate;
|
|
70
|
-
formConfigContext.registerFieldValidation({
|
|
71
|
-
name,
|
|
72
|
-
type: "boolean",
|
|
73
|
-
rules
|
|
74
|
-
});
|
|
75
|
-
return () => {
|
|
76
|
-
formConfigContext.unregisterFieldValidation(name);
|
|
77
|
-
};
|
|
78
|
-
}
|
|
79
|
-
}, [formConfigContext, name, required, validate]);
|
|
80
|
-
const { field, fieldState } = reactHookForm.useController({
|
|
81
|
-
name,
|
|
82
|
-
control
|
|
83
|
-
});
|
|
84
|
-
const fieldError = fieldState.error?.message;
|
|
85
|
-
const errorMessage = customError ?? fieldError;
|
|
86
|
-
const hasError = !!errorMessage;
|
|
87
|
-
const effectiveSize = size ?? formConfig.size ?? "md";
|
|
88
|
-
const effectiveDisabled = disabled ?? formConfig.disabled;
|
|
89
|
-
const isChecked = field.value ?? false;
|
|
90
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5", children: [
|
|
91
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
|
|
92
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
93
|
-
_switch.Switch,
|
|
94
|
-
{
|
|
95
|
-
...props,
|
|
96
|
-
ref,
|
|
97
|
-
id: inputId,
|
|
98
|
-
checked: isChecked,
|
|
99
|
-
onCheckedChange: (checked) => field.onChange(checked),
|
|
100
|
-
disabled: effectiveDisabled,
|
|
101
|
-
"aria-labelledby": label$1 ? `${inputId}-label` : void 0,
|
|
102
|
-
className: cn.cn(
|
|
103
|
-
switchSizeVariants({ size: effectiveSize }),
|
|
104
|
-
className
|
|
105
|
-
)
|
|
106
|
-
}
|
|
107
|
-
),
|
|
108
|
-
(checkedText || uncheckedText) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: isChecked ? checkedText : uncheckedText }),
|
|
109
|
-
label$1 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
110
|
-
label.Label,
|
|
111
|
-
{
|
|
112
|
-
id: `${inputId}-label`,
|
|
113
|
-
htmlFor: inputId,
|
|
114
|
-
className: labelVariants({ disabled: effectiveDisabled }),
|
|
115
|
-
children: label$1
|
|
116
|
-
}
|
|
117
|
-
)
|
|
118
|
-
] }),
|
|
119
|
-
showError && hasError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive", role: "alert", children: errorMessage }),
|
|
120
|
-
helperText && !hasError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: helperText })
|
|
121
|
-
] });
|
|
122
|
-
}
|
|
123
|
-
const Switch = React.forwardRef(SwitchInner);
|
|
124
|
-
Switch.displayName = "Switch";
|
|
125
|
-
exports.Switch = Switch;
|
|
126
|
-
//# sourceMappingURL=Switch.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Form/Switch.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useId, useContext, useEffect } from \"react\";\nimport type { ReactNode, ComponentPropsWithoutRef } from \"react\";\nimport { useController, useFormContext as useRHFFormContext, type FieldValues, type FieldPath, type Control } from \"react-hook-form\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\nimport { FormConfigContext, type FormConfig, type FieldValidationRules } from \"../Form/context\";\nimport { Switch as ShadcnSwitch } from \"../../primitives/switch\";\nimport { Label } from \"../../primitives/label\";\nimport type * as SwitchPrimitives from \"@radix-ui/react-switch\";\n\nconst switchSizeVariants = cva(\n \"\",\n {\n variants: {\n size: {\n sm: \"h-5 w-9\",\n md: \"h-6 w-11\",\n lg: \"h-7 w-14\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n }\n);\n\nconst labelVariants = cva(\n \"text-sm font-medium cursor-pointer select-none\",\n {\n variants: {\n disabled: {\n true: \"cursor-not-allowed opacity-50\",\n false: \"\",\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n);\n\nexport interface SwitchProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> extends Omit<ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>, \"name\" | \"checked\" | \"onCheckedChange\" | \"required\">,\n VariantProps<typeof switchSizeVariants> {\n /** Field name - required for form integration */\n name: TName;\n /** Label text for the switch */\n label?: ReactNode;\n /** Helper text displayed below the switch */\n helperText?: string;\n /** Whether to show the error message */\n showError?: boolean;\n /** Custom error message (overrides form error) */\n error?: string;\n /** External control (for use outside Form) */\n control?: Control<TFieldValues>;\n /** Text to show when checked */\n checkedText?: ReactNode;\n /** Text to show when unchecked */\n uncheckedText?: ReactNode;\n \n // Validation props\n /** Field is required (must be on) */\n required?: boolean | string;\n /** Custom validation function */\n validate?: (value: unknown) => boolean | string | Promise<boolean | string>;\n}\n\n/**\n * Switch component with form integration\n * \n * This is a wrapper around the shadcn/ui Switch primitive that adds:\n * - Form integration with react-hook-form\n * - Automatic validation registration\n * - Label, helper text, and error message support\n * - Checked/unchecked text display\n * \n * @example\n * ```tsx\n * // Inside a Form component\n * <Switch name=\"notifications\" label=\"Enable notifications\" />\n * <Switch name=\"terms\" label=\"Accept terms\" required=\"You must accept the terms\" />\n * <Switch name=\"darkMode\" label=\"Dark mode\" checkedText=\"On\" uncheckedText=\"Off\" />\n * ```\n */\nfunction SwitchInner<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>(\n {\n name,\n label,\n helperText,\n showError = true,\n error: customError,\n size,\n className,\n disabled,\n id: providedId,\n control: externalControl,\n checkedText,\n uncheckedText,\n // Validation props\n required,\n validate,\n ...props\n }: SwitchProps<TFieldValues, TName>,\n ref: React.ForwardedRef<React.ElementRef<typeof SwitchPrimitives.Root>>\n) {\n const generatedId = useId();\n const inputId = providedId ?? generatedId;\n \n // Try to get form context\n const formConfigContext = useContext(FormConfigContext);\n const formConfig: FormConfig = formConfigContext ?? {};\n \n // Get form context from react-hook-form\n const rhfContext = useRHFFormContext<TFieldValues>();\n const control = externalControl ?? rhfContext?.control;\n\n // Register validation rules with the form\n useEffect(() => {\n if (formConfigContext?.registerFieldValidation) {\n const rules: FieldValidationRules = {};\n \n if (required !== undefined) rules.required = required;\n if (validate !== undefined) rules.validate = validate;\n\n formConfigContext.registerFieldValidation({\n name: name as string,\n type: \"boolean\",\n rules,\n });\n\n return () => {\n formConfigContext.unregisterFieldValidation(name as string);\n };\n }\n }, [formConfigContext, name, required, validate]);\n\n // Use controller for form integration\n const { field, fieldState } = useController<TFieldValues, TName>({\n name,\n control,\n });\n\n const fieldError = fieldState.error?.message;\n const errorMessage = customError ?? fieldError;\n const hasError = !!errorMessage;\n \n // Merge sizes - prop takes precedence over form config\n const effectiveSize = size ?? formConfig.size ?? \"md\";\n const effectiveDisabled = disabled ?? formConfig.disabled;\n const isChecked = field.value ?? false;\n\n return (\n <div className=\"space-y-1.5\">\n <div className=\"flex items-center gap-3\">\n <ShadcnSwitch\n {...props}\n ref={ref}\n id={inputId}\n checked={isChecked}\n onCheckedChange={(checked) => field.onChange(checked)}\n disabled={effectiveDisabled}\n aria-labelledby={label ? `${inputId}-label` : undefined}\n className={cn(\n switchSizeVariants({ size: effectiveSize }),\n className\n )}\n />\n \n {(checkedText || uncheckedText) && (\n <span className=\"text-sm text-muted-foreground\">\n {isChecked ? checkedText : uncheckedText}\n </span>\n )}\n \n {label && (\n <Label\n id={`${inputId}-label`}\n htmlFor={inputId}\n className={labelVariants({ disabled: effectiveDisabled })}\n >\n {label}\n </Label>\n )}\n </div>\n\n {showError && hasError && (\n <p className=\"text-sm text-destructive\" role=\"alert\">\n {errorMessage}\n </p>\n )}\n \n {helperText && !hasError && (\n <p className=\"text-sm text-muted-foreground\">\n {helperText}\n </p>\n )}\n </div>\n );\n}\n\n// Use forwardRef with generic support\nexport const Switch = forwardRef(SwitchInner) as <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>(\n props: SwitchProps<TFieldValues, TName> & { ref?: React.ForwardedRef<React.ElementRef<typeof SwitchPrimitives.Root>> }\n) => React.ReactElement;\n\n(Switch as React.FC).displayName = \"Switch\";\n"],"names":["cva","label","useId","useContext","FormConfigContext","useRHFFormContext","useEffect","useController","jsxs","jsx","ShadcnSwitch","cn","Label","forwardRef"],"mappings":"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"}
|
package/dist/cjs/index.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/Form/Switch.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAsD,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,OAAO,EAAE,MAAM,iBAAiB,CAAC;AACrI,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,OAAO,KAAK,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAEhE,QAAA,MAAM,kBAAkB;;8EAcvB,CAAC;AAiBF,MAAM,WAAW,WAAW,CAC1B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,CAC/D,SAAQ,IAAI,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,iBAAiB,GAAG,UAAU,CAAC,EACvH,YAAY,CAAC,OAAO,kBAAkB,CAAC;IACzC,iDAAiD;IACjD,IAAI,EAAE,KAAK,CAAC;IACZ,gCAAgC;IAChC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wCAAwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAChC,gCAAgC;IAChC,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,kCAAkC;IAClC,aAAa,CAAC,EAAE,SAAS,CAAC;IAG1B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC5B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,OAAO,GAAG,MAAM,CAAC,CAAC;CAC7E;AA2ID,eAAO,MAAM,MAAM,EAA8B,CAC/C,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAE/D,KAAK,EAAE,WAAW,CAAC,YAAY,EAAE,KAAK,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAA;CAAE,KACnH,KAAK,CAAC,YAAY,CAAC"}
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef, useId, useContext, useEffect } from "react";
|
|
4
|
-
import { useFormContext, useController } from "react-hook-form";
|
|
5
|
-
import { cva } from "class-variance-authority";
|
|
6
|
-
import { cn } from "../../utils/cn.js";
|
|
7
|
-
import { FormConfigContext } from "./context.js";
|
|
8
|
-
import { Switch as Switch$1 } from "../../primitives/switch.js";
|
|
9
|
-
import { Label } from "../../primitives/label.js";
|
|
10
|
-
const switchSizeVariants = cva(
|
|
11
|
-
"",
|
|
12
|
-
{
|
|
13
|
-
variants: {
|
|
14
|
-
size: {
|
|
15
|
-
sm: "h-5 w-9",
|
|
16
|
-
md: "h-6 w-11",
|
|
17
|
-
lg: "h-7 w-14"
|
|
18
|
-
}
|
|
19
|
-
},
|
|
20
|
-
defaultVariants: {
|
|
21
|
-
size: "md"
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
);
|
|
25
|
-
const labelVariants = cva(
|
|
26
|
-
"text-sm font-medium cursor-pointer select-none",
|
|
27
|
-
{
|
|
28
|
-
variants: {
|
|
29
|
-
disabled: {
|
|
30
|
-
true: "cursor-not-allowed opacity-50",
|
|
31
|
-
false: ""
|
|
32
|
-
}
|
|
33
|
-
},
|
|
34
|
-
defaultVariants: {
|
|
35
|
-
disabled: false
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
);
|
|
39
|
-
function SwitchInner({
|
|
40
|
-
name,
|
|
41
|
-
label,
|
|
42
|
-
helperText,
|
|
43
|
-
showError = true,
|
|
44
|
-
error: customError,
|
|
45
|
-
size,
|
|
46
|
-
className,
|
|
47
|
-
disabled,
|
|
48
|
-
id: providedId,
|
|
49
|
-
control: externalControl,
|
|
50
|
-
checkedText,
|
|
51
|
-
uncheckedText,
|
|
52
|
-
// Validation props
|
|
53
|
-
required,
|
|
54
|
-
validate,
|
|
55
|
-
...props
|
|
56
|
-
}, ref) {
|
|
57
|
-
const generatedId = useId();
|
|
58
|
-
const inputId = providedId ?? generatedId;
|
|
59
|
-
const formConfigContext = useContext(FormConfigContext);
|
|
60
|
-
const formConfig = formConfigContext ?? {};
|
|
61
|
-
const rhfContext = useFormContext();
|
|
62
|
-
const control = externalControl ?? rhfContext?.control;
|
|
63
|
-
useEffect(() => {
|
|
64
|
-
if (formConfigContext?.registerFieldValidation) {
|
|
65
|
-
const rules = {};
|
|
66
|
-
if (required !== void 0) rules.required = required;
|
|
67
|
-
if (validate !== void 0) rules.validate = validate;
|
|
68
|
-
formConfigContext.registerFieldValidation({
|
|
69
|
-
name,
|
|
70
|
-
type: "boolean",
|
|
71
|
-
rules
|
|
72
|
-
});
|
|
73
|
-
return () => {
|
|
74
|
-
formConfigContext.unregisterFieldValidation(name);
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
}, [formConfigContext, name, required, validate]);
|
|
78
|
-
const { field, fieldState } = useController({
|
|
79
|
-
name,
|
|
80
|
-
control
|
|
81
|
-
});
|
|
82
|
-
const fieldError = fieldState.error?.message;
|
|
83
|
-
const errorMessage = customError ?? fieldError;
|
|
84
|
-
const hasError = !!errorMessage;
|
|
85
|
-
const effectiveSize = size ?? formConfig.size ?? "md";
|
|
86
|
-
const effectiveDisabled = disabled ?? formConfig.disabled;
|
|
87
|
-
const isChecked = field.value ?? false;
|
|
88
|
-
return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
|
|
89
|
-
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
|
|
90
|
-
/* @__PURE__ */ jsx(
|
|
91
|
-
Switch$1,
|
|
92
|
-
{
|
|
93
|
-
...props,
|
|
94
|
-
ref,
|
|
95
|
-
id: inputId,
|
|
96
|
-
checked: isChecked,
|
|
97
|
-
onCheckedChange: (checked) => field.onChange(checked),
|
|
98
|
-
disabled: effectiveDisabled,
|
|
99
|
-
"aria-labelledby": label ? `${inputId}-label` : void 0,
|
|
100
|
-
className: cn(
|
|
101
|
-
switchSizeVariants({ size: effectiveSize }),
|
|
102
|
-
className
|
|
103
|
-
)
|
|
104
|
-
}
|
|
105
|
-
),
|
|
106
|
-
(checkedText || uncheckedText) && /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: isChecked ? checkedText : uncheckedText }),
|
|
107
|
-
label && /* @__PURE__ */ jsx(
|
|
108
|
-
Label,
|
|
109
|
-
{
|
|
110
|
-
id: `${inputId}-label`,
|
|
111
|
-
htmlFor: inputId,
|
|
112
|
-
className: labelVariants({ disabled: effectiveDisabled }),
|
|
113
|
-
children: label
|
|
114
|
-
}
|
|
115
|
-
)
|
|
116
|
-
] }),
|
|
117
|
-
showError && hasError && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", role: "alert", children: errorMessage }),
|
|
118
|
-
helperText && !hasError && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: helperText })
|
|
119
|
-
] });
|
|
120
|
-
}
|
|
121
|
-
const Switch = forwardRef(SwitchInner);
|
|
122
|
-
Switch.displayName = "Switch";
|
|
123
|
-
export {
|
|
124
|
-
Switch
|
|
125
|
-
};
|
|
126
|
-
//# sourceMappingURL=Switch.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.js","sources":["../../../src/components/Form/Switch.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useId, useContext, useEffect } from \"react\";\nimport type { ReactNode, ComponentPropsWithoutRef } from \"react\";\nimport { useController, useFormContext as useRHFFormContext, type FieldValues, type FieldPath, type Control } from \"react-hook-form\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\nimport { FormConfigContext, type FormConfig, type FieldValidationRules } from \"../Form/context\";\nimport { Switch as ShadcnSwitch } from \"../../primitives/switch\";\nimport { Label } from \"../../primitives/label\";\nimport type * as SwitchPrimitives from \"@radix-ui/react-switch\";\n\nconst switchSizeVariants = cva(\n \"\",\n {\n variants: {\n size: {\n sm: \"h-5 w-9\",\n md: \"h-6 w-11\",\n lg: \"h-7 w-14\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n }\n);\n\nconst labelVariants = cva(\n \"text-sm font-medium cursor-pointer select-none\",\n {\n variants: {\n disabled: {\n true: \"cursor-not-allowed opacity-50\",\n false: \"\",\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n);\n\nexport interface SwitchProps<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> extends Omit<ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>, \"name\" | \"checked\" | \"onCheckedChange\" | \"required\">,\n VariantProps<typeof switchSizeVariants> {\n /** Field name - required for form integration */\n name: TName;\n /** Label text for the switch */\n label?: ReactNode;\n /** Helper text displayed below the switch */\n helperText?: string;\n /** Whether to show the error message */\n showError?: boolean;\n /** Custom error message (overrides form error) */\n error?: string;\n /** External control (for use outside Form) */\n control?: Control<TFieldValues>;\n /** Text to show when checked */\n checkedText?: ReactNode;\n /** Text to show when unchecked */\n uncheckedText?: ReactNode;\n \n // Validation props\n /** Field is required (must be on) */\n required?: boolean | string;\n /** Custom validation function */\n validate?: (value: unknown) => boolean | string | Promise<boolean | string>;\n}\n\n/**\n * Switch component with form integration\n * \n * This is a wrapper around the shadcn/ui Switch primitive that adds:\n * - Form integration with react-hook-form\n * - Automatic validation registration\n * - Label, helper text, and error message support\n * - Checked/unchecked text display\n * \n * @example\n * ```tsx\n * // Inside a Form component\n * <Switch name=\"notifications\" label=\"Enable notifications\" />\n * <Switch name=\"terms\" label=\"Accept terms\" required=\"You must accept the terms\" />\n * <Switch name=\"darkMode\" label=\"Dark mode\" checkedText=\"On\" uncheckedText=\"Off\" />\n * ```\n */\nfunction SwitchInner<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>(\n {\n name,\n label,\n helperText,\n showError = true,\n error: customError,\n size,\n className,\n disabled,\n id: providedId,\n control: externalControl,\n checkedText,\n uncheckedText,\n // Validation props\n required,\n validate,\n ...props\n }: SwitchProps<TFieldValues, TName>,\n ref: React.ForwardedRef<React.ElementRef<typeof SwitchPrimitives.Root>>\n) {\n const generatedId = useId();\n const inputId = providedId ?? generatedId;\n \n // Try to get form context\n const formConfigContext = useContext(FormConfigContext);\n const formConfig: FormConfig = formConfigContext ?? {};\n \n // Get form context from react-hook-form\n const rhfContext = useRHFFormContext<TFieldValues>();\n const control = externalControl ?? rhfContext?.control;\n\n // Register validation rules with the form\n useEffect(() => {\n if (formConfigContext?.registerFieldValidation) {\n const rules: FieldValidationRules = {};\n \n if (required !== undefined) rules.required = required;\n if (validate !== undefined) rules.validate = validate;\n\n formConfigContext.registerFieldValidation({\n name: name as string,\n type: \"boolean\",\n rules,\n });\n\n return () => {\n formConfigContext.unregisterFieldValidation(name as string);\n };\n }\n }, [formConfigContext, name, required, validate]);\n\n // Use controller for form integration\n const { field, fieldState } = useController<TFieldValues, TName>({\n name,\n control,\n });\n\n const fieldError = fieldState.error?.message;\n const errorMessage = customError ?? fieldError;\n const hasError = !!errorMessage;\n \n // Merge sizes - prop takes precedence over form config\n const effectiveSize = size ?? formConfig.size ?? \"md\";\n const effectiveDisabled = disabled ?? formConfig.disabled;\n const isChecked = field.value ?? false;\n\n return (\n <div className=\"space-y-1.5\">\n <div className=\"flex items-center gap-3\">\n <ShadcnSwitch\n {...props}\n ref={ref}\n id={inputId}\n checked={isChecked}\n onCheckedChange={(checked) => field.onChange(checked)}\n disabled={effectiveDisabled}\n aria-labelledby={label ? `${inputId}-label` : undefined}\n className={cn(\n switchSizeVariants({ size: effectiveSize }),\n className\n )}\n />\n \n {(checkedText || uncheckedText) && (\n <span className=\"text-sm text-muted-foreground\">\n {isChecked ? checkedText : uncheckedText}\n </span>\n )}\n \n {label && (\n <Label\n id={`${inputId}-label`}\n htmlFor={inputId}\n className={labelVariants({ disabled: effectiveDisabled })}\n >\n {label}\n </Label>\n )}\n </div>\n\n {showError && hasError && (\n <p className=\"text-sm text-destructive\" role=\"alert\">\n {errorMessage}\n </p>\n )}\n \n {helperText && !hasError && (\n <p className=\"text-sm text-muted-foreground\">\n {helperText}\n </p>\n )}\n </div>\n );\n}\n\n// Use forwardRef with generic support\nexport const Switch = forwardRef(SwitchInner) as <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>(\n props: SwitchProps<TFieldValues, TName> & { ref?: React.ForwardedRef<React.ElementRef<typeof SwitchPrimitives.Root>> }\n) => React.ReactElement;\n\n(Switch as React.FC).displayName = \"Switch\";\n"],"names":["useRHFFormContext","ShadcnSwitch"],"mappings":"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"}
|
package/dist/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|