@qualcomm-ui/angular-core 1.0.1 → 1.0.3

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

@@ -0,0 +1,1186 @@
+import * as i0 from '@angular/core';
+import { signal, Injectable, InjectionToken, inject, TemplateRef, ViewContainerRef, Injector, effect, Directive, computed, input, ElementRef, Renderer2, runInInjectionContext, RendererStyleFlags2, afterRenderEffect, untracked, isSignal } from '@angular/core';
+import { isFunction, isString, isNumber, isObject, ensure } from '@qualcomm-ui/utils/guard';
+import { clsx } from '@qualcomm-ui/utils/clsx';
+import { callAll } from '@qualcomm-ui/utils/functions';
+import { isEqual } from '@qualcomm-ui/utils/equal';
+import { normalizeAriaAttr } from '@qualcomm-ui/utils/attributes';
+import { createPropNormalizer, MachineStatus, INIT_STATE } from '@qualcomm-ui/utils/machine';
+import { createScope } from '@qualcomm-ui/dom/query';
+import { toArray } from '@qualcomm-ui/utils/array';
+import { compact } from '@qualcomm-ui/utils/object';
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * Manages the API context for a service.
+ *
+ * Provides a way to initialize and access an API signal, ensuring that it is only
+ * set once. Attempting to reinitialize or access an uninitialized API will result
+ * in errors.
+ *
+ * @template T - The type of the data returned by the API.
+ */
+class BaseApiContextService {
+    initialized = signal(false, ...(ngDevMode ? [{ debugName: "initialized" }] : []));
+    get context() {
+        if (!this._context) {
+            throw new Error("context not initialized");
+        }
+        return this._context;
+    }
+    _context;
+    init(computedApi) {
+        if (this._context) {
+            throw new Error("context already initialized");
+        }
+        this._context = computedApi;
+        this.initialized.set(true);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: BaseApiContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: BaseApiContextService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: BaseApiContextService, decorators: [{
+            type: Injectable
+        }] });
+function createApiContext(name, service, initialValue) {
+    const token = new InjectionToken(name);
+    function useContext(opts = {}) {
+        return inject(token, opts);
+    }
+    function getProviders() {
+        return [
+            service,
+            {
+                deps: [service],
+                provide: token,
+                useFactory: (context) => {
+                    if (!context.initialized() && initialValue !== undefined) {
+                        context.init(signal(initialValue));
+                    }
+                    return () => context.context();
+                },
+            },
+        ];
+    }
+    return [token, useContext, getProviders];
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * Base directive for creating context-aware directives that render content
+ * only when an API context is available.
+ *
+ * This abstract class provides the core functionality to:
+ * 1. Check if a required API context service is available
+ * 2. Render the associated template only when the API instance is accessible
+ * 3. Provide the API instance to the template as a typed value
+ */
+class ApiContextDirective {
+    templateRef = inject(TemplateRef);
+    viewContainerRef = inject(ViewContainerRef);
+    injector = inject(Injector);
+    constructor(
+    // eslint-disable-next-line @angular-eslint/prefer-inject
+    contextService, contextName) {
+        if (!contextService) {
+            console.warn(`${contextName} used without a parent context. Template will not render.`);
+            return;
+        }
+        effect(() => {
+            this.viewContainerRef.clear();
+            const apiInstance = contextService.context();
+            if (apiInstance) {
+                this.viewContainerRef.createEmbeddedView(this.templateRef, {
+                    $implicit: apiInstance,
+                    [contextName]: apiInstance,
+                });
+            }
+        }, { injector: this.injector });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: ApiContextDirective, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: ApiContextDirective, isStandalone: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: ApiContextDirective, decorators: [{
+            type: Directive
+        }], ctorParameters: () => [{ type: BaseApiContextService }, { type: undefined }] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function bindableIdCollection() {
+    const collection = signal({}, ...(ngDevMode ? [{ debugName: "collection" }] : []));
+    return {
+        get(itemKey) {
+            return collection()[itemKey];
+        },
+        getAll() {
+            const result = {};
+            const current = collection();
+            for (const key in current) {
+                result[key] = current[key];
+            }
+            return result;
+        },
+        keys() {
+            return Object.keys(collection());
+        },
+        register(itemKey, value, onDestroy) {
+            const current = collection();
+            if (current[itemKey] === value) {
+                return;
+            }
+            if (onDestroy) {
+                onDestroy(() => {
+                    const currentState = collection();
+                    const { [itemKey]: _removed, ...rest } = currentState;
+                    collection.set(rest);
+                });
+            }
+            collection.update((prevState) => ({
+                ...prevState,
+                [itemKey]: value,
+            }));
+        },
+        remove(itemKey) {
+            const current = collection();
+            const { [itemKey]: _removed, ...rest } = current;
+            collection.set(rest);
+        },
+        set(itemKey, value) {
+            collection.update((prev) => ({
+                ...prev,
+                [itemKey]: value,
+            }));
+        },
+    };
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function bindableId(initialValue) {
+    // this value won't trigger change detection, but signals do
+    let cachedValue = initialValue;
+    const value = signal(initialValue, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    return {
+        get() {
+            return value();
+        },
+        set(v) {
+            if (cachedValue === v) {
+                return;
+            }
+            cachedValue = v;
+            value.set(v);
+        },
+    };
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function bindable(props) {
+    const initial = props().value ?? props().defaultValue;
+    const eq = props().isEqual ?? Object.is;
+    const value = signal(initial, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    const controlled = computed(() => props().value !== undefined, ...(ngDevMode ? [{ debugName: "controlled" }] : []));
+    const valueRef = computed(() => (controlled() ? props().value : value()), ...(ngDevMode ? [{ debugName: "valueRef" }] : []));
+    return {
+        get() {
+            return valueRef();
+        },
+        hash(value) {
+            return props().hash?.(value) ?? String(value);
+        },
+        initial,
+        invoke(nextValue, prevValue) {
+            props().onChange?.(nextValue, null, prevValue);
+        },
+        ref: valueRef,
+        set(v, event) {
+            const prev = valueRef();
+            const next = isFunction(v) ? v(prev) : v;
+            if (!controlled()) {
+                value.set(next);
+            }
+            if (!eq(next, prev)) {
+                props().onChange?.(next, event, prev);
+            }
+        },
+    };
+}
+bindable.cleanup = (fn) => {
+    effect((onCleanup) => onCleanup(fn));
+};
+bindable.ref = (defaultValue) => {
+    let value = defaultValue;
+    return {
+        get: () => value,
+        set: (next) => {
+            value = next;
+        },
+    };
+};
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+const CSS_REGEX = /((?:--)?(?:\w+-?)+)\s*:\s*([^;]*)/g;
+/**
+ * Converts a CSS text fragment (`"color:red; width:10px"`)
+ * into a `{color:'red', width:'10px'}` object.
+ */
+function parseCssText(style) {
+    const out = {};
+    let match;
+    while ((match = CSS_REGEX.exec(style))) {
+        out[match[1]] = match[2];
+    }
+    return out;
+}
+function mergeStyle(a, b) {
+    if (typeof a === "string") {
+        if (typeof b === "string") {
+            return `${a};${b}`;
+        }
+        a = parseCssText(a);
+    }
+    else if (typeof b === "string") {
+        b = parseCssText(b);
+    }
+    return { ...(a ?? {}), ...(b ?? {}) };
+}
+/**
+ * Angular-friendly version of `mergeProps`.
+ *
+ * - Handlers (`on*`) are composed with `callAll`.
+ * - `class` / `className` values are merged via `clsx`.
+ * - `style` strings or objects are merged and normalised.
+ */
+function mergeProps(...sources) {
+    const result = {};
+    for (const current of sources) {
+        if (!current) {
+            continue;
+        }
+        for (const key in current) {
+            const prev = result[key];
+            const next = current[key];
+            if (prev !== undefined) {
+                if (key.startsWith("on") &&
+                    typeof prev === "function" &&
+                    typeof next === "function") {
+                    result[key] = callAll(prev, next);
+                    continue;
+                }
+                if (key === "class" || key === "className") {
+                    result[key] = clsx(prev, next);
+                    continue;
+                }
+                if (key === "style") {
+                    result[key] = mergeStyle(prev, next);
+                    continue;
+                }
+            }
+            result[key] = next;
+        }
+    }
+    // Adapt the merged object to Angular-friendly prop names.
+    return result;
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * A directive similar to Vue's `v-bind` that spreads an object's properties onto
+ * the host element. For the best performance, use a stable reference to a signal
+ * instead of an object literal in the template. Converts callbacks from `on*`
+ * syntax to their corresponding Angular event callbacks. Does not account for
+ * input/output properties due to Angular limitations.
+ *
+ * @example
+ * <!-- bad: new object every time -->
+ * <div [q-bind]="{class: 'a', onClick: click}"></div>
+ *
+ * <!-- good: stable reference -->
+ * <div [q-bind]="buttonProps"></div>
+ */
+class QBindDirective {
+    bind = input.required(...(ngDevMode ? [{ debugName: "bind", alias: "q-bind" }] : [{ alias: "q-bind" }]));
+    bindOptions = input({}, ...(ngDevMode ? [{ debugName: "bindOptions", alias: "q-bind-options" }] : [{ alias: "q-bind-options" }]));
+    elementRef = inject((ElementRef));
+    renderer = inject(Renderer2);
+    injector = inject(Injector);
+    listeners = new Map();
+    prev = {};
+    omittedProps = computed(() => {
+        const opts = this.bindOptions();
+        return new Set(Array.from(opts.omittedProps || []));
+    }, ...(ngDevMode ? [{ debugName: "omittedProps" }] : []));
+    constructor() {
+        runInInjectionContext(this.injector, () => {
+            effect(() => {
+                const next = this.bind();
+                if (!isEqual(next, this.prev)) {
+                    this.handleAttrs(this.prev, next || {});
+                    this.prev = { ...next };
+                }
+            });
+        });
+    }
+    ngOnDestroy() {
+        this.listeners.forEach((unlisten) => unlisten());
+        this.listeners.clear();
+    }
+    removeClass(names) {
+        if (!names) {
+            return;
+        }
+        const el = this.elementRef.nativeElement;
+        for (const name of names.split(",")) {
+            this.renderer.removeClass(el, name);
+        }
+    }
+    addClass(names) {
+        const el = this.elementRef.nativeElement;
+        for (const className of names.split(" ")) {
+            for (const name of className.split(",")) {
+                this.renderer.addClass(el, name);
+            }
+        }
+    }
+    removeStyle(style) {
+        if (!style) {
+            return;
+        }
+        const el = this.elementRef.nativeElement;
+        for (const name of Object.keys(style)) {
+            this.renderer.removeStyle(el, name, RendererStyleFlags2.DashCase);
+        }
+    }
+    addStyle(style) {
+        const el = this.elementRef.nativeElement;
+        for (const [name, value] of Object.entries(style)) {
+            this.renderer.setStyle(el, name, value, RendererStyleFlags2.DashCase);
+        }
+    }
+    addEventListener(name, callback) {
+        const eventName = name.substring(2);
+        this.listeners.get(name)?.();
+        const unlisten = this.renderer.listen(this.elementRef.nativeElement, eventName, callback);
+        this.listeners.set(name, unlisten);
+    }
+    handleAttrs(prevProps, nextProps) {
+        const el = this.elementRef.nativeElement;
+        for (const [name, value] of Object.entries(prevProps)) {
+            if (name in nextProps || this.omittedProps().has(name)) {
+                continue;
+            }
+            if (name.startsWith("on")) {
+                this.listeners.get(name)?.();
+                this.listeners.delete(name);
+                continue;
+            }
+            switch (name) {
+                case "class":
+                    this.removeClass(value);
+                    continue;
+                case "style":
+                    this.removeStyle(value);
+                    continue;
+                case "value":
+                    this.renderer.setProperty(el, "value", undefined);
+                    continue;
+                case "textContent":
+                    this.renderer.setProperty(el, "textContent", "");
+                    continue;
+                case "checked":
+                    this.renderer.setProperty(el, "checked", false);
+                    continue;
+            }
+            this.renderer.removeAttribute(el, name);
+        }
+        for (const [name, value] of Object.entries(nextProps)) {
+            if (name in prevProps && isEqual(value, prevProps[name])) {
+                continue;
+            }
+            if (name.startsWith("on")) {
+                const prevHandler = prevProps[name];
+                if (isEqual(prevHandler, value)) {
+                    continue;
+                }
+                this.addEventListener(name, value);
+                continue;
+            }
+            switch (name) {
+                case "class":
+                    this.removeClass(prevProps[name]);
+                    this.addClass(value);
+                    continue;
+                case "style":
+                    this.removeStyle(prevProps[name]);
+                    this.addStyle(value);
+                    continue;
+                case "value":
+                case "checked":
+                case "textContent":
+                    this.renderer.setProperty(el, name, value);
+                    continue;
+            }
+            if (isString(value) || isNumber(value)) {
+                this.renderer.setAttribute(el, name, `${value}`);
+                continue;
+            }
+            if (value === true) {
+                this.renderer.setAttribute(el, name, "");
+            }
+            else {
+                this.renderer.removeAttribute(el, name);
+            }
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: QBindDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: QBindDirective, isStandalone: true, selector: "[q-bind]", inputs: { bind: { classPropertyName: "bind", publicName: "q-bind", isSignal: true, isRequired: true, transformFunction: null }, bindOptions: { classPropertyName: "bindOptions", publicName: "q-bind-options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: QBindDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-bind]",
+                }]
+        }], ctorParameters: () => [], propDecorators: { bind: [{ type: i0.Input, args: [{ isSignal: true, alias: "q-bind", required: true }] }], bindOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "q-bind-options", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+const propMap = {
+    className: "class",
+    defaultChecked: "checked",
+    defaultValue: "value",
+    htmlFor: "for",
+    onBlur: "onfocusout",
+    onChange: "oninput",
+    onDoubleClick: "ondblclick",
+    onFocus: "onfocusin",
+    readOnly: "readonly",
+};
+const preserveKeys = new Set([
+    "viewBox",
+    "className",
+    "preserveAspectRatio",
+    "fillRule",
+    "clipPath",
+    "clipRule",
+]);
+const transformers = {
+    "aria-hidden": normalizeAriaAttr,
+};
+const normalizeProps = createPropNormalizer((props) => {
+    const normalized = {};
+    for (const [key, value] of Object.entries(props)) {
+        if (key === "style") {
+            if (isString(value)) {
+                normalized["style"] = serializeStyle(value);
+            }
+            else if (isObject(value)) {
+                normalized["style"] = hyphenateStyle(value);
+            }
+            continue;
+        }
+        if (key === "className") {
+            if (isString(value)) {
+                normalized["class"] = value;
+            }
+            else {
+                normalized["class"] = clsx(value);
+            }
+            continue;
+        }
+        if (key === "children") {
+            if (isString(value)) {
+                normalized["textContent"] = value;
+            }
+            continue;
+        }
+        if (key in transformers) {
+            normalized[key] = transformers[key](value);
+            continue;
+        }
+        normalized[toAngularProp(key)] = value;
+    }
+    return normalized;
+});
+const STYLE_REGEX = /((?:--)?(?:\w+-?)+)\s*:\s*([^;]*)/g;
+function serializeStyle(style) {
+    const res = {};
+    let match;
+    while ((match = STYLE_REGEX.exec(style))) {
+        res[match[1]] = match[2];
+    }
+    return res;
+}
+function hyphenateStyle(style) {
+    const res = {};
+    for (const [property, value] of Object.entries(style)) {
+        if (value === null || value === undefined) {
+            continue;
+        }
+        res[hyphenateStyleName(property)] = value;
+    }
+    return res;
+}
+const cache = new Map();
+const uppercasePattern = /[A-Z]/g;
+const msPattern = /^ms-/;
+function hyphenateStyleName(name) {
+    if (name.startsWith("--")) {
+        return name;
+    }
+    if (cache.has(name)) {
+        return cache.get(name);
+    }
+    const hName = name.replace(uppercasePattern, toHyphenLower);
+    return cache.set(name, msPattern.test(hName) ? `-${hName}` : hName).get(name);
+}
+function toHyphenLower(match) {
+    return `-${match.toLowerCase()}`;
+}
+function toAngularProp(prop) {
+    if (prop in propMap) {
+        return propMap[prop];
+    }
+    if (preserveKeys.has(prop)) {
+        return prop;
+    }
+    return prop.toLowerCase();
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function createRefs(refs) {
+    const ref = signal(refs, ...(ngDevMode ? [{ debugName: "ref" }] : []));
+    return {
+        get(key) {
+            return ref()[key];
+        },
+        set(key, value) {
+            ref.update((prev) => ({
+                ...prev,
+                [key]: value,
+            }));
+        },
+    };
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function access$1(value) {
+    return isFunction(value) ? value() : value;
+}
+function useTrack(injector) {
+    return (deps, _effect) => {
+        let prevDeps = [];
+        let isInitialized = false;
+        let isMounted = false;
+        runInInjectionContext(injector, () => {
+            // Separate effect to track mount state
+            effect(() => {
+                queueMicrotask(() => {
+                    isMounted = true;
+                });
+            });
+            effect(() => {
+                const currentDeps = deps.map((d) => access$1(d));
+                if (!isInitialized) {
+                    prevDeps = currentDeps;
+                    isInitialized = true;
+                    return;
+                }
+                if (!isMounted) {
+                    return;
+                }
+                let changed = false;
+                for (let i = 0; i < deps.length; i++) {
+                    if (!isEqual(prevDeps[i], currentDeps[i])) {
+                        changed = true;
+                        break;
+                    }
+                }
+                if (changed) {
+                    prevDeps = currentDeps;
+                    _effect();
+                }
+            });
+        });
+    };
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+function useMachine(config, userProps = {}, injector, opts = {}) {
+    const debug = (...args) => {
+        if (opts.debug) {
+            console.debug(...args);
+        }
+    };
+    const scope = computed(() => {
+        const { getRootNode, id } = access(userProps);
+        return createScope({ getRootNode, id });
+    });
+    const configIds = config.ids?.({
+        bindableId,
+        bindableIdCollection: () => bindableIdCollection(),
+    });
+    const ids = {
+        collection(key) {
+            return configIds?.[key];
+        },
+        get(key) {
+            return configIds?.[key]?.get?.();
+        },
+        register(key, valueOrParams, onDestroy) {
+            if (typeof valueOrParams === "object" &&
+                valueOrParams !== null &&
+                "id" in valueOrParams) {
+                const params = valueOrParams;
+                configIds?.[key].set?.(params.id);
+                params.onDestroy?.(() => configIds?.[key].set?.(undefined));
+            }
+            else {
+                configIds?.[key].set?.(valueOrParams);
+                onDestroy?.(() => configIds?.[key].set?.(undefined));
+            }
+        },
+        set(key, value) {
+            configIds?.[key].set?.(value);
+        },
+    };
+    const props = computed(() => config.props?.({
+        props: compact(access(userProps)),
+        scope: { ...scope(), ids },
+    }) ?? access(userProps));
+    const prop = useProp(props);
+    let previousEventRef = null;
+    let eventRef = { type: "" };
+    const getEvent = () => ({
+        ...eventRef,
+        current() {
+            return eventRef;
+        },
+        previous() {
+            return previousEventRef;
+        },
+    });
+    const context = {
+        get(key) {
+            return configContext[key]?.get();
+        },
+        hash(key) {
+            const current = configContext?.[key].get();
+            return configContext?.[key].hash(current);
+        },
+        initial(key) {
+            return configContext?.[key].initial;
+        },
+        set(key, value, ...details) {
+            configContext?.[key].set(value, ...details);
+        },
+    };
+    const refs = createRefs(config.refs?.({ context, prop }) ?? {});
+    const configContext = config.context?.({
+        bindable,
+        flush,
+        getComputed() {
+            return computed$1;
+        },
+        getContext() {
+            return context;
+        },
+        getEvent() {
+            return getEvent();
+        },
+        getRefs() {
+            return refs;
+        },
+        prop,
+        get scope() {
+            return { ...scope(), ids };
+        },
+    });
+    const computed$1 = (key) => {
+        ensure(config.computed, () => `No computed object found on machine`);
+        const fn = config.computed[key];
+        return fn({
+            computed: computed$1,
+            context,
+            prop,
+            refs,
+            get scope() {
+                return { ...scope(), ids };
+            },
+        });
+    };
+    // Create the actions object with direct property access
+    const actions = {};
+    if (config.actions) {
+        for (const key of Object.keys(config.actions)) {
+            const actionFn = config.actions[key];
+            actions[key] = () => {
+                return actionFn(getParams());
+            };
+        }
+    }
+    let effectsRef = new Map();
+    let transitionRef = null;
+    const action = (keys) => {
+        if (!keys) {
+            return;
+        }
+        const strs = isFunction(keys) ? keys(getParams()) : keys;
+        if (!strs) {
+            return;
+        }
+        for (const key of strs) {
+            const fn = config.actions?.[key];
+            if (fn) {
+                fn(getParams());
+            }
+        }
+    };
+    const guard = (guard) => {
+        if (isFunction(guard)) {
+            return guard(getParams());
+        }
+        return config.guards?.[guard](getParams());
+    };
+    const choose = (transitions) => {
+        return toArray(transitions).find((t) => {
+            let result = !t.guard;
+            if (isString(t.guard)) {
+                result = !!guard(t.guard);
+            }
+            else if (isFunction(t.guard)) {
+                result = t.guard(getParams());
+            }
+            return result;
+        });
+    };
+    const effect = (keys) => {
+        if (!keys) {
+            return undefined;
+        }
+        const fns = keys.map((s) => {
+            return config.effects?.[s];
+        });
+        const cleanups = [];
+        for (const fn of fns) {
+            const cleanup = fn?.(getParams());
+            if (cleanup) {
+                cleanups.push(cleanup);
+            }
+        }
+        return () => cleanups.forEach((fn) => fn?.());
+    };
+    const state = bindable(() => ({
+        defaultValue: config.initialState({ prop }),
+        name: "state",
+        onChange: (nextState, details, prevState) => {
+            // compute effects: exit -> transition -> enter
+            // exit effects
+            if (prevState) {
+                const exitEffects = effectsRef.get(prevState);
+                exitEffects?.();
+                effectsRef.delete(prevState);
+            }
+            // exit actions
+            if (prevState) {
+                action(config.states[prevState]?.exit);
+            }
+            // transition actions
+            action(transitionRef?.actions);
+            // enter effect
+            const cleanup = effect(config.states[nextState]?.effects);
+            if (cleanup) {
+                effectsRef.set(nextState, cleanup);
+            }
+            // root entry actions
+            if (prevState === "__init__") {
+                action(config.onInit?.actions);
+                const cleanup = effect(config.onInit?.effects ?? []);
+                if (cleanup) {
+                    effectsRef.set("__init__", cleanup);
+                }
+            }
+            // enter actions
+            action(config.states[nextState]?.entry);
+        },
+    }));
+    const getState = () => ({
+        ...state,
+        hasTag(tag) {
+            return !!config.states[state.get()]?.tags?.includes(tag);
+        },
+        matches(...values) {
+            return values.includes(state.get());
+        },
+    });
+    const send = (event) => {
+        queueMicrotask(() => {
+            previousEventRef = { ...eventRef };
+            eventRef = { ...event };
+            const currentState = state.get();
+            debug("send", { currentState, event });
+            const transitions = config.states[currentState]?.on?.[event.type] ?? config.on?.[event.type];
+            const transition = choose(transitions);
+            if (!transition) {
+                return;
+            }
+            // save current transition
+            transitionRef = transition;
+            const target = transition.target ?? currentState;
+            const changed = target !== currentState;
+            debug("transition", transition);
+            if (changed) {
+                state.set(target);
+            }
+            else if (transition.reenter && !changed) {
+                // reenter will re-invoke the current state
+                state.invoke(currentState, currentState);
+            }
+            else {
+                // call transition actions
+                action(transition.actions ?? []);
+            }
+        });
+    };
+    const getParams = () => ({
+        action,
+        actions,
+        choose,
+        computed: computed$1,
+        context,
+        event: getEvent(),
+        flush,
+        guard,
+        prop,
+        refs,
+        get scope() {
+            return { ...scope(), ids };
+        },
+        send: send,
+        state: getState(),
+        track: useTrack(injector),
+    });
+    config.watch?.(getParams());
+    let status = MachineStatus.NOT_STARTED;
+    runInInjectionContext(injector, () => {
+        afterRenderEffect((onCleanup) => {
+            const started = status === MachineStatus.STARTED;
+            status = MachineStatus.STARTED;
+            debug(started ? "rehydrating..." : "initializing...");
+            untracked(() => state.invoke(state.initial, INIT_STATE));
+            onCleanup(() => {
+                debug("unmounting...");
+                status = MachineStatus.STOPPED;
+                effectsRef.forEach((fn) => fn());
+                effectsRef = new Map();
+                transitionRef = null;
+                action(config.onDestroy?.actions);
+            });
+        });
+    });
+    return {
+        computed: computed$1,
+        context,
+        event: getEvent(),
+        prop,
+        refs,
+        get scope() {
+            return { ...scope(), ids };
+        },
+        send: send,
+        state: getState(),
+    };
+}
+function flush(fn) {
+    queueMicrotask(() => {
+        fn();
+    });
+}
+function access(value) {
+    return isSignal(value) ? value() : value;
+}
+function useProp(value) {
+    return function get(key) {
+        return value()[key];
+    };
+}
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * Creates a reactive property binding system that dynamically applies computed
+ * properties to a host element. This function sets up an effect that watches for
+ * changes in the provided property getter and efficiently updates the DOM element
+ * accordingly.
+ *
+ * @param propGetter - A function that returns a dictionary of properties to bind to the element.
+ *   Supports attributes, CSS classes, styles, event listeners, and DOM properties.
+ *
+ * @returns An initialization function that starts the reactive binding process
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   selector: 'my-component',
+ *   template: '<div>Content</div>'
+ * })
+ * export class MyComponent {
+ *   protected readonly isExpanded = signal(false)
+ *
+ *   private readonly trackBindings = useTrackBindings(() => ({
+ *     class: 'active component',
+ *     'aria-expanded': this.isExpanded(),
+ *   }))
+ *
+ *   ngOnInit() {
+ *     // Start the reactive binding
+ *     this.trackBindings()
+ *   }
+ * }
+ * ```
+ */
+function useTrackBindings(propGetter) {
+    let shouldDebug;
+    let disabled = false;
+    const additionalPropGetters = [];
+    const debug = (...args) => {
+        if (shouldDebug) {
+            console.debug(...args);
+        }
+    };
+    let elementRef = inject((ElementRef));
+    const renderer = inject(Renderer2);
+    const listeners = new Map();
+    const injector = inject(Injector);
+    let prev = {};
+    function removeClass(names) {
+        if (!names) {
+            return;
+        }
+        const el = elementRef.nativeElement;
+        for (const name of names.split(",")) {
+            renderer.removeClass(el, name);
+        }
+    }
+    function addClass(names) {
+        const el = elementRef.nativeElement;
+        for (const name of names.split(",")) {
+            for (const className of name.split(" ")) {
+                renderer.addClass(el, className);
+            }
+        }
+    }
+    function removeStyle(style) {
+        if (!style) {
+            return;
+        }
+        const el = elementRef.nativeElement;
+        for (const name of Object.keys(style)) {
+            renderer.removeStyle(el, name, RendererStyleFlags2.DashCase);
+        }
+    }
+    function addStyle(style) {
+        const el = elementRef.nativeElement;
+        for (const [name, value] of Object.entries(style)) {
+            renderer.setStyle(el, name, value, RendererStyleFlags2.DashCase);
+        }
+    }
+    function addEventListener(name, callback) {
+        const eventName = name.substring(2);
+        debug(`Binding event: ${name} -> ${eventName}`);
+        listeners.get(name)?.();
+        const unlisten = renderer.listen(elementRef.nativeElement, name.substring(2), callback);
+        listeners.set(name, unlisten);
+    }
+    function handleAttrs(prevProps, nextProps) {
+        const el = elementRef.nativeElement;
+        for (const [name, value] of Object.entries(prevProps)) {
+            if (name in nextProps) {
+                continue;
+            }
+            if (name.startsWith("on")) {
+                listeners.get(name)?.();
+                listeners.delete(name); // Ensure cleanup
+                continue;
+            }
+            switch (name) {
+                case "class":
+                    removeClass(value);
+                    continue;
+                case "style":
+                    removeStyle(value);
+                    continue;
+                case "value":
+                    renderer.setProperty(el, "value", undefined);
+                    continue;
+                case "textContent":
+                    renderer.setProperty(el, "textContent", "");
+                    continue;
+                case "checked":
+                    renderer.setProperty(el, "checked", false);
+                    continue;
+            }
+            renderer.removeAttribute(el, name);
+        }
+        for (const [name, value] of Object.entries(nextProps)) {
+            if (name in prevProps && isEqual(value, prevProps[name])) {
+                continue;
+            }
+            if (name.startsWith("on")) {
+                const prevHandler = prevProps[name];
+                // Skip if it's the exact same function reference
+                if (isEqual(prevHandler, value)) {
+                    continue;
+                }
+                addEventListener(name, value);
+                continue;
+            }
+            switch (name) {
+                case "class":
+                    removeClass(prevProps[name]);
+                    addClass(value);
+                    continue;
+                case "style":
+                    removeStyle(prevProps[name]);
+                    addStyle(value);
+                    continue;
+                case "value":
+                case "checked":
+                case "textContent":
+                    renderer.setAttribute(el, name, `${value}`);
+                    renderer.setProperty(el, name, value);
+                    continue;
+            }
+            if (isString(value) || isNumber(value)) {
+                renderer.setAttribute(el, name, `${value}`);
+                continue;
+            }
+            if (value === true) {
+                renderer.setAttribute(el, name, "");
+            }
+            else {
+                renderer.removeAttribute(el, name);
+            }
+        }
+    }
+    const initialized = signal(false, ...(ngDevMode ? [{ debugName: "initialized" }] : []));
+    function getNextBindings() {
+        if (!additionalPropGetters.length) {
+            return propGetter();
+        }
+        return additionalPropGetters.reduce((acc, current) => {
+            return mergeProps(acc, current());
+        }, propGetter());
+    }
+    runInInjectionContext(injector, () => {
+        effect(() => {
+            // only start running the effect after the implementing component initializes.
+            // This is used to prevent the binding operation from starting before the
+            // parent machine has fully initialized.
+            if (initialized()) {
+                const next = getNextBindings();
+                if (!isEqual(next, prev)) {
+                    handleAttrs(prev, next);
+                    prev = { ...next };
+                }
+            }
+        });
+    });
+    const initFn = function (opts = {}) {
+        if (opts.disabled || disabled) {
+            return;
+        }
+        shouldDebug = opts.debug;
+        if (opts.elementRef) {
+            elementRef = isFunction(opts.elementRef)
+                ? opts.elementRef()
+                : opts.elementRef;
+        }
+        if (opts.extraBindings) {
+            additionalPropGetters.push(opts.extraBindings);
+        }
+        initialized.set(true);
+    };
+    initFn.extendWith = (extraProps) => {
+        additionalPropGetters.push(extraProps);
+    };
+    initFn.setDisabled = (isDisabled) => {
+        disabled = isDisabled;
+    };
+    return initFn;
+}
+function applyBindings(el, props, renderer) {
+    function removeClass(names) {
+        if (!names) {
+            return;
+        }
+        for (const name of names.split(",")) {
+            renderer.removeClass(el, name);
+        }
+    }
+    function addClass(names) {
+        for (const name of names.split(",")) {
+            for (const className of name.split(" ")) {
+                renderer.addClass(el, className);
+            }
+        }
+    }
+    function removeStyle(style) {
+        if (!style) {
+            return;
+        }
+        for (const name of Object.keys(style)) {
+            renderer.removeStyle(el, name, RendererStyleFlags2.DashCase);
+        }
+    }
+    function addStyle(style) {
+        for (const [name, value] of Object.entries(style)) {
+            renderer.setStyle(el, name, value, RendererStyleFlags2.DashCase);
+        }
+    }
+    for (const [name, value] of Object.entries(props)) {
+        if (name.startsWith("on")) {
+            // skip event listeners
+        }
+        switch (name) {
+            case "class":
+                removeClass(value);
+                addClass(value);
+                continue;
+            case "style":
+                removeStyle(value);
+                addStyle(value);
+                continue;
+            case "value":
+            case "checked":
+            case "textContent":
+                renderer.setAttribute(el, name, `${value}`);
+                renderer.setProperty(el, name, value);
+                continue;
+        }
+        if (isString(value) || isNumber(value)) {
+            renderer.setAttribute(el, name, `${value}`);
+            continue;
+        }
+        if (value === true) {
+            renderer.setAttribute(el, name, "");
+        }
+        else {
+            renderer.removeAttribute(el, name);
+        }
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ApiContextDirective, BaseApiContextService, QBindDirective, applyBindings, bindable, bindableId, bindableIdCollection, createApiContext, createRefs, mergeProps, normalizeProps, useMachine, useTrack, useTrackBindings };
+//# sourceMappingURL=qualcomm-ui-angular-core-machine.mjs.map