radio

➤ wl-radio

Select one option from a set.

➤ Properties

Property	Attribute	Type	Default	Description
ariaChecked	aria-checked	string		Aria checked attribute.
checked	checked	boolean	false	Checks the switch.
disabled	disabled	boolean	false	Disables the element.
name	name	string		Name of the native form element.
readonly	readonly	boolean	false	Makes the element readonly (disabled but tabbable)
required	required	boolean	false	Makes the element required in a form context.
role	role	AriaRole	"radio"	Role of the radio behavior.
value	value	string	""	Value of the form element.

➤ Events

Event	Description
change	Dispatched when the checked property changes due to a user interaction.

➤ CSS Custom Properties

Property	Description
--radio-bg	Default background
--radio-bg-checked	Background when checked
--radio-bg-disabled	Background when disabled and checked
--radio-bg-disabled-checked	Background when disabled and checked
--radio-border-config	Border configuration (width and style)
--radio-border-radius	Border radius
--radio-color	Default color
--radio-color-checked	Color when checked
--radio-color-disabled	Color when disabled
--radio-color-disabled-checked	Color when disabled and checked
--radio-dot-border-radius	Border radius of the dot
--radio-dot-size	Size of the dot
--radio-dot-transition	Transition of the dot
--radio-ripple-transform	Transform of the ripple
--radio-size	Width and height
--radio-transition	Transition

➤ Usage

Go here to try the demo.

➤ Contributors

Andreas Mehlsen	You?

➤ License

Licensed under MIT.