@malva-ui/core 0.1.12

package/checkbox/lib/checkbox/checkbox.d.ts

@@ -0,0 +1,129 @@
+import type { BooleanInput } from '@angular/cdk/coercion';
+import type { MlvFormState, MlvFormControl } from '@malva-ui/core/form-utils';
+import { MlvSignalCheckboxControlBase } from '@malva-ui/core/form-utils';
+import * as i0 from "@angular/core";
+/**
+ * Visual/validation state of the checkbox. Mirrors {@link MlvFormState}.
+ */
+export type MlvCheckboxState = MlvFormState;
+export declare class MlvCheckbox extends MlvSignalCheckboxControlBase implements MlvFormControl {
+    /** @private Optional parent checkbox group used for roving-focus coordination. */
+    private readonly _group;
+    /** @private Host element reference, used to strip the moved ARIA attributes. */
+    private readonly _elementRef;
+    /** @private Renderer used to imperatively remove host ARIA attributes. */
+    private readonly _renderer;
+    /**
+     * @private The `aria-label` a consumer placed directly on the `<mlv-checkbox>`
+     * host, captured before host bindings run. The host is role-less, so ARIA
+     * prohibits an `aria-label` there (axe `aria-prohibited-attr`); it is moved to
+     * the inner `<input type="checkbox">` instead (see the constructor).
+     */
+    private readonly _hostAriaLabel;
+    /**
+     * @private The `aria-labelledby` a consumer placed directly on the
+     * `<mlv-checkbox>` host, captured before host bindings run. Moved to the inner
+     * input for the same reason as {@link _hostAriaLabel}.
+     */
+    private readonly _hostAriaLabelledBy;
+    /**
+     * Id reference(s) naming the inner native input (`aria-labelledby`). Use this
+     * input (not a host `[attr.aria-labelledby]` binding) when the reference is
+     * dynamic — the role-less host must not carry ARIA naming attributes
+     * (axe `aria-prohibited-attr`). A static host `aria-labelledby` attribute is
+     * also supported and forwarded automatically (see the constructor); this
+     * input takes precedence when both are present.
+     *
+     * The inherited `ariaLabel` input behaves the same way for `aria-label`.
+     */
+    readonly ariaLabelledBy: import("@angular/core").InputSignal<string | undefined>;
+    /**
+     * @internal The accessible name forwarded onto the native input, sourced from a
+     * host `aria-label`. `null` when the consumer supplied none, so no empty
+     * `aria-label` is emitted on the input.
+     */
+    readonly _ariaLabel: import("@angular/core").WritableSignal<string | null>;
+    /**
+     * @internal The `aria-labelledby` forwarded onto the native input, sourced from
+     * a host `aria-labelledby`. `null` when the consumer supplied none.
+     */
+    readonly _ariaLabelledBy: import("@angular/core").WritableSignal<string | null>;
+    /**
+     * @internal The final `aria-label` for the native input: the `ariaLabel` input
+     * wins over a captured static host attribute; `null` emits no attribute.
+     */
+    readonly _resolvedAriaLabel: import("@angular/core").Signal<string | null>;
+    /**
+     * @internal The final `aria-labelledby` for the native input, with the same
+     * precedence as {@link _resolvedAriaLabel}.
+     */
+    readonly _resolvedAriaLabelledBy: import("@angular/core").Signal<string | null>;
+    constructor();
+    /**
+     * The checked state — the signal-forms `FormCheckboxControl` model. Two-way
+     * bindable (`[(checked)]`) and kept in sync with the bound field by
+     * `[formField]` / `[formControl]` / `ngModel`. The `FormCheckboxControl`
+     * contract forbids a sibling `value` member, so the previous group-membership
+     * `value` input was removed in the signal-forms cutover.
+     */
+    readonly checked: import("@angular/core").ModelSignal<boolean>;
+    /** Renders mixed-state visuals (minus icon). */
+    readonly indeterminate: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * When `false`, forces the native input out of the tab order (`tabindex="-1"`)
+     * regardless of group roving state. Composite parents that own a single tab
+     * stop — e.g. `mlv-tree` multi-select rows or `mlv-data-table` rows — set
+     * `[tabbable]="false"` so the checkbox does not add an extra tab stop while
+     * remaining operable via the row (Space) and the mouse.
+     */
+    readonly tabbable: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    readonly inputId: string;
+    /**
+     * Roving tabindex applied to the native checkbox input — the single focus
+     * target. `0` for the tabbable checkbox, `-1` for the rest of a group.
+     * Managed by `MlvCheckboxGroup`.
+     */
+    readonly tabIndex: import("@angular/core").WritableSignal<number>;
+    /** @internal Effective tabindex on the native input, gated by `tabbable`. */
+    readonly _resolvedTabIndex: import("@angular/core").Signal<number>;
+    /**
+     * @private Reference to the visually-hidden native input, which is the
+     * component's focus target (kept in the a11y tree via the clip-path pattern).
+     */
+    private readonly _nativeInput;
+    /**
+     * Moves focus to the native checkbox input. Satisfies CDK `FocusableOption`
+     * so `MlvCheckboxGroup`'s `FocusKeyManager` focuses the input, not the host.
+     */
+    focus(): void;
+    /** @internal Notifies the parent group when the native input gains focus. */
+    onFocus(): void;
+    /**
+     * Reflects the native `change` event (Space / click): the `checked` model
+     * emits, propagating to the bound field. Touched is reported on blur (see
+     * {@link onBlur}), matching the signal-forms `touch` contract.
+     */
+    onInputChange(event: Event): void;
+    /** Toggles the checked state from an Enter keypress on the native input. */
+    toggle(event: Event): void;
+    /**
+     * @internal Marks the control touched when focus leaves the native input —
+     * the signal-forms `touch` output replacing the CVA `onTouched` callback.
+     */
+    onBlur(): void;
+    /** Whether the control holds a clearable value — Checked state counts as the clearable value (clear unchecks). */
+    readonly hasValue: import("@angular/core").Signal<boolean>;
+    /**
+     * @private The wrapper around the projected content, used once after the
+     * first render to tell whether the consumer supplied visible text.
+     */
+    private readonly _contentRef;
+    /**
+     * @private Dev-mode diagnostic: a checkbox with no projected text, no
+     * `label` and no ARIA naming has no accessible name at all. CSS decides which
+     * of the two visible sources renders, so this only reports the empty case.
+     */
+    private _warnWhenUnlabelled;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvCheckbox, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MlvCheckbox, "mlv-checkbox", never, { "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "tabbable": { "alias": "tabbable"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, ["*"], true, never>;
+}

package/checkbox/lib/checkbox-group/checkbox-group.d.ts

@@ -0,0 +1,24 @@
+import { MlvCheckbox } from '../checkbox/checkbox';
+import type { MlvCheckboxGroupAccessor } from '../checkbox-group-token';
+import type { MlvFormState } from '@malva-ui/core/form-utils';
+import { MlvFocusableGroupBase } from '@malva-ui/core/form-utils';
+import * as i0 from "@angular/core";
+/**
+ * Visual/validation state of the checkbox group. Mirrors {@link MlvFormState}.
+ */
+export type MlvCheckboxGroupState = MlvFormState;
+export declare class MlvCheckboxGroup extends MlvFocusableGroupBase<MlvCheckbox> implements MlvCheckboxGroupAccessor {
+    /** Accessible label for the group, rendered above the checkboxes. */
+    readonly label: import("@angular/core").InputSignal<string>;
+    /** Visual/validation state applied to the group. */
+    readonly state: import("@angular/core").InputSignal<MlvFormState>;
+    /**
+     * @protected The projected checkboxes in DOM order — drives the shared
+     * roving-tabindex arrow navigation from {@link MlvFocusableGroupBase}.
+     */
+    protected readonly _items: import("@angular/core").Signal<readonly MlvCheckbox[]>;
+    /** @protected Skips disabled checkboxes during arrow navigation. */
+    protected _isDisabled(checkbox: MlvCheckbox): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvCheckboxGroup, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MlvCheckboxGroup, "mlv-checkbox-group", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; }, {}, ["_items"], ["*"], true, never>;
+}

package/checkbox/lib/checkbox-group-token.d.ts

@@ -0,0 +1,6 @@
+import { InjectionToken } from '@angular/core';
+import type { MlvCheckbox } from './checkbox/checkbox';
+export interface MlvCheckboxGroupAccessor {
+    onChildFocus(checkbox: MlvCheckbox): void;
+}
+export declare const CHECKBOX_GROUP: InjectionToken<MlvCheckboxGroupAccessor>;

package/checkbox/malva-ui-core-checkbox.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@malva-ui/core/checkbox" />
+export * from './index';

package/chip/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lib/chip/chip';
+export * from './lib/chip/chip.directives';

package/chip/lib/chip/chip.d.ts

@@ -0,0 +1,107 @@
+import type { BooleanInput } from '@angular/cdk/coercion';
+import type { MlvTone } from '@malva-ui/cdk/utils';
+import { MlvChipAppend, MlvChipPrepend } from './chip.directives';
+import * as i0 from "@angular/core";
+import * as i1 from "@malva-ui/cdk/density";
+/**
+ * Available tone variants for the chip component.
+ * Extends the shared {@link MlvTone} semantic vocabulary with neutral and
+ * brand options, mapping to color tokens in the design system.
+ */
+export type MlvChipTone = MlvTone | 'default' | 'primary' | 'secondary' | 'accent';
+/**
+ * Chip component for representing filterable tags, selected items, or categorized attributes.
+ * Similar to badge but with richer interactivity: prepend/append slots, closable mode,
+ * floating (elevated) variant, and full density system integration.
+ *
+ * When `animated` is `true`, enter and leave animations (opacity + scale + width) are enabled.
+ * The leave animation completes before `chipClose` emits.
+ *
+ * @example
+ * ```html
+ * <mlv-chip tone="primary">Angular</mlv-chip>
+ * <mlv-chip tone="success" muted closable animated (chipClose)="removeTag('done')">Done</mlv-chip>
+ * <mlv-chip tone="accent" floating>
+ *   <ng-template mlvChipPrepend><svg lucideStar [size]="12" /></ng-template>
+ *   Featured
+ * </mlv-chip>
+ * ```
+ */
+export declare class MlvChip {
+    /** @protected The component's i18n strings signal. */
+    protected readonly _i18n: import("@angular/core").Signal<import("@malva-ui/i18n").MlvChipI18n>;
+    /**
+     * The semantic tone of the chip.
+     * Determines the background and text colors.
+     * Defaults to `'default'` (neutral).
+     */
+    readonly tone: import("@angular/core").InputSignal<MlvChipTone>;
+    /**
+     * When `true`, uses muted surface/text tokens instead of solid fill colors.
+     * Muted chips are less visually prominent — suited for inline or secondary contexts.
+     * Supports attribute usage: `<mlv-chip muted>`.
+     */
+    readonly muted: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * When `true`, renders the chip with fully rounded (pill) corners.
+     * Default shape uses `--mlv-radius-l` (slightly rounded).
+     * Supports attribute usage: `<mlv-chip rounded>`.
+     */
+    readonly rounded: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * When `true`, renders the chip with an elevated box-shadow, making it appear
+     * to float above the page surface. Equivalent to the button's `elevated` variant.
+     * Supports attribute usage: `<mlv-chip floating>`.
+     */
+    readonly floating: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * When `true`, renders a close (×) button after all chip content.
+     * Clicking it triggers the leave animation (if `animated`) before emitting `chipClose`.
+     * Supports attribute usage: `<mlv-chip closable>`.
+     */
+    readonly closable: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Configurable tabindex for the chip host. Defaults to `0` (focusable).
+     * Set to `-1` when the parent (e.g., tokenizer) manages focus via FocusKeyManager.
+     */
+    readonly chipTabIndex: import("@angular/core").InputSignal<number>;
+    /**
+     * Optional override for the close button's `aria-label`. When `null` (default),
+     * the generic i18n "Remove" label (`MLV_CHIP_I18N.remove`) is used. Set this to
+     * a more descriptive value — e.g. `"Remove: Angular"` — so screen-reader users
+     * know which item the close button removes when the same chip is one of many.
+     */
+    readonly closeAriaLabel: import("@angular/core").InputSignal<string | null>;
+    /**
+     * Emits after the leave animation completes when the user clicks the close button.
+     * Only relevant when `closable` is `true`.
+     */
+    readonly chipClose: import("@angular/core").OutputEmitterRef<void>;
+    /**
+     * @protected Resolved accessible name for the close button. Prefers the
+     * explicit {@link closeAriaLabel} override, falling back to the generic
+     * i18n "Remove" string.
+     */
+    protected readonly _resolvedCloseAriaLabel: import("@angular/core").Signal<string>;
+    /** @protected Template slot rendered before the chip label. */
+    protected readonly _prependRef: import("@angular/core").Signal<MlvChipPrepend | undefined>;
+    /** @protected Template slot rendered after the chip label (before the close button). */
+    protected readonly _appendRef: import("@angular/core").Signal<MlvChipAppend | undefined>;
+    /**
+     * @protected Handles the close button click. When `animated` is true, sets `_leaving`
+     * to trigger the CSS leave animation and defers `chipClose` until it completes.
+     * When not animated, emits `chipClose` immediately.
+     * Prevents event propagation so the chip's container doesn't receive the click.
+     */
+    protected _handleClose(event: Event): void;
+    /**
+     * @protected Handles Backspace/Delete key to remove a closable chip.
+     * Emits `chipClose` and prevents default to avoid browser back navigation.
+     */
+    protected _handleKeyRemove(event: Event): void;
+    /** @private Host element reference, exposed publicly via the `element` getter. */
+    private readonly _elementRef;
+    get element(): HTMLElement;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvChip, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MlvChip, "mlv-chip", never, { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "muted": { "alias": "muted"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "floating": { "alias": "floating"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "chipTabIndex": { "alias": "chipTabIndex"; "required": false; "isSignal": true; }; "closeAriaLabel": { "alias": "closeAriaLabel"; "required": false; "isSignal": true; }; }, { "chipClose": "chipClose"; }, ["_prependRef", "_appendRef"], ["*"], true, [{ directive: typeof i1.MlvDensityDirective; inputs: { "mlvDensity": "mlvDensity"; }; outputs: {}; }]>;
+}

package/chip/lib/chip/chip.directives.d.ts

@@ -0,0 +1,18 @@
+import { MlvStructural } from '@malva-ui/cdk/utils';
+import * as i0 from "@angular/core";
+/**
+ * Template slot directive for content rendered **before** the chip text label.
+ * Use with `<ng-template mlvChipPrepend>` inside a chip element.
+ */
+export declare class MlvChipPrepend extends MlvStructural {
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvChipPrepend, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MlvChipPrepend, "[mlvChipPrepend]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Template slot directive for content rendered **after** the chip text label.
+ * Use with `<ng-template mlvChipAppend>` inside a chip element.
+ */
+export declare class MlvChipAppend extends MlvStructural {
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvChipAppend, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MlvChipAppend, "[mlvChipAppend]", never, {}, {}, never, never, true, never>;
+}

package/chip/malva-ui-core-chip.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@malva-ui/core/chip" />
+export * from './index';

package/color-picker/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/color-picker/color-picker';
+export * from './lib/color-picker-popup/color-picker-popup';
+export * from './lib/color-utils/color-utils';

package/color-picker/lib/color-picker/color-picker.d.ts

@@ -0,0 +1,188 @@
+import type { AfterViewInit, ElementRef, OnInit } from '@angular/core';
+import { MlvSignalFormControlBase } from '@malva-ui/core/form-utils';
+import type { BooleanInput } from '@angular/cdk/coercion';
+import type { MlvHsla, MlvColorInputMode } from '../color-utils/color-utils';
+import * as i0 from "@angular/core";
+/**
+ * The MlvColorPicker provides an HSL/HEX/RGB color picker with:
+ * - A 2D saturation-lightness canvas (pointer-draggable)
+ * - A hue slider
+ * - An opacity slider
+ * - Input mode tabs for HEX, RGB, and HSL
+ * - Signal, reactive, and template-driven forms integration producing a CSS color string
+ */
+export declare class MlvColorPicker extends MlvSignalFormControlBase<string> implements AfterViewInit, OnInit {
+    private static readonly _ALL_FORMATS;
+    /** The CSS color string used by all Angular forms APIs. */
+    readonly value: import("@angular/core").ModelSignal<string>;
+    /** @protected Injected i18n translations for the color picker. */
+    protected readonly _i18n: import("@angular/core").Signal<import("@malva-ui/i18n").MlvColorPickerI18n>;
+    /** Whether to show the opacity slider. Defaults to true. */
+    readonly showOpacity: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** The default input mode displayed when the picker opens. */
+    readonly defaultMode: import("@angular/core").InputSignal<MlvColorInputMode>;
+    /** Available color formats, in display order. */
+    readonly supportedFormats: import("@angular/core").InputSignal<readonly MlvColorInputMode[]>;
+    /** Emits the CSS color string whenever the color changes. */
+    readonly colorChange: import("@angular/core").OutputEmitterRef<string>;
+    /** @private Current color in HSLA space. */
+    protected readonly _hsla: import("@angular/core").WritableSignal<MlvHsla>;
+    /** @private Current input mode for the text inputs. */
+    protected readonly _inputMode: import("@angular/core").WritableSignal<MlvColorInputMode>;
+    /** Formats normalized to supported unique values, preserving caller order. */
+    protected readonly _supportedFormats: import("@angular/core").Signal<readonly MlvColorInputMode[]>;
+    /** @private The current raw hex input string (kept separate to avoid cursor-jump on typing). */
+    protected readonly _hexInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw red channel input. */
+    protected readonly _rgbRInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw green channel input. */
+    protected readonly _rgbGInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw blue channel input. */
+    protected readonly _rgbBInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw alpha input for RGB mode. */
+    protected readonly _rgbAInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw hue input for HSL mode. */
+    protected readonly _hslHInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw saturation input for HSL mode. */
+    protected readonly _hslSInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw lightness input for HSL mode. */
+    protected readonly _hslLInput: import("@angular/core").WritableSignal<string>;
+    /** @private The current raw alpha input for HSL mode. */
+    protected readonly _hslAInput: import("@angular/core").WritableSignal<string>;
+    /** @private Whether the canvas pointer is currently being dragged. */
+    protected readonly _canvasDragging: import("@angular/core").WritableSignal<boolean>;
+    /**
+     * @private Computed CSS string for the hue thumb gradient stop.
+     * Used to show the pure hue color on the canvas gradient background.
+     */
+    protected readonly _hueColor: import("@angular/core").Signal<string>;
+    /**
+     * @private Computed CSS color for the opacity slider checkerboard preview.
+     */
+    protected readonly _rgbaString: import("@angular/core").Signal<string>;
+    /** @private Reference to the canvas element. */
+    protected readonly _canvasRef: import("@angular/core").Signal<ElementRef<HTMLCanvasElement> | undefined>;
+    /** @private Reference to the canvas container for size calculation. */
+    protected readonly _canvasContainerRef: import("@angular/core").Signal<ElementRef<HTMLDivElement> | undefined>;
+    /** @private DestroyRef for cleanup. */
+    private readonly _destroyRef;
+    /**
+     * @private The canvas bounding rect captured once at pointerdown and reused
+     * for every pointermove of that drag, avoiding a forced layout read
+     * (`getBoundingClientRect`) on every move. Cleared on pointerup.
+     */
+    private _dragRect;
+    constructor();
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    /** Whether the control holds a clearable value — The picker always holds a colour, so a clearable X (if enabled) is always actionable. */
+    readonly hasValue: import("@angular/core").Signal<boolean>;
+    /** @private Synchronizes the color editor from an external value. */
+    private _applyValue;
+    /**
+     * @private Draws the 2D saturation-lightness canvas for the current hue.
+     * The canvas shows a gradient from white (top-left) to the pure hue (top-right)
+     * to black (bottom).
+     */
+    protected _drawCanvas(): void;
+    /**
+     * @private Handles pointer down on the SL canvas.
+     * Begins drag and updates color immediately.
+     */
+    protected _onCanvasPointerDown(event: PointerEvent): void;
+    /**
+     * @private Converts a pointer position on the canvas to saturation/lightness values.
+     */
+    private _updateColorFromCanvas;
+    /**
+     * @private Handles hue slider input change.
+     */
+    protected _onHueChange(event: Event): void;
+    /**
+     * @private Handles opacity slider input change.
+     */
+    protected _onOpacityChange(event: Event): void;
+    /**
+     * @private Switches the active input mode tab.
+     */
+    protected _setInputMode(mode: string): void;
+    /**
+     * @private Handles hex input changes.
+     */
+    protected _onHexInput(event: Event): void;
+    /** @private Updates red channel from input. */
+    protected _onRgbRInput(event: Event): void;
+    /** @private Updates green channel from input. */
+    protected _onRgbGInput(event: Event): void;
+    /** @private Updates blue channel from input. */
+    protected _onRgbBInput(event: Event): void;
+    /** @private Updates alpha channel from RGB mode input. */
+    protected _onRgbAInput(event: Event): void;
+    /**
+     * @private Parses all RGB inputs and updates the internal HSLA state.
+     */
+    private _applyRgbInputs;
+    /** @private Updates hue from HSL input. */
+    protected _onHslHInput(event: Event): void;
+    /** @private Updates saturation from HSL input. */
+    protected _onHslSInput(event: Event): void;
+    /** @private Updates lightness from HSL input. */
+    protected _onHslLInput(event: Event): void;
+    /** @private Updates alpha from HSL mode input. */
+    protected _onHslAInput(event: Event): void;
+    /**
+     * @private Parses all HSL inputs and updates internal state.
+     */
+    private _applyHslInputs;
+    /**
+     * @private Refreshes the in-progress text-mirror signals for the requested
+     * channels from the canonical `_hsla()` state. Called after every external
+     * mutation (canvas drag, hue slider, opacity slider, external value write) to
+     * keep the unfocused channels in sync without clobbering the channel the
+     * user is currently typing into.
+     */
+    private _syncFromHsla;
+    /**
+     * @private Emits the current color through the forms model and colorChange output.
+     */
+    private _emitChange;
+    /**
+     * @private Returns the current CSS color string for a given mode.
+     * Used by the template to display the color in the active mode.
+     */
+    protected _getColorString(mode: MlvColorInputMode): string;
+    /**
+     * @private Returns opacity value as 0-100 integer for the opacity slider.
+     */
+    protected _getOpacityPercent(): number;
+    /**
+     * @private Returns the hue value for the hue slider.
+     */
+    protected _getHue(): number;
+    /**
+     * @private Canvas thumb left position.
+     * The canvas uses HSV space (x = HSV saturation, y = 1 − HSV value).
+     * Converts the stored HSL to HSV to get the correct x coordinate.
+     */
+    protected _getThumbLeft(): string;
+    /**
+     * @private Canvas thumb top position.
+     * y = 1 − HSV value (top = bright/white, bottom = black).
+     */
+    protected _getThumbTop(): string;
+    /**
+     * @private Converts the current HSLA state to HSV (saturation + value),
+     * matching the coordinate system used by the SL canvas gradient.
+     *
+     * The canvas draws:
+     *   - Horizontal: white (left) → pure hue (right)  → x = HSV saturation
+     *   - Vertical:   full brightness (top) → black (bottom) → y = 1 − HSV value
+     *
+     * HSL → HSV:
+     *   V  = L + S · min(L, 1−L)
+     *   Sv = V > 0 ? 2·(1 − L/V) : 0
+     */
+    private _hslToHsv;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MlvColorPicker, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MlvColorPicker, "mlv-color-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "showOpacity": { "alias": "showOpacity"; "required": false; "isSignal": true; }; "defaultMode": { "alias": "defaultMode"; "required": false; "isSignal": true; }; "supportedFormats": { "alias": "supportedFormats"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "colorChange": "colorChange"; }, never, never, true, never>;
+}