@qualcomm-ui/angular-core 1.0.4 → 1.0.6

package/fesm2022/qualcomm-ui-angular-core-slider.mjs

@@ -0,0 +1,592 @@
+import * as i0 from '@angular/core';
+import { Injectable, input, computed, Directive, output, inject } from '@angular/core';
+import { BaseApiContextService, createApiContext, useTrackBindings, useMachine, normalizeProps } from '@qualcomm-ui/angular-core/machine';
+import { useId, useOnDestroy, useIsMounted } from '@qualcomm-ui/angular-core/common';
+import { DOCUMENT } from '@angular/common';
+import '@angular/forms';
+import { AbstractBaseListCollectionFormControlDirective } from '@qualcomm-ui/angular-core/input';
+import { sliderMachine, createSliderApi } from '@qualcomm-ui/core/slider';
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class SliderContextService extends BaseApiContextService {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderContextService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderContextService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderContextService, decorators: [{
+            type: Injectable
+        }] });
+const [SLIDER_CONTEXT, useSliderContext, provideSliderContext] = createApiContext("SliderContext", SliderContextService);
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class SliderThumbContextService extends BaseApiContextService {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderThumbContextService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderThumbContextService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: SliderThumbContextService, decorators: [{
+            type: Injectable
+        }] });
+const [SLIDER_THUMB_CONTEXT, useSliderThumbContext, provideSliderThumbContext,] = createApiContext("SliderThumbContext", SliderThumbContextService);
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderControlDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getControlBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderControlDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderControlDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderErrorTextDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getErrorTextBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderErrorTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderErrorTextDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderErrorTextDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderHiddenInputDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    sliderThumbContext = useSliderThumbContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getHiddenInputBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+        ...this.sliderThumbContext(),
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderHiddenInputDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderHiddenInputDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderHiddenInputDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderHintDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getHintBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderHintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderHintDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderHintDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderLabelDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getLabelBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderLabelDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderLabelDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderMarkerGroupDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getMarkerGroupBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMarkerGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderMarkerGroupDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMarkerGroupDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderMarkerDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    /**
+     * The value the marker should indicate.
+     */
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getMarkerBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+        value: this.value(),
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMarkerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderMarkerDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMarkerDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderMaxDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => {
+        return this.sliderContext().getMaxMarkerBindings({
+            id: this.hostId(),
+            onDestroy: this.onDestroy,
+        });
+    });
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMaxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderMaxDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMaxDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderMinDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getMinMarkerBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMinDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderMinDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderMinDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderRangeDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getRangeBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderRangeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderRangeDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderRangeDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderRootDirective extends AbstractBaseListCollectionFormControlDirective {
+    /**
+     * The document's text/writing direction.
+     */
+    dir = input(...(ngDevMode ? [undefined, { debugName: "dir" }] : []));
+    /**
+     * A root node to correctly resolve the Document in custom environments. i.e.,
+     * Iframes, Electron.
+     */
+    getRootNode = input(...(ngDevMode ? [undefined, { debugName: "getRootNode" }] : []));
+    /**
+     * HTML {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.)
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    /**
+     * The aria-label of each slider thumb. Useful for providing an accessible name to
+     * the slider
+     */
+    ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel", alias: "aria-label" }] : [{
+            alias: "aria-label",
+        }]));
+    /**
+     * The `id` of the elements that labels each slider thumb. Useful for providing an
+     * accessible name to the slider
+     */
+    ariaLabelledby = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabelledby", alias: "aria-labelledby" }] : [{
+            alias: "aria-labelledby",
+        }]));
+    /**
+     * Function that returns a human readable value for the slider thumb
+     */
+    getAriaValueText = input(...(ngDevMode ? [undefined, { debugName: "getAriaValueText" }] : []));
+    /**
+     * The maximum value of the slider
+     * @default 100
+     */
+    max = input(...(ngDevMode ? [undefined, { debugName: "max" }] : []));
+    /**
+     * The minimum value of the slider
+     * @default 0
+     */
+    min = input(...(ngDevMode ? [undefined, { debugName: "min" }] : []));
+    /**
+     * The minimum permitted steps between multiple thumbs.
+     *
+     * `minStepsBetweenThumbs` * `step` should reflect the gap between the thumbs.
+     *
+     * - `step: 1` and `minStepsBetweenThumbs: 10` => gap is `10`
+     * - `step: 10` and `minStepsBetweenThumbs: 2` => gap is `20`
+     *
+     * @default 0
+     */
+    minStepsBetweenThumbs = input(...(ngDevMode ? [undefined, { debugName: "minStepsBetweenThumbs" }] : []));
+    /**
+     * The orientation of the slider
+     * @default "horizontal"
+     */
+    orientation = input(...(ngDevMode ? [undefined, { debugName: "orientation" }] : []));
+    /**
+     * The origin of the slider range. The track is filled from the origin
+     * to the thumb for single values.
+     * - "start": Useful when the value represents an absolute value
+     * - "center": Useful when the value represents an offset (relative)
+     * - "end": Useful when the value represents an offset from the end
+     *
+     * @default "start"
+     */
+    origin = input(...(ngDevMode ? [undefined, { debugName: "origin" }] : []));
+    /**
+     * The step value of the slider
+     * @default 1
+     */
+    step = input(...(ngDevMode ? [undefined, { debugName: "step" }] : []));
+    /**
+     * The alignment of the slider thumb relative to the track
+     * - `center`: the thumb will extend beyond the bounds of the slider track.
+     * - `contain`: the thumb will be contained within the bounds of the track.
+     *
+     * @default "contain"
+     */
+    thumbAlignment = input(...(ngDevMode ? [undefined, { debugName: "thumbAlignment" }] : []));
+    /**
+     * The slider thumbs dimensions
+     */
+    thumbSize = input(...(ngDevMode ? [undefined, { debugName: "thumbSize" }] : []));
+    /**
+     * Value change callback.
+     */
+    valueChanged = output();
+    /**
+     * Function invoked when the slider value change is done
+     */
+    valueChangedEnd = output();
+    /**
+     * Function invoked when the slider focus changes
+     */
+    focusChanged = output();
+    document = inject(DOCUMENT);
+    sliderContextService = inject(SliderContextService);
+    isMounted = useIsMounted();
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    trackBindings = useTrackBindings(() => this.sliderContextService.context().getRootBindings({ id: this.hostId() }));
+    ngOnInit() {
+        super.ngOnInit();
+        const machine = useMachine(sliderMachine, computed(() => ({
+            "aria-label": this.ariaLabel(),
+            "aria-labelledby": this.ariaLabelledby(),
+            defaultValue: this.defaultValue(),
+            dir: this.dir(),
+            disabled: this.isDisabled(),
+            // angular handles this automatically with ngModel and Reactive Forms
+            form: undefined,
+            getAriaValueText: this.getAriaValueText(),
+            getRootNode: this.getRootNode() ?? (() => this.document),
+            ids: undefined,
+            invalid: this.isInvalid(),
+            max: this.max(),
+            min: this.min(),
+            minStepsBetweenThumbs: this.minStepsBetweenThumbs(),
+            name: this.name(),
+            onFocusChange: (details) => {
+                if (this.isMounted()) {
+                    this.focusChanged.emit(details);
+                }
+                if (details.focusedIndex === -1) {
+                    // only trigger onTouched on blur.
+                    this.onTouched();
+                }
+            },
+            onValueChange: (details) => {
+                if (!this.control) {
+                    if (this.isMounted()) {
+                        this.valueChanged.emit(details);
+                    }
+                    this.value.set(details.value);
+                    return;
+                }
+                // ngModel is bound to the root, but change events happen from internal
+                // elements and are passed to the machine.  So we need to fire the
+                // form's value change event to keep it in sync.
+                this.onChange(details.value);
+                // angular handles touched/dirty internally when ngModel is bound to an
+                // <input> element, but we don't have that luxury here. We fire these
+                // manually.
+                if (!this.control?.touched) {
+                    this.control.markAsTouched?.();
+                }
+                if (!this.control?.dirty) {
+                    this.control.markAsDirty?.();
+                }
+            },
+            onValueChangeEnd: (details) => {
+                if (this.isMounted()) {
+                    this.valueChangedEnd.emit(details);
+                }
+            },
+            orientation: this.orientation(),
+            origin: this.origin(),
+            readOnly: this.readOnly(),
+            required: this.isRequired(),
+            step: this.step(),
+            thumbAlignment: this.thumbAlignment(),
+            thumbSize: this.thumbSize(),
+            value: this.value(),
+        })), this.injector);
+        this.sliderContextService.init(computed(() => createSliderApi(machine, normalizeProps)));
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderRootDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderRootDirective, isStandalone: true, inputs: { dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, getRootNode: { classPropertyName: "getRootNode", publicName: "getRootNode", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, getAriaValueText: { classPropertyName: "getAriaValueText", publicName: "getAriaValueText", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, minStepsBetweenThumbs: { classPropertyName: "minStepsBetweenThumbs", publicName: "minStepsBetweenThumbs", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, thumbAlignment: { classPropertyName: "thumbAlignment", publicName: "thumbAlignment", isSignal: true, isRequired: false, transformFunction: null }, thumbSize: { classPropertyName: "thumbSize", publicName: "thumbSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged", valueChangedEnd: "valueChangedEnd", focusChanged: "focusChanged" }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderRootDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], getRootNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRootNode", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-labelledby", required: false }] }], getAriaValueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "getAriaValueText", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], minStepsBetweenThumbs: [{ type: i0.Input, args: [{ isSignal: true, alias: "minStepsBetweenThumbs", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], origin: [{ type: i0.Input, args: [{ isSignal: true, alias: "origin", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], thumbAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbAlignment", required: false }] }], thumbSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbSize", required: false }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }], valueChangedEnd: [{ type: i0.Output, args: ["valueChangedEnd"] }], focusChanged: [{ type: i0.Output, args: ["focusChanged"] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderThumbIndicatorDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    sliderThumbContext = useSliderThumbContext();
+    onDestroy = useOnDestroy();
+    value = computed(() => this.sliderContext().getThumbValue(this.sliderThumbContext().index), ...(ngDevMode ? [{ debugName: "value" }] : []));
+    trackBindings = useTrackBindings(() => this.sliderContext().getThumbIndicatorBindings({
+        id: this.hostId(),
+        index: this.sliderThumbContext().index,
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderThumbIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderThumbIndicatorDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderThumbIndicatorDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderThumbDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    /**
+     * The slider thumb's index.
+     */
+    index = input.required(...(ngDevMode ? [{ debugName: "index" }] : []));
+    /**
+     * The name associated with the slider thumb's input (when used in a form).
+     */
+    name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
+    sliderThumbContextService = inject(SliderThumbContextService);
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getThumbBindings({
+        id: this.hostId(),
+        index: this.index(),
+        name: this.name(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.sliderThumbContextService.init(computed(() => ({
+            index: this.index(),
+            name: this.name(),
+        })));
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderThumbDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderThumbDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderThumbDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderTrackDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getTrackBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderTrackDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderTrackDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderTrackDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class CoreSliderValueTextDirective {
+    /**
+     * {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    sliderContext = useSliderContext();
+    onDestroy = useOnDestroy();
+    trackBindings = useTrackBindings(() => this.sliderContext().getValueTextBindings({
+        id: this.hostId(),
+        onDestroy: this.onDestroy,
+    }));
+    ngOnInit() {
+        this.trackBindings();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderValueTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: CoreSliderValueTextDirective, isStandalone: true, inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CoreSliderValueTextDirective, decorators: [{
+            type: Directive
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CoreSliderControlDirective, CoreSliderErrorTextDirective, CoreSliderHiddenInputDirective, CoreSliderHintDirective, CoreSliderLabelDirective, CoreSliderMarkerDirective, CoreSliderMarkerGroupDirective, CoreSliderMaxDirective, CoreSliderMinDirective, CoreSliderRangeDirective, CoreSliderRootDirective, CoreSliderThumbDirective, CoreSliderThumbIndicatorDirective, CoreSliderTrackDirective, CoreSliderValueTextDirective, SLIDER_CONTEXT, SLIDER_THUMB_CONTEXT, SliderContextService, SliderThumbContextService, provideSliderContext, provideSliderThumbContext, useSliderContext, useSliderThumbContext };
+//# sourceMappingURL=qualcomm-ui-angular-core-slider.mjs.map