@finastra/radio NPM

Radio

fds-radio extend Material web's mwc-radio-base

Usage

Import

npm i @finastra/radio

import '@finastra/radio';
...
<fds-radio checked name="Gaga" value="Freddie"></fds-radio>
<fds-radio checked name="Gaga" value="Mercury"></fds-radio>

API

Properties

Property	Attribute	Modifiers	Type	Default	Description
`ariaLabel`			`string`
`ariaLabelledBy`			`string`
`checked`	`checked`		`boolean`	false	We define our own getter/setter for `checked` because we need to trackchanges to it synchronously.The order in which the `checked` property is set across radio buttonswithin the same group is very important. However, we can't rely onUpdatingElement's `updated` callback to observe these changes (which isalso what the `@observer` decorator uses), because it batches changes toall properties.Consider: radio1.disabled = true; radio2.checked = true; radio1.checked = true;In this case we'd first see all changes for radio1, and then for radio2,and we couldn't tell that radio1 was the most recently checked.
`disabled`	`disabled`		`boolean`	false	Disabled state for the component. When `disabled` is set to `true`, thecomponent will not be added to form submission.
`formElementTabIndex`			`number`		input's tabindex is updated based on checked status.Tab navigation will be removed from unchecked radios.
`global`	`global`		`boolean`	false	If true, this radio button will use a global, document-level scope for its selection group rather than its local shadow root.
`isRippleActive`		readonly
`name`	`name`		`string`	""	Name of the input for form submission, and identifier for the selection group. Only one radio button can be checked for a given selection group.
`reducedTouchTarget`	`reducedTouchTarget`		`boolean`	false	Touch target extends beyond visual boundary of a component by default.Set to `true` to remove touch target added to the component.
`ripple`			`Promise<Ripple \\| null>`		Implement ripple getter for Ripple integration with mwc-formfield
`styles`			`CSSResult[]`	"styles"
`value`	`value`		`string`	""	Value of the input for form submission.