@koobiq/components 21.0.0 → 21.1.0

package/types/koobiq-components-filter-bar.d.ts

@@ -149,6 +149,18 @@ interface KbqPipe {
     value: unknown | null;
     search?: boolean;
     selectAll?: boolean;
+    /**
+     * `multiselect` / `multi-tree-select` pipes only: shows a counter of the elements "Select all" would
+     * toggle next to its row — all of them, or only the ones matching the search while searching. Locked
+     * values are not counted. Ignored by other pipe types. Default is `false`.
+     */
+    selectAllCounter?: boolean;
+    /**
+     * Tree-based pipes only (`tree-select`, `multi-tree-select`): whether the panel opens with every
+     * branch expanded. When `false`, all branches start collapsed except the ancestors of the selected
+     * node(s). Default is `true`.
+     */
+    defaultExpanded?: boolean;
     openOnAdd?: boolean;
     openOnReset?: boolean;
     /**
@@ -188,6 +200,12 @@ interface KbqPipeData<V> extends KbqPipe {
 }
 interface KbqPipeTemplate extends Omit<KbqPipe, 'value'> {
     values?: unknown[];
+    /**
+     * Custom option content for `select` and `multiselect`, or custom leaf and branch content for
+     * `tree-select` and `multi-tree-select`. Tree templates receive a {@link KbqMultiTreeSelectValueTemplateContext} with the
+     * original `option` and current `search`; filtering and the trigger still use the node's `name`.
+     * Ignored by other pipe types.
+     */
     valueTemplate?: TemplateRef<any> | string;
     /**
      * Custom equality comparator forwarded to the underlying `kbq-select` of the `select` /
@@ -220,8 +238,9 @@ interface KbqPipeTemplate extends Omit<KbqPipe, 'value'> {
     panelMaxHeight?: KbqPanelMaxHeight;
     /**
      * Whether option names and captions in the dropdown wrap instead of being truncated to one line.
-     * Applies to the `select` and `multiselect` pipes; ignored by the other pipe types. Unrelated to
-     * `KbqSelect.multiline`, which lays the trigger's values out in rows.
+     * Applies to the `select`, `multiselect`, `tree-select` and `multi-tree-select` pipes independently of
+     * `valueTemplate`; ignored by the other pipe types. Unrelated to `KbqSelect.multiline`, which lays the
+     * trigger's values out in rows.
      */
     multilineOptions?: boolean;
     /**
@@ -283,11 +302,15 @@ declare class KbqTreeSelectFlatNode {
     level: number;
     expandable: boolean;
     parent?: KbqTreeSelectFlatNode;
+    /** Second line under `name` in the dropdown of the tree-select pipes. */
+    caption?: string;
 }
 interface KbqTreeSelectNode {
     children: KbqTreeSelectNode[] | null;
     name: string;
     value: unknown;
+    /** Second line under `name` in the dropdown of the tree-select pipes. Ignored when `valueTemplate` is used. */
+    caption?: string;
 }
 /**
  * Build the file structure tree. The `value` is the Json object, or a sub-tree of a Json object.
@@ -706,7 +729,7 @@ declare abstract class KbqBasePipe<V> implements AfterViewInit {
     protected panelMaxHeight?: KbqPanelMaxHeight;
     /**
      * Whether the dropdown's option names and captions wrap instead of being truncated, forwarded from
-     * the pipe template. Only consumed by the select / multi-select pipe components.
+     * the pipe template. Only consumed by the select-family pipe components.
      */
     protected multilineOptions?: boolean;
     /**
@@ -1159,6 +1182,8 @@ declare class KbqPipeInputComponent extends KbqBasePipe<string | null> implement
 declare class KbqPipeMultiSelectComponent extends KbqBasePipe<KbqSelectValue[]> implements AfterViewInit, OnInit {
     /** control for search options */
     readonly searchControl: FormControl<string | null>;
+    /** Query tokens for option highlighting: tokenized like the filter, so every matched token is marked. */
+    readonly searchTokens: Signal<string[]>;
     /**
      * Options of the pipe template that match the search query. Follows the templates too, so options
      * supplied after initialization render on first open.
@@ -1174,6 +1199,8 @@ declare class KbqPipeMultiSelectComponent extends KbqBasePipe<KbqSelectValue[]>
     get isEmpty(): boolean;
     /** state for checkbox 'select all'. */
     get checkboxState(): KbqPseudoCheckboxState;
+    /** Number of options the "select all" action would toggle right now — template-only. */
+    protected get selectAllCount(): number;
     /** true if all visible options selected */
     get allVisibleOptionsSelected(): boolean;
     /** true if all options selected */
@@ -1231,8 +1258,9 @@ declare abstract class KbqTreeSelectPipeBase<V> extends KbqBasePipe<V> implement
     treeControl: FlatTreeControl<KbqTreeSelectFlatNode>;
     treeFlattener: KbqTreeFlattener<KbqTreeSelectNode, KbqTreeSelectFlatNode>;
     dataSource: KbqTreeFlatDataSource<KbqTreeSelectNode, KbqTreeSelectFlatNode>;
+    private readonly sourceNodes;
     /** @docs-private */
-    readonly select: _angular_core.Signal<KbqTreeSelect<KbqTreeSelectFlatNode>>;
+    readonly select: _angular_core.Signal<KbqTreeSelect<KbqTreeSelectFlatNode, KbqTreeSelectFlatNode>>;
     constructor();
     ngOnInit(): void;
     ngAfterViewInit(): void;
@@ -1242,6 +1270,22 @@ declare abstract class KbqTreeSelectPipeBase<V> extends KbqBasePipe<V> implement
     open(): void;
     /** @docs-private */
     onOpen(): void;
+    /**
+     * Values of the currently selected nodes, in the shape `treeControl.compareValues` understands.
+     * Read from the pipe's own state rather than the select's selection model: the select applies a
+     * value written ahead of its data only once the options render, which is after `onOpen` fires.
+     *
+     * @docs-private
+     */
+    protected abstract getSelectedValues(): KbqSelectValue[];
+    /**
+     * Expands the ancestors of every selected node. Selected values are matched against the current
+     * `dataNodes` by `compareValues`, not by flat-node reference: re-assigning `dataSource.data` rebuilds
+     * the flat nodes, so a stale node reference would miss.
+     */
+    private expandSelectedNodeAncestors;
+    /** @docs-private */
+    protected getSourceNode(node: KbqTreeSelectFlatNode): KbqTreeSelectNode;
     protected transformer: (node: KbqTreeSelectNode, level: number, parent: KbqTreeSelectFlatNode | null) => KbqTreeSelectFlatNode;
     protected getLevel: (node: KbqTreeSelectFlatNode) => number;
     protected isExpandable: (node: KbqTreeSelectFlatNode) => boolean;
@@ -1252,14 +1296,29 @@ declare abstract class KbqTreeSelectPipeBase<V> extends KbqBasePipe<V> implement
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqTreeSelectPipeBase<any>, never, never, {}, {}, never, never, true, never>;
 }
 
+/** Context available to a custom `multi-tree-select` value template. */
+interface KbqMultiTreeSelectValueTemplateContext<T extends KbqTreeSelectNode = KbqTreeSelectNode> {
+    /** Pipe component instance, matching the implicit context of the flat select pipes. */
+    $implicit: KbqPipeMultiTreeSelectComponent;
+    /** Original node, including consumer-defined fields omitted from the flattened tree model. */
+    option: T;
+    /** Current search query. Defaults to `null`. */
+    search: string | null;
+}
 declare class KbqPipeMultiTreeSelectComponent extends KbqTreeSelectPipeBase<KbqSelectValue[]> implements OnInit {
     /** @docs-private */
-    readonly tree: _angular_core.Signal<KbqTreeSelection<KbqTreeSelectFlatNode>>;
+    readonly tree: _angular_core.Signal<KbqTreeSelection<KbqTreeSelectFlatNode, KbqTreeSelectFlatNode>>;
     /** selected value */
     get selected(): KbqSelectValue[] | null;
     /** Whether the current pipe is empty. */
     get isEmpty(): boolean;
     get selectAllCheckboxState(): KbqPseudoCheckboxState;
+    /**
+     * Number of leaf nodes "select all" would toggle right now — template-only. Searching counts only
+     * the matching leaves among the rendered options; the group ancestors shown for context are not
+     * leaves and drop out of the count by construction.
+     */
+    protected get selectAllCount(): number;
     get numberOfSelectedLeaves(): number;
     /** true if all options selected */
     get allOptionsSelected(): boolean;
@@ -1285,6 +1344,16 @@ declare class KbqPipeMultiTreeSelectComponent extends KbqTreeSelectPipeBase<KbqS
     ngOnInit(): void;
     ngAfterViewInit(): void;
     isNodeSelectAll(_: number, nodeData: KbqTreeSelectFlatNode): boolean;
+    /**
+     * The committed value rather than `multiSelect.selected`: that snapshot is only refreshed on
+     * initialization, clearing and a full selection, so a user-made partial selection would leave
+     * the ancestors of the current value collapsed on reopen.
+     *
+     * @docs-private
+     */
+    protected getSelectedValues(): KbqSelectValue[];
+    /** @docs-private */
+    protected getValueTemplateContext(node: KbqTreeSelectFlatNode): KbqMultiTreeSelectValueTemplateContext;
     onSelect({ value: option }: {
         value: any;
     }): void;
@@ -1325,6 +1394,8 @@ declare class KbqPipeReadonlyComponent extends KbqBasePipe<string | null> {
 declare class KbqPipeSelectComponent extends KbqBasePipe<KbqSelectValue> implements AfterViewInit {
     /** control for search options */
     readonly searchControl: FormControl<string | null>;
+    /** Query tokens for option highlighting: tokenized like the filter, so every matched token is marked. */
+    readonly searchTokens: Signal<string[]>;
     /**
      * Options of the pipe template that match the search query. Follows the templates too, so options
      * supplied after initialization render on first open.
@@ -1374,6 +1445,8 @@ declare class KbqPipeTreeSelectComponent extends KbqTreeSelectPipeBase<KbqSelect
     /** Whether the current pipe is empty. */
     get isEmpty(): boolean;
     constructor();
+    /** @docs-private */
+    protected getSelectedValues(): KbqSelectValue[];
     onSelect(item: KbqTreeOption): void;
     /**
      * Populates the tree data source from the pipe template. The shared `values`/`valueTemplate`
@@ -1386,4 +1459,4 @@ declare class KbqPipeTreeSelectComponent extends KbqTreeSelectPipeBase<KbqSelect
 }
 
 export { KBQ_FILTERS, KBQ_FILTER_BAR_CONFIGURATION, KBQ_FILTER_BAR_DEFAULT_CONFIGURATION, KBQ_FILTER_BAR_DEFAULT_LOCALE_CONFIGURATION, KBQ_FILTER_BAR_HOST, KBQ_FILTER_BAR_LOCALE_CONFIGURATION, KBQ_FILTER_BAR_PIPES, KBQ_PIPE_DATA, KbqBasePipe, KbqFilterBar, KbqFilterBarButton, KbqFilterBarModule, KbqFilterRefresher, KbqFilterReset, KbqFilterSavePopover, KbqFilters, KbqPipeAdd, KbqPipeButton, KbqPipeDateBaseComponent, KbqPipeDateComponent, KbqPipeDatetimeComponent, KbqPipeDirective, KbqPipeInputComponent, KbqPipeMultiSelectComponent, KbqPipeMultiTreeSelectComponent, KbqPipeReadonlyComponent, KbqPipeSelectComponent, KbqPipeState, KbqPipeTextComponent, KbqPipeTreeSelectComponent, KbqPipeTypes, KbqSaveFilterStatuses, KbqTreeSelectFlatNode, KbqTreeSelectPipeBase, defaultFilterBarPipes, getId, kbqBuildTree, kbqFilterBarLocaleConfigurationProvider, kbqFilterBarPipesProvider };
-export type { KbqDateTimeValue, KbqFilter, KbqFilterBarHost, KbqFilterBarPipeState, KbqFilterBarState, KbqFiltersHost, KbqPipe, KbqPipeData, KbqPipeTemplate, KbqPipeType, KbqSaveFilterError, KbqSaveFilterEvent, KbqSelectValue, KbqTreeSelectNode };
+export type { KbqDateTimeValue, KbqFilter, KbqFilterBarHost, KbqFilterBarPipeState, KbqFilterBarState, KbqFiltersHost, KbqMultiTreeSelectValueTemplateContext, KbqPipe, KbqPipeData, KbqPipeTemplate, KbqPipeType, KbqSaveFilterError, KbqSaveFilterEvent, KbqSelectValue, KbqTreeSelectNode };

package/types/koobiq-components-flag.d.ts

@@ -53,6 +53,24 @@ declare class KbqFlag {
      * projected image (`alt`, `<title>`) has to repeat it here.
      */
     readonly label: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Value of `role`.
+     *
+     * @docs-private
+     */
+    protected readonly resolvedRole: _angular_core.Signal<"img" | null>;
+    /**
+     * Value of `aria-label`.
+     *
+     * @docs-private
+     */
+    protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
+    /**
+     * Value of `aria-hidden`.
+     *
+     * @docs-private
+     */
+    protected readonly resolvedAriaHidden: _angular_core.Signal<"true" | null>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqFlag, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<KbqFlag, "kbq-flag", ["kbqFlag"], { "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; "shadow": { "alias": "shadow"; "required": false; "isSignal": true; }; "empty": { "alias": "empty"; "required": false; "isSignal": true; }; "svg": { "alias": "svg"; "required": false; "isSignal": true; }; "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/types/koobiq-components-form-field.d.ts

@@ -33,6 +33,13 @@ declare abstract class KbqFormFieldControl<T> {
     readonly disabled: Signal<boolean>;
     /** Whether the control is in an error state. */
     readonly errorState: Signal<boolean>;
+    /**
+     * Whether the control is read-only: it can be focused and its value selected and copied, but not changed.
+     *
+     * Implement it only on a control that has a read-only state. `KbqFormField` then hides the cleaner and adds
+     * the `kbq-form-field_readonly` class.
+     */
+    readonly readonly?: Signal<boolean>;
     /**
      * Whether the control's value was filled in by the browser.
      *
@@ -138,19 +145,57 @@ declare class KbqCleaner extends KbqIconButton implements AfterContentInit {
     static ɵcmp: i0.ɵɵComponentDeclaration<KbqCleaner, "kbq-cleaner", ["kbqCleaner"], { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof i1.KbqLocaleOverridesDirective; inputs: { "kbqLocaleOverrides": "localeOverrides"; }; outputs: {}; }]>;
 }
 
+/**
+ * State that a control gives to the hints projected into it. A hint's own input can only add to it: `[compact]="false"`
+ * does not cancel `compact` of the control.
+ *
+ * @docs-private
+ */
+interface KbqHintParentConfig {
+    /** Makes the hints smaller, as `KbqHint.compact` does. */
+    compact?: Signal<boolean>;
+    /** Disables `color` for the hint text, as `KbqHint.fillTextOff` does. */
+    fillTextOff?: Signal<boolean>;
+    /**
+     * Whether the control is disabled. Its hints then show in the disabled color what no `color` paints: a hint
+     * without `color` with its icons that have no color of their own, and the text of a hint with `fillTextOff`. A
+     * color set on the hint or on its icon wins. A hint has no `disabled` of its own: it is not interactive, so only the
+     * state of its control applies.
+     */
+    disabled?: Signal<boolean>;
+}
+/**
+ * Lets a control set the state of the hints projected into it, so that it does not restyle them.
+ *
+ * @docs-private
+ */
+declare const KBQ_HINT_PARENT: InjectionToken<KbqHintParentConfig>;
+/**
+ * Provides `KBQ_HINT_PARENT`. The factory runs in the injection context of the control, so it can inject the control.
+ *
+ * @docs-private
+ */
+declare const kbqHintParentFactoryProvider: (factory: () => KbqHintParentConfig) => Provider;
 /** Hint text to be shown below the form field control. */
 declare class KbqHint extends KbqColorDirective {
+    private readonly parent;
     /** Unique ID for the hint. Referenced by the `aria-describedby` of the form field control. */
     readonly id: i0.InputSignal<string>;
     /** Disables `color` for the hint text. */
     readonly fillTextOff: i0.InputSignalWithTransform<boolean, unknown>;
     /** Makes the hint size smaller. */
     readonly compact: i0.InputSignalWithTransform<boolean, unknown>;
+    /** @docs-private */
+    protected readonly isFillTextOff: Signal<boolean>;
+    /** @docs-private */
+    protected readonly isCompact: Signal<boolean>;
+    /** @docs-private */
+    protected readonly isDisabled: Signal<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqHint, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<KbqHint, "kbq-hint", ["kbqHint"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "fillTextOff": { "alias": "fillTextOff"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; }, {}, never, ["[kbq-icon]", "*"], true, never>;
 }
 
-/** Error text to be shown below the form field control. */
+/** Error text to be shown below the form field control. It keeps the error color under a disabled control too. */
 declare class KbqError extends KbqHint {
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqError, never>;
@@ -256,6 +301,8 @@ type KbqStepperControl = {
     readonly controlType: 'input-number';
     /** Read by the template, so it has to be backed by a signal for the stepper to follow it. */
     readonly disabled: boolean;
+    /** Whether the field is read-only: the stepper stays visible but does not step. */
+    readonly readonly: Signal<boolean>;
     /** A signal since the input review: `step` is an `input()` on `KbqNumberInput`. */
     readonly step: Signal<number>;
     stepUp: (step: number) => void;
@@ -287,6 +334,12 @@ declare class KbqStepper {
      * @docs-private
      */
     protected readonly control: Signal<KbqStepperControl>;
+    /**
+     * Whether the steps are blocked. A read-only field keeps the stepper visible, as a disabled one does.
+     *
+     * @docs-private
+     */
+    protected readonly inactive: Signal<boolean>;
     constructor();
     /** @docs-private */
     onStepUp(event: MouseEvent): void;
@@ -324,6 +377,8 @@ type KbqFormFieldDefaultOptions = Partial<{
     labelClass: string | string[] | Set<string>;
     /** Additional CSS classes applied to the content wrapper element. */
     contentClass: string | string[] | Set<string>;
+    /** Whether the label of a required control ends with the `*` marker. */
+    showRequiredMarker: boolean;
 }>;
 /**
  * Injection token that can be used to configure the default options for all kbq-form-field's.
@@ -341,6 +396,8 @@ declare const KBQ_FORM_FIELD_DEFAULT_OPTIONS: InjectionToken<Partial<{
     labelClass: string | string[] | Set<string>;
     /** Additional CSS classes applied to the content wrapper element. */
     contentClass: string | string[] | Set<string>;
+    /** Whether the label of a required control ends with the `*` marker. */
+    showRequiredMarker: boolean;
 }>>;
 /** Utility provider for `KBQ_FORM_FIELD_DEFAULT_OPTIONS`. */
 declare const kbqFormFieldDefaultOptionsProvider: (options: KbqFormFieldDefaultOptions) => Provider;
@@ -365,6 +422,11 @@ declare class KbqFormField extends KbqColorDirective implements AfterContentInit
     readonly labelClass: i0.InputSignal<string | string[] | Set<string> | undefined>;
     /** Additional CSS classes applied to the content wrapper element. */
     readonly contentClass: i0.InputSignal<string | string[] | Set<string> | undefined>;
+    /**
+     * Whether the label of a required control ends with the `*` marker. A control is required by its `required`
+     * state or by `Validators.required` on its form control.
+     */
+    readonly showRequiredMarker: i0.InputSignalWithTransform<boolean, unknown>;
     /**
      * The form field control.
      *
@@ -427,6 +489,17 @@ declare class KbqFormField extends KbqColorDirective implements AfterContentInit
      * @docs-private
      */
     protected readonly hasLabel: Signal<boolean>;
+    /**
+     * Whether the bound form control has `Validators.required`. Re-read on every content check: the validators of a
+     * control notify nothing a signal could follow.
+     */
+    private readonly requiredByValidator;
+    /**
+     * Whether the label ends with the required marker.
+     *
+     * @docs-private
+     */
+    protected readonly hasRequiredMarker: Signal<boolean>;
     /**
      * Id of the rendered label, or `null` when the form field has no label.
      *
@@ -491,13 +564,15 @@ declare class KbqFormField extends KbqColorDirective implements AfterContentInit
     get hasFocus(): boolean;
     /**
      * Whether the cleaner can be displayed: it requires a projected `kbq-cleaner`, an enabled control
-     * and a value that is not empty.
+     * that is not read-only and a value that is not empty.
      *
      * @docs-private
      */
     get canShowCleaner(): boolean;
     /** Whether the form field is disabled. */
     get disabled(): boolean;
+    /** Whether the form field control is read-only. */
+    readonly readonly: Signal<boolean>;
     /**
      * Whether the form field control's value was filled in by the browser. Controls that cannot be
      * autofilled do not implement `autofilled`, and report `false` here.
@@ -563,7 +638,7 @@ declare class KbqFormField extends KbqColorDirective implements AfterContentInit
     /** Initializes the form field control. */
     private initializeControl;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqFormField, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFormField, "kbq-form-field", ["kbqFormField"], { "noBorders": { "alias": "noBorders"; "required": false; "isSignal": true; }; "inOverlay": { "alias": "inOverlay"; "required": false; "isSignal": true; }; "horizontal": { "alias": "horizontal"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; }, { "inOverlay": "inOverlayChange"; }, ["control", "stepper", "cleaner", "passwordToggle", "hint", "suffix", "prefix", "controlElementRef", "reactivePasswordHint", "error", "label"], ["kbq-label", "[kbqPrefix]", "*", "kbq-cleaner", "kbq-password-toggle, kbq-stepper, [kbqSuffix]", "kbq-error", "kbq-hint, kbq-reactive-password-hint"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFormField, "kbq-form-field", ["kbqFormField"], { "noBorders": { "alias": "noBorders"; "required": false; "isSignal": true; }; "inOverlay": { "alias": "inOverlay"; "required": false; "isSignal": true; }; "horizontal": { "alias": "horizontal"; "required": false; "isSignal": true; }; "labelClass": { "alias": "labelClass"; "required": false; "isSignal": true; }; "contentClass": { "alias": "contentClass"; "required": false; "isSignal": true; }; "showRequiredMarker": { "alias": "showRequiredMarker"; "required": false; "isSignal": true; }; }, { "inOverlay": "inOverlayChange"; }, ["control", "stepper", "cleaner", "passwordToggle", "hint", "suffix", "prefix", "controlElementRef", "reactivePasswordHint", "error", "label"], ["kbq-label", "[kbqPrefix]", "*", "kbq-cleaner", "kbq-password-toggle, kbq-stepper, [kbqSuffix]", "kbq-error", "kbq-hint, kbq-reactive-password-hint"], true, never>;
 }
 /**
  * Trims the value of `kbqInput` and `kbqTextarea` before it reaches the model.
@@ -602,12 +677,18 @@ declare class KbqReactivePasswordHint extends KbqHint {
     readonly hasError: i0.InputSignalWithTransform<boolean, unknown>;
     /** Disables `color` for the hint text. */
     readonly fillTextOff: i0.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * A password hint keeps its size under any control, so `compact` of the control does not apply to it.
+     *
+     * @docs-private
+     */
+    protected readonly isCompact: Signal<boolean>;
     /**
      * The form field hint icon.
      *
      * @docs-private
      */
-    protected readonly icon: i0.Signal<"kbq-xmark-s_16" | "kbq-check-s_16">;
+    protected readonly icon: Signal<"kbq-xmark-s_16" | "kbq-check-s_16">;
     constructor();
     private updateColor;
     private makeColor;
@@ -621,5 +702,5 @@ declare class KbqFormFieldModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<KbqFormFieldModule>;
 }
 
-export { KBQ_CLEANER_CONTEXT, KBQ_FORM_FIELD, KBQ_FORM_FIELD_DEFAULT_OPTIONS, KbqCleaner, KbqError, KbqFieldset, KbqFieldsetItem, KbqFormField, KbqFormFieldControl, KbqFormFieldModule, KbqHint, KbqLabel, KbqLegend, KbqPasswordToggle, KbqPrefix, KbqReactivePasswordHint, KbqStepper, KbqSuffix, KbqTrim, kbqCleanerFactoryProvider, kbqFormFieldDefaultOptionsProvider };
-export type { KbqCleanerContext, KbqCleanerContextBase, KbqFormFieldDefaultOptions };
+export { KBQ_CLEANER_CONTEXT, KBQ_FORM_FIELD, KBQ_FORM_FIELD_DEFAULT_OPTIONS, KBQ_HINT_PARENT, KbqCleaner, KbqError, KbqFieldset, KbqFieldsetItem, KbqFormField, KbqFormFieldControl, KbqFormFieldModule, KbqHint, KbqLabel, KbqLegend, KbqPasswordToggle, KbqPrefix, KbqReactivePasswordHint, KbqStepper, KbqSuffix, KbqTrim, kbqCleanerFactoryProvider, kbqFormFieldDefaultOptionsProvider, kbqHintParentFactoryProvider };
+export type { KbqCleanerContext, KbqCleanerContextBase, KbqFormFieldDefaultOptions, KbqHintParentConfig };

package/types/koobiq-components-icon.d.ts

@@ -42,6 +42,13 @@ declare class KbqIconRegistry {
      * Accepts "namespace:name" syntax.
      */
     getNamedSvgIcon(name: string, namespace?: string): Observable<SVGElement>;
+    /**
+     * `getNamedSvgIcon` without the error for a miss: `null` when nothing registered can resolve the name. Every font
+     * icon is looked up, and an error per miss would cost a stack trace each.
+     *
+     * @docs-private
+     */
+    findSvgIcon(name: string, namespace?: string): Observable<SVGElement> | null;
     private cacheIcon;
     private loadIcon;
     private registerIconSet;
@@ -105,6 +112,14 @@ declare class KbqIcon extends KbqColorDirective implements AfterContentInit, OnC
      */
     protected get autoColorError(): boolean;
     private readonly hostErrorState;
+    /**
+     * Whether `color` is the error color. A signal of its own because the color class binding already reads
+     * `color`: the host bindings of every icon in a view run in that view's reactive consumer, which finds a
+     * signal read a second time by scanning all it has read so far, O(N²) per check across N icons.
+     *
+     * @docs-private
+     */
+    protected readonly colorIsError: _angular_core.Signal<boolean>;
     /** Name of an icon within a `@koobiq/icons`. Accepts "namespace:name" syntax. */
     iconName: string | undefined;
     /** @docs-private */

package/types/koobiq-components-inline-edit.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_cdk_overlay from '@angular/cdk/overlay';
-import { ScrollStrategy, CdkConnectedOverlay } from '@angular/cdk/overlay';
+import { ScrollStrategy, CdkConnectedOverlay, ConnectedPosition } from '@angular/cdk/overlay';
 import * as _angular_core from '@angular/core';
 import { InjectionToken, ElementRef, TemplateRef } from '@angular/core';
 import * as _koobiq_components_core from '@koobiq/components/core';
@@ -192,6 +192,13 @@ declare class KbqInlineEdit implements KbqConnectedOverlayOriginProvider, KbqInl
     protected readonly overlayWidth: _angular_core.WritableSignal<string | number>;
     /** Distance the panel is pulled up by so that it covers the view it replaces. */
     protected readonly overlayOffsetY: _angular_core.WritableSignal<number>;
+    /**
+     * Single overlay position that keeps the panel anchored to the view mode element. Fallback positions are
+     * intentionally omitted so the panel does not flip or get pushed away from the origin when space is tight.
+     *
+     * @docs-private
+     */
+    protected readonly overlayPositions: ConnectedPosition[];
     /**
      * Built on first read rather than in the field initializer: a list of inline edits would otherwise
      * allocate one strategy per row, including the rows nobody ever opens.

package/types/koobiq-components-input.d.ts

@@ -107,6 +107,11 @@ declare class KbqNumberInput implements ControlValueAccessor, OnDestroy {
     /** Whether the field is disabled, bound with `[disabled]` or set by a form control. */
     get disabled(): boolean;
     private readonly disabledState;
+    /**
+     * Whether the field is read-only: the arrow keys, `kbq-stepper` and a paste leave the value as it is.
+     * `KbqInput` on the same element binds the native attribute. Defaults to `false`.
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, string | boolean | null | undefined>;
     focused: boolean;
     get nativeElement(): HTMLInputElement;
     get viewValue(): string;
@@ -130,6 +135,8 @@ declare class KbqNumberInput implements ControlValueAccessor, OnDestroy {
     protected get fractionSeparator(): KbqInputNumberLocaleConfiguration['fractionSeparator'];
     protected get groupSeparator(): KbqInputNumberLocaleConfiguration['groupSeparator'];
     private get config();
+    private get stepMin();
+    private get stepMax();
     private readonly localeConfiguration;
     private valueFromPaste;
     /** Pending `onInput` reformats by timer handle: cancelled on destroy, run at once before a step. */
@@ -172,6 +179,8 @@ declare class KbqNumberInput implements ControlValueAccessor, OnDestroy {
      */
     private correctCaretForSeparator;
     private setViewValue;
+    private isBeyondSafeRange;
+    private clampToSafeRange;
     /** Writes a value from outside the field: reformats it and reports the change. */
     private setValue;
     private setDisabled;
@@ -180,7 +189,7 @@ declare class KbqNumberInput implements ControlValueAccessor, OnDestroy {
     private formatNumber;
     private createLocalizedNumberFromParts;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqNumberInput, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqNumberInput, "input[kbqNumberInput]", ["kbqNumberInput", "kbqNumericalInput"], { "integer": { "alias": "integer"; "required": false; "isSignal": true; }; "bigStep": { "alias": "bigStep"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "withThousandSeparator": { "alias": "withThousandSeparator"; "required": false; "isSignal": true; }; "startFormattingFrom": { "alias": "startFormattingFrom"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.KbqLocaleOverridesDirective; inputs: { "kbqLocaleOverrides": "localeOverrides"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqNumberInput, "input[kbqNumberInput]", ["kbqNumberInput", "kbqNumericalInput"], { "integer": { "alias": "integer"; "required": false; "isSignal": true; }; "bigStep": { "alias": "bigStep"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "withThousandSeparator": { "alias": "withThousandSeparator"; "required": false; "isSignal": true; }; "startFormattingFrom": { "alias": "startFormattingFrom"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.KbqLocaleOverridesDirective; inputs: { "kbqLocaleOverrides": "localeOverrides"; }; outputs: {}; }]>;
 }
 
 declare class KbqInput implements KbqFormFieldControl<any>, DoCheck, CanUpdateErrorState {
@@ -234,6 +243,11 @@ declare class KbqInput implements KbqFormFieldControl<any>, DoCheck, CanUpdateEr
      * @docs-private
      */
     readonly disabled: _angular_core.Signal<boolean>;
+    /**
+     * Whether the input is read-only: its value can be selected and copied, but not changed. A read-only
+     * input shows no placeholder. Defaults to `false`.
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, string | boolean | null | undefined>;
     /** @docs-private */
     readonly idInput: _angular_core.InputSignal<string | undefined>;
     /**
@@ -302,7 +316,7 @@ declare class KbqInput implements KbqFormFieldControl<any>, DoCheck, CanUpdateEr
     protected isBadInput(): boolean;
     private isEmpty;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInput, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInput, "input[kbqInput],input[kbqNumberInput]", ["kbqInput"], { "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; "isSignal": true; }; "placeholderInput": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "typeInput": { "alias": "type"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInput, "input[kbqInput],input[kbqNumberInput]", ["kbqInput"], { "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; "isSignal": true; }; "placeholderInput": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "typeInput": { "alias": "type"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class KbqInputMono {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInputMono, never>;
@@ -400,6 +414,11 @@ declare class KbqInputPassword implements KbqFormFieldControl<any>, DoCheck, Can
      * @docs-private
      */
     readonly disabled: _angular_core.Signal<boolean>;
+    /**
+     * Whether the input is read-only: its value can be selected and copied, but not changed. A read-only
+     * input shows no placeholder. Defaults to `false`.
+     */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, string | boolean | null | undefined>;
     /** @docs-private */
     readonly idInput: _angular_core.InputSignal<string | undefined>;
     /**
@@ -461,7 +480,7 @@ declare class KbqInputPassword implements KbqFormFieldControl<any>, DoCheck, Can
     protected isBadInput(): boolean;
     private isEmpty;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInputPassword, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInputPassword, "input[kbqInputPassword]", ["kbqInputPassword"], { "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; "isSignal": true; }; "placeholderInput": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInputPassword, "input[kbqInputPassword]", ["kbqInputPassword"], { "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; "isSignal": true; }; "placeholderInput": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare const KBQ_INPUT_VALUE_ACCESSOR: InjectionToken<{

package/types/koobiq-components-list.d.ts

@@ -536,6 +536,12 @@ declare class KbqListOption<T = any> implements OnDestroy, OnInit, IFocusableOpt
     /** Whether the option is disabled, through its own input, its group or the list. */
     get disabled(): boolean;
     private readonly disabledState;
+    /**
+     * Value of `aria-disabled`: the disabled state, but a signal of its own, since `kbq-disabled` reads that one.
+     *
+     * @docs-private
+     */
+    protected readonly ariaDisabled: _angular_core.Signal<true | null>;
     /** @docs-private */
     readonly draggableInput: _angular_core.InputSignalWithTransform<boolean, string | boolean | null | undefined>;
     /**

package/types/koobiq-components-modal.d.ts

@@ -211,6 +211,13 @@ declare class KbqModalComponent<T = any, R = any> extends KbqModalRef<T, R> impl
     private focusMonitor;
     private readonly inputModalityDetector;
     private readonly injector;
+    /**
+     * Whether the dialog and its dim layer move without motion. Read from the dialog's own injector, under
+     * `options.injector` when the service opened it.
+     *
+     * @docs-private
+     */
+    readonly animationsDisabled: boolean;
     /** Accessible name for the icon-only close button. */
     protected readonly a11yLocaleConfiguration: _angular_core.Signal<i1.KbqA11yLocaleConfiguration>;
     protected readonly document: Document;