;
@@ -32,19 +100,97 @@ export declare class ValidateHost {
static validationTypes: string[];
+ /**
+ * Triggered by:
+ * - modelValue change
+ * - change in the 'validators' array
+ * - change in the config of an individual Validator
+ *
+ * Three situations are handled:
+ * - a1) the FormControl is empty: further execution is halted. When the Required Validator
+ * (being mutually exclusive to the other Validators) is applied, it will end up in the
+ * validation result (as the only Validator, since further execution was halted).
+ * - a2) there are synchronous Validators: this is the most common flow. When modelValue hasn't
+ * changed since last async results were generated, 'sync results' are merged with the
+ * 'async results'.
+ * - a3) there are asynchronous Validators: for instance when server side evaluation is needed.
+ * Executions are scheduled and awaited and the 'async results' are merged with the
+ * 'sync results'.
+ *
+ * - b) there are ResultValidators. After steps a1, a2, or a3 are finished, the holistic
+ * ResultValidators (evaluating the total result of the 'regular' (a1, a2 and a3) validators)
+ * will be run...
+ *
+ * Situations a2 and a3 are not mutually exclusive and can be triggered within one `validate()`
+ * call. Situation b will occur after every call.
+ *
+ * @param {{ clearCurrentResult?: boolean }} [opts]
+ */
validate(opts?: { clearCurrentResult?: boolean }): void;
+ /**
+ * The amount of feedback messages that will visible in LionValidationFeedback
+ */
protected _visibleMessagesAmount: number;
- protected _allValidators: Validator[];
- protected get _feedbackConditionMeta(): object;
- protected get _feedbackNode(): LionValidationFeedback;
+ /**
+ * Combination of validators provided by Application Developer and the default validators
+ */
+ protected _allValidators: Validator[];
+
+ /**
+ * Allows Subclassers to add meta info for feedbackCondition
+ */
+ protected get _feedbackConditionMeta(): object;
+
+ /**
+ * Responsible for retrieving messages from Validators and
+ * (delegation of) rendering them.
+ *
+ * For `._feedbackNode` (extension of LionValidationFeedback):
+ * - retrieve messages from highest prio Validators
+ * - provide the result to custom feedback node and let the
+ * custom node decide on their renderings
+ *
+ * In both cases:
+ * - we compute the 'show' flag (like 'hasErrorVisible') for all types
+ * - we set the customValidity message of the highest prio Validator
+ * - we set aria-invalid="true" in case hasErrorVisible is true
+ */
protected _updateFeedbackComponent(): void;
+
+ /**
+ * Default feedbackCondition condition, used by Subclassers, that will be used when
+ * `feedbackCondition()` is not overridden by Application Developer.
+ * Show the validity feedback when returning true, don't show when false
+ * @param {string} type could be 'error', 'warning', 'info', 'success' or any other custom
+ * Validator type
+ * @param {object} meta meta info (interaction states etc)
+ */
protected _showFeedbackConditionFor(type: string, meta: object): boolean;
+
+ /**
+ * Used to translate `.hasFeedbackFor` and `.shouldShowFeedbackFor` to `.showsFeedbackFor`
+ */
protected _hasFeedbackVisibleFor(type: string): boolean;
protected _updateShouldShowFeedbackFor(): void;
+
+ /**
+ * Orders all active validators in this.__validationResult. Can also filter out occurrences
+ * (based on interaction states).
+ *
+ * @example
+ * ```js
+ * _prioritizeAndFilterFeedback({ validationResult }) {
+ * // Put info messages on top; no limitation by `._visibleMessagesAmount`
+ * const meta = this._feedbackConditionMeta;
+ * return validationResult.filter(v =>
+ * this.feedbackCondition(v.type, meta, this._showFeedbackConditionFor.bind(this))
+ * ).sort((a, b) => a.type === 'info' ? 1 : 0);
+ * }
+ * ```
+ */
protected _prioritizeAndFilterFeedback(opts: { validationResult: Validator[] }): Validator[];
- protected updateSync(name: string, oldValue: unknown): void;
private __syncValidationResult: Validator[];
private __asyncValidationResult: Validator[];
diff --git a/packages/input-range/src/LionInputRange.js b/packages/input-range/src/LionInputRange.js
index 8c3278698..13e02c774 100644
--- a/packages/input-range/src/LionInputRange.js
+++ b/packages/input-range/src/LionInputRange.js
@@ -119,7 +119,9 @@ export class LionInputRange extends LionInput {
_inputGroupTemplate() {
return html`
- ${formatNumber(parseFloat(this.formattedValue))}
+ ${formatNumber(parseFloat(/** @type {string} */ (this.formattedValue)))}
${this.unit}
diff --git a/packages/radio-group/test/lion-radio-group.test.js b/packages/radio-group/test/lion-radio-group.test.js
index 9947fd396..97276f5f9 100644
--- a/packages/radio-group/test/lion-radio-group.test.js
+++ b/packages/radio-group/test/lion-radio-group.test.js
@@ -67,7 +67,7 @@ describe('', () => {
`);
- el.children[1].focus();
+ el.formElements[1].focus();
expect(el.touched).to.equal(false, 'initially, touched state is false');
/** @type {LionRadio} */ (el.children[1]).checked = true;
expect(el.touched, `focused via a mouse click, group should be touched`).to.be.true;
diff --git a/packages/select/src/LionSelect.js b/packages/select/src/LionSelect.js
index ac427a576..e2660b988 100644
--- a/packages/select/src/LionSelect.js
+++ b/packages/select/src/LionSelect.js
@@ -2,6 +2,21 @@
import { LionField } from '@lion/form-core';
class LionFieldWithSelect extends LionField {
+ /** @type {any} */
+ static get properties() {
+ return { autocomplete: { type: String } };
+ }
+
+ constructor() {
+ super();
+
+ /**
+ * Delegates autocomplete to select
+ * @type {string|undefined}
+ */
+ this.autocomplete = undefined;
+ }
+
/**
* @returns {HTMLSelectElement}
*/