ngx-t-forms 2.0.29 → 2.0.31

package/fesm2022/ngx-t-forms-validators-config.component-oGjQVGE2.mjs

@@ -0,0 +1,733 @@
+import * as i0 from '@angular/core';
+import { input, output, inject, ElementRef, signal, computed, Input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { v4 } from 'uuid';
+import { CalculationFunctions, InputDataTypes, InputTypes } from 'ngx-t-forms-types';
+import * as i3$2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { NgControl } from '@angular/forms';
+import { MatFormFieldControl } from '@angular/material/form-field';
+import * as i3 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i1 from '@angular/material/chips';
+import { MatChipsModule } from '@angular/material/chips';
+import * as i3$1 from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
+import * as i5 from '@angular/material/toolbar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import * as i1$1 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i2 from '@angular/material/button-toggle';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import * as i1$2 from '@angular/material/slide-toggle';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import * as i5$1 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { Subject } from 'rxjs';
+import { P as PREDICATE_OPERATORS, f as evaluatePredicate } from './ngx-t-forms-ngx-t-forms-u_kigDid.mjs';
+
+/** Canonical operator value keyed by its lower-cased spelling (for parse normalisation). */
+const OPERATOR_BY_KEY = new Map(PREDICATE_OPERATORS.map((op) => [op.value.toLowerCase(), op.value]));
+/** Symbolic operators, longest-match first so `===` wins over `==`. */
+const SYMBOLIC_OPS = ['===', '!==', '>=', '<=', '==', '!=', '>', '<'];
+/** Keyword operators (matched case-insensitively, surrounded by whitespace). */
+const KEYWORD_OPS = ['includes', 'startsWith', 'endsWith', 'matches', 'in'];
+/** An empty condition seeded with the given field and a sensible default operator. */
+function emptyCondition(field = '') {
+    return { field, operator: '===', compareTo: 'value', value: '' };
+}
+const isBareLiteral = (v) => v === 'true' || v === 'false' || v === 'null' || (v.trim() !== '' && !Number.isNaN(Number(v)));
+const isQuoted = (v) => {
+    const t = v.trim();
+    if (t.length < 2)
+        return false;
+    const a = t[0];
+    const b = t[t.length - 1];
+    return (a === '"' && b === '"') || (a === "'" && b === "'");
+};
+const unquote = (v) => (isQuoted(v) ? v.trim().slice(1, -1) : v.trim());
+/** Formats a literal: bare for numbers/booleans/null, otherwise a quoted, escaped string. */
+function formatLiteral(value) {
+    const t = value.trim();
+    if (t === '')
+        return '""';
+    if (isBareLiteral(t))
+        return t;
+    return `"${t.replace(/"/g, '\\"')}"`;
+}
+/** The expression token for a condition's right operand. */
+function rightToken(condition) {
+    return condition.compareTo === 'field' ? condition.value.trim() : formatLiteral(condition.value);
+}
+/** Whether a condition is complete enough to contribute to the expression. */
+function isComplete(condition) {
+    if (condition.field.trim() === '')
+        return false;
+    if (condition.compareTo === 'field')
+        return condition.value.trim() !== '';
+    return true;
+}
+/**
+ * Serialises a condition group into a predicate expression string. Incomplete
+ * conditions are dropped, so an empty/half-built group yields `''` (which the
+ * editor treats as "nothing to save yet").
+ */
+function serializeConditions(group) {
+    return group.conditions
+        .filter(isComplete)
+        .map((c) => `${c.field.trim()} ${c.operator} ${rightToken(c)}`)
+        .join(` ${group.connector} `);
+}
+/** Resolves a raw operator spelling to its canonical {@link PREDICATE_OPERATORS} value, or `null`. */
+function canonicalOperator(raw) {
+    return OPERATOR_BY_KEY.get(raw.toLowerCase()) ?? null;
+}
+/** Classifies a raw right-hand operand as a field reference or a literal value. */
+function classifyRight(raw, fieldNames) {
+    const t = raw.trim();
+    if (isQuoted(t))
+        return { compareTo: 'value', value: unquote(t) };
+    if (fieldNames.has(t))
+        return { compareTo: 'field', value: t };
+    return { compareTo: 'value', value: t };
+}
+/** Parses a single `left op right` comparison, or `null` if it is not representable. */
+function parseCondition(part, fieldNames) {
+    const p = part.trim();
+    for (const op of SYMBOLIC_OPS) {
+        const idx = p.indexOf(op);
+        if (idx > 0) {
+            const operator = canonicalOperator(op);
+            if (!operator)
+                return null;
+            const field = p.slice(0, idx).trim();
+            const right = p.slice(idx + op.length).trim();
+            if (field === '' || right === '')
+                return null;
+            return { field, operator, ...classifyRight(right, fieldNames) };
+        }
+    }
+    for (const kw of KEYWORD_OPS) {
+        const m = p.match(new RegExp(`^(.+?)\\s+${kw}\\s+(.+)$`, 'i'));
+        if (m && m[1] && m[2]) {
+            const operator = canonicalOperator(kw);
+            if (!operator)
+                return null;
+            return { field: m[1].trim(), operator, ...classifyRight(m[2], fieldNames) };
+        }
+    }
+    return null;
+}
+/**
+ * Best-effort parse of an expression into a guided condition group. Returns
+ * `null` (→ raw editor) for anything the builder cannot represent losslessly:
+ * grouping `()`, mixed `&&`/`||`, unary `!`, or an unknown operator.
+ */
+function parseConditions(expression, fieldNames) {
+    const e = expression.trim();
+    if (e === '')
+        return { connector: '&&', conditions: [] };
+    if (/[()]/.test(e))
+        return null; // grouping → raw
+    if (/!(?!=)/.test(e))
+        return null; // unary negation (`!field`) → raw
+    const hasAnd = e.includes('&&');
+    const hasOr = e.includes('||');
+    if (hasAnd && hasOr)
+        return null; // mixed connectors → raw
+    const connector = hasOr ? '||' : '&&';
+    const parts = hasOr ? e.split('||') : hasAnd ? e.split('&&') : [e];
+    const conditions = [];
+    for (const part of parts) {
+        const condition = parseCondition(part, fieldNames);
+        if (!condition)
+            return null;
+        conditions.push(condition);
+    }
+    return { connector, conditions };
+}
+/** Returns the unique identifier tokens referenced in an expression. */
+function referencedTokens(expression) {
+    return new Set(expression.match(/[A-Za-z_][A-Za-z0-9_]*/g) ?? []);
+}
+/**
+ * Derives the `inputsObservedForChanges` dependency list from an expression by
+ * matching identifier tokens against the editor's resolved {@link FieldBinding}s.
+ * Works for both guided and raw expressions, so observed inputs always reflect
+ * what the expression actually references — no manual add/remove, no orphans.
+ *
+ * When an aggregate has been chosen for a field (only possible for a
+ * multiple-input column), the binding carries `parentInputId` + `function` so
+ * the engine reduces its row array to a scalar. Otherwise it resolves directly
+ * (a scalar primary input, or a per-row list value).
+ */
+function deriveObservedInputs(expression, fields, functions) {
+    const tokens = referencedTokens(expression);
+    const observed = [];
+    const seen = new Set();
+    for (const field of fields) {
+        if (!tokens.has(field.variable) || seen.has(field.variable))
+            continue;
+        seen.add(field.variable);
+        const aggregate = functions[field.variable];
+        if (aggregate && field.parentInputId) {
+            observed.push({
+                inputId: field.inputId,
+                variable: field.variable,
+                parentInputId: field.parentInputId,
+                function: aggregate,
+            });
+        }
+        else {
+            observed.push({ inputId: field.inputId, variable: field.variable });
+        }
+    }
+    return observed;
+}
+
+/**
+ * Internal editor implementing `MatFormFieldControl<FormControlCustomValidatorsInterface[]>`
+ * for authoring a form input's custom validators.
+ *
+ * Rendered by `t-dynamic-data-edit` inside its `<mat-form-field>`, which supplies
+ * the surrounding field label, hint, and validation errors — so this component
+ * owns only the validator chip list and the inline draft editor.
+ *
+ * ### Authoring model
+ * A validator's `expression` is evaluated by the shared predicate DSL where
+ * **`true` means the field is invalid** (the error message is then shown). The
+ * editor captures that condition through a **guided builder** — `field operator
+ * value` rows joined by All/Any — that serialises to the expression string and
+ * auto-derives `inputsObservedForChanges` from the fields it references. An
+ * **Advanced** raw editor is the escape hatch for expressions the builder cannot
+ * represent (grouping, mixed connectors, negation); these round-trip unchanged.
+ *
+ * The bound `value` may contain both string entries (legacy validator-name
+ * references such as `'required'`, which are read-only) and object entries
+ * ({@link FormControlCustomValidatorsInterface}, which are editable). Only object
+ * entries open the draft editor.
+ *
+ * NOTE: `MatFormFieldControl<T>` mandates plain mutable `value` / `disabled` /
+ * `required` / `placeholder` / `id` members, `@Input()` decorators, the
+ * `focused` / `touched` / `stateChanges` members, and the `useExisting`
+ * provider. These are framework wiring, not defects — the CLAUDE.md bans on
+ * `@Input()` / `useExisting` do not apply to MatFormFieldControl integration.
+ */
+class ValidatorsConfigComponent {
+    constructor() {
+        /** Emits whenever a piece of `MatFormFieldControl` state changes. */
+        this.stateChanges = new Subject();
+        this.controlType = 'lib-validators-config';
+        this.id = `lib-validators-config-${ValidatorsConfigComponent.nextId++}`;
+        this.placeholder = '';
+        this.focused = false;
+        this.touched = false;
+        this.required = false;
+        this.describedBy = '';
+        this.autofilled = undefined;
+        this.userAriaDescribedBy = undefined;
+        this.disableAutomaticLabeling = undefined;
+        /** Whether the editor is inert. Kept as `@Input()` for the MFC contract. */
+        this.disabled = false;
+        /** Current validator list. Kept as `@Input()` for the MFC contract. */
+        this.value = [];
+        /** Validation errors surfaced by the parent for error-state derivation. */
+        this.errors = [];
+        /** Source input that owns this validator config (for multiple-input scopes). */
+        this.mapToData = input(undefined, ...(ngDevMode ? [{ debugName: "mapToData" }] : /* istanbul ignore next */ []));
+        /** Available form inputs offered as variables. */
+        this.formInputs = input([], ...(ngDevMode ? [{ debugName: "formInputs" }] : /* istanbul ignore next */ []));
+        /** Emits the full validator list whenever it changes. */
+        this.valueChanged = output();
+        /** Operator choices shared with the array-access predicate builder. */
+        this.operators = PREDICATE_OPERATORS;
+        /** Aggregate choices for a list field, with non-technical labels. */
+        this.aggregates = [
+            { value: CalculationFunctions.Sum, label: 'total' },
+            { value: CalculationFunctions.Avg, label: 'average' },
+            { value: CalculationFunctions.Min, label: 'lowest' },
+            { value: CalculationFunctions.Max, label: 'highest' },
+            { value: CalculationFunctions.Count, label: 'count' },
+        ];
+        this.#elementRef = inject(ElementRef);
+        this.ngControl = inject(NgControl, { self: true, optional: true });
+        /** Draft currently open in the inline editor, or `null` when closed. */
+        this.#edit = signal(null, ...(ngDevMode ? [{ debugName: "#edit" }] : /* istanbul ignore next */ []));
+        /** Read-only view of the open draft for the template. */
+        this.edit = this.#edit.asReadonly();
+        /** Guided builder model mirroring the open draft's expression. */
+        this.#group = signal({ connector: '&&', conditions: [] }, ...(ngDevMode ? [{ debugName: "#group" }] : /* istanbul ignore next */ []));
+        this.group = this.#group.asReadonly();
+        /** Whether the draft is being edited as a raw expression instead of guided rows. */
+        this.#raw = signal(false, ...(ngDevMode ? [{ debugName: "#raw" }] : /* istanbul ignore next */ []));
+        this.raw = this.#raw.asReadonly();
+        /** Chosen aggregate per referenced list variable (keyed by variable name). */
+        this.#functions = signal({}, ...(ngDevMode ? [{ debugName: "#functions" }] : /* istanbul ignore next */ []));
+        /** Whether the validator being authored lives on a multiple-input sub-item. */
+        this.validatorOnList = computed(() => !!this.mapToData()?.multipleInputInEditId, ...(ngDevMode ? [{ debugName: "validatorOnList" }] : /* istanbul ignore next */ []));
+        /**
+         * Fields the builder can reference: every primary input plus every
+         * multiple-input column. A multiple column carries its row-array container
+         * (`parentInputId`); whether it must be aggregated is decided per condition
+         * (see {@link requiredAggregateVariables}), not by the field itself.
+         */
+        this.fieldOptions = computed(() => {
+            const self = this.mapToData();
+            const selfId = self?.id;
+            const options = [];
+            for (const input of this.formInputs()) {
+                if (!input.formControlName)
+                    continue;
+                const group = input.multipleInputInEditId;
+                options.push({
+                    variable: input.formControlName,
+                    label: input.label || input.formControlName,
+                    isSelf: input.id === selfId,
+                    isMultiple: !!group,
+                    numeric: this.#isNumeric(input),
+                    inputId: group ? input.id : (input.originalId ?? input.id),
+                    parentInputId: group,
+                });
+            }
+            return options;
+        }, ...(ngDevMode ? [{ debugName: "fieldOptions" }] : /* istanbul ignore next */ []));
+        /** Primary (scalar) fields, for the first dropdown group. */
+        this.directFields = computed(() => this.fieldOptions().filter((f) => !f.isMultiple), ...(ngDevMode ? [{ debugName: "directFields" }] : /* istanbul ignore next */ []));
+        /** Multiple-input columns, for the second dropdown group. */
+        this.listFields = computed(() => this.fieldOptions().filter((f) => f.isMultiple), ...(ngDevMode ? [{ debugName: "listFields" }] : /* istanbul ignore next */ []));
+        /** Field option keyed by its expression variable, for operand lookups. */
+        this.#fieldByVariable = computed(() => new Map(this.fieldOptions().map((f) => [f.variable, f])), ...(ngDevMode ? [{ debugName: "#fieldByVariable" }] : /* istanbul ignore next */ []));
+        /** Multiple-input columns actually referenced by the current expression. */
+        this.referencedListFields = computed(() => {
+            const tokens = referencedTokens(this.#edit()?.expression ?? '');
+            return this.listFields().filter((f) => tokens.has(f.variable));
+        }, ...(ngDevMode ? [{ debugName: "referencedListFields" }] : /* istanbul ignore next */ []));
+        /**
+         * Multiple-input variables that MUST be aggregated: a list column compared
+         * against a non-list operand (a primary field or a typed value) has to be
+         * reduced to a single value. A list-vs-list comparison leaves the aggregate
+         * optional (the columns are row-aligned). In raw mode operand pairing cannot
+         * be analysed, so every referenced list column is treated as required.
+         */
+        this.requiredAggregateVariables = computed(() => {
+            if (this.#raw()) {
+                return new Set(this.referencedListFields().map((f) => f.variable));
+            }
+            const byVariable = this.#fieldByVariable();
+            const required = new Set();
+            for (const cond of this.#group().conditions) {
+                const left = byVariable.get(cond.field);
+                const right = cond.compareTo === 'field' ? byVariable.get(cond.value) : undefined;
+                const leftMultiple = !!left?.isMultiple;
+                const rightMultiple = !!right?.isMultiple;
+                if (leftMultiple && !rightMultiple)
+                    required.add(cond.field);
+                if (rightMultiple && !leftMultiple && right)
+                    required.add(right.variable);
+            }
+            return required;
+        }, ...(ngDevMode ? [{ debugName: "requiredAggregateVariables" }] : /* istanbul ignore next */ []));
+        /** Whether every list column that MUST be aggregated has an aggregate chosen. */
+        this.aggregatesResolved = computed(() => {
+            const functions = this.#functions();
+            const required = this.requiredAggregateVariables();
+            return [...required].every((variable) => !!functions[variable]);
+        }, ...(ngDevMode ? [{ debugName: "aggregatesResolved" }] : /* istanbul ignore next */ []));
+        /** Whether the guided builder has at least one condition and all are complete. */
+        this.conditionsComplete = computed(() => {
+            if (this.#raw())
+                return true; // raw mode is gated by syntaxError + non-empty
+            const conditions = this.#group().conditions;
+            return conditions.length > 0 && conditions.every((c) => this.isConditionComplete(c));
+        }, ...(ngDevMode ? [{ debugName: "conditionsComplete" }] : /* istanbul ignore next */ []));
+        /** Whether the current draft expression can be edited in the guided builder. */
+        this.canUseGuided = computed(() => parseConditions(this.#edit()?.expression ?? '', this.#fieldNameSet()) !== null, ...(ngDevMode ? [{ debugName: "canUseGuided" }] : /* istanbul ignore next */ []));
+        /** Human-readable syntax error for the raw editor, or `null` when valid/empty. */
+        this.syntaxError = computed(() => {
+            const expression = this.#edit()?.expression ?? '';
+            if (expression.trim() === '')
+                return null;
+            try {
+                evaluatePredicate(expression, {});
+                return null;
+            }
+            catch (error) {
+                return error instanceof Error ? error.message : 'The expression syntax is invalid.';
+            }
+        }, ...(ngDevMode ? [{ debugName: "syntaxError" }] : /* istanbul ignore next */ []));
+        /** Whether the open draft can be saved (message, a complete/valid rule, aggregates chosen). */
+        this.canSave = computed(() => {
+            const draft = this.#edit();
+            return (!!draft &&
+                !!draft.message &&
+                !!draft.expression &&
+                this.syntaxError() === null &&
+                this.conditionsComplete() &&
+                this.aggregatesResolved());
+        }, ...(ngDevMode ? [{ debugName: "canSave" }] : /* istanbul ignore next */ []));
+        /** A one-line reason the rule cannot be saved yet, or `null` when it can. */
+        this.saveHint = computed(() => {
+            const draft = this.#edit();
+            if (!draft)
+                return null;
+            if (!draft.message)
+                return 'Add an error message.';
+            if (!this.#raw() && !this.conditionsComplete()) {
+                return 'Finish every condition — choose a field, a condition and a value.';
+            }
+            if (!draft.expression)
+                return 'Add at least one condition.';
+            if (this.#raw() && this.syntaxError() !== null)
+                return this.syntaxError();
+            if (!this.aggregatesResolved())
+                return 'Choose how to combine each list field.';
+            return null;
+        }, ...(ngDevMode ? [{ debugName: "saveHint" }] : /* istanbul ignore next */ []));
+        this.onTouched = () => { };
+    }
+    static { this.nextId = 0; }
+    #elementRef;
+    /** Draft currently open in the inline editor, or `null` when closed. */
+    #edit;
+    /** Guided builder model mirroring the open draft's expression. */
+    #group;
+    /** Whether the draft is being edited as a raw expression instead of guided rows. */
+    #raw;
+    /** Chosen aggregate per referenced list variable (keyed by variable name). */
+    #functions;
+    /** Field option keyed by its expression variable, for operand lookups. */
+    #fieldByVariable;
+    /** Aggregates offered for a field: numeric columns get all, others only count. */
+    aggregatesFor(field) {
+        return field.numeric
+            ? this.aggregates
+            : this.aggregates.filter((a) => a.value === CalculationFunctions.Count);
+    }
+    /** Whether a referenced list column is required to have an aggregate. */
+    isAggregateRequired(variable) {
+        return this.requiredAggregateVariables().has(variable);
+    }
+    /**
+     * Whether a guided condition is fully specified (field, operator and a value
+     * all set). Incomplete conditions are otherwise silently dropped on save, so
+     * this gates {@link canSave}.
+     */
+    isConditionComplete(condition) {
+        return (condition.field.trim() !== '' &&
+            condition.operator.trim() !== '' &&
+            condition.value.trim() !== '');
+    }
+    // MatFormFieldControl reads these as plain getters during its own change
+    // detection, so they stay getters rather than `computed()` signals.
+    get empty() {
+        return this.value.length === 0;
+    }
+    get shouldLabelFloat() {
+        return this.focused || !this.empty;
+    }
+    get errorState() {
+        const ngControlError = this.ngControl?.errors != null;
+        const externalError = (this.errors?.length ?? 0) > 0 && this.touched;
+        const requiredUnset = this.empty && this.required;
+        return requiredUnset || ngControlError || externalError;
+    }
+    setDescribedByIds(ids) {
+        this.describedBy = ids.join(' ');
+        const el = this.#elementRef.nativeElement;
+        const controlElement = el.querySelector('.lib-validators-config__list');
+        controlElement?.setAttribute('aria-describedby', this.describedBy);
+        this.stateChanges.next();
+    }
+    onContainerClick() {
+        this.markAsTouched();
+        this.stateChanges.next();
+    }
+    markAsTouched() {
+        if (!this.touched) {
+            this.touched = true;
+            this.onTouched();
+            this.stateChanges.next();
+        }
+    }
+    /** Tear down the MFC state stream so subscribers do not leak. */
+    ngOnDestroy() {
+        this.stateChanges.complete();
+    }
+    /** `@for` track key: object validators by id, string validators by value. */
+    trackValidator(validator) {
+        return typeof validator === 'string' ? validator : validator.id;
+    }
+    /** Resolve the label shown on a validator chip. */
+    validatorLabel(validator) {
+        return typeof validator === 'string' ? validator : validator.message;
+    }
+    /** Whether a validator chip is the one currently being edited. */
+    isEditing(validator) {
+        if (typeof validator === 'string') {
+            return false;
+        }
+        return this.#edit()?.id === validator.id;
+    }
+    /**
+     * Open a validator for editing. String entries are read-only legacy
+     * references and are ignored. Editing the open validator again closes it.
+     * The draft is a clone, so edits only land in `value` on Save.
+     *
+     * DEFECT FIX (discard semantics): the editor is an inline panel with an
+     * explicit Close/Save toolbar, not a transient overlay that vanishes on an
+     * outside click. Opening a different validator (or {@link addValidator})
+     * deliberately replaces the open draft — an explicit, documented discard,
+     * never a silent loss mid-edit.
+     */
+    editV(validator) {
+        if (typeof validator === 'string') {
+            return;
+        }
+        if (this.#edit()?.id === validator.id) {
+            this.#edit.set(null);
+            return;
+        }
+        this.#edit.set(this.#cloneValidator(validator));
+        this.#initBuilderFromDraft();
+    }
+    /** Begin a brand-new validator draft (id assigned on save). */
+    addValidator() {
+        this.#edit.set(this.#emptyDraft());
+        this.#initBuilderFromDraft();
+    }
+    /** Discard the open draft without persisting it. */
+    closeEditor() {
+        this.#edit.set(null);
+    }
+    /** Remove a validator (string or object) from the list and emit. */
+    remove(validator) {
+        const next = this.value.filter((item) => !this.#sameValidator(item, validator));
+        this.#commit(next);
+        if (this.isEditing(validator)) {
+            this.#edit.set(null);
+        }
+    }
+    /** Update the draft's message, or replace its raw expression as the user types. */
+    onTextChange(event, key) {
+        const value = event.target.value;
+        if (key === 'expression') {
+            this.#syncExpression(value);
+            return;
+        }
+        this.#edit.update((draft) => {
+            const base = draft ?? this.#emptyDraft();
+            return { ...base, message: value };
+        });
+    }
+    /** Toggle whether users may override (warn instead of block) this validator. */
+    setCanOverride(checked) {
+        this.#edit.update((draft) => (draft ? { ...draft, canOverride: checked } : draft));
+    }
+    /**
+     * Persist the open draft. A new draft (no id) is appended with a fresh uuid;
+     * an existing draft (has id) replaces the matching entry. Emits the new list.
+     */
+    saveVariable() {
+        const draft = this.#edit();
+        if (!draft || !draft.message || !draft.expression) {
+            return;
+        }
+        if (draft.id !== undefined) {
+            const id = draft.id;
+            const saved = { ...draft, id };
+            this.#commit(this.value.map((item) => typeof item !== 'string' && item.id === id ? saved : item));
+        }
+        else {
+            const saved = { ...draft, id: v4() };
+            this.#commit([...this.value, saved]);
+        }
+        this.#edit.set(null);
+    }
+    // ---- guided condition builder ------------------------------------------
+    /** Switch the All/Any connector joining the conditions. */
+    setConnector(connector) {
+        this.#applyGroup({ ...this.#group(), connector });
+    }
+    /** Append a fresh condition, defaulting its field to the owning input. */
+    addCondition() {
+        const fallback = this.directFields().find((f) => f.isSelf) ??
+            this.directFields()[0] ??
+            this.fieldOptions()[0];
+        const group = this.#group();
+        this.#applyGroup({
+            ...group,
+            conditions: [...group.conditions, emptyCondition(fallback?.variable ?? '')],
+        });
+    }
+    /** Apply a partial change to the condition at `index`. */
+    updateCondition(index, patch) {
+        const group = this.#group();
+        const conditions = group.conditions.map((c, i) => (i === index ? { ...c, ...patch } : c));
+        this.#applyGroup({ ...group, conditions });
+    }
+    /** Flip a condition between comparing to a typed value and another field. */
+    toggleCompareTo(index) {
+        const condition = this.#group().conditions[index];
+        if (!condition)
+            return;
+        if (condition.compareTo === 'value') {
+            const field = this.fieldOptions().find((f) => f.variable !== condition.field);
+            this.updateCondition(index, { compareTo: 'field', value: field?.variable ?? '' });
+        }
+        else {
+            this.updateCondition(index, { compareTo: 'value', value: '' });
+        }
+    }
+    /** Remove the condition at `index`. */
+    removeCondition(index) {
+        const group = this.#group();
+        this.#applyGroup({ ...group, conditions: group.conditions.filter((_, i) => i !== index) });
+    }
+    /**
+     * Choose (or clear, by re-clicking) the aggregate that reduces a referenced
+     * list field to a single value.
+     */
+    setFunction(variable, fn) {
+        this.#functions.update((current) => {
+            const next = { ...current };
+            if (next[variable] === fn) {
+                delete next[variable];
+            }
+            else {
+                next[variable] = fn;
+            }
+            return next;
+        });
+        // The expression text is unchanged, but the observed deps now carry the
+        // aggregate — re-sync so inputsObservedForChanges reflects the choice.
+        this.#syncExpression(this.#edit()?.expression ?? '');
+    }
+    /** The aggregate currently chosen for a list variable, if any. */
+    currentFunction(variable) {
+        return this.#functions()[variable];
+    }
+    /** Switch to the raw expression editor. */
+    useRaw() {
+        this.#raw.set(true);
+    }
+    /** Switch back to the guided builder, reparsing the current expression. */
+    useGuided() {
+        if (!this.canUseGuided())
+            return;
+        this.#initGroupFromExpression();
+        this.#raw.set(false);
+    }
+    /** Read the value-event target as a string. */
+    inputValue(event) {
+        return event.target.value;
+    }
+    // ---- internal ----------------------------------------------------------
+    #emptyDraft() {
+        return {
+            message: '',
+            expression: '',
+            canOverride: false,
+            inputsObservedForChanges: [],
+        };
+    }
+    #cloneValidator(validator) {
+        return {
+            ...validator,
+            inputsObservedForChanges: validator.inputsObservedForChanges.map((i) => ({ ...i })),
+        };
+    }
+    #sameValidator(item, target) {
+        if (typeof item === 'string' || typeof target === 'string') {
+            return item === target;
+        }
+        return item.id === target.id;
+    }
+    /** Set of field variable names the builder recognises (for parsing). */
+    #fieldNameSet() {
+        return new Set(this.fieldOptions().map((f) => f.variable));
+    }
+    /** Whether an input carries a numeric data type. */
+    #isNumeric(input) {
+        return input.dataType === InputDataTypes.Number || input.type === InputTypes.Number;
+    }
+    /** Recover the per-variable aggregate choices from a draft's observed inputs. */
+    #functionsFromDraft() {
+        const map = {};
+        for (const observed of this.#edit()?.inputsObservedForChanges ?? []) {
+            if (observed.function)
+                map[observed.variable] = observed.function;
+        }
+        return map;
+    }
+    /** Seed the builder state when a draft opens: guided if parseable, else raw. */
+    #initBuilderFromDraft() {
+        this.#functions.set(this.#functionsFromDraft());
+        const parsed = parseConditions(this.#edit()?.expression ?? '', this.#fieldNameSet());
+        if (parsed) {
+            this.#group.set(parsed);
+            this.#raw.set(false);
+        }
+        else {
+            this.#raw.set(true);
+        }
+    }
+    /** Reparse the current draft expression into the guided model. */
+    #initGroupFromExpression() {
+        const parsed = parseConditions(this.#edit()?.expression ?? '', this.#fieldNameSet());
+        if (parsed) {
+            this.#group.set(parsed);
+        }
+    }
+    /** Store a builder change: update the model, then serialise into the draft. */
+    #applyGroup(next) {
+        this.#group.set(next);
+        this.#syncExpression(serializeConditions(next));
+    }
+    /** Write an expression onto the draft and re-derive its observed-input deps. */
+    #syncExpression(expression) {
+        const fields = this.fieldOptions();
+        const functions = this.#functions();
+        this.#edit.update((draft) => {
+            const base = draft ?? this.#emptyDraft();
+            return {
+                ...base,
+                expression,
+                inputsObservedForChanges: deriveObservedInputs(expression, fields, functions),
+            };
+        });
+    }
+    /** Single mutation path: store the new list and notify the parent. */
+    #commit(next) {
+        this.value = next;
+        this.markAsTouched();
+        this.stateChanges.next();
+        this.valueChanged.emit([...next]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ValidatorsConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: ValidatorsConfigComponent, isStandalone: true, selector: "lib-validators-config", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: false, isRequired: false, transformFunction: null }, mapToData: { classPropertyName: "mapToData", publicName: "mapToData", isSignal: true, isRequired: false, transformFunction: null }, formInputs: { classPropertyName: "formInputs", publicName: "formInputs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, host: { properties: { "attr.id": "id" }, classAttribute: "lib-validators-config" }, providers: [{ provide: MatFormFieldControl, useExisting: ValidatorsConfigComponent }], ngImport: i0, template: "<section class=\"lib-validators-config__list\">\n  <h5 class=\"lib-validators-config__title\">Validation rules</h5>\n\n  <p class=\"lib-validators-config__hint\">\n    <mat-icon class=\"lib-validators-config__hint-icon\">lightbulb</mat-icon>\n    <span>Each rule shows its message when its condition is true \u2014 describe when the entry is\n      <strong>wrong</strong>.</span>\n  </p>\n\n  <mat-chip-listbox [disabled]=\"disabled\" aria-label=\"Validation rules\">\n    @for (validator of value; track trackValidator(validator)) {\n    <mat-chip-option\n      class=\"lib-validators-config__chip\"\n      [selected]=\"isEditing(validator)\"\n      (click)=\"editV(validator)\"\n    >\n      <span class=\"lib-validators-config__chip-label\">\n        {{ validatorLabel(validator) | titlecase }}\n      </span>\n\n      @if (isEditing(validator)) {\n      <mat-icon matChipTrailingIcon>check_circle</mat-icon>\n      } @else {\n      <button matChipRemove [attr.aria-label]=\"'remove validator'\" (click)=\"remove(validator)\">\n        <mat-icon>cancel</mat-icon>\n      </button>\n      }\n    </mat-chip-option>\n    }\n\n    @if (!edit()) {\n    <mat-chip-option\n      class=\"lib-validators-config__add\"\n      matTooltip=\"Add a new validation rule\"\n      [selectable]=\"false\"\n      [disabled]=\"disabled\"\n      (click)=\"addValidator()\"\n    >\n      Add rule\n      <mat-icon matChipTrailingIcon>add</mat-icon>\n    </mat-chip-option>\n    }\n  </mat-chip-listbox>\n</section>\n\n@if (edit(); as draft) {\n<mat-card class=\"lib-validators-config__editor\" (click)=\"$event.stopPropagation()\">\n  <label class=\"lib-validators-config__field\">\n    <span class=\"lib-validators-config__f-label\">Error message</span>\n    <textarea\n      class=\"lib-validators-config__control lib-validators-config__textarea\"\n      rows=\"2\"\n      [value]=\"draft.message\"\n      (input)=\"onTextChange($event, 'message')\"\n      placeholder=\"e.g. End date must be after the start date\"\n    ></textarea>\n  </label>\n\n  <div class=\"lib-validators-config__condition-head\">\n    <span class=\"lib-validators-config__f-label\">Show this error when</span>\n    @if (!raw() && group().conditions.length > 1) {\n    <div class=\"lib-validators-config__match\">\n      <mat-button-toggle-group\n        class=\"lib-validators-config__seg\"\n        [value]=\"group().connector\"\n        hideSingleSelectionIndicator\n        (change)=\"setConnector($event.value)\"\n        aria-label=\"Combine conditions\"\n      >\n        <mat-button-toggle value=\"&&\">All</mat-button-toggle>\n        <mat-button-toggle value=\"||\">Any</mat-button-toggle>\n      </mat-button-toggle-group>\n      <span class=\"lib-validators-config__muted\">of these match</span>\n    </div>\n    }\n  </div>\n\n  @if (raw()) {\n  <label class=\"lib-validators-config__field\">\n    <span class=\"lib-validators-config__f-label\">Expression</span>\n    <textarea\n      class=\"lib-validators-config__control lib-validators-config__textarea lib-validators-config__mono\"\n      rows=\"2\"\n      [value]=\"draft.expression\"\n      (input)=\"onTextChange($event, 'expression')\"\n      placeholder='e.g. endDate < startDate'\n    ></textarea>\n  </label>\n  @if (syntaxError(); as error) {\n  <p class=\"lib-validators-config__error\">\n    <mat-icon class=\"lib-validators-config__error-icon\">error_outline</mat-icon>\n    <span>{{ error }}</span>\n  </p>\n  } @else {\n  <p class=\"lib-validators-config__sub-hint\">\n    True means the entry is invalid. Reference a field by its name; comparisons use\n    <code>===</code>, <code>&gt;</code>, <code>includes</code> \u2026\n  </p>\n  }\n  } @else {\n  @if (fieldOptions().length === 0) {\n  <p class=\"lib-validators-config__sub-hint\">\n    No fields available yet \u2014 switch to Advanced to type an expression.\n  </p>\n  }\n  @for (cond of group().conditions; track $index; let first = $first) {\n  @if (!first) {\n  <div class=\"lib-validators-config__connector\" aria-hidden=\"true\">\n    <span>{{ group().connector === '&&' ? 'AND' : 'OR' }}</span>\n  </div>\n  }\n  <div class=\"lib-validators-config__cond\">\n    <div class=\"lib-validators-config__cond-body\">\n      <label class=\"lib-validators-config__field\">\n        <span class=\"lib-validators-config__f-label\">Field</span>\n        <select\n          class=\"lib-validators-config__control\"\n          [class.lib-validators-config__control--invalid]=\"!cond.field\"\n          (change)=\"updateCondition($index, { field: inputValue($event) })\"\n        >\n          <option value=\"\" disabled [selected]=\"!cond.field\">Choose a field</option>\n          @if (directFields().length) {\n          <optgroup label=\"Fields\">\n            @for (f of directFields(); track f.variable) {\n            <option [value]=\"f.variable\" [selected]=\"f.variable === cond.field\">\n              {{ f.label }}{{ f.isSelf ? ' (this field)' : '' }}\n            </option>\n            }\n          </optgroup>\n          }\n          @if (listFields().length) {\n          <optgroup label=\"List fields (totalled)\">\n            @for (f of listFields(); track f.variable) {\n            <option [value]=\"f.variable\" [selected]=\"f.variable === cond.field\">{{ f.label }}</option>\n            }\n          </optgroup>\n          }\n        </select>\n      </label>\n\n      <div class=\"lib-validators-config__cond-pair\">\n        <label class=\"lib-validators-config__field\">\n          <span class=\"lib-validators-config__f-label\">Condition</span>\n          <select\n            class=\"lib-validators-config__control\"\n            (change)=\"updateCondition($index, { operator: inputValue($event) })\"\n          >\n            @for (op of operators; track op.value) {\n            <option [value]=\"op.value\" [selected]=\"op.value === cond.operator\">{{ op.label }}</option>\n            }\n          </select>\n        </label>\n\n        <div class=\"lib-validators-config__field\">\n          <span class=\"lib-validators-config__f-label\">\n            {{ cond.compareTo === 'field' ? 'Other field' : 'Value' }}\n          </span>\n          <div class=\"lib-validators-config__value\">\n            @if (cond.compareTo === 'field') {\n            <select\n              class=\"lib-validators-config__control\"\n              [class.lib-validators-config__control--invalid]=\"!cond.value\"\n              (change)=\"updateCondition($index, { value: inputValue($event) })\"\n            >\n              <option value=\"\" disabled [selected]=\"!cond.value\">Choose a field</option>\n              @if (directFields().length) {\n              <optgroup label=\"Fields\">\n                @for (f of directFields(); track f.variable) {\n                <option [value]=\"f.variable\" [selected]=\"f.variable === cond.value\">\n                  {{ f.label }}{{ f.isSelf ? ' (this field)' : '' }}\n                </option>\n                }\n              </optgroup>\n              }\n              @if (listFields().length) {\n              <optgroup label=\"List fields (totalled)\">\n                @for (f of listFields(); track f.variable) {\n                <option [value]=\"f.variable\" [selected]=\"f.variable === cond.value\">{{ f.label }}</option>\n                }\n              </optgroup>\n              }\n            </select>\n            } @else {\n            <input\n              class=\"lib-validators-config__control\"\n              [class.lib-validators-config__control--invalid]=\"!cond.value\"\n              [value]=\"cond.value\"\n              (input)=\"updateCondition($index, { value: inputValue($event) })\"\n              placeholder=\"e.g. 18\"\n            />\n            }\n            <button\n              type=\"button\"\n              class=\"lib-validators-config__value-toggle\"\n              (click)=\"toggleCompareTo($index)\"\n              [attr.aria-label]=\"\n                cond.compareTo === 'field' ? 'Compare to a typed value' : 'Compare to another field'\n              \"\n              [matTooltip]=\"\n                cond.compareTo === 'field' ? 'Compare to a typed value' : 'Compare to another field'\n              \"\n            >\n              <mat-icon>{{ cond.compareTo === 'field' ? 'edit' : 'link' }}</mat-icon>\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <button\n      type=\"button\"\n      class=\"lib-validators-config__cond-remove\"\n      mat-icon-button\n      (click)=\"removeCondition($index)\"\n      matTooltip=\"Remove condition\"\n      aria-label=\"Remove condition\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  </div>\n  }\n\n  <button type=\"button\" class=\"lib-validators-config__link\" (click)=\"addCondition()\">\n    <mat-icon>add</mat-icon> Add condition\n  </button>\n  }\n\n  @if (referencedListFields().length) {\n  <div class=\"lib-validators-config__lists\">\n    <span class=\"lib-validators-config__f-label\">Combine each list</span>\n    <p class=\"lib-validators-config__sub-hint\">\n      A list field has many rows. Choose how to reduce it to one value when comparing against a\n      single field or value \u2014 optional when comparing two lists.\n    </p>\n    @for (f of referencedListFields(); track f.variable) {\n    <div\n      class=\"lib-validators-config__list-row\"\n      [class.lib-validators-config__list-row--unset]=\"\n        isAggregateRequired(f.variable) && !currentFunction(f.variable)\n      \"\n    >\n      <span class=\"lib-validators-config__list-name\">\n        {{ f.label }}\n        @if (!isAggregateRequired(f.variable)) {\n        <span class=\"lib-validators-config__list-optional\">optional</span>\n        }\n      </span>\n      <div class=\"lib-validators-config__agg\" role=\"group\" [attr.aria-label]=\"'Combine ' + f.label\">\n        @for (agg of aggregatesFor(f); track agg.value) {\n        <button\n          type=\"button\"\n          class=\"lib-validators-config__agg-chip\"\n          [class.lib-validators-config__agg-chip--on]=\"currentFunction(f.variable) === agg.value\"\n          (click)=\"setFunction(f.variable, agg.value)\"\n        >\n          {{ agg.label }}\n        </button>\n        }\n      </div>\n    </div>\n    }\n  </div>\n  }\n\n  @if (draft.expression) {\n  <div class=\"lib-validators-config__preview\">\n    <span class=\"lib-validators-config__f-label\">Generated</span>\n    <code>{{ draft.expression }}</code>\n  </div>\n  }\n\n  <div class=\"lib-validators-config__override\">\n    <mat-slide-toggle\n      name=\"canOverride\"\n      [checked]=\"draft.canOverride\"\n      (change)=\"setCanOverride($event.checked)\"\n    >\n      <span class=\"lib-validators-config__toggle-label\">Users can override this rule</span>\n    </mat-slide-toggle>\n    <span class=\"lib-validators-config__sub-hint\">\n      @if (draft.canOverride) { Shown as a warning \u2014 the form can still be submitted. } @else { Blocks\n      submission until the entry is fixed. }\n    </span>\n  </div>\n\n  <div class=\"lib-validators-config__foot\">\n    @if (raw()) {\n    <button\n      type=\"button\"\n      class=\"lib-validators-config__link\"\n      [disabled]=\"!canUseGuided()\"\n      [matTooltip]=\"canUseGuided() ? '' : 'This expression is too advanced for the guided builder'\"\n      (click)=\"useGuided()\"\n    >\n      <mat-icon>view_module</mat-icon> Guided\n    </button>\n    } @else {\n    <button type=\"button\" class=\"lib-validators-config__link\" (click)=\"useRaw()\">\n      <mat-icon>code</mat-icon> Advanced\n    </button>\n    }\n  </div>\n\n  @if (saveHint(); as hint) {\n  <p class=\"lib-validators-config__save-hint\">\n    <mat-icon class=\"lib-validators-config__save-hint-icon\">info</mat-icon>\n    <span>{{ hint }}</span>\n  </p>\n  }\n\n  <mat-toolbar class=\"lib-validators-config__toolbar\">\n    <span class=\"lib-validators-config__spacer\"></span>\n    <button mat-button (click)=\"closeEditor()\">Close</button>\n    <button mat-raised-button color=\"accent\" [disabled]=\"!canSave()\" (click)=\"saveVariable()\">\n      Save rule\n    </button>\n  </mat-toolbar>\n</mat-card>\n}\n", styles: ["@charset \"UTF-8\";:host{display:block}.lib-validators-config__title{margin:0 0 .5rem;font-size:.9375rem;font-weight:500;letter-spacing:-.01em;color:var(--lib-forms-on-surface)}.lib-validators-config__hint{display:flex;align-items:flex-start;gap:.5rem;margin:0 0 1.25rem;font-size:.8125rem;line-height:1.5;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__hint-icon{flex:none;font-size:1.125rem;width:1.125rem;height:1.125rem;color:var(--sem-info, var(--lib-forms-primary))}.lib-validators-config__chip{height:fit-content;padding:.5rem;cursor:pointer}.lib-validators-config__chip-label{white-space:normal}.lib-validators-config__add{cursor:pointer}.lib-validators-config__editor{display:flex;flex-direction:column;gap:1.25rem;margin-top:1.25rem;padding:1.5rem;background:var(--lib-forms-surface-container-low);border-radius:var(--lib-forms-radius-lg, 16px);box-shadow:var(--mat-sys-level1, 0 1px 3px rgba(0, 0, 0, .1))}.lib-validators-config__field{display:flex;flex-direction:column;gap:.25rem;min-width:0}.lib-validators-config__f-label{font-size:.625rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__control{box-sizing:border-box;width:100%;min-width:0;height:2.125rem;padding:.375rem .5rem;font-family:inherit;font-size:.8125rem;line-height:1.25;color:var(--lib-forms-on-surface);background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm);transition:border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}select.lib-validators-config__control{cursor:pointer}.lib-validators-config__textarea{height:auto;min-height:2.75rem;line-height:1.45;resize:vertical}.lib-validators-config__mono{font-family:var(--lib-forms-font-mono, monospace)}.lib-validators-config__control:hover{border-color:var(--lib-forms-outline)}.lib-validators-config__control:focus{outline:none;border-color:var(--lib-forms-primary);box-shadow:0 0 0 1px var(--lib-forms-primary)}.lib-validators-config__control--invalid:not(:focus){border-color:var(--sem-warning, var(--lib-forms-outline));background:var(--sem-warning-surface, var(--lib-forms-surface-container-lowest))}.lib-validators-config__condition-head{display:flex;flex-direction:column;gap:.625rem}.lib-validators-config__match{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap}.lib-validators-config__muted{font-size:.8125rem;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__seg{--mat-standard-button-toggle-height: 30px;height:30px}.lib-validators-config__connector{display:flex;justify-content:center;margin:-.375rem 0}.lib-validators-config__connector span{padding:.0625rem .5rem;font-size:.625rem;font-weight:600;letter-spacing:.1em;color:var(--lib-forms-on-surface-variant);background:var(--lib-forms-surface-container-high);border-radius:var(--lib-forms-radius-pill, 999px)}.lib-validators-config__cond{display:grid;grid-template-columns:1fr auto;align-items:start;gap:.375rem;padding:.75rem;background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-md)}.lib-validators-config__cond-body{display:flex;flex-direction:column;gap:.625rem;min-width:0}.lib-validators-config__cond-pair{display:grid;grid-template-columns:8.5rem 1fr;gap:.5rem;min-width:0}.lib-validators-config__value{display:flex;align-items:center;gap:.25rem;min-width:0}.lib-validators-config__value-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:2.125rem;height:2.125rem;padding:0;color:var(--lib-forms-on-surface-variant);background:transparent;border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm);cursor:pointer;transition:border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__value-toggle:hover{color:var(--lib-forms-primary);border-color:var(--lib-forms-primary)}.lib-validators-config__value-toggle mat-icon{font-size:1.0625rem;width:1.0625rem;height:1.0625rem}.lib-validators-config__cond-remove{width:2rem;height:2rem;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__link{display:inline-flex;align-items:center;align-self:flex-start;gap:.25rem;height:1.875rem;padding:0 .5rem;font:inherit;font-size:.8125rem;font-weight:500;color:var(--lib-forms-primary);background:transparent;border:0;border-radius:var(--lib-forms-radius-sm);cursor:pointer;transition:background-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__link:hover:not(:disabled){background:var(--lib-forms-primary-container)}.lib-validators-config__link:disabled{color:var(--lib-forms-on-surface-variant);cursor:default;opacity:.6}.lib-validators-config__link mat-icon{flex:none;font-size:1.0625rem;width:1.0625rem;height:1.0625rem}.lib-validators-config__lists{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-md)}.lib-validators-config__list-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.lib-validators-config__list-name{font-size:.8125rem;font-weight:500;color:var(--lib-forms-on-surface)}.lib-validators-config__list-row--unset .lib-validators-config__list-name:after{content:\" \\2014  pick one\";font-weight:400;color:var(--sem-warning, var(--lib-forms-on-surface-variant))}.lib-validators-config__list-optional{margin-left:.375rem;font-size:.625rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__agg{display:inline-flex;flex-wrap:wrap;gap:.25rem}.lib-validators-config__agg-chip{padding:.1875rem .5rem;font:inherit;font-size:.75rem;font-weight:500;color:var(--lib-forms-on-surface-variant);background:var(--lib-forms-surface-container);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-pill, 999px);cursor:pointer;transition:background-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__agg-chip:hover{border-color:var(--lib-forms-primary);color:var(--lib-forms-primary)}.lib-validators-config__agg-chip--on{color:var(--mat-sys-on-primary, #fff);background:var(--lib-forms-primary);border-color:var(--lib-forms-primary)}.lib-validators-config__preview{display:flex;align-items:baseline;gap:.5rem;padding:.5rem .625rem;background:var(--lib-forms-surface-container-lowest);border:1px dashed var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm)}.lib-validators-config__preview .lib-validators-config__f-label{flex:none}.lib-validators-config__preview code{font-family:var(--lib-forms-font-mono, monospace);font-size:.75rem;color:var(--lib-forms-on-surface-variant);word-break:break-word}.lib-validators-config__sub-hint{margin:0;font-size:.75rem;line-height:1.45;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__sub-hint code,.lib-validators-config__error code{font-family:var(--lib-forms-font-mono, monospace);padding:.0625rem .25rem;background:var(--lib-forms-surface-container-high);border-radius:var(--lib-forms-radius-sm)}.lib-validators-config__error{display:flex;align-items:flex-start;gap:.375rem;margin:0;font-size:.75rem;line-height:1.45;color:var(--sem-error, var(--mat-sys-error))}.lib-validators-config__error-icon{flex:none;font-size:1rem;width:1rem;height:1rem}.lib-validators-config__override{display:flex;flex-direction:column;gap:.5rem}.lib-validators-config__toggle-label{margin-left:.5rem;font-size:.8125rem}.lib-validators-config__foot{display:flex;justify-content:flex-end;margin-top:-.5rem}.lib-validators-config__save-hint{display:flex;align-items:flex-start;gap:.375rem;margin:0;font-size:.75rem;line-height:1.45;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__save-hint-icon{flex:none;font-size:1rem;width:1rem;height:1rem;color:var(--sem-info, var(--lib-forms-primary))}.lib-validators-config__toolbar{background:transparent;padding:0}.lib-validators-config__spacer{flex:1 1 auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: i1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "directive", type: i1.MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i3$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i1$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i3$2.TitleCasePipe, name: "titlecase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ValidatorsConfigComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-validators-config', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [
+                        CommonModule,
+                        MatIconModule,
+                        MatChipsModule,
+                        MatCardModule,
+                        MatToolbarModule,
+                        MatButtonModule,
+                        MatButtonToggleModule,
+                        MatSlideToggleModule,
+                        MatTooltipModule,
+                    ], providers: [{ provide: MatFormFieldControl, useExisting: ValidatorsConfigComponent }], host: {
+                        'class': 'lib-validators-config',
+                        '[attr.id]': 'id',
+                    }, template: "<section class=\"lib-validators-config__list\">\n  <h5 class=\"lib-validators-config__title\">Validation rules</h5>\n\n  <p class=\"lib-validators-config__hint\">\n    <mat-icon class=\"lib-validators-config__hint-icon\">lightbulb</mat-icon>\n    <span>Each rule shows its message when its condition is true \u2014 describe when the entry is\n      <strong>wrong</strong>.</span>\n  </p>\n\n  <mat-chip-listbox [disabled]=\"disabled\" aria-label=\"Validation rules\">\n    @for (validator of value; track trackValidator(validator)) {\n    <mat-chip-option\n      class=\"lib-validators-config__chip\"\n      [selected]=\"isEditing(validator)\"\n      (click)=\"editV(validator)\"\n    >\n      <span class=\"lib-validators-config__chip-label\">\n        {{ validatorLabel(validator) | titlecase }}\n      </span>\n\n      @if (isEditing(validator)) {\n      <mat-icon matChipTrailingIcon>check_circle</mat-icon>\n      } @else {\n      <button matChipRemove [attr.aria-label]=\"'remove validator'\" (click)=\"remove(validator)\">\n        <mat-icon>cancel</mat-icon>\n      </button>\n      }\n    </mat-chip-option>\n    }\n\n    @if (!edit()) {\n    <mat-chip-option\n      class=\"lib-validators-config__add\"\n      matTooltip=\"Add a new validation rule\"\n      [selectable]=\"false\"\n      [disabled]=\"disabled\"\n      (click)=\"addValidator()\"\n    >\n      Add rule\n      <mat-icon matChipTrailingIcon>add</mat-icon>\n    </mat-chip-option>\n    }\n  </mat-chip-listbox>\n</section>\n\n@if (edit(); as draft) {\n<mat-card class=\"lib-validators-config__editor\" (click)=\"$event.stopPropagation()\">\n  <label class=\"lib-validators-config__field\">\n    <span class=\"lib-validators-config__f-label\">Error message</span>\n    <textarea\n      class=\"lib-validators-config__control lib-validators-config__textarea\"\n      rows=\"2\"\n      [value]=\"draft.message\"\n      (input)=\"onTextChange($event, 'message')\"\n      placeholder=\"e.g. End date must be after the start date\"\n    ></textarea>\n  </label>\n\n  <div class=\"lib-validators-config__condition-head\">\n    <span class=\"lib-validators-config__f-label\">Show this error when</span>\n    @if (!raw() && group().conditions.length > 1) {\n    <div class=\"lib-validators-config__match\">\n      <mat-button-toggle-group\n        class=\"lib-validators-config__seg\"\n        [value]=\"group().connector\"\n        hideSingleSelectionIndicator\n        (change)=\"setConnector($event.value)\"\n        aria-label=\"Combine conditions\"\n      >\n        <mat-button-toggle value=\"&&\">All</mat-button-toggle>\n        <mat-button-toggle value=\"||\">Any</mat-button-toggle>\n      </mat-button-toggle-group>\n      <span class=\"lib-validators-config__muted\">of these match</span>\n    </div>\n    }\n  </div>\n\n  @if (raw()) {\n  <label class=\"lib-validators-config__field\">\n    <span class=\"lib-validators-config__f-label\">Expression</span>\n    <textarea\n      class=\"lib-validators-config__control lib-validators-config__textarea lib-validators-config__mono\"\n      rows=\"2\"\n      [value]=\"draft.expression\"\n      (input)=\"onTextChange($event, 'expression')\"\n      placeholder='e.g. endDate < startDate'\n    ></textarea>\n  </label>\n  @if (syntaxError(); as error) {\n  <p class=\"lib-validators-config__error\">\n    <mat-icon class=\"lib-validators-config__error-icon\">error_outline</mat-icon>\n    <span>{{ error }}</span>\n  </p>\n  } @else {\n  <p class=\"lib-validators-config__sub-hint\">\n    True means the entry is invalid. Reference a field by its name; comparisons use\n    <code>===</code>, <code>&gt;</code>, <code>includes</code> \u2026\n  </p>\n  }\n  } @else {\n  @if (fieldOptions().length === 0) {\n  <p class=\"lib-validators-config__sub-hint\">\n    No fields available yet \u2014 switch to Advanced to type an expression.\n  </p>\n  }\n  @for (cond of group().conditions; track $index; let first = $first) {\n  @if (!first) {\n  <div class=\"lib-validators-config__connector\" aria-hidden=\"true\">\n    <span>{{ group().connector === '&&' ? 'AND' : 'OR' }}</span>\n  </div>\n  }\n  <div class=\"lib-validators-config__cond\">\n    <div class=\"lib-validators-config__cond-body\">\n      <label class=\"lib-validators-config__field\">\n        <span class=\"lib-validators-config__f-label\">Field</span>\n        <select\n          class=\"lib-validators-config__control\"\n          [class.lib-validators-config__control--invalid]=\"!cond.field\"\n          (change)=\"updateCondition($index, { field: inputValue($event) })\"\n        >\n          <option value=\"\" disabled [selected]=\"!cond.field\">Choose a field</option>\n          @if (directFields().length) {\n          <optgroup label=\"Fields\">\n            @for (f of directFields(); track f.variable) {\n            <option [value]=\"f.variable\" [selected]=\"f.variable === cond.field\">\n              {{ f.label }}{{ f.isSelf ? ' (this field)' : '' }}\n            </option>\n            }\n          </optgroup>\n          }\n          @if (listFields().length) {\n          <optgroup label=\"List fields (totalled)\">\n            @for (f of listFields(); track f.variable) {\n            <option [value]=\"f.variable\" [selected]=\"f.variable === cond.field\">{{ f.label }}</option>\n            }\n          </optgroup>\n          }\n        </select>\n      </label>\n\n      <div class=\"lib-validators-config__cond-pair\">\n        <label class=\"lib-validators-config__field\">\n          <span class=\"lib-validators-config__f-label\">Condition</span>\n          <select\n            class=\"lib-validators-config__control\"\n            (change)=\"updateCondition($index, { operator: inputValue($event) })\"\n          >\n            @for (op of operators; track op.value) {\n            <option [value]=\"op.value\" [selected]=\"op.value === cond.operator\">{{ op.label }}</option>\n            }\n          </select>\n        </label>\n\n        <div class=\"lib-validators-config__field\">\n          <span class=\"lib-validators-config__f-label\">\n            {{ cond.compareTo === 'field' ? 'Other field' : 'Value' }}\n          </span>\n          <div class=\"lib-validators-config__value\">\n            @if (cond.compareTo === 'field') {\n            <select\n              class=\"lib-validators-config__control\"\n              [class.lib-validators-config__control--invalid]=\"!cond.value\"\n              (change)=\"updateCondition($index, { value: inputValue($event) })\"\n            >\n              <option value=\"\" disabled [selected]=\"!cond.value\">Choose a field</option>\n              @if (directFields().length) {\n              <optgroup label=\"Fields\">\n                @for (f of directFields(); track f.variable) {\n                <option [value]=\"f.variable\" [selected]=\"f.variable === cond.value\">\n                  {{ f.label }}{{ f.isSelf ? ' (this field)' : '' }}\n                </option>\n                }\n              </optgroup>\n              }\n              @if (listFields().length) {\n              <optgroup label=\"List fields (totalled)\">\n                @for (f of listFields(); track f.variable) {\n                <option [value]=\"f.variable\" [selected]=\"f.variable === cond.value\">{{ f.label }}</option>\n                }\n              </optgroup>\n              }\n            </select>\n            } @else {\n            <input\n              class=\"lib-validators-config__control\"\n              [class.lib-validators-config__control--invalid]=\"!cond.value\"\n              [value]=\"cond.value\"\n              (input)=\"updateCondition($index, { value: inputValue($event) })\"\n              placeholder=\"e.g. 18\"\n            />\n            }\n            <button\n              type=\"button\"\n              class=\"lib-validators-config__value-toggle\"\n              (click)=\"toggleCompareTo($index)\"\n              [attr.aria-label]=\"\n                cond.compareTo === 'field' ? 'Compare to a typed value' : 'Compare to another field'\n              \"\n              [matTooltip]=\"\n                cond.compareTo === 'field' ? 'Compare to a typed value' : 'Compare to another field'\n              \"\n            >\n              <mat-icon>{{ cond.compareTo === 'field' ? 'edit' : 'link' }}</mat-icon>\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <button\n      type=\"button\"\n      class=\"lib-validators-config__cond-remove\"\n      mat-icon-button\n      (click)=\"removeCondition($index)\"\n      matTooltip=\"Remove condition\"\n      aria-label=\"Remove condition\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  </div>\n  }\n\n  <button type=\"button\" class=\"lib-validators-config__link\" (click)=\"addCondition()\">\n    <mat-icon>add</mat-icon> Add condition\n  </button>\n  }\n\n  @if (referencedListFields().length) {\n  <div class=\"lib-validators-config__lists\">\n    <span class=\"lib-validators-config__f-label\">Combine each list</span>\n    <p class=\"lib-validators-config__sub-hint\">\n      A list field has many rows. Choose how to reduce it to one value when comparing against a\n      single field or value \u2014 optional when comparing two lists.\n    </p>\n    @for (f of referencedListFields(); track f.variable) {\n    <div\n      class=\"lib-validators-config__list-row\"\n      [class.lib-validators-config__list-row--unset]=\"\n        isAggregateRequired(f.variable) && !currentFunction(f.variable)\n      \"\n    >\n      <span class=\"lib-validators-config__list-name\">\n        {{ f.label }}\n        @if (!isAggregateRequired(f.variable)) {\n        <span class=\"lib-validators-config__list-optional\">optional</span>\n        }\n      </span>\n      <div class=\"lib-validators-config__agg\" role=\"group\" [attr.aria-label]=\"'Combine ' + f.label\">\n        @for (agg of aggregatesFor(f); track agg.value) {\n        <button\n          type=\"button\"\n          class=\"lib-validators-config__agg-chip\"\n          [class.lib-validators-config__agg-chip--on]=\"currentFunction(f.variable) === agg.value\"\n          (click)=\"setFunction(f.variable, agg.value)\"\n        >\n          {{ agg.label }}\n        </button>\n        }\n      </div>\n    </div>\n    }\n  </div>\n  }\n\n  @if (draft.expression) {\n  <div class=\"lib-validators-config__preview\">\n    <span class=\"lib-validators-config__f-label\">Generated</span>\n    <code>{{ draft.expression }}</code>\n  </div>\n  }\n\n  <div class=\"lib-validators-config__override\">\n    <mat-slide-toggle\n      name=\"canOverride\"\n      [checked]=\"draft.canOverride\"\n      (change)=\"setCanOverride($event.checked)\"\n    >\n      <span class=\"lib-validators-config__toggle-label\">Users can override this rule</span>\n    </mat-slide-toggle>\n    <span class=\"lib-validators-config__sub-hint\">\n      @if (draft.canOverride) { Shown as a warning \u2014 the form can still be submitted. } @else { Blocks\n      submission until the entry is fixed. }\n    </span>\n  </div>\n\n  <div class=\"lib-validators-config__foot\">\n    @if (raw()) {\n    <button\n      type=\"button\"\n      class=\"lib-validators-config__link\"\n      [disabled]=\"!canUseGuided()\"\n      [matTooltip]=\"canUseGuided() ? '' : 'This expression is too advanced for the guided builder'\"\n      (click)=\"useGuided()\"\n    >\n      <mat-icon>view_module</mat-icon> Guided\n    </button>\n    } @else {\n    <button type=\"button\" class=\"lib-validators-config__link\" (click)=\"useRaw()\">\n      <mat-icon>code</mat-icon> Advanced\n    </button>\n    }\n  </div>\n\n  @if (saveHint(); as hint) {\n  <p class=\"lib-validators-config__save-hint\">\n    <mat-icon class=\"lib-validators-config__save-hint-icon\">info</mat-icon>\n    <span>{{ hint }}</span>\n  </p>\n  }\n\n  <mat-toolbar class=\"lib-validators-config__toolbar\">\n    <span class=\"lib-validators-config__spacer\"></span>\n    <button mat-button (click)=\"closeEditor()\">Close</button>\n    <button mat-raised-button color=\"accent\" [disabled]=\"!canSave()\" (click)=\"saveVariable()\">\n      Save rule\n    </button>\n  </mat-toolbar>\n</mat-card>\n}\n", styles: ["@charset \"UTF-8\";:host{display:block}.lib-validators-config__title{margin:0 0 .5rem;font-size:.9375rem;font-weight:500;letter-spacing:-.01em;color:var(--lib-forms-on-surface)}.lib-validators-config__hint{display:flex;align-items:flex-start;gap:.5rem;margin:0 0 1.25rem;font-size:.8125rem;line-height:1.5;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__hint-icon{flex:none;font-size:1.125rem;width:1.125rem;height:1.125rem;color:var(--sem-info, var(--lib-forms-primary))}.lib-validators-config__chip{height:fit-content;padding:.5rem;cursor:pointer}.lib-validators-config__chip-label{white-space:normal}.lib-validators-config__add{cursor:pointer}.lib-validators-config__editor{display:flex;flex-direction:column;gap:1.25rem;margin-top:1.25rem;padding:1.5rem;background:var(--lib-forms-surface-container-low);border-radius:var(--lib-forms-radius-lg, 16px);box-shadow:var(--mat-sys-level1, 0 1px 3px rgba(0, 0, 0, .1))}.lib-validators-config__field{display:flex;flex-direction:column;gap:.25rem;min-width:0}.lib-validators-config__f-label{font-size:.625rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__control{box-sizing:border-box;width:100%;min-width:0;height:2.125rem;padding:.375rem .5rem;font-family:inherit;font-size:.8125rem;line-height:1.25;color:var(--lib-forms-on-surface);background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm);transition:border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}select.lib-validators-config__control{cursor:pointer}.lib-validators-config__textarea{height:auto;min-height:2.75rem;line-height:1.45;resize:vertical}.lib-validators-config__mono{font-family:var(--lib-forms-font-mono, monospace)}.lib-validators-config__control:hover{border-color:var(--lib-forms-outline)}.lib-validators-config__control:focus{outline:none;border-color:var(--lib-forms-primary);box-shadow:0 0 0 1px var(--lib-forms-primary)}.lib-validators-config__control--invalid:not(:focus){border-color:var(--sem-warning, var(--lib-forms-outline));background:var(--sem-warning-surface, var(--lib-forms-surface-container-lowest))}.lib-validators-config__condition-head{display:flex;flex-direction:column;gap:.625rem}.lib-validators-config__match{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap}.lib-validators-config__muted{font-size:.8125rem;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__seg{--mat-standard-button-toggle-height: 30px;height:30px}.lib-validators-config__connector{display:flex;justify-content:center;margin:-.375rem 0}.lib-validators-config__connector span{padding:.0625rem .5rem;font-size:.625rem;font-weight:600;letter-spacing:.1em;color:var(--lib-forms-on-surface-variant);background:var(--lib-forms-surface-container-high);border-radius:var(--lib-forms-radius-pill, 999px)}.lib-validators-config__cond{display:grid;grid-template-columns:1fr auto;align-items:start;gap:.375rem;padding:.75rem;background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-md)}.lib-validators-config__cond-body{display:flex;flex-direction:column;gap:.625rem;min-width:0}.lib-validators-config__cond-pair{display:grid;grid-template-columns:8.5rem 1fr;gap:.5rem;min-width:0}.lib-validators-config__value{display:flex;align-items:center;gap:.25rem;min-width:0}.lib-validators-config__value-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:2.125rem;height:2.125rem;padding:0;color:var(--lib-forms-on-surface-variant);background:transparent;border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm);cursor:pointer;transition:border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__value-toggle:hover{color:var(--lib-forms-primary);border-color:var(--lib-forms-primary)}.lib-validators-config__value-toggle mat-icon{font-size:1.0625rem;width:1.0625rem;height:1.0625rem}.lib-validators-config__cond-remove{width:2rem;height:2rem;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__link{display:inline-flex;align-items:center;align-self:flex-start;gap:.25rem;height:1.875rem;padding:0 .5rem;font:inherit;font-size:.8125rem;font-weight:500;color:var(--lib-forms-primary);background:transparent;border:0;border-radius:var(--lib-forms-radius-sm);cursor:pointer;transition:background-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__link:hover:not(:disabled){background:var(--lib-forms-primary-container)}.lib-validators-config__link:disabled{color:var(--lib-forms-on-surface-variant);cursor:default;opacity:.6}.lib-validators-config__link mat-icon{flex:none;font-size:1.0625rem;width:1.0625rem;height:1.0625rem}.lib-validators-config__lists{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--lib-forms-surface-container-lowest);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-md)}.lib-validators-config__list-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.lib-validators-config__list-name{font-size:.8125rem;font-weight:500;color:var(--lib-forms-on-surface)}.lib-validators-config__list-row--unset .lib-validators-config__list-name:after{content:\" \\2014  pick one\";font-weight:400;color:var(--sem-warning, var(--lib-forms-on-surface-variant))}.lib-validators-config__list-optional{margin-left:.375rem;font-size:.625rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__agg{display:inline-flex;flex-wrap:wrap;gap:.25rem}.lib-validators-config__agg-chip{padding:.1875rem .5rem;font:inherit;font-size:.75rem;font-weight:500;color:var(--lib-forms-on-surface-variant);background:var(--lib-forms-surface-container);border:1px solid var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-pill, 999px);cursor:pointer;transition:background-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1)),border-color var(--lib-forms-duration-hover, .3s) var(--lib-forms-easing, cubic-bezier(.16, 1, .3, 1))}.lib-validators-config__agg-chip:hover{border-color:var(--lib-forms-primary);color:var(--lib-forms-primary)}.lib-validators-config__agg-chip--on{color:var(--mat-sys-on-primary, #fff);background:var(--lib-forms-primary);border-color:var(--lib-forms-primary)}.lib-validators-config__preview{display:flex;align-items:baseline;gap:.5rem;padding:.5rem .625rem;background:var(--lib-forms-surface-container-lowest);border:1px dashed var(--lib-forms-outline-variant);border-radius:var(--lib-forms-radius-sm)}.lib-validators-config__preview .lib-validators-config__f-label{flex:none}.lib-validators-config__preview code{font-family:var(--lib-forms-font-mono, monospace);font-size:.75rem;color:var(--lib-forms-on-surface-variant);word-break:break-word}.lib-validators-config__sub-hint{margin:0;font-size:.75rem;line-height:1.45;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__sub-hint code,.lib-validators-config__error code{font-family:var(--lib-forms-font-mono, monospace);padding:.0625rem .25rem;background:var(--lib-forms-surface-container-high);border-radius:var(--lib-forms-radius-sm)}.lib-validators-config__error{display:flex;align-items:flex-start;gap:.375rem;margin:0;font-size:.75rem;line-height:1.45;color:var(--sem-error, var(--mat-sys-error))}.lib-validators-config__error-icon{flex:none;font-size:1rem;width:1rem;height:1rem}.lib-validators-config__override{display:flex;flex-direction:column;gap:.5rem}.lib-validators-config__toggle-label{margin-left:.5rem;font-size:.8125rem}.lib-validators-config__foot{display:flex;justify-content:flex-end;margin-top:-.5rem}.lib-validators-config__save-hint{display:flex;align-items:flex-start;gap:.375rem;margin:0;font-size:.75rem;line-height:1.45;color:var(--lib-forms-on-surface-variant)}.lib-validators-config__save-hint-icon{flex:none;font-size:1rem;width:1rem;height:1rem;color:var(--sem-info, var(--lib-forms-primary))}.lib-validators-config__toolbar{background:transparent;padding:0}.lib-validators-config__spacer{flex:1 1 auto}\n"] }]
+        }], propDecorators: { disabled: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], errors: [{
+                type: Input
+            }], mapToData: [{ type: i0.Input, args: [{ isSignal: true, alias: "mapToData", required: false }] }], formInputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "formInputs", required: false }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }] } });
+
+export { ValidatorsConfigComponent };
+//# sourceMappingURL=ngx-t-forms-validators-config.component-oGjQVGE2.mjs.map