@lion/ui 0.7.3 → 0.7.5

package/docs/fundamentals/systems/form/api-table.md

@@ -0,0 +1,166 @@
+# Systems >> Form >> API Table ||90 
+
+## class: `LionField`, `lion-field`
+
+### Fields
+
+| Name                         | Privacy   | Type                                  | Default                 | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | Inherited From        |
+| ---------------------------- | --------- | ------------------------------------- | ----------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------- |
+| `_feedbackConditionMeta`     | protected |                                       |                         | Allows Subclassers to add meta info for feedbackCondition                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | ValidateMixin         |
+| `_focusableNode`             | protected | `HTMLElement`                         |                         | The focusable element:
could be an input, textarea, select, button or any other element with tabindex > -1                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | FocusMixin            |
+| `label`                      | public    | `string`                              | `''`                    | The label text for the input node.
When no value is defined, textContent of \[slot=label] will be used                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | FormControlMixin      |
+| `helpText`                   | public    | `string`                              | `''`                    | The helpt text for the input node.
When no value is defined, textContent of \[slot=help-text] will be used                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | FormControlMixin      |
+| `fieldName`                  | public    | `string`                              |                         | Will be used in validation messages to refer to the current field                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | FormControlMixin      |
+| `_inputNode`                 | protected |                                       |                         | The interactive (form) element. Can be a native element like input/textarea/select or
an element with tabindex > -1                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | FormControlMixin      |
+| `_labelNode`                 | protected |                                       |                         | Element where label will be rendered to                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | FormControlMixin      |
+| `_helpTextNode`              | protected |                                       |                         | Element where help text will be rendered to                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | FormControlMixin      |
+| `_feedbackNode`              | protected |                                       |                         | Element where validation feedback will be rendered to                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | FormControlMixin      |
+| `readOnly`                   | public    | `boolean`                             | `false`                 | A Boolean attribute which, if present, indicates that the user should not be able to edit
the value of the input. The difference between disabled and readonly is that read-only
controls can still function, whereas disabled controls generally do not function as
controls until they are enabled.
(From: https\://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-readonly)                                                                                                                                                                                              | FormControlMixin      |
+| `labelSrOnly`                | public    | `boolean`                             | `false`                 | The label will only be visible for srceen readers when true                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | FormControlMixin      |
+| `_inputId`                   | protected | `string`                              |                         | Unique id that can be used in all light dom                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | FormControlMixin      |
+| `_ariaLabelledNodes`         | public    | `HTMLElement[]`                       | `[]`                    | Contains all elements that should end up in aria-labelledby of \`.\_inputNode\`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | FormControlMixin      |
+| `_ariaDescribedNodes`        | public    | `HTMLElement[]`                       | `[]`                    | Contains all elements that should end up in aria-describedby of \`.\_inputNode\`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | FormControlMixin      |
+| `_repropagationRole`         | public    | `'child'\|'choice-group'\|'fieldset'` | `'child'`               | Based on the role, details of handling model-value-changed repropagation differ.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | FormControlMixin      |
+| `_isRepropagationEndpoint`   | public    | `boolean`                             | `false`                 | By default, a field with \_repropagationRole 'choice-group' will act as an
'endpoint'. This means it will be considered as an individual field: for
a select, individual options will not be part of the formPath. They
will.
Similarly, components that (a11y wise) need to be fieldsets, but 'interaction wise'
(from Application Developer perspective) need to be more like fields
(think of an amount-input with a currency select box next to it), can set this
to true to hide private internals in the formPath.                                                      | FormControlMixin      |
+| `modelValue`                 | public    |                                       |                         |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | FormControlMixin      |
+| `name`                       | public    | `string`                              | `''`                    | The name the element will be registered with to the .formElements collection
of the parent. Also, it serves as the key of key/value pairs in
 modelValue/serializedValue objects                                                                                                                                                                                                                                                                                                                                                                                                                  | FormRegisteringMixin  |
+| `_parentFormGroup`           | protected | `FormRegistrarHost \| undefined`      | `undefined`             | The registrar this FormControl registers to, Usually a descendant of FormGroup or
ChoiceGroup                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | FormRegisteringMixin  |
+| `allowCrossRootRegistration` | public    | `boolean`                             | `false`                 | To encourage accessibility best practices, \`form-element-register\` events
do not pierce through shadow roots. This forces the developer to create form groups and fieldsets that automatically allow the creation of accessible relationships in the same dom tree.
Use this option if you know what you're doing. It will then be possible to nest FormControls
inside shadow dom. See https\://lion-web.netlify.app/fundamentals/rationales/accessibility/#shadow-roots-and-accessibility                                                                                                 | FormRegisteringMixin  |
+| `_requestedToBeDisabled`     | protected | `boolean`                             | `false`                 |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | DisabledMixin         |
+| `disabled`                   | public    | `boolean`                             | `false`                 |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | DisabledMixin         |
+| `touched`                    | public    | `boolean`                             | `false`                 | True when user has focused and left(blurred) the field.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | InteractionStateMixin |
+| `dirty`                      | public    | `boolean`                             | `false`                 | True when user has changed the value of the field.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        | InteractionStateMixin |
+| `prefilled`                  | public    | `boolean`                             | `false`                 | True when user has left non-empty field or input is prefilled.
The name must be seen from the point of view of the input field:
once the user enters the input field, the value is non-empty.                                                                                                                                                                                                                                                                                                                                                                                                     | InteractionStateMixin |
+| `filled`                     | public    | `boolean`                             | `false`                 | True when the modelValue is non-empty (see \_isEmpty in FormControlMixin)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | InteractionStateMixin |
+| `_leaveEvent`                | protected | `string`                              | `'blur'`                | The event that triggers the touched state                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | InteractionStateMixin |
+| `_valueChangedEvent`         | protected | `string`                              | `'model-value-changed'` | The event that triggers the dirty state                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | InteractionStateMixin |
+| `submitted`                  | public    |                                       |                         |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | InteractionStateMixin |
+| `focused`                    | public    | `boolean`                             | `false`                 | Whether the focusable element within (\`.\_focusableNode\`) is focused.
Reflects to attribute '\[focused]' as a styling hook                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | FocusMixin            |
+| `focusedVisible`             | public    | `boolean`                             | `false`                 | Whether the focusable element within (\`.\_focusableNode\`) matches ':focus-visible'
Reflects to attribute '\[focused-visible]' as a styling hook
See: https\://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible                                                                                                                                                                                                                                                                                                                                                                           | FocusMixin            |
+| `autofocus`                  | public    | `boolean`                             | `false`                 |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | FocusMixin            |
+| `value`                      | public    |                                       |                         | The view value. Will be delegated to \`.\_inputNode.value\`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | FormatMixin           |
+| `formatOn`                   | protected | `string`                              | `'change'`              | Event that will trigger formatting (more precise, visual update of the view, so the
user sees the formatted value)
Default: 'change'                                                                                                                                                                                                                                                                                                                                                                                                                                                              | FormatMixin           |
+| `formatOptions`              | public    |                                       | `({})`                  | Configuration object that will be available inside the formatter function                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | FormatMixin           |
+| `formattedValue`             | public    | `string\|undefined`                   | `undefined`             | The view value is the result of the formatter function (when available).
The result will be stored in the native \_inputNode (usually an input\[type=text]).

Examples:
- For a date input, this would be '20/01/1999' (dependent on locale).
- For a number input, this could be '1,234.56' (a String representation of modelValue
1234.56)                                                                                                                                                                                                                                      | FormatMixin           |
+| `serializedValue`            | public    | `string\|undefined`                   | `undefined`             | The serialized version of the model value.
This value exists for maximal compatibility with the platform API.
The serialized value can be an interface in context where data binding is not
supported and a serialized string needs to be set.

Examples:
- For a date input, this would be the iso format of a date, e.g. '1999-01-20'.
- For a number input this would be the String representation of a float ('1234.56'
  instead of 1234.56)

When no parser is available, the value is usually the same as the formattedValue
(being \_inputNode.value) | FormatMixin           |
+| `_isPasting`                 | protected | `boolean`                             | `false`                 | Whether the user is pasting content. Allows Subclassers to do this in their subclass:                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | FormatMixin           |
+| `_isHandlingUserInput`       | protected | `boolean`                             | `false`                 | Flag that will be set when user interaction takes place (for instance after an 'input'
event). Will be added as meta info to the \`model-value-changed\` event. Depending on
whether a user is interacting, formatting logic will be handled differently.                                                                                                                                                                                                                                                                                                                                         | FormatMixin           |
+| `operationMode`              | public    | `OperationMode`                       |                         | Types of input interaction of the FormControl (for instance 'enter'\|'select'\|'upload')                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | ValidateMixin         |
+| `_allValidators`             | protected | `Validator[]`                         |                         | Combination of validators provided by Application Developer and the default validators                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | ValidateMixin         |
+| `hasFeedbackFor`             | public    | `ValidationType[]`                    | `[]`                    | As soon as validation happens (after modelValue/validators/validator param change), this
array is updated with the active ValidationTypes ('error'\|'warning'\|'success'\|'info' etc.).
Notice the difference with \`.showsFeedbackFor\`, which filters \`.hasFeedbackFor\` based on
\`.feedbackCondition()\`.

For styling purposes, will be reflected to \[has-feedback-for="error warning"]. This can
be useful for subtle visual feedback on keyup, like a red/green border around an input.                                                                                  | ValidateMixin         |
+| `showsFeedbackFor`           | public    | `ValidationType[]`                    | `[]`                    | Based on outcome of feedbackCondition, this array decides what ValidationTypes should be
shown in validationFeedback, based on meta data like interaction states.

For styling purposes, it reflects it \`\[shows-feedback-for="error warning"]\`                                                                                                                                                                                                                                                                                                                                             | ValidateMixin         |
+| `validationStates`           | public    | `ValidationStates`                    | `{}`                    | The outcome of a validation 'round'. Keyed by ValidationType and Validator name                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | ValidateMixin         |
+| `isPending`                  | public    | `boolean`                             | `false`                 | Flag indicating whether async validation is pending.
Creates attribute \[is-pending] as a styling hook                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | ValidateMixin         |
+| `validators`                 | public    | `Validator[]`                         | `[]`                    | Used by Application Developers to add Validators to a FormControl.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        | ValidateMixin         |
+| `defaultValidators`          | public    | `Validator[]`                         | `[]`                    | Used by Subclassers to add default Validators to a particular FormControl.
A date input for instance, always needs the isDate validator.                                                                                                                                                                                                                                                                                                                                                                                                                                                              | ValidateMixin         |
+| `_visibleMessagesAmount`     | protected | `number`                              | `1`                     | The amount of feedback messages that will visible in LionValidationFeedback                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | ValidateMixin         |
+
+### Methods
+
+| Name                                     | Privacy   | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | Parameters                                                                                                     | Return                                                        | Inherited From        |
+| ---------------------------------------- | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- | --------------------- |
+| `resetInteractionState`                  | public    | Resets touched and dirty, and recomputes prefilled                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |                                                                                                                |                                                               | InteractionStateMixin |
+| `reset`                                  | public    | Resets modelValue to initial value.
Interaction states are cleared                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |                                                                                                                |                                                               |                       |
+| `clear`                                  | public    | Clears modelValue.
Interaction states are not cleared (use resetInteractionState for this)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |                                                                                                                |                                                               |                       |
+| `_onChange`                              | protected | Dispatches custom bubble event                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | `ev: Event=`                                                                                                   |                                                               |                       |
+| `_triggerInitialModelValueChangedEvent`  | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormControlMixin      |
+| `_enhanceLightDomClasses`                | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormControlMixin      |
+| `_enhanceLightDomA11y`                   | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormControlMixin      |
+| `_enhanceLightDomA11yForAdditionalSlots` | protected | Enhances additional slots(prefix, suffix, before, after) defined by developer.

When boolean attribute data-label or data-description is found,
the slot element will be connected to the input via aria-labelledby or aria-describedby                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `additionalSlots: string[]`                                                                                    |                                                               | FormControlMixin      |
+| `__reflectAriaAttr`                      | protected | Will handle help text, validation feedback and character counter,&#xA;prefix/suffix/before/after (if they contain data-description flag attr).&#xA;Also, contents of id references that will be put in the \<lion-field>.\_ariaDescribedby property&#xA;from an external context, will be read by a screen reader.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `attrName: string, nodes: Element[], reorder: boolean\|undefined`                                              |                                                               | FormControlMixin      |
+| `_groupOneTemplate`                      | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_groupTwoTemplate`                      | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_labelTemplate`                         | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_helpTextTemplate`                      | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_inputGroupTemplate`                    | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_inputGroupBeforeTemplate`              | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_inputGroupPrefixTemplate`              | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult \| nothing`                                   | FormControlMixin      |
+| `_inputGroupInputTemplate`               | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_inputGroupSuffixTemplate`              | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult \| nothing`                                   | FormControlMixin      |
+| `_inputGroupAfterTemplate`               | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_feedbackTemplate`                      | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                | `TemplateResult`                                              | FormControlMixin      |
+| `_isEmpty`                               | protected | Used for Required validation and computation of interaction states                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `modelValue: any`                                                                                              | `boolean`                                                     | FormControlMixin      |
+| `_getAriaDescriptionElements`            | protected | This function exposes descripion elements that a FormGroup should expose to its&#xA;children. See FormGroupMixin.\_\_getAllDescriptionElementsInParentChain()                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            |                                                                                                                | `Array.<HTMLElement>`                                         | FormControlMixin      |
+| `addToAriaLabelledBy`                    | public    | Allows to add extra element references to aria-labelledby attribute.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `element: HTMLElement, { idPrefix = '', reorder = true }, customConfig: {idPrefix?:string; reorder?: boolean}` |                                                               | FormControlMixin      |
+| `removeFromAriaLabelledBy`               | public    | Allows to remove element references from aria-labelledby attribute.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `element: HTMLElement`                                                                                         |                                                               | FormControlMixin      |
+| `addToAriaDescribedBy`                   | public    | Allows to add element references to aria-describedby attribute.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `element: HTMLElement, { idPrefix = '', reorder = true }, customConfig: {idPrefix?:string; reorder?: boolean}` |                                                               | FormControlMixin      |
+| `removeFromAriaDescribedBy`              | public    | Allows to remove element references from aria-describedby attribute.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `element: HTMLElement`                                                                                         |                                                               | FormControlMixin      |
+| `__getDirectSlotChild`                   | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `slotName: string`                                                                                             | `HTMLElement \| undefined`                                    | FormControlMixin      |
+| `_dispatchInitialModelValueChangedEvent` | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormControlMixin      |
+| `_onBeforeRepropagateChildrenValues`     | protected | Hook for Subclassers to add logic before repropagation                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `ev: CustomEvent`                                                                                              |                                                               | FormControlMixin      |
+| `__repropagateChildrenValues`            | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `ev: CustomEvent`                                                                                              |                                                               | FormControlMixin      |
+| `_repropagationCondition`                | protected | Based on provided target, this condition determines whether received model-value-changed&#xA;event should be repropagated                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `target: FormControlHost`                                                                                      |                                                               | FormControlMixin      |
+| `_onLabelClick`                          | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormControlMixin      |
+| `makeRequestToBeDisabled`                | public    |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | DisabledMixin         |
+| `retractRequestToBeDisabled`             | public    |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | DisabledMixin         |
+| `initInteractionState`                   | public    | Evaluations performed on connectedCallback.&#xA;This method is public, so it can be called at a later moment (when we need to wait for&#xA;registering children for instance) as well.&#xA;Since this method will be called twice in last mentioned scenario, it must stay idempotent.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |                                                                                                                |                                                               | InteractionStateMixin |
+| `_iStateOnLeave`                         | protected | Sets touched value to true and reevaluates prefilled state.&#xA;When false, on next interaction, user will start with a clean state.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |                                                                                                                |                                                               | InteractionStateMixin |
+| `_iStateOnValueChange`                   | protected | Sets dirty value and validates when already touched or invalid                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |                                                                                                                |                                                               | InteractionStateMixin |
+| `_onTouchedChanged`                      | protected | Dispatches event on touched state change                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |                                                                                                                |                                                               | InteractionStateMixin |
+| `_onDirtyChanged`                        | protected | Dispatches event on touched state change                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |                                                                                                                |                                                               | InteractionStateMixin |
+| `_showFeedbackConditionFor`              | protected | Default feedbackCondition condition, used by Subclassers, that will be used when&#xA;\`feedbackCondition()\` is not overridden by Application Developer.&#xA;Show the validity feedback when returning true, don't show when false                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `type: string, meta: InteractionStates`                                                                        |                                                               | ValidateMixin         |
+| `focus`                                  | public    | Calls \`focus()\` on focusable element within                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            |                                                                                                                |                                                               | FocusMixin            |
+| `blur`                                   | public    | Calls \`blur()\` on focusable element within                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |                                                                                                                |                                                               | FocusMixin            |
+| `preprocessor`                           | public    | Preprocessors could be considered 'live formatters'. Their result is shown to the user&#xA;on keyup instead of after blurring the field. The biggest difference between preprocessors&#xA;and formatters is their moment of execution: preprocessors are run before modelValue is&#xA;computed (and work based on view value), whereas formatters are run after the parser (and&#xA;are based on modelValue)&#xA;Automatically formats code while typing. It depends on a preprocessro that smartly&#xA;updates the viewValue and caret position for best UX.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `v: string, opts: FormatOptions & { prevViewValue: string; currentCaretIndex: number }`                        | `{ viewValue:string; caretIndex:number; }\|string\|undefined` | FormatMixin           |
+| `parser`                                 | public    | Converts viewValue to modelValue&#xA;For instance, a localized date to a Date Object                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `v: string, opts: FormatOptions`                                                                               | `*`                                                           | FormatMixin           |
+| `formatter`                              | public    | Converts modelValue to formattedValue (formattedValue will be synced with&#xA;\`.\_inputNode.value\`)&#xA;For instance, a Date object to a localized date.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | `v: *, opts: FormatOptions`                                                                                    | `string`                                                      | FormatMixin           |
+| `serializer`                             | public    | Converts \`.modelValue\` to \`.serializedValue\`&#xA;For instance, a Date object to an iso formatted date string                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `v: ?`                                                                                                         | `string`                                                      | FormatMixin           |
+| `deserializer`                           | public    | Converts \`.serializedValue\` to \`.modelValue\`&#xA;For instance, an iso formatted date string to a Date object                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `v: ?`                                                                                                         | `?`                                                           | FormatMixin           |
+| `_calculateValues`                       | protected | Responsible for storing all representations(modelValue, serializedValue, formattedValue&#xA;and value) of the input value. Prevents infinite loops, so all value observers can be&#xA;treated like they will only be called once, without indirectly calling other observers.&#xA;(in fact, some are called twice, but the \_\_preventRecursiveTrigger lock prevents the&#xA;second call from having effect).                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `{ source }, config: {source:'model'\|'serialized'\|'formatted'\|null}`                                        |                                                               | FormatMixin           |
+| `_onModelValueChanged`                   | protected | Responds to modelValue changes in the synchronous cycle (most subclassers should listen to&#xA;the asynchronous cycle ('modelValue' in the .updated lifecycle))                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `args: { modelValue: unknown; }[]`                                                                             |                                                               | FormatMixin           |
+| `_dispatchModelValueChangedEvent`        | protected | This is wrapped in a distinct method, so that parents can control when the changed event&#xA;is fired. For objects, a deep comparison might be needed.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `args: { modelValue: unknown; }[]`                                                                             |                                                               | FormatMixin           |
+| `_syncValueUpwards`                      | protected | Synchronization from \`.\_inputNode.value\` to \`LionField\` (flow \[2])&#xA;Downwards syncing should only happen for \`LionField\`.value changes from 'above'.&#xA;This triggers \_onModelValueChanged and connects user input&#xA;to the parsing/formatting/serializing loop.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormatMixin           |
+| `_reflectBackFormattedValueToUser`       | protected | Synchronization from \`LionField.value\` to \`.\_inputNode.value\`&#xA;- flow \[1] will always be reflected back&#xA;- flow \[2] will not be reflected back when this flow was triggered via&#xA;  \`@user-input-changed\` (this will happen later, when \`formatOn\` condition is met)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |                                                                                                                |                                                               | FormatMixin           |
+| `_reflectBackOn`                         | protected | Every time .formattedValue is attempted to sync to the view value (on change/blur and on&#xA;modelValue change), this condition is checked. When enhancing it, it's recommended to&#xA;call via \`return this.\_myExtraCondition && super.\_reflectBackOn()\`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            |                                                                                                                | `boolean`                                                     | FormatMixin           |
+| `_proxyInputEvent`                       | protected | This can be called whenever the view value should be updated. Dependent on component type&#xA;("input" for \<input> or "change" for \<select>(mainly for IE)) a different event should be&#xA;used  as source for the "user-input-changed" event (which can be seen as an abstraction&#xA;layer on top of other events (input, change, whatever))                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        |                                                                                                                |                                                               | FormatMixin           |
+| `_onUserInputChanged`                    | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | FormatMixin           |
+| `__onCompositionEvent`                   | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `{ type }, event: Event`                                                                                       |                                                               | FormatMixin           |
+| `validate`                               | public    | Triggered by:&#xA; \- modelValue change&#xA; \- change in the 'validators' array&#xA; \- change in the config of an individual Validator&#xA;&#xA;Three situations are handled:&#xA;- a1) the FormControl is empty: further execution is halted. When the Required Validator&#xA;(being mutually exclusive to the other Validators) is applied, it will end up in the&#xA;validation result (as the only Validator, since further execution was halted).&#xA;- a2) there are synchronous Validators: this is the most common flow. When modelValue hasn't&#xA;changed since last async results were generated, 'sync results' are merged with the&#xA;'async results'.&#xA;- a3) there are asynchronous Validators: for instance when server side evaluation is needed.&#xA;Executions are scheduled and awaited and the 'async results' are merged with the&#xA;'sync results'.&#xA;&#xA;- b) there are MetaValidators. After steps a1, a2, or a3 are finished, the holistic&#xA;MetaValidators (evaluating the total result of the 'regular' (a1, a2 and a3) validators)&#xA;will be run...&#xA;&#xA;Situations a2 and a3 are not mutually exclusive and can be triggered within one \`validate()\`&#xA;call. Situation b will occur after every call. | `{ clearCurrentResult = false }, opts: { clearCurrentResult?: boolean }`                                       |                                                               | ValidateMixin         |
+| `__executeValidators`                    | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | ValidateMixin         |
+| `_onValidatorUpdated`                    | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `e: Event\|CustomEvent`                                                                                        |                                                               | ValidateMixin         |
+| `_updateFeedbackComponent`               | protected | Responsible for retrieving messages from Validators and&#xA;(delegation of) rendering them.&#xA;&#xA;For \`.\_feedbackNode\` (extension of LionValidationFeedback):&#xA;- retrieve messages from highest prio Validators&#xA;- provide the result to custom feedback node and let the&#xA;custom node decide on their renderings&#xA;&#xA;In both cases:&#xA;- we compute the 'show' flag (like 'hasErrorVisible') for all types&#xA;- we set the customValidity message of the highest prio Validator&#xA;- we set aria-invalid="true" in case hasErrorVisible is true                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |                                                                                                                |                                                               | ValidateMixin         |
+| `feedbackCondition`                      | public    | Allows the Application Developer to specify when a feedback message should be shown                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `type: string, meta: object, currentCondition: ((type: string, meta: object) => boolean)`                      | `boolean`                                                     | ValidateMixin         |
+| `_hasFeedbackVisibleFor`                 | protected | Used to translate \`.hasFeedbackFor\` and \`.shouldShowFeedbackFor\` to \`.showsFeedbackFor\`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `type: string`                                                                                                 |                                                               | ValidateMixin         |
+| `_updateShouldShowFeedbackFor`           | protected |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |                                                                                                                |                                                               | ValidateMixin         |
+| `_prioritizeAndFilterFeedback`           | protected | Orders all active validators in this.\_\_validationResult.&#xA;Can also filter out occurrences (based on interaction states)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `{ validationResult }, opts: { validationResult: Validator[] }`                                                | `Validator[]`                                                 | ValidateMixin         |
+
+### Events
+
+| Name                           | Type          | Description                                              | Inherited From        |
+| ------------------------------ | ------------- | -------------------------------------------------------- | --------------------- |
+| `user-input-changed`           | `Event`       |                                                          | FormatMixin           |
+| `form-element-name-changed`    | `CustomEvent` |                                                          | FormControlMixin      |
+| `model-value-changed`          | `CustomEvent` |                                                          | FormControlMixin      |
+| `form-element-register`        | `CustomEvent` |                                                          | FormRegisteringMixin  |
+| `touched-changed`              | `Event`       |                                                          | InteractionStateMixin |
+| `dirty-changed`                | `Event`       |                                                          | InteractionStateMixin |
+| `focus`                        | `Event`       |                                                          | FocusMixin            |
+| `blur`                         | `Event`       |                                                          | FocusMixin            |
+| `focusin`                      | `Event`       |                                                          | FocusMixin            |
+| `focusout`                     | `Event`       |                                                          | FocusMixin            |
+| `showsFeedbackForChanged`      | `Event`       |                                                          | ValidateMixin         |
+|                                | `Event`       |                                                          | ValidateMixin         |
+| `shouldShowFeedbackForChanged` | `Event`       |                                                          | ValidateMixin         |
+| `validate-performed`           | `Event`       | private event that should be listened to by LionFieldSet | ValidateMixin         |
+
+### Attributes
+
+| Name                            | Field                      | Inherited From        |
+| ------------------------------- | -------------------------- | --------------------- |
+| `readonly`                      | readOnly                   | FormControlMixin      |
+| `label`                         | label                      | FormControlMixin      |
+| `label-sr-only`                 | labelSrOnly                | FormControlMixin      |
+| `help-text`                     | helpText                   | FormControlMixin      |
+| `name`                          | name                       | FormRegisteringMixin  |
+| `allow-cross-root-registration` | allowCrossRootRegistration | FormRegisteringMixin  |
+| `disabled`                      | disabled                   | DisabledMixin         |
+| `touched`                       | touched                    | InteractionStateMixin |
+| `dirty`                         | dirty                      | InteractionStateMixin |
+| `filled`                        | filled                     | InteractionStateMixin |
+| `focused`                       | focused                    | FocusMixin            |
+| `focused-visible`               | focusedVisible             | FocusMixin            |
+| `autofocus`                     | autofocus                  | FocusMixin            |
+| `shows-feedback-for`            | showsFeedbackFor           | ValidateMixin         |
+| `is-pending`                    | isPending                  | ValidateMixin         |
+
+<hr/>

package/docs/fundamentals/systems/form/formatting-and-parsing.md

@@ -23,7 +23,7 @@ Our fields can automatically format/parse/serialize user input or an input set i
 
 Below are some concrete examples of implementations of formatters and parsers mimicking a (basic) amount input.
 
-> For an actual amount input, check out [lion-input-amount](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-amount/overview.md).
+> For an actual amount input, check out [lion-input-amount](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-amount/overview.md).
 > This comes with its own formatter, parser, serializer.
 
 ### Parsers & modelValue
@@ -230,16 +230,16 @@ Below we show three flow diagrams to show the flow of formatting, serializing an
 
 Where a user changes the input with their keyboard:
 
-![Standard flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-1.svg 'Standard flow')
+![Standard flow](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/assets/FormatMixinDiagram-1.svg 'Standard flow')
 
 ### Unparseable flow
 
 Where a user sets the input to something that is not parseable by the parser:
 
-![Unparseable flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-2.svg 'Unparseable flow')
+![Unparseable flow](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/assets/FormatMixinDiagram-2.svg 'Unparseable flow')
 
 ### Imperative / programmatic flow
 
 Where the developer sets the modelValue of the input programmatically:
 
-![Imperative flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-3.svg 'Imperative flow')
+![Imperative flow](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/assets/FormatMixinDiagram-3.svg 'Imperative flow')

package/docs/fundamentals/systems/form/model-value.md

@@ -21,7 +21,7 @@ level, via:
 > Internal/private concepts like viewValue, formattedValue, serializedValue are therefore not
 > recommended as a means of interaction.
 
-For more information about parsing and the Unparseable type, see [Formatting and Parsing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md)
+For more information about parsing and the Unparseable type, see [Formatting and Parsing](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/formatting-and-parsing.md)
 
 ### Event meta
 

package/docs/fundamentals/systems/form/overview.md

@@ -20,9 +20,9 @@ Fields (think of an input, textarea, select) are the actual form controls the en
 
 On top of this, they feature:
 
-- [formatting/parsing/serializing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md) of view values.
-- Advanced [validation](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/validate.md) possibilities.
-- Creation of advanced user interaction scenarios via [interaction states](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/interaction-states.md).
+- [formatting/parsing/serializing](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/formatting-and-parsing.md) of view values.
+- Advanced [validation](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/validate.md) possibilities.
+- Creation of advanced user interaction scenarios via [interaction states](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/interaction-states.md).
 - Provision of labels and help texts in an easy, declarative manner.
 - Accessibility out of the box.
 - Advanced styling possibilities: map your own Design System to the internal HTML structure.
@@ -31,33 +31,33 @@ On top of this, they feature:
 
 ### Platform fields (wrappers)
 
-- [LionInput](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input/overview.md), a wrapper for `<input>`.
-- [LionTextarea](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/textarea/overview.md), a wrapper for `<textarea>`.
-- [LionSelect](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select/overview.md), a wrapper for `<select>`.
+- [LionInput](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input/overview.md), a wrapper for `<input>`.
+- [LionTextarea](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/textarea/overview.md), a wrapper for `<textarea>`.
+- [LionSelect](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/select/overview.md), a wrapper for `<select>`.
 
 ### Custom fields (wrappers)
 
-Whenever a native form control doesn't exist or is not sufficient, a [custom form field](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/guides/how-to/create-a-custom-field.md) should be created. One could think of components like:
+Whenever a native form control doesn't exist or is not sufficient, a [custom form field](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/guides/how-to/create-a-custom-field.md) should be created. One could think of components like:
 
-- [LionCombobox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/combobox/overview.md), a custom implementation of a combobox.
-- [LionDate](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-date/overview.md), an alternative for `<input type="date">`.
-- [LionDatepicker](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-datepicker/overview.md), an alternative for `<input type="date">` including a calendar dropdown.
-- [LionListbox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/listbox/overview.md), a custom implementation of a listbox.
-- [LionInputAmount](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-amount/overview.md), an alternative for `<input type="number">` special for amounts.
-- [LionInputEmail](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-email/overview.md), an alternative for `<input type="email">`.
-- [LionInputIban](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-iban/overview.md), an ING specific for an input with IBAN numbers.
-- [LionInputRange](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-range/overview.md), an alternative for `<input type="range">`.
-- [LionInputStepper](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-stepper/overview.md), an alternative for `<input type="number">`.
-- [LionSelectRich](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select-rich/overview.md), an alternative for `<select>` with multiline options.
+- [LionCombobox](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/combobox/overview.md), a custom implementation of a combobox.
+- [LionDate](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-date/overview.md), an alternative for `<input type="date">`.
+- [LionDatepicker](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-datepicker/overview.md), an alternative for `<input type="date">` including a calendar dropdown.
+- [LionListbox](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/listbox/overview.md), a custom implementation of a listbox.
+- [LionInputAmount](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-amount/overview.md), an alternative for `<input type="number">` special for amounts.
+- [LionInputEmail](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-email/overview.md), an alternative for `<input type="email">`.
+- [LionInputIban](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-iban/overview.md), an ING specific for an input with IBAN numbers.
+- [LionInputRange](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-range/overview.md), an alternative for `<input type="range">`.
+- [LionInputStepper](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/input-stepper/overview.md), an alternative for `<input type="number">`.
+- [LionSelectRich](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/select-rich/overview.md), an alternative for `<select>` with multiline options.
 
 ### Choice Input Fields
 
 For form controls which return a `checked-state` you can use the `lion-choice-input` mixin. It is used in:
 
-- [LionCheckbox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/checkbox-group/overview.md), a wrapper for `<input type="checkbox">`.
+- [LionCheckbox](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/checkbox-group/overview.md), a wrapper for `<input type="checkbox">`.
 - LionOption, an alternative for `<option>`.
-- [LionRadio](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/radio-group/overview.md), a wrapper for `<input type="radio">`.
-- [LionSwitch](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/switch/overview.md), a custom implementation of a switch.
+- [LionRadio](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/radio-group/overview.md), a wrapper for `<input type="radio">`.
+- [LionSwitch](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/switch/overview.md), a custom implementation of a switch.
 
 Which contains the following features:
 
@@ -69,14 +69,14 @@ Which contains the following features:
 
 Fieldsets are groups of fields. They can be considered fields on their own as well, since they partly share the normalized API via `FormControlMixin`. Fieldsets are the basis for:
 
-- [LionFieldset](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/fieldset/overview.md), a wrapper around multiple input fields or other fieldsets.
-- [LionForm](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/form/overview.md), enhances the functionality of the native `<form>` component.
-- [LionCheckboxGroup](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/checkbox-group/overview.md), a wrapper component for multiple checkboxes.
-- [LionRadioGroup](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/radio-group/overview.md), a wrapper component for multiple radio inputs.
+- [LionFieldset](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/fieldset/overview.md), a wrapper around multiple input fields or other fieldsets.
+- [LionForm](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/form/overview.md), enhances the functionality of the native `<form>` component.
+- [LionCheckboxGroup](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/checkbox-group/overview.md), a wrapper component for multiple checkboxes.
+- [LionRadioGroup](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/components/radio-group/overview.md), a wrapper component for multiple radio inputs.
 
 ## Other Resources
 
-- [Model Value](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/model-value.md)
-- [Formatting and parsing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md)
-- [Interaction states](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/interaction-states.md)
-- [Validation System](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/validate.md)
+- [Model Value](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/model-value.md)
+- [Formatting and parsing](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/formatting-and-parsing.md)
+- [Interaction states](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/interaction-states.md)
+- [Validation System](https://github.com/ing-bank/lion/blob/b15d2aae1a8d40d3551822279e1a650633dba428/docs/fundamentals/systems/form/validate.md)