@cuby-ui/cdk 0.0.487 → 0.0.488

package/fesm2022/cuby-ui-cdk.mjs

@@ -0,0 +1,1644 @@
+import * as i0 from '@angular/core';
+import { QueryList, inject, ChangeDetectorRef, NgZone, InjectionToken, ElementRef, Directive, Output, Input, Injectable, Renderer2, signal, input, output, HostListener, EventEmitter, HostBinding, ViewContainerRef, TemplateRef, effect, Pipe } from '@angular/core';
+import { __decorate, __metadata } from 'tslib';
+import { NgControl, NgModel, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { pipe, switchMap, EMPTY, fromEvent, tap, Observable, asyncScheduler, BehaviorSubject, timer, map, startWith, share, merge, filter, takeUntil, repeat, withLatestFrom, of, take, distinctUntilChanged, skip, Subject, interval } from 'rxjs';
+import { DOCUMENT } from '@angular/common';
+import { ɵAnimationEngine as _AnimationEngine } from '@angular/animations/browser';
+import { toSignal } from '@angular/core/rxjs-interop';
+
+const rect = {
+    bottom: 0,
+    height: 0,
+    left: 0,
+    right: 0,
+    top: 0,
+    width: 0,
+    x: 0,
+    y: 0
+};
+/**
+ * For type safety when using @ContentChildren and @ViewChildren
+ *
+ * NOTE: Be careful subscribing to 'changes'
+ */
+const EMPTY_QUERY = new QueryList();
+const EMPTY_ARRAY = [];
+const EMPTY_FUNCTION = () => { };
+const EMPTY_CLIENT_RECT = {
+    ...rect,
+    toJSON: () => rect
+};
+
+/**
+ * Handler that always returns `false`.
+ */
+// eslint-disable-next-line no-restricted-syntax
+const CUI_FALSE_HANDLER = () => false;
+/**
+ * Handler that always returns `true`.
+ */
+// eslint-disable-next-line no-restricted-syntax
+const CUI_TRUE_HANDLER = () => true;
+
+const UnitsMetricWeight = [
+    { label: 'kilogram (kg)', abbreviation: 'kg', value: 'KILOGRAM' },
+    { label: 'gram', abbreviation: 'g', value: 'G' },
+    { label: 'ton', abbreviation: 'tn', value: 'TONNE' }
+];
+const UnitsImperialWeight = [
+    { label: 'ounce', abbreviation: 'oz', value: 'OZ' },
+    { label: 'pound', abbreviation: 'lb', value: 'POUND' },
+    { label: 'ton', abbreviation: 'tn', value: 'TON_US' }
+];
+const UnitsMetricLength = [
+    { label: 'meter', abbreviation: 'm', value: 'METER' },
+    { label: 'millimeter', abbreviation: 'mm', value: 'MILLI_METER' },
+    { label: 'centimeter', abbreviation: 'cm', value: 'CENTI_METER' }
+    // { label: 'kilometer', abbreviation: 'km', value: 'KILO_METER' },
+];
+const UnitsImperialLength = [
+    { label: 'foot', abbreviation: 'ft', value: 'FOOT' },
+    { label: 'inch', abbreviation: 'i', value: 'INCH' },
+    { label: 'yard', abbreviation: 'yd', value: 'YARD' }
+    // { label: 'mile', abbreviation: 'm', value: 'MILE' },
+];
+const UnitsMetricVolume = [
+    { label: 'litre', abbreviation: 'l', value: 'LITRE' },
+    { label: 'millilitre', abbreviation: 'ml', value: 'MILLI_LITRE' },
+    { label: 'cubic metre', abbreviation: 'm³', value: 'CUBIC_METRE' }
+];
+const UnitsImperialVolume = [
+    { label: 'gallon liquid', abbreviation: 'gl', value: 'GALLON_LIQUID' },
+    { label: 'gallon dry', abbreviation: 'gd', value: 'GALLON_DRY' },
+    { label: 'fluid ounce', abbreviation: 'fo', value: 'FLUID_OUNCE' },
+    { label: 'barrel', abbreviation: 'b', value: 'BARREL' },
+    { label: 'pint', abbreviation: 'p', value: 'PINT' }
+];
+const UnitsMetricSquare = [
+    { label: 'sq. meter', abbreviation: 'm²', value: 'SQUARE_METRE', initial: 'METER' },
+    { label: 'sq. millimeter', abbreviation: 'mm²', value: 'SQUARE_MILLI', initial: 'MILLI_METER' },
+    { label: 'sq. centimeter', abbreviation: 'cm²', value: 'SQUARE_CENTI', initial: 'CENTI_METER' }
+];
+const UnitsImperialSquare = [
+    { label: 'sq. foot', abbreviation: 'ft²', value: 'SQUARE_FOOT', initial: 'FOOT' },
+    { label: 'sq. inch', abbreviation: 'inch²', value: 'SQUARE_INCH', initial: 'INCH' },
+    { label: 'sq. yard', abbreviation: 'yard²', value: 'SQUARE_YARD', initial: 'YARD' }
+];
+const UnitsAmount = [{ label: 'pieces', value: 'PIECES', abbreviation: 'pcs' }];
+const UnitsMetric = {
+    ["LENGTH" /* Consumption.Length */]: UnitsMetricLength,
+    ["SQUARE" /* Consumption.Square */]: UnitsMetricSquare,
+    ["VOLUME" /* Consumption.Volume */]: UnitsMetricVolume,
+    ["WEIGHT" /* Consumption.Weight */]: UnitsMetricWeight,
+    ["AMOUNT" /* Consumption.Amount */]: UnitsAmount
+};
+const UnitsImperial = {
+    ["LENGTH" /* Consumption.Length */]: UnitsImperialLength,
+    ["SQUARE" /* Consumption.Square */]: UnitsImperialSquare,
+    ["VOLUME" /* Consumption.Volume */]: UnitsImperialVolume,
+    ["WEIGHT" /* Consumption.Weight */]: UnitsImperialWeight,
+    ["AMOUNT" /* Consumption.Amount */]: UnitsAmount
+};
+const SystemUnits = {
+    ["METRIC" /* UnitsSystem.Metric */]: UnitsMetric,
+    ["IMPERIAL" /* UnitsSystem.Imperial */]: UnitsImperial
+};
+
+const svgNodeFilter = {
+    acceptNode(node) {
+        return 'ownerSVGElement' in node ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT;
+    }
+};
+
+class CuiTime {
+    constructor(hours, minutes, seconds = 0, ms = 0) {
+        this.hours = hours;
+        this.minutes = minutes;
+        this.seconds = seconds;
+        this.ms = ms;
+    }
+    static fromString(time) {
+        const hours = this.parseHours(time);
+        const minutes = Number(time.slice(3, 5)) || 0;
+        const seconds = Number(time.slice(6, 8)) || 0;
+        const ms = Number(time.slice(9, 12)) || 0;
+        return new CuiTime(hours, minutes, seconds, ms);
+    }
+    static fromPT(time) {
+        let duration = time.trim().toUpperCase();
+        if (!duration.startsWith('P')) {
+            throw new Error('Invalid PT format: does not start with P');
+        }
+        duration = duration.substring(1);
+        if (duration.startsWith('T')) {
+            duration = duration.substring(1);
+        }
+        const regex = /(\d+(\.\d+)?)([HMS])/g;
+        let match;
+        let hours = 0, minutes = 0, seconds = 0, ms = 0;
+        while ((match = regex.exec(duration)) !== null) {
+            const value = parseFloat(match[1]);
+            const unit = match[3];
+            if (unit === 'H') {
+                hours = value;
+            }
+            else if (unit === 'M') {
+                minutes = value;
+            }
+            else if (unit === 'S') {
+                seconds = Math.floor(value);
+                ms = Math.round((value - seconds) * 1000);
+            }
+        }
+        return new CuiTime(hours, minutes, seconds, ms);
+    }
+    static parseHours(time) {
+        return Number(time.slice(0, 2));
+    }
+    toString(mode) {
+        const needAddMs = mode?.startsWith('HH:MM:SS.MSS') || (!mode && this.ms > 0);
+        const needAddSeconds = needAddMs || mode?.startsWith('HH:MM:SS') || (!mode && this.seconds > 0);
+        const hhMm = `${this.formatTime(this.hours)}:${this.formatTime(this.minutes)}`;
+        const ss = needAddSeconds ? `:${this.formatTime(this.seconds)}` : '';
+        const mss = needAddMs ? `.${this.formatTime(this.ms, 3)}` : '';
+        return `${hhMm}${ss}${mss}`;
+    }
+    toPT(mode) {
+        let duration = 'PT';
+        if (this.hours !== 0) {
+            duration += `${this.hours}H`;
+        }
+        if (this.minutes !== 0) {
+            duration += `${this.minutes}M`;
+        }
+        const totalSeconds = this.seconds + this.ms / 1000;
+        if (totalSeconds !== 0 || duration === 'PT') {
+            duration += `${parseFloat(totalSeconds.toFixed(3))}S`;
+        }
+        return duration;
+    }
+    formatTime(time, digits = 2) {
+        return String(time).padStart(digits, '0');
+    }
+}
+
+function cuiIfMap(project, predicate = Boolean) {
+    return pipe(switchMap((value) => (predicate(value) ? project(value) : EMPTY)));
+}
+
+function cuiTypedFromEvent(target, event, options = {}) {
+    /**
+     * @note:
+     * in RxJS 7 type signature `CuiTypedEventTarget<E>` !== `HasEventTargetAddRemove<E>`
+     */
+    return fromEvent(target, event, options);
+}
+
+function cuiWatch(cdr = inject(ChangeDetectorRef)) {
+    return tap(() => cdr.markForCheck());
+}
+
+function cuiZonefull(zone = inject(NgZone)) {
+    return (source) => new Observable((subscriber) => source.subscribe({
+        next: (value) => zone.run(() => subscriber.next(value)),
+        error: (error) => zone.run(() => subscriber.error(error)),
+        complete: () => zone.run(() => subscriber.complete())
+    }));
+}
+function cuiZonefree(zone = inject(NgZone)) {
+    return (source) => new Observable((subscriber) => zone.runOutsideAngular(() => source.subscribe(subscriber)));
+}
+function cuiZoneOptimized(zone = inject(NgZone)) {
+    return pipe(cuiZonefree(zone), cuiZonefull(zone));
+}
+class CuiZoneScheduler {
+    constructor(zoneConditionFn, scheduler = asyncScheduler) {
+        this.zoneConditionFn = zoneConditionFn;
+        this.scheduler = scheduler;
+    }
+    now() {
+        return this.scheduler.now();
+    }
+    schedule(...args) {
+        return this.zoneConditionFn(() => this.scheduler.schedule(...args));
+    }
+}
+function cuiZonefreeScheduler(zone = inject(NgZone), scheduler = asyncScheduler) {
+    return new CuiZoneScheduler(zone.runOutsideAngular.bind(zone), scheduler);
+}
+function cuiZonefullScheduler(zone = inject(NgZone), scheduler = asyncScheduler) {
+    return new CuiZoneScheduler(zone.run.bind(zone), scheduler);
+}
+
+function cuiCreateToken(defaults) {
+    return cuiCreateTokenFromFactory(() => defaults);
+}
+function cuiCreateTokenFromFactory(factory) {
+    return new InjectionToken('', { factory });
+}
+
+function cuiProvide(provide, useExisting, multi = false) {
+    return { provide, useExisting, multi };
+}
+
+const CUI_WINDOW = cuiCreateTokenFromFactory(() => {
+    const { defaultView } = inject(DOCUMENT);
+    if (!defaultView) {
+        throw new Error('Window is not available');
+    }
+    return defaultView;
+});
+
+function cuiContainsOrAfter(current, node) {
+    try {
+        return current.contains(node) || !!(node.compareDocumentPosition(current) & Node.DOCUMENT_POSITION_PRECEDING);
+    }
+    catch {
+        return false;
+    }
+}
+
+function cuiIsInput(element) {
+    return element.matches('input');
+}
+function cuiIsTextarea(element) {
+    return element.matches('textarea');
+}
+function cuiIsTextfield(element) {
+    return cuiIsInput(element) || cuiIsTextarea(element);
+}
+function cuiIsElement(node) {
+    return !!node && 'nodeType' in node && node.nodeType === Node.ELEMENT_NODE;
+}
+function cuiIsHTMLElement(node) {
+    const defaultView = node?.ownerDocument.defaultView;
+    return !!node && !!defaultView && node instanceof defaultView.HTMLElement;
+}
+function cuiIsTextNode(node) {
+    return node.nodeType === Node.TEXT_NODE;
+}
+
+/**
+ * Gets actual target from open Shadow DOM if event happened within it
+ */
+function cuiGetActualTarget(event) {
+    return event.composedPath()[0];
+}
+
+function cuiGetDocumentOrShadowRoot(node) {
+    return 'getRootNode' in node && node.isConnected
+        ? node.getRootNode()
+        : node.ownerDocument;
+}
+
+/**
+ * Clamps a value between two inclusive limits
+ *
+ * @param value
+ * @param min lower limit
+ * @param max upper limit
+ */
+function cuiClamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+
+function cuiMoveItemInArray(array, fromIndex, toIndex) {
+    const resultArray = [...array];
+    if (fromIndex === toIndex) {
+        return resultArray;
+    }
+    const [item] = resultArray.splice(fromIndex, 1);
+    resultArray.splice(toIndex, 0, item);
+    return resultArray;
+}
+
+function cuiArrayRemove(array, index) {
+    return array.slice(0, Math.max(index, 0)).concat(array.slice(Math.max(index + 1, 0)));
+}
+
+function cuiIsPresent(value) {
+    return value !== null && value !== undefined;
+}
+
+function decorateMethod(originalMethod) {
+    let previousArgs = [];
+    let originalFnWasCalledLeastAtOnce = false;
+    let pureValue;
+    return function cuiPureMethodPatched(...args) {
+        const isPure = originalFnWasCalledLeastAtOnce &&
+            previousArgs.length === args.length &&
+            args.every((arg, index) => arg === previousArgs[index]);
+        if (isPure) {
+            return pureValue;
+        }
+        previousArgs = args;
+        pureValue = originalMethod.apply(this, args);
+        originalFnWasCalledLeastAtOnce = true;
+        return pureValue;
+    };
+}
+function decorateGetter(originalGetter, propertyKey, enumerable = true) {
+    return function cuiPureGetterPatched() {
+        const value = originalGetter.call(this);
+        Object.defineProperty(this, propertyKey, { enumerable, value });
+        return value;
+    };
+}
+function cuiPure(target, propertyKeyOrContext, descriptor) {
+    if (typeof target === 'function') {
+        const context = propertyKeyOrContext;
+        if (context.kind === 'getter') {
+            return decorateGetter(target, context.name);
+        }
+        if (context.kind === 'method') {
+            return decorateMethod(target);
+        }
+        throw new CuiPureException();
+    }
+    const { get, enumerable, value } = descriptor;
+    const propertyKey = propertyKeyOrContext;
+    if (get) {
+        return {
+            configurable: true,
+            enumerable,
+            get: decorateGetter(get, propertyKey, enumerable)
+        };
+    }
+    if (typeof value !== 'function') {
+        throw new CuiPureException();
+    }
+    const original = value;
+    return {
+        configurable: true,
+        enumerable,
+        get() {
+            let previousArgs = [];
+            let originalFnWasCalledLeastAtOnce = false;
+            let pureValue;
+            const patched = (...args) => {
+                const isPure = originalFnWasCalledLeastAtOnce &&
+                    previousArgs.length === args.length &&
+                    args.every((arg, index) => arg === previousArgs[index]);
+                if (isPure) {
+                    return pureValue;
+                }
+                previousArgs = args;
+                pureValue = original.apply(this, args);
+                originalFnWasCalledLeastAtOnce = true;
+                return pureValue;
+            };
+            Object.defineProperty(this, propertyKey, {
+                configurable: true,
+                value: patched
+            });
+            return patched;
+        }
+    };
+}
+class CuiPureException extends Error {
+    constructor() {
+        super('cuiPure can only be used with functions or getters');
+    }
+}
+
+/**
+ * Adds 'px' to the number and turns it into a string
+ */
+function cuiPx(value) {
+    return `${value}px`;
+}
+
+/**
+ * Returns array of Elements covering edges of given element or null if at least one edge middle point is visible
+ *
+ * CAUTION: Empty array means element if offscreen i.e. covered by no elements, rather than not covered
+ * ```ts
+ * function cuiGetElementObscures(element: Element): readonly [Element, Element, Element, Element] | [] | null
+ * ```
+ */
+function cuiGetElementObscures(element) {
+    const { ownerDocument } = element;
+    if (!ownerDocument?.defaultView || !element.getBoundingClientRect) {
+        return null;
+    }
+    const { innerWidth, innerHeight } = ownerDocument.defaultView;
+    const doc = cuiGetDocumentOrShadowRoot(element);
+    const rect = element.getBoundingClientRect();
+    if (rect.width === 0 && rect.height === 0) {
+        return null;
+    }
+    const left = cuiClamp(Math.round(rect.left) + 2, 0, innerWidth);
+    const top = cuiClamp(Math.round(rect.top) + 2, 0, innerHeight);
+    const right = cuiClamp(Math.round(rect.right) - 2, 0, innerWidth);
+    const bottom = cuiClamp(Math.round(rect.bottom) - 2, 0, innerHeight);
+    const horizontalMiddle = cuiClamp(Math.round(rect.left + rect.width / 2), 0, innerWidth);
+    const verticalMiddle = cuiClamp(Math.round(rect.top + rect.height / 2), 0, innerHeight);
+    const elements = [
+        doc.elementFromPoint(horizontalMiddle, top),
+        doc.elementFromPoint(horizontalMiddle, bottom),
+        doc.elementFromPoint(left, verticalMiddle),
+        doc.elementFromPoint(right, verticalMiddle)
+    ];
+    const nonNull = elements.filter(cuiIsPresent);
+    if (!nonNull.length) {
+        return [];
+    }
+    const filtered = nonNull.filter((el) => !element.contains(el) && !el.contains(element));
+    return filtered.length === 4 ? filtered : null;
+}
+
+function cuiInjectElement() {
+    return inject(ElementRef).nativeElement;
+}
+
+function cuiPointToClientRect(x = 0, y = 0) {
+    const rect = {
+        x,
+        y,
+        left: x,
+        right: x,
+        top: y,
+        bottom: y,
+        width: 0,
+        height: 0
+    };
+    return {
+        ...rect,
+        toJSON: () => rect
+    };
+}
+
+function cuiGetNativeFocused({ activeElement }) {
+    if (!activeElement?.shadowRoot) {
+        return activeElement;
+    }
+    let element = activeElement.shadowRoot.activeElement;
+    while (element?.shadowRoot) {
+        element = element.shadowRoot.activeElement;
+    }
+    return element;
+}
+
+function cuiBlurNativeFocused(document) {
+    const activeElement = cuiGetNativeFocused(document);
+    if (cuiIsHTMLElement(activeElement)) {
+        activeElement.blur();
+    }
+}
+
+function cuiIsNativeKeyboardFocusable(element) {
+    if (element.hasAttribute('disabled') || element.getAttribute('tabIndex') === '-1') {
+        return false;
+    }
+    if ((cuiIsHTMLElement(element) && element.isContentEditable) || element.getAttribute('tabIndex') === '0') {
+        return true;
+    }
+    switch (element.tagName) {
+        case 'BUTTON':
+        case 'SELECT':
+        case 'TEXTAREA':
+            return true;
+        case 'VIDEO':
+        case 'AUDIO':
+            return element.hasAttribute('controls');
+        case 'INPUT':
+            return element.getAttribute('type') !== 'hidden';
+        case 'A':
+        case 'LINK':
+            return element.hasAttribute('href');
+        default:
+            return false;
+    }
+}
+
+function cuiIsNativeMouseFocusable(element) {
+    return (!element.hasAttribute('disabled') &&
+        (element.getAttribute('tabIndex') === '-1' || cuiIsNativeKeyboardFocusable(element)));
+}
+
+function cuiGetClosestFocusable({ initial, root, previous = false, keyboard = true }) {
+    if (!root.ownerDocument) {
+        return null;
+    }
+    const check = keyboard ? cuiIsNativeKeyboardFocusable : cuiIsNativeMouseFocusable;
+    const treeWalker = root.ownerDocument.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, svgNodeFilter);
+    treeWalker.currentNode = initial;
+    while (previous ? treeWalker.previousNode() : treeWalker.nextNode()) {
+        if (cuiIsHTMLElement(treeWalker.currentNode)) {
+            initial = treeWalker.currentNode;
+        }
+        if (cuiIsHTMLElement(initial) && check(initial)) {
+            return initial;
+        }
+    }
+    return null;
+}
+
+/**
+ * Checks if element is focused.
+ *
+ * Could return true even after blur since element remains focused if you switch away from a browser tab.
+ *
+ * @param node or null (as a common return value of DOM nodes walking)
+ * @return true if focused
+ */
+function cuiIsNativeFocused(node) {
+    return !!node?.ownerDocument && cuiGetNativeFocused(node.ownerDocument) === node && node.ownerDocument.hasFocus();
+}
+
+const CUI_SAFARI_REG_EXP = /^((?!chrome|android).)*safari/i;
+const CUI_IOS_REG_EXP = /ipad|iphone|ipod/i;
+function cuiIsIos({ userAgent, maxTouchPoints }) {
+    return CUI_SAFARI_REG_EXP.test(userAgent) || (CUI_IOS_REG_EXP.test(userAgent) && maxTouchPoints > 1);
+}
+
+class FilesUploaderImpl {
+    uploadFile(types = '*') {
+        const input = document.createElement('input');
+        input.type = 'file';
+        input.accept = types;
+        return new Promise((resolve) => {
+            input.onchange = () => {
+                const files = input.files;
+                if (!files?.length) {
+                    return;
+                }
+                resolve(files);
+            };
+            input.click();
+        });
+    }
+}
+const FilesUploader = new FilesUploaderImpl();
+
+function takeCaptureFromVideo(url, time = 1) {
+    const canvas = document.createElement('canvas');
+    const video = document.createElement('video');
+    video.src = url;
+    video.currentTime = time;
+    canvas.width = 184;
+    canvas.height = 120;
+    return new Promise((resolve) => {
+        video.onloadeddata = () => {
+            const context = canvas.getContext('2d');
+            if (!context) {
+                return;
+            }
+            context.drawImage(video, 0, 0, canvas.width, canvas.height);
+            canvas.toBlob((blob) => {
+                if (!blob) {
+                    return;
+                }
+                resolve(URL.createObjectURL(blob));
+            });
+        };
+        video.load();
+    });
+}
+
+/**
+ * Element currently being removed by AnimationEngine
+ */
+const CUI_REMOVED_ELEMENT = cuiCreateTokenFromFactory(() => {
+    const stub = { onRemovalComplete: () => { } };
+    const element$ = new BehaviorSubject(null);
+    const engine = inject(_AnimationEngine, { optional: true }) || stub;
+    const { onRemovalComplete = stub.onRemovalComplete } = engine;
+    engine.onRemovalComplete = (element, context) => {
+        element$.next(element);
+        onRemovalComplete.call(engine, element, context);
+    };
+    return element$.pipe(switchMap((element) => timer(0).pipe(map(() => null), startWith(element))), share());
+});
+
+// Checks if focusout event should be considered leaving active zone
+function isValidFocusout(target, removedElement = null) {
+    return (
+    // Not due to switching tabs/going to DevTools
+    cuiGetDocumentOrShadowRoot(target).activeElement !== target &&
+        // Not due to button/input becoming disabled or under disabled fieldset
+        !target.matches(':disabled') &&
+        // Not due to element being removed from DOM
+        !removedElement?.contains(target) &&
+        // Not due to scrollable element became non-scrollable
+        cuiIsNativeMouseFocusable(target));
+}
+function shadowRootActiveElement(root) {
+    return merge(cuiTypedFromEvent(root, 'focusin').pipe(map(({ target }) => target)), cuiTypedFromEvent(root, 'focusout').pipe(filter(({ target, relatedTarget }) => !!relatedTarget && isValidFocusout(target)), map(({ relatedTarget }) => relatedTarget)));
+}
+/**
+ * Active element on the document for ActiveZone
+ */
+const CUI_ACTIVE_ELEMENT = cuiCreateTokenFromFactory(() => {
+    const removedElement$ = inject(CUI_REMOVED_ELEMENT);
+    const win = inject(CUI_WINDOW);
+    const doc = inject(DOCUMENT);
+    const zone = inject(NgZone);
+    const focusout$ = cuiTypedFromEvent(win, 'focusout', { capture: true });
+    const focusin$ = cuiTypedFromEvent(win, 'focusin', { capture: true });
+    const blur$ = cuiTypedFromEvent(win, 'blur');
+    const mousedown$ = cuiTypedFromEvent(win, 'mousedown');
+    const mouseup$ = cuiTypedFromEvent(win, 'mouseup');
+    return merge(focusout$.pipe(takeUntil(mousedown$), repeat({ delay: () => mouseup$ }), withLatestFrom(removedElement$), filter(([event, removedElement]) => isValidFocusout(cuiGetActualTarget(event), removedElement)), map(([{ relatedTarget }]) => relatedTarget)), blur$.pipe(map(() => doc.activeElement), filter((element) => !!element?.matches('iframe'))), focusin$.pipe(switchMap((event) => {
+        const target = cuiGetActualTarget(event);
+        const root = cuiGetDocumentOrShadowRoot(target);
+        return root === doc ? of(target) : shadowRootActiveElement(root).pipe(startWith(target));
+    })), mousedown$.pipe(switchMap((event) => {
+        const actualTargetInCurrentTime = cuiGetActualTarget(event);
+        return !doc.activeElement || doc.activeElement === doc.body
+            ? of(actualTargetInCurrentTime)
+            : focusout$.pipe(take(1), map(
+            /**
+             * Do not use `map(() => cuiGetActualTarget(event))`
+             * because we have different result in runtime
+             */
+            () => actualTargetInCurrentTime), takeUntil(timer(0, cuiZonefreeScheduler(zone))));
+    }))).pipe(distinctUntilChanged(), share());
+});
+
+const CUI_ANIMATION_FRAME = new InjectionToken('[CUI_ANIMATION_FRAME]', {
+    factory: () => {
+        const { requestAnimationFrame, cancelAnimationFrame } = inject(CUI_WINDOW);
+        const animationFrame$ = new Observable((subscriber) => {
+            let id = NaN;
+            const callback = (timestamp) => {
+                subscriber.next(timestamp);
+                id = requestAnimationFrame(callback);
+            };
+            id = requestAnimationFrame(callback);
+            return () => {
+                cancelAnimationFrame(id);
+            };
+        });
+        return animationFrame$.pipe(share());
+    }
+});
+
+const CUI_NAVIGATOR = new InjectionToken('[CUI_NAVIGATOR]', {
+    factory: () => inject(CUI_WINDOW).navigator
+});
+
+const CUI_USER_AGENT = new InjectionToken('[CUI_USER_AGENT]', {
+    factory: () => inject(CUI_NAVIGATOR).userAgent
+});
+
+// https://stackoverflow.com/a/11381730/2706426 http://detectmobilebrowsers.com/
+const firstRegex = 
+// eslint-disable-next-line sonarjs/regex-complexity
+/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series([46])0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/;
+const secondRegex = 
+// eslint-disable-next-line sonarjs/regex-complexity
+/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br([ev])w|bumb|bw-([nu])|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do([cp])o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly([-_])|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-([mpt])|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c([- _agpst])|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac([ \-/])|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja([tv])a|jbro|jemu|jigs|kddi|keji|kgt([ /])|klon|kpt |kwc-|kyo([ck])|le(no|xi)|lg( g|\/([klu])|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t([- ov])|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30([02])|n50([025])|n7(0([01])|10)|ne(([cm])-|on|tf|wf|wg|wt)|nok([6i])|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan([adt])|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c([-01])|47|mc|nd|ri)|sgh-|shar|sie([-m])|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel([im])|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c([- ])|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/;
+const CUI_IS_MOBILE = cuiCreateTokenFromFactory(() => firstRegex.test(inject(CUI_USER_AGENT).toLowerCase()) ||
+    secondRegex.test(inject(CUI_USER_AGENT).slice(0, 4).toLowerCase()));
+const CUI_IS_IOS = cuiCreateTokenFromFactory(() => cuiIsIos(inject(CUI_NAVIGATOR)));
+const CUI_IS_ANDROID = cuiCreateTokenFromFactory(() => inject(CUI_IS_MOBILE) && !inject(CUI_IS_IOS));
+const CUI_IS_WEBKIT = cuiCreateTokenFromFactory(() => !!inject(CUI_WINDOW)?.webkitConvertPointFromNodeToPage);
+const CUI_PLATFORM = cuiCreateTokenFromFactory(() => {
+    if (inject(CUI_IS_IOS)) {
+        return 'ios';
+    }
+    return inject(CUI_IS_ANDROID) ? 'android' : 'web';
+});
+const CUI_IS_TOUCH = cuiCreateTokenFromFactory(() => {
+    const media = inject(CUI_WINDOW).matchMedia('(pointer: coarse)');
+    return toSignal(fromEvent(media, 'change').pipe(map(() => media.matches)), {
+        initialValue: media.matches
+    });
+});
+/**
+ * Detect if app is running under Cypress
+ * {@link https://docs.cypress.io/faq/questions/using-cypress-faq#Is-there-any-way-to-detect-if-my-app-is-running-under-Cypress Cypress docs}
+ */
+const CUI_IS_CYPRESS = cuiCreateTokenFromFactory(() => !!inject(CUI_WINDOW).Cypress);
+/**
+ * Manually provide `true` when running tests in Playwright
+ */
+const CUI_IS_PLAYWRIGHT = cuiCreateTokenFromFactory(CUI_FALSE_HANDLER);
+/**
+ * Detect if app is running under any of test frameworks
+ */
+const CUI_IS_E2E = cuiCreateTokenFromFactory(() => inject(CUI_IS_CYPRESS) || inject(CUI_IS_PLAYWRIGHT));
+
+const CUI_HISTORY = cuiCreateTokenFromFactory(() => inject(CUI_WINDOW).history);
+
+const CUI_LOCAL_STORAGE = cuiCreateTokenFromFactory(() => inject(CUI_WINDOW).localStorage);
+
+const CUI_SESSION_STORAGE = cuiCreateTokenFromFactory(() => inject(CUI_WINDOW).sessionStorage);
+
+class CuiActiveZone {
+    constructor() {
+        this.control = inject(NgControl, { self: true, optional: true });
+        this.active$ = inject(CUI_ACTIVE_ELEMENT);
+        this.zone = inject(NgZone);
+        this.el = cuiInjectElement();
+        this.cuiActiveZoneParent = null;
+        this.subActiveZones = [];
+        this.directParentActiveZone = inject(CuiActiveZone, {
+            skipSelf: true,
+            optional: true
+        });
+        this.cuiActiveZoneChange = this.active$.pipe(map((element) => !!element && this.contains(element)), startWith(false), distinctUntilChanged(), skip(1), tap((active) => {
+            if (!active && typeof this.control?.valueAccessor.onTouched === 'function') {
+                this.control.valueAccessor.onTouched();
+            }
+        }), cuiZoneOptimized(this.zone));
+        this.directParentActiveZone?.addSubActiveZone(this);
+    }
+    set cuiActiveZoneParentSetter(zone) {
+        this.setZone(zone);
+    }
+    ngOnDestroy() {
+        this.directParentActiveZone?.removeSubActiveZone(this);
+        this.cuiActiveZoneParent?.removeSubActiveZone(this);
+    }
+    contains(node) {
+        return (this.el.contains(node) ||
+            this.subActiveZones.some((item, index, array) => array.indexOf(item) === index && item.contains(node)));
+    }
+    setZone(zone) {
+        this.cuiActiveZoneParent?.removeSubActiveZone(this);
+        zone?.addSubActiveZone(this);
+        this.cuiActiveZoneParent = zone;
+    }
+    addSubActiveZone(activeZone) {
+        this.subActiveZones = [...this.subActiveZones, activeZone];
+    }
+    removeSubActiveZone(activeZone) {
+        this.subActiveZones = cuiArrayRemove(this.subActiveZones, this.subActiveZones.indexOf(activeZone));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiActiveZone, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiActiveZone, isStandalone: true, selector: "[cuiActiveZone]:not(ng-container), [cuiActiveZoneChange]:not(ng-container), [cuiActiveZoneParent]:not(ng-container)", inputs: { cuiActiveZoneParentSetter: ["cuiActiveZoneParent", "cuiActiveZoneParentSetter"] }, outputs: { cuiActiveZoneChange: "cuiActiveZoneChange" }, host: { listeners: { "document:mousedown.silent": "(0)" } }, exportAs: ["cuiActiveZone"], ngImport: i0 }); }
+}
+__decorate([
+    cuiPure,
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], CuiActiveZone.prototype, "setZone", null);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiActiveZone, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiActiveZone]:not(ng-container), [cuiActiveZoneChange]:not(ng-container), [cuiActiveZoneParent]:not(ng-container)',
+                    exportAs: 'cuiActiveZone',
+                    host: {
+                        '(document:mousedown.silent)': '(0)'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { cuiActiveZoneChange: [{
+                type: Output
+            }], cuiActiveZoneParentSetter: [{
+                type: Input,
+                args: ['cuiActiveZoneParent']
+            }], setZone: [] } });
+
+function movedOut({ currentTarget, relatedTarget }) {
+    return !cuiIsElement(relatedTarget) || !cuiIsElement(currentTarget) || !currentTarget.contains(relatedTarget);
+}
+class CuiHoveredService extends Observable {
+    constructor() {
+        super((subscriber) => this.stream$.subscribe(subscriber));
+        this.el = cuiInjectElement();
+        this.zone = inject(NgZone);
+        this.stream$ = merge(cuiTypedFromEvent(this.el, 'mouseenter').pipe(map(CUI_TRUE_HANDLER)), cuiTypedFromEvent(this.el, 'mouseleave').pipe(map(CUI_FALSE_HANDLER)), 
+        // Hello, Safari
+        cuiTypedFromEvent(this.el, 'mouseout').pipe(filter(movedOut), map(CUI_FALSE_HANDLER))).pipe(distinctUntilChanged(), cuiZoneOptimized(this.zone));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHoveredService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHoveredService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHoveredService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+function cuiHovered() {
+    return toSignal(inject(CUI_IS_MOBILE) ? of(false) : inject(CuiHoveredService).pipe(cuiWatch()), {
+        initialValue: false
+    });
+}
+
+class CuiHovered {
+    constructor() {
+        this.cuiHoveredChange = inject(CuiHoveredService);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHovered, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiHovered, isStandalone: true, selector: "[cuiHoveredChange]", outputs: { cuiHoveredChange: "cuiHoveredChange" }, providers: [CuiHoveredService], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHovered, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiHoveredChange]',
+                    providers: [CuiHoveredService]
+                }]
+        }], propDecorators: { cuiHoveredChange: [{
+                type: Output
+            }] } });
+
+class CuiConsumptionUnitsService {
+    getConsumptionsUnits(material) {
+        let consumptionsUnits = {};
+        const consumptionsUnitsSystem = this.getConsumptionsUnitsSystem(material);
+        const consumptions = material.consumption;
+        consumptions.forEach((consumption) => {
+            consumptionsUnits = {
+                ...consumptionsUnits,
+                [consumption]: this.getConsumptionUnits(consumption, consumptionsUnitsSystem)
+            };
+        });
+        return consumptionsUnits;
+    }
+    getConsumptionByUnit(unit) {
+        const unitsSystem = this.getUnitsSystemByUnit(unit);
+        const consumption = Object.entries(SystemUnits[unitsSystem]).find(([consumption, consumptionUnits]) => consumptionUnits.find((consumptionUnit) => consumptionUnit.value === unit))?.[0];
+        return consumption ?? "LENGTH" /* Consumption.Length */;
+    }
+    getUnitsSystemByUnit(consumptionUnit) {
+        return Object.entries(SystemUnits).find(([unitsSystem, consumptionUnits]) => Object.entries(consumptionUnits).find(([consumption, units]) => units.find((unit) => unit.value === consumptionUnit)))?.[0];
+    }
+    getConsumptionsUnitsSystem(material) {
+        let specifications = {};
+        if (material.specifications) {
+            specifications = material.specifications;
+        }
+        else {
+            specifications = this.prepareParametersToSpecifications(material);
+        }
+        const weightValue = specifications.weight.unit;
+        const unitsSystem = Object.entries(SystemUnits).find(([key, value]) => value.WEIGHT?.includes(weightValue));
+        if (!unitsSystem) {
+            return "METRIC" /* UnitsSystem.Metric */;
+        }
+        return unitsSystem[0];
+    }
+    prepareParametersToSpecifications(material) {
+        const arrayFromParameters = material.parameters.map((param) => {
+            return {
+                [param.measure.toLowerCase()]: { value: param.value, unit: param.unit }
+            };
+        });
+        return arrayFromParameters.reduce((result, item) => {
+            for (const key in item) {
+                if (Object.prototype.hasOwnProperty.call(item, key)) {
+                    result[key] = item[key];
+                }
+            }
+            return result;
+        }, {});
+    }
+    getConsumptionUnits(consumption, unitsSystem) {
+        return SystemUnits[unitsSystem][consumption] ?? [];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiConsumptionUnitsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiConsumptionUnitsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiConsumptionUnitsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class CuiDestroyService extends Subject {
+    ngOnDestroy() {
+        this.next();
+        this.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDestroyService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDestroyService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDestroyService, decorators: [{
+            type: Injectable
+        }] });
+
+const CUI = 'cui_';
+class CuiIdService {
+    static { this.autoId = 0; }
+    generate() {
+        return `${CUI}${CuiIdService.autoId++}${Date.now()}`;
+    }
+    checkIdGenerated(id) {
+        return id.startsWith(CUI);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiIdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiIdService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiIdService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class CuiPopoverService {
+    constructor(items, component, options = {}) {
+        this.options = options;
+        this.cuiIdService = inject(CuiIdService);
+        this.items$ = inject(items);
+        this.component = component;
+    }
+    open(content, options = {}) {
+        return new Observable((observer) => {
+            const item = {
+                ...this.options,
+                ...options,
+                $implicit: observer,
+                id: this.cuiIdService.generate(),
+                component: this.component,
+                content: content,
+                completeWith: (result) => {
+                    observer.next(result);
+                    observer.complete();
+                }
+            };
+            this.items$.next([...this.items$.value, item]);
+            return () => {
+                this.items$.next(this.items$.value.filter((value) => value !== item));
+            };
+        });
+    }
+    closeAll() {
+        this.items$.next([]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiPopoverService, deps: "invalid", target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiPopoverService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiPopoverService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: undefined }, { type: undefined }, { type: undefined }] });
+
+class CuiDragListDirective {
+    constructor() {
+        this.renderer = inject(Renderer2);
+        this.element = inject(ElementRef).nativeElement;
+        this.id = inject(CuiIdService).generate();
+        this.listId = `${this.id}-list`;
+        this.renderer.setAttribute(this.element, 'id', this.listId);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiDragListDirective, isStandalone: true, selector: "[cuiDragList]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragListDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cuiDragList]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiDragDropDirective {
+    constructor() {
+        this.zone = inject(NgZone);
+        this.document = inject(DOCUMENT);
+        this.renderer = inject(Renderer2);
+        this.element = inject(ElementRef).nativeElement;
+        this.dragListDirective = inject(CuiDragListDirective);
+        this.PLACEHOLDER_CLASS = 'cui-drag-drop-placeholder';
+        this.listId = this.dragListDirective.listId;
+        this.itemAttribute = `${this.listId}-drag-item`;
+        this.abortController = new AbortController();
+        this.hostAbortController = new AbortController();
+        this.draggingElement = signal(null);
+        this.placeholderElement = signal(null);
+        this.dragData = signal({});
+        this.disabled = input(false);
+        this.elementDragged = output();
+        this.initDragItem();
+        this.initPointerEvents(this.element);
+    }
+    ngOnDestroy() {
+        this.destroyEvents();
+    }
+    changePointerEvents(element) {
+        this.hostAbortController.abort();
+        this.hostAbortController = new AbortController();
+        this.initPointerEvents(element);
+    }
+    onDrag(clientX, clientY) {
+        if (!this.draggingElement()) {
+            return;
+        }
+        const elementsFromPoint = this.document.elementsFromPoint(clientX, clientY);
+        const elementFromPoint = elementsFromPoint.find((element) => element.closest(`#${this.listId}`));
+        if (!elementFromPoint) {
+            return;
+        }
+        const targetElement = elementFromPoint.closest(`[${this.itemAttribute}]`);
+        if (!targetElement || targetElement === this.draggingElement()) {
+            return;
+        }
+        this.configurateDragData(targetElement, clientY);
+    }
+    onDragStart(event) {
+        if (this.disabled()) {
+            return;
+        }
+        let isClicked = true;
+        const elementClientRect = this.element.getBoundingClientRect();
+        const shiftX = event.clientX - elementClientRect.left;
+        const shiftY = event.clientY - elementClientRect.top;
+        this.prevIndex = this.calculatePreviousIndex();
+        this.document.addEventListener('pointermove', ({ clientX, clientY }) => {
+            if (isClicked) {
+                this.prepareMoving();
+                isClicked = false;
+            }
+            const draggingElement = this.draggingElement();
+            this.renderer.setStyle(draggingElement, 'left', clientX - shiftX + 'px');
+            this.renderer.setStyle(draggingElement, 'top', clientY - shiftY + 'px');
+            this.onDrag(clientX, clientY);
+        }, { signal: this.abortController.signal });
+    }
+    onDragEnd() {
+        const { targetElement, pointer } = this.dragData();
+        if (targetElement && pointer) {
+            this.elementDragged.emit({
+                index: this.index,
+                prevIndex: this.prevIndex,
+                targetElement,
+                pointer
+            });
+        }
+        // remove document events
+        this.abortController.abort();
+        this.abortController = new AbortController();
+        this.removeDragElement();
+        this.removePlaceholder();
+        this.dragData.set({});
+    }
+    initDragItem() {
+        this.renderer.setAttribute(this.element, this.itemAttribute, 'true');
+    }
+    initPointerEvents(element) {
+        const signal = this.hostAbortController.signal;
+        this.zone.runOutsideAngular(() => {
+            element.addEventListener('pointerup', this.onDragEnd.bind(this), { signal });
+            element.addEventListener('pointerdown', this.onDragStart.bind(this), { signal });
+        });
+    }
+    destroyEvents() {
+        this.hostAbortController.abort();
+        this.abortController.abort();
+    }
+    prepareMoving() {
+        const placeholderElement = this.createPlaceholderElement();
+        const draggingElement = this.createDragElement();
+        this.document.addEventListener('pointerup', this.onDragEnd.bind(this), {
+            signal: this.abortController.signal
+        });
+        this.element.after(placeholderElement);
+        this.draggingElement.set(draggingElement);
+        this.element.remove();
+        this.document.body.append(draggingElement);
+    }
+    configurateDragData(targetElement, clientY) {
+        const placeholderElement = this.placeholderElement();
+        const boundingRect = targetElement.getBoundingClientRect();
+        const middleY = boundingRect.top + boundingRect.height / 2;
+        if (clientY < middleY) {
+            targetElement.before(placeholderElement);
+            this.dragData.set({ targetElement, pointer: 'BEFORE' });
+        }
+        else {
+            targetElement.after(placeholderElement);
+            this.dragData.set({ targetElement, pointer: 'AFTER' });
+        }
+        this.index = this.calculateIndex(placeholderElement);
+    }
+    createDragElement() {
+        const width = this.element.clientWidth;
+        const draggingElement = this.element.cloneNode(true);
+        this.renderer.setStyle(draggingElement, 'position', 'fixed');
+        this.renderer.setStyle(draggingElement, 'display', 'block');
+        this.renderer.setStyle(draggingElement, 'margin', '0');
+        this.renderer.setStyle(draggingElement, 'width', `${width}px`);
+        return draggingElement;
+    }
+    createPlaceholderElement() {
+        const element = this.placeholderElement();
+        if (element) {
+            return element;
+        }
+        const placeholderElement = this.renderer.createElement('div');
+        this.renderer.addClass(placeholderElement, this.PLACEHOLDER_CLASS);
+        this.placeholderElement.set(placeholderElement);
+        return placeholderElement;
+    }
+    removeDragElement() {
+        const draggingElement = this.draggingElement();
+        if (!draggingElement) {
+            return;
+        }
+        draggingElement.remove();
+        this.draggingElement.set(null);
+    }
+    removePlaceholder() {
+        const placeholderElement = this.placeholderElement();
+        if (!placeholderElement) {
+            return;
+        }
+        placeholderElement.after(this.element);
+        placeholderElement.remove();
+        this.placeholderElement.set(null);
+    }
+    calculateIndex(placeholderElement) {
+        const childNodes = placeholderElement.parentElement.childNodes;
+        const elements = Array.from(childNodes).filter((node) => node instanceof HTMLElement);
+        return elements.indexOf(placeholderElement);
+    }
+    calculatePreviousIndex() {
+        let index = 0;
+        let currentElement = this.element;
+        while (currentElement && currentElement.previousElementSibling) {
+            index++;
+            currentElement = currentElement.previousElementSibling;
+        }
+        return index;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.14", type: CuiDragDropDirective, isStandalone: true, selector: "[cuiDragDrop]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { elementDragged: "elementDragged" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragDropDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cuiDragDrop]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiDragPointerDirective {
+    constructor() {
+        this.dragDropDirective = inject(CuiDragDropDirective);
+        this.element = inject(ElementRef).nativeElement;
+        this.dragDropDirective.changePointerEvents(this.element);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragPointerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiDragPointerDirective, isStandalone: true, selector: "[cuiDragPointer]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDragPointerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cuiDragPointer]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiAutoResizingDirective {
+    constructor() {
+        this.window = inject(CUI_WINDOW);
+        this.element = inject(ElementRef).nativeElement;
+        this.ngControl = inject(NgControl, { self: true, optional: true });
+        this.ngModel = inject(NgModel, { self: true, optional: true });
+        this.destroy$ = inject(CuiDestroyService, { self: true });
+        this.elementStyles = this.element.style;
+    }
+    ngOnInit() {
+        this.initNgControlValueChangeSubscription();
+        this.initNgModelValueChangeSubscription();
+    }
+    ngAfterViewChecked() {
+        this.resize();
+    }
+    onInput() {
+        this.resize();
+    }
+    initNgControlValueChangeSubscription() {
+        if (!this.ngControl) {
+            return;
+        }
+        this.ngControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(this.resize.bind(this));
+    }
+    initNgModelValueChangeSubscription() {
+        if (!this.ngModel) {
+            return;
+        }
+        this.ngModel.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(this.resize.bind(this));
+    }
+    resize() {
+        const { maxHeight: computedMaxHeight, borderTopWidth, borderBottomWidth } = this.window.getComputedStyle(this.element);
+        this.elementStyles.height = 'auto';
+        this.elementStyles.height =
+            this.element.scrollHeight + parseFloat(borderTopWidth) + parseFloat(borderBottomWidth) + 'px';
+        if (parseFloat(this.element.style.height) < parseFloat(computedMaxHeight)) {
+            this.elementStyles.overflow = 'hidden';
+            return;
+        }
+        this.elementStyles.overflowY = 'scroll';
+        this.elementStyles.height = computedMaxHeight;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiAutoResizingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiAutoResizingDirective, isStandalone: true, selector: "textarea[cuiAutoResizing]", host: { listeners: { "input": "onInput()" } }, providers: [CuiDestroyService], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiAutoResizingDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: 'textarea[cuiAutoResizing]',
+                    providers: [CuiDestroyService]
+                }]
+        }], propDecorators: { onInput: [{
+                type: HostListener,
+                args: ['input']
+            }] } });
+
+class CuiHandleScrollDirective {
+    constructor() {
+        this.window = inject(CUI_WINDOW);
+        this.document = inject(DOCUMENT);
+        this.renderer = inject(Renderer2);
+        this.zone = inject(NgZone);
+        this.abortController = new AbortController();
+        this.SCROLL_AREA_HEIGHT = 100;
+        this.scrollGapElements = signal(null);
+        this.scrollSpeed = input(100);
+    }
+    ngOnDestroy() {
+        this.removeSubscription();
+    }
+    onTargetMove() {
+        const signal = this.abortController.signal;
+        this.zone.runOutsideAngular(this.initScrollEvent.bind(this, signal));
+    }
+    initScrollEvent(signal) {
+        this.document.addEventListener('pointermove', ({ clientY }) => this.handleScroll(clientY), { signal });
+        this.document.addEventListener('pointerup', () => {
+            this.scrollGapElements()?.forEach((element) => element.remove());
+            this.scrollGapElements.set(null);
+            this.removeSubscription();
+            this.abortController.abort();
+            this.abortController = new AbortController();
+        }, { signal });
+    }
+    handleScroll(clientY) {
+        const windowHeight = this.document.documentElement.clientHeight;
+        const scrollSpeed = this.scrollSpeed();
+        if (!this.scrollGapElements()) {
+            this.setScrollGapElements();
+        }
+        if (clientY <= this.SCROLL_AREA_HEIGHT) {
+            this.startScrolling(-scrollSpeed);
+            return;
+        }
+        if (clientY >= windowHeight - this.SCROLL_AREA_HEIGHT) {
+            this.startScrolling(scrollSpeed);
+            return;
+        }
+        this.removeSubscription();
+    }
+    setScrollGapElements() {
+        const scrollGapElement = this.renderer.createElement('div');
+        this.renderer.setStyle(scrollGapElement, 'position', 'fixed');
+        this.renderer.setStyle(scrollGapElement, 'width', '100%');
+        this.renderer.setStyle(scrollGapElement, 'height', '48px');
+        this.renderer.setStyle(scrollGapElement, 'top', '0');
+        const scrollGapBottomElement = scrollGapElement.cloneNode(true);
+        this.renderer.appendChild(this.document.body, scrollGapElement);
+        this.renderer.appendChild(this.document.body, scrollGapBottomElement);
+        this.scrollGapElements.set([scrollGapElement, scrollGapBottomElement]);
+    }
+    startScrolling(speed) {
+        this.removeSubscription();
+        this.scrollSubscription = interval(this.scrollSpeed()).subscribe(() => this.window.scrollBy({ top: speed, behavior: 'smooth' }));
+    }
+    removeSubscription() {
+        this.scrollSubscription?.unsubscribe();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHandleScrollDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.14", type: CuiHandleScrollDirective, isStandalone: true, selector: "[cuiHandleScroll]", inputs: { scrollSpeed: { classPropertyName: "scrollSpeed", publicName: "scrollSpeed", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "pointerdown": "onTargetMove()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiHandleScrollDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cuiHandleScroll]',
+                    standalone: true,
+                    host: {
+                        '(pointerdown)': 'onTargetMove()'
+                    }
+                }]
+        }] });
+
+class CuiClickOutsideDirective {
+    constructor() {
+        this.element = inject(ElementRef).nativeElement;
+        this.cuiClickOutside = new EventEmitter();
+    }
+    onClickOutside(target) {
+        if (this.element.contains(target)) {
+            return;
+        }
+        this.cuiClickOutside.emit(target);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiClickOutsideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiClickOutsideDirective, isStandalone: true, selector: "(cuiClickOutside)", outputs: { cuiClickOutside: "cuiClickOutside" }, host: { listeners: { "document:click": "onClickOutside($event.target)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiClickOutsideDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '(cuiClickOutside)'
+                }]
+        }], propDecorators: { cuiClickOutside: [{
+                type: Output
+            }], onClickOutside: [{
+                type: HostListener,
+                args: ['document:click', ['$event.target']]
+            }] } });
+
+class CuiDimensionsObserverDirective {
+    constructor() {
+        this.element = inject(ElementRef).nativeElement;
+        this.observer = new ResizeObserver((entries) => {
+            entries.forEach(() => this.cuiResizeObserver.emit({
+                width: this.element.offsetWidth,
+                height: this.element.offsetHeight
+            }));
+        });
+        this.cuiResizeObserver = new EventEmitter();
+    }
+    ngOnInit() {
+        this.observer.observe(this.element);
+    }
+    ngOnDestroy() {
+        this.observer.disconnect();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDimensionsObserverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiDimensionsObserverDirective, isStandalone: true, selector: "[cuiResizeObserver]", outputs: { cuiResizeObserver: "cuiResizeObserver" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDimensionsObserverDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiResizeObserver]'
+                }]
+        }], propDecorators: { cuiResizeObserver: [{
+                type: Output
+            }] } });
+
+class CuiContentEditableValueAccessorDirective {
+    constructor() {
+        this.element = inject(ElementRef).nativeElement;
+    }
+    writeValue(value) {
+        this.element.innerText = value ?? '';
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.element.contentEditable = String(!isDisabled);
+    }
+    onInput() {
+        this.onChange(this.element.innerHTML === '<br>' ? '' : this.element.innerText);
+    }
+    onBlur() {
+        this.onTouched();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiContentEditableValueAccessorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiContentEditableValueAccessorDirective, isStandalone: true, selector: "[contenteditable][formControlName], [contenteditable][formControl], [contenteditable][ngModel]", host: { listeners: { "input": "onInput()", "blur": "onBlur()" } }, providers: [cuiProvide(NG_VALUE_ACCESSOR, CuiContentEditableValueAccessorDirective, true)], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiContentEditableValueAccessorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[contenteditable][formControlName], [contenteditable][formControl], [contenteditable][ngModel]',
+                    providers: [cuiProvide(NG_VALUE_ACCESSOR, CuiContentEditableValueAccessorDirective, true)]
+                }]
+        }], propDecorators: { onInput: [{
+                type: HostListener,
+                args: ['input']
+            }], onBlur: [{
+                type: HostListener,
+                args: ['blur']
+            }] } });
+
+class CuiElementDirective {
+    constructor() {
+        this.nativeElement = inject((ElementRef)).nativeElement;
+        return new ElementRef(this.nativeElement);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiElementDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiElementDirective, isStandalone: true, selector: "[cuiElement]", exportAs: ["elementRef"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiElementDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiElement]',
+                    exportAs: 'elementRef'
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiFocusTrapDirective {
+    constructor() {
+        this.document = inject(DOCUMENT);
+        this.element = inject(ElementRef).nativeElement;
+        this.activeElement = cuiGetNativeFocused(this.document);
+        this.tabIndex = 0;
+        this.initElementFocus();
+    }
+    ngOnDestroy() {
+        cuiBlurNativeFocused(this.document);
+        Promise.resolve().then(() => {
+            if (!cuiIsHTMLElement(this.activeElement)) {
+                return;
+            }
+            this.activeElement.focus();
+        });
+    }
+    onFocusIn(node) {
+        if (cuiContainsOrAfter(this.element, node)) {
+            return;
+        }
+        cuiGetClosestFocusable({
+            initial: this.element,
+            root: this.element
+        })?.focus();
+    }
+    initElementFocus() {
+        Promise.resolve().then(() => this.element.focus());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFocusTrapDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiFocusTrapDirective, isStandalone: true, selector: "[cuiFocusTrap]", host: { listeners: { "window:focusin": "onFocusIn($event.target)" }, properties: { "tabIndex": "this.tabIndex" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFocusTrapDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiFocusTrap]'
+                }]
+        }], ctorParameters: () => [], propDecorators: { tabIndex: [{
+                type: HostBinding,
+                args: ['tabIndex']
+            }], onFocusIn: [{
+                type: HostListener,
+                args: ['window:focusin', ['$event.target']]
+            }] } });
+
+class CuiItemDirective {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiItemDirective, isStandalone: true, selector: "[cuiItem]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiItemDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiItem]'
+                }]
+        }] });
+
+class CuiLetContext {
+    constructor(internalDirectiveInstance) {
+        this.internalDirectiveInstance = internalDirectiveInstance;
+    }
+    get $implicit() {
+        return this.internalDirectiveInstance.cuiLet;
+    }
+    get cuiLet() {
+        return this.internalDirectiveInstance.cuiLet;
+    }
+}
+
+class CuiLetDirective {
+    constructor() {
+        inject(ViewContainerRef).createEmbeddedView(inject((TemplateRef)), new CuiLetContext(this));
+    }
+    static ngTemplateContextGuard(_dir, _ctx) {
+        return true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLetDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiLetDirective, isStandalone: true, selector: "[cuiLet]", inputs: { cuiLet: "cuiLet" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLetDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[cuiLet]'
+                }]
+        }], ctorParameters: () => [], propDecorators: { cuiLet: [{
+                type: Input
+            }] } });
+
+class CuiTargetDirective {
+    constructor() {
+        this.clickListener = (event) => {
+            this.clicked.emit(event);
+        };
+        this.clicked = new EventEmitter();
+    }
+    ngOnInit() {
+        this.initClickListener();
+    }
+    ngOnDestroy() {
+        this.destroyClickListener();
+    }
+    initClickListener() {
+        this.ccTarget.addEventListener('click', this.clickListener);
+    }
+    destroyClickListener() {
+        this.ccTarget.removeEventListener('click', this.clickListener);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTargetDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: CuiTargetDirective, isStandalone: true, selector: "[ccTarget]", inputs: { ccTarget: "ccTarget" }, outputs: { clicked: "clicked" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTargetDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: '[ccTarget]'
+                }]
+        }], propDecorators: { ccTarget: [{
+                type: Input
+            }], clicked: [{
+                type: Output
+            }] } });
+
+class CuiLadderListDirective {
+    constructor() {
+        this.zone = inject(NgZone);
+        this.element = inject(ElementRef).nativeElement;
+        this.LIST_ITEM_MARGIN_LEFT = 16;
+        this.disabled = input(false);
+        effect(() => this.initElementsEffect());
+    }
+    initElementsEffect() {
+        this.zone.runOutsideAngular(this.initObserver.bind(this));
+    }
+    initObserver() {
+        const observer = new MutationObserver(this.calculateListItemsMargin.bind(this));
+        this.calculateListItemsMargin();
+        observer.observe(this.element, { childList: true });
+    }
+    calculateListItemsMargin() {
+        if (this.disabled()) {
+            return;
+        }
+        let index = 0;
+        this.element.childNodes.forEach((node) => {
+            if (!(node instanceof HTMLElement)) {
+                return;
+            }
+            node.style.marginLeft = index * this.LIST_ITEM_MARGIN_LEFT + 'px';
+            index += 1;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLadderListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.14", type: CuiLadderListDirective, isStandalone: true, selector: "[cuiLadderList]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLadderListDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cuiLadderList]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiTypedTemplateDirective extends TemplateRef {
+    constructor() {
+        super();
+        this.templateRef = inject(TemplateRef);
+        this.elementRef = this.templateRef.elementRef;
+        this.type = input.required({ alias: 'cuiTypedTemplate' });
+    }
+    createEmbeddedView(context) {
+        return this.templateRef.createEmbeddedView(context);
+    }
+    static ngTemplateContextGuard(_, ctx) {
+        return true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTypedTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.2.14", type: CuiTypedTemplateDirective, isStandalone: true, selector: "ng-template[cuiTypedTemplate]", inputs: { type: { classPropertyName: "type", publicName: "cuiTypedTemplate", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["cuiTypedTemplate"], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTypedTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[cuiTypedTemplate]',
+                    standalone: true,
+                    exportAs: 'cuiTypedTemplate'
+                }]
+        }], ctorParameters: () => [] });
+
+class CuiFilterPipe {
+    transform(items, matcher, ...args) {
+        return items.filter((item) => matcher(item, ...args));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterPipe, isStandalone: true, name: "cuiFilter" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiFilterPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    standalone: true,
+                    name: 'cuiFilter'
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CUI_ACTIVE_ELEMENT, CUI_ANIMATION_FRAME, CUI_FALSE_HANDLER, CUI_HISTORY, CUI_IOS_REG_EXP, CUI_IS_ANDROID, CUI_IS_CYPRESS, CUI_IS_E2E, CUI_IS_IOS, CUI_IS_MOBILE, CUI_IS_PLAYWRIGHT, CUI_IS_TOUCH, CUI_IS_WEBKIT, CUI_LOCAL_STORAGE, CUI_NAVIGATOR, CUI_PLATFORM, CUI_REMOVED_ELEMENT, CUI_SAFARI_REG_EXP, CUI_SESSION_STORAGE, CUI_TRUE_HANDLER, CUI_USER_AGENT, CUI_WINDOW, CuiActiveZone, CuiAutoResizingDirective, CuiClickOutsideDirective, CuiConsumptionUnitsService, CuiContentEditableValueAccessorDirective, CuiDestroyService, CuiDimensionsObserverDirective, CuiDragDropDirective, CuiDragListDirective, CuiDragPointerDirective, CuiElementDirective, CuiFilterPipe, CuiFocusTrapDirective, CuiHandleScrollDirective, CuiHovered, CuiHoveredService, CuiIdService, CuiItemDirective, CuiLadderListDirective, CuiLetContext, CuiLetDirective, CuiPopoverService, CuiPureException, CuiTargetDirective, CuiTime, CuiTypedTemplateDirective, EMPTY_ARRAY, EMPTY_CLIENT_RECT, EMPTY_FUNCTION, EMPTY_QUERY, FilesUploader, SystemUnits, UnitsAmount, UnitsImperial, UnitsImperialLength, UnitsImperialSquare, UnitsImperialVolume, UnitsImperialWeight, UnitsMetric, UnitsMetricLength, UnitsMetricSquare, UnitsMetricVolume, UnitsMetricWeight, cuiArrayRemove, cuiBlurNativeFocused, cuiClamp, cuiContainsOrAfter, cuiCreateToken, cuiCreateTokenFromFactory, cuiGetActualTarget, cuiGetClosestFocusable, cuiGetDocumentOrShadowRoot, cuiGetElementObscures, cuiGetNativeFocused, cuiHovered, cuiIfMap, cuiInjectElement, cuiIsElement, cuiIsHTMLElement, cuiIsInput, cuiIsIos, cuiIsNativeFocused, cuiIsNativeKeyboardFocusable, cuiIsNativeMouseFocusable, cuiIsPresent, cuiIsTextNode, cuiIsTextarea, cuiIsTextfield, cuiMoveItemInArray, cuiPointToClientRect, cuiProvide, cuiPure, cuiPx, cuiTypedFromEvent, cuiWatch, cuiZoneOptimized, cuiZonefree, cuiZonefreeScheduler, cuiZonefull, cuiZonefullScheduler, svgNodeFilter, takeCaptureFromVideo };
+//# sourceMappingURL=cuby-ui-cdk.mjs.map