shadow
The radio element is a modified version of the standard HTML radio element, enhanced with styles to achieve a more visually consistent user interface across devices. It works similarly to a standard radio button and allows users to select one from a set of options. It is used inside the radio group element to add alignment and group them together.
Adding the inline property arranges the elements in a horizontal layout.
Using the color property it is possible to change the color of the radio element.
| Description | Indicates whether the switch is checked. |
| Attribute | checked |
| Type | boolean |
| Default | false |
| Description | Indicates whether the switch is unchecked. |
| Attribute | disabled |
| Type | boolean |
| Default | false |
| Description | Specifies the color of the switch. |
| Attribute | color |
| Type | string |
| Default | undefined |
| Description | Switch value. |
| Attribute | value |
| Type | string |
| Default | undefined |
| Description | Specifies the location of the label relative to the switch. |
| Attribute | placement |
| Type | string |
| Default | start |
| Name | Description |
|---|
wje-radio:change | Called when the switch state changes. |
wje-radio:input | Invoked when interacting with the switch. |
No public methods available for this component.
No CSS shadow parts available for this component.
| Name | Description |
|---|
--wje-radio-margin-inline | Specifies the horizontal (left and right) offset for the switch. Accepts any valid CSS length unit (e.g. px, rem, %) to control the spacing on either side of the component. |
--wje-radio-margin-top | Defines the upper offset for the switch. Accepts any valid CSS length value to set the vertical spacing above the component. |
--wje-radio-margin-bottom | Sets the lower offset for the switch. Accepts any valid CSS length value to set the vertical spacing below the component. |
| Name | Description |
|---|
| `` | The default switch label content slot. |