fix(radio-button): allow value type to be a number (#1868)

This commit is contained in:
metonym 2023-12-17 09:42:28 -08:00 committed by GitHub
commit 479225711a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 21 additions and 18 deletions

View file

@ -2937,7 +2937,7 @@ None.
| :------------ | :------- | :--------------- | :------- | ----------------------------------------- | ------------------------------------------------ | --------------------------------------------------- | | :------------ | :------- | :--------------- | :------- | ----------------------------------------- | ------------------------------------------------ | --------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element | | ref | No | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element |
| checked | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to check the radio button | | checked | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to check the radio button |
| value | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the value of the radio button | | value | No | <code>let</code> | No | <code>string &#124; number</code> | <code>""</code> | Specify the value of the radio button |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the radio button | | disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the radio button |
| required | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to mark the field as required | | required | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to mark the field as required |
| labelPosition | No | <code>let</code> | No | <code>"right" &#124; "left"</code> | <code>"right"</code> | Specify the label position | | labelPosition | No | <code>let</code> | No | <code>"right" &#124; "left"</code> | <code>"right"</code> | Specify the label position |
@ -2964,7 +2964,7 @@ None.
| Prop name | Required | Kind | Reactive | Type | Default value | Description | | Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :------------ | :------- | :--------------- | :------- | ------------------------------------------- | ------------------------- | -------------------------------------------------------- | | :------------ | :------- | :--------------- | :------- | ------------------------------------------- | ------------------------- | -------------------------------------------------------- |
| selected | No | <code>let</code> | Yes | <code>string</code> | <code>undefined</code> | Set the selected radio button value | | selected | No | <code>let</code> | Yes | <code>string &#124; number</code> | <code>undefined</code> | Set the selected radio button value |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the radio buttons | | disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the radio buttons |
| required | No | <code>let</code> | No | <code>boolean</code> | <code>undefined</code> | Set to `true` to require the selection of a radio button | | required | No | <code>let</code> | No | <code>boolean</code> | <code>undefined</code> | Set to `true` to require the selection of a radio button |
| name | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a name attribute for the radio button inputs | | name | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a name attribute for the radio button inputs |
@ -2983,13 +2983,13 @@ None.
### Events ### Events
| Event name | Type | Detail | | Event name | Type | Detail |
| :--------- | :--------- | :------------------ | | :--------- | :--------- | :-------------------------------- |
| change | dispatched | <code>string</code> | | change | dispatched | <code>string &#124; number</code> |
| click | forwarded | -- | | click | forwarded | -- |
| mouseover | forwarded | -- | | mouseover | forwarded | -- |
| mouseenter | forwarded | -- | | mouseenter | forwarded | -- |
| mouseleave | forwarded | -- | | mouseleave | forwarded | -- |
## `RadioButtonSkeleton` ## `RadioButtonSkeleton`

View file

@ -9366,7 +9366,7 @@
"name": "value", "name": "value",
"kind": "let", "kind": "let",
"description": "Specify the value of the radio button", "description": "Specify the value of the radio button",
"type": "string", "type": "string | number",
"value": "\"\"", "value": "\"\"",
"isFunction": false, "isFunction": false,
"isFunctionDeclaration": false, "isFunctionDeclaration": false,
@ -9503,7 +9503,7 @@
"name": "selected", "name": "selected",
"kind": "let", "kind": "let",
"description": "Set the selected radio button value", "description": "Set the selected radio button value",
"type": "string", "type": "string | number",
"isFunction": false, "isFunction": false,
"isFunctionDeclaration": false, "isFunctionDeclaration": false,
"isRequired": false, "isRequired": false,
@ -9615,7 +9615,7 @@
} }
], ],
"events": [ "events": [
{ "type": "dispatched", "name": "change", "detail": "string" }, { "type": "dispatched", "name": "change", "detail": "string | number" },
{ "type": "forwarded", "name": "click", "element": "div" }, { "type": "forwarded", "name": "click", "element": "div" },
{ "type": "forwarded", "name": "mouseover", "element": "div" }, { "type": "forwarded", "name": "mouseover", "element": "div" },
{ "type": "forwarded", "name": "mouseenter", "element": "div" }, { "type": "forwarded", "name": "mouseenter", "element": "div" },

View file

@ -1,5 +1,8 @@
<script> <script>
/** Specify the value of the radio button */ /**
* Specify the value of the radio button
* @type {string | number}
*/
export let value = ""; export let value = "";
/** Set to `true` to check the radio button */ /** Set to `true` to check the radio button */

View file

@ -1,11 +1,11 @@
<script> <script>
/** /**
* @event {string} change * @event {string | number} change
*/ */
/** /**
* Set the selected radio button value * Set the selected radio button value
* @type {string} * @type {string | number}
*/ */
export let selected = undefined; export let selected = undefined;

View file

@ -8,7 +8,7 @@ export interface RadioButtonProps extends RestProps {
* Specify the value of the radio button * Specify the value of the radio button
* @default "" * @default ""
*/ */
value?: string; value?: string | number;
/** /**
* Set to `true` to check the radio button * Set to `true` to check the radio button

View file

@ -8,7 +8,7 @@ export interface RadioButtonGroupProps extends RestProps {
* Set the selected radio button value * Set the selected radio button value
* @default undefined * @default undefined
*/ */
selected?: string; selected?: string | number;
/** /**
* Set to `true` to disable the radio buttons * Set to `true` to disable the radio buttons
@ -64,7 +64,7 @@ export interface RadioButtonGroupProps extends RestProps {
export default class RadioButtonGroup extends SvelteComponentTyped< export default class RadioButtonGroup extends SvelteComponentTyped<
RadioButtonGroupProps, RadioButtonGroupProps,
{ {
change: CustomEvent<string>; change: CustomEvent<string | number>;
click: WindowEventMap["click"]; click: WindowEventMap["click"];
mouseover: WindowEventMap["mouseover"]; mouseover: WindowEventMap["mouseover"];
mouseenter: WindowEventMap["mouseenter"]; mouseenter: WindowEventMap["mouseenter"];