@startupjs-ui/radio 0.1.13 → 0.1.16
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/CHANGELOG.md +8 -0
- package/README.mdx +16 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.1.16](https://github.com/startupjs/startupjs-ui/compare/v0.1.15...v0.1.16) (2026-02-10)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @startupjs-ui/radio
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
## [0.1.13](https://github.com/startupjs/startupjs-ui/compare/v0.1.12...v0.1.13) (2026-02-03)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @startupjs-ui/radio
|
package/README.mdx
CHANGED
|
@@ -4,7 +4,7 @@ import { Sandbox } from '@startupjs-ui/docs'
|
|
|
4
4
|
|
|
5
5
|
# Radio
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
Lets the user pick exactly one option from a list. Each option is rendered as a radio button with an optional label and description.
|
|
8
8
|
|
|
9
9
|
```jsx
|
|
10
10
|
import { Radio } from 'startupjs-ui'
|
|
@@ -12,6 +12,8 @@ import { Radio } from 'startupjs-ui'
|
|
|
12
12
|
|
|
13
13
|
## Basic usage
|
|
14
14
|
|
|
15
|
+
Pass an array of options and track the selected value with `value` and `onChange`. Options can be plain strings (used as both the value and the label) or objects with `value`, `label`, and `description` fields.
|
|
16
|
+
|
|
15
17
|
```jsx example
|
|
16
18
|
const [checked, setChecked] = useState()
|
|
17
19
|
return (
|
|
@@ -25,6 +27,8 @@ return (
|
|
|
25
27
|
|
|
26
28
|
## Custom label and description
|
|
27
29
|
|
|
30
|
+
When you need separate display text or a description beneath each option, pass objects with `value`, `label`, and an optional `description`.
|
|
31
|
+
|
|
28
32
|
```jsx example
|
|
29
33
|
const [checked, setChecked] = useState()
|
|
30
34
|
return (
|
|
@@ -49,6 +53,8 @@ return (
|
|
|
49
53
|
|
|
50
54
|
## Disabled
|
|
51
55
|
|
|
56
|
+
Set `disabled` to prevent all interaction. Every option appears greyed out and cannot be selected.
|
|
57
|
+
|
|
52
58
|
```jsx example
|
|
53
59
|
const [checked, setChecked] = useState()
|
|
54
60
|
|
|
@@ -73,6 +79,8 @@ return (
|
|
|
73
79
|
|
|
74
80
|
## Readonly
|
|
75
81
|
|
|
82
|
+
Set `readonly` to display the current selection without allowing changes. Unlike `disabled`, the component retains its normal visual styling.
|
|
83
|
+
|
|
76
84
|
```jsx example
|
|
77
85
|
const [checked, setChecked] = useState('js')
|
|
78
86
|
|
|
@@ -95,6 +103,13 @@ return (
|
|
|
95
103
|
)
|
|
96
104
|
```
|
|
97
105
|
|
|
106
|
+
## Additional props
|
|
107
|
+
|
|
108
|
+
- `style` -- custom styles applied to the root wrapper
|
|
109
|
+
- `inputStyle` -- custom styles applied to each individual option item
|
|
110
|
+
- `row` -- when `true`, renders the options horizontally in a row (default `false`)
|
|
111
|
+
- `onChange` -- callback invoked with the selected option's value when the user makes a selection
|
|
112
|
+
|
|
98
113
|
## Sandbox
|
|
99
114
|
|
|
100
115
|
<Sandbox
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@startupjs-ui/radio",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.16",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -9,13 +9,13 @@
|
|
|
9
9
|
"type": "module",
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@startupjs-ui/core": "^0.1.11",
|
|
12
|
-
"@startupjs-ui/div": "^0.1.
|
|
13
|
-
"@startupjs-ui/span": "^0.1.
|
|
12
|
+
"@startupjs-ui/div": "^0.1.16",
|
|
13
|
+
"@startupjs-ui/span": "^0.1.16"
|
|
14
14
|
},
|
|
15
15
|
"peerDependencies": {
|
|
16
16
|
"react": "*",
|
|
17
17
|
"react-native": "*",
|
|
18
18
|
"startupjs": "*"
|
|
19
19
|
},
|
|
20
|
-
"gitHead": "
|
|
20
|
+
"gitHead": "9943aa3566d5d80f5b404473906eb3c0611f9ee5"
|
|
21
21
|
}
|