Option

🛠 Status: Pilot Phase

Lion Web Components are still in an early alpha stage; they should not be considered production ready yet.

The goal of our pilot phase is to gather feedback from a private group of users. Therefore, during this phase, we kindly ask you to:

• not publicly promote or link us yet: (no tweets, blog posts or other forms of communication about Lion Web Components)
• not publicly promote or link products derived from/based on Lion Web Components

As soon as Pilot Phase ends we will let you know (feel free to subscribe to this issue https://github.com/ing-bank/lion/issues/1)

lion-option is a selectable within a lion-select-rich

Live Demo/Documentation

See our storybook for a live demo and API documentation

How to use

Installation

npm i --save @lion/option

import '@lion/option/lion-option.js';

Example

<lion-option .choiceValue=${'hotpink'} checked>Hotpink</lion-option>

You can also set the full modelValue for each option.

<lion-option .modelValue=${{ value: 'red', checked: false }}>Red</lion-option>

This component should not be used standalone. It is not accessible unless it is a child of a listbox-like element.

For more details on usage, please see lion-select-rich.