@versini/ui-togglegroup 6.1.0 → 7.0.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 +3 -10
- package/dist/components/index.js +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -20,7 +20,6 @@ The ToggleGroup component provides grouped toggle buttons for single-select usag
|
|
|
20
20
|
- **🔢 Grouped Selection**: Manage a set of related options with single selection
|
|
21
21
|
- **♿ Accessible**: Built atop Radix primitives with robust a11y patterns
|
|
22
22
|
- **🎨 Theming & Sizes**: Supports light/dark/system modes & `small | medium | large` sizes
|
|
23
|
-
- **🎯 Focus Styles**: Independent `focusMode` to align with design tokens
|
|
24
23
|
- **⌨️ Keyboard Friendly**: Arrow key navigation & typeahead labeling
|
|
25
24
|
- **🧪 Type Safe**: Strongly typed props and context sharing
|
|
26
25
|
|
|
@@ -88,12 +87,7 @@ function App() {
|
|
|
88
87
|
### Themed Group (Dark)
|
|
89
88
|
|
|
90
89
|
```tsx
|
|
91
|
-
<ToggleGroup
|
|
92
|
-
mode="dark"
|
|
93
|
-
focusMode="light"
|
|
94
|
-
value={theme}
|
|
95
|
-
onValueChange={setTheme}
|
|
96
|
-
>
|
|
90
|
+
<ToggleGroup mode="dark" value={theme} onValueChange={setTheme}>
|
|
97
91
|
<ToggleGroupItem value="auto" />
|
|
98
92
|
<ToggleGroupItem value="light" />
|
|
99
93
|
<ToggleGroupItem value="dark" />
|
|
@@ -105,13 +99,12 @@ function App() {
|
|
|
105
99
|
### ToggleGroup Props
|
|
106
100
|
|
|
107
101
|
| Prop | Type | Default | Description |
|
|
108
|
-
| --------------- | ------------------------- | -------- | ----------------------------------------- | ------------- | --------------------- |
|
|
102
|
+
| --------------- | ------------------------- | -------- | ----------------------------------------- | ------------- | --------------------- | ------------------- |
|
|
109
103
|
| `value` | `string` | - | Current selected value (controlled). |
|
|
110
104
|
| `defaultValue` | `string` | - | Initial value (uncontrolled). |
|
|
111
105
|
| `onValueChange` | `(value: string) => void` | - | Fired when selection changes. |
|
|
112
106
|
| `disabled` | `boolean` | - | Disable the entire group. |
|
|
113
|
-
| `mode` | `"dark" | "light" | "system" | "alt-system"` | `"system"` | Color / theme mode.
|
|
114
|
-
| `focusMode` | `"dark" | "light" | "system" | "alt-system"` | `"system"` | Color mode for focus ring. |
|
|
107
|
+
| `mode` | `"dark" | "light" | "system" | "alt-system"` | `"system"` | Color / theme mode. |
|
|
115
108
|
| `size` | `"small" | "medium" | "large"` | `"medium"` | Visual size of items. |
|
|
116
109
|
| `className` | `string` | - | Extra class(es) applied to container. |
|
|
117
110
|
| `children` | `React.ReactNode` | - | One or more `ToggleGroupItem` components. |
|
package/dist/components/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-togglegroup",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "7.0.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"test": "vitest run"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@versini/ui-types": "
|
|
40
|
+
"@versini/ui-types": "9.0.0"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@radix-ui/react-toggle-group": "1.1.11",
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"sideEffects": [
|
|
48
48
|
"**/*.css"
|
|
49
49
|
],
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "a295349019d1512796f266bba535de383f12b6ee"
|
|
51
51
|
}
|