@wirekyt/angular 0.0.16 → 0.0.18

package/dist/fesm2022/wirekyt-angular-drawer.mjs

@@ -0,0 +1,706 @@
+import * as drawer from '@wirekyt/dom/machines/drawer';
+export { anatomy as drawerAnatomy } from '@wirekyt/dom/machines/drawer';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, input, model, booleanAttribute, output, EnvironmentInjector, Injector, forwardRef, Directive, computed, DestroyRef, Renderer2, ElementRef, TemplateRef, ViewContainerRef, effect, untracked, signal } from '@angular/core';
+import { injectLocale, injectEnvironment, createId, useMachine, buildRootCarrier, bindProps, normalizeProps } from '@wirekyt/angular';
+import { PresenceBase, PRESENCE_CONTEXT, injectPresenceContext, usePresence } from '@wirekyt/angular/presence';
+
+const DRAWER_CONTEXT = new InjectionToken("WIREKYT.DRAWER_CONTEXT");
+function injectDrawerContext() {
+    return inject(DRAWER_CONTEXT);
+}
+const DRAWER_CONTEXT_CARRIER = new InjectionToken("WIREKYT.DRAWER_CONTEXT_CARRIER");
+function injectDrawerContextCarrier() {
+    return inject(DRAWER_CONTEXT_CARRIER);
+}
+const DRAWER_RENDER_STRATEGY_CONTEXT = new InjectionToken("WIREKYT.DRAWER_RENDER_STRATEGY_CONTEXT");
+function injectDrawerRenderStrategyContext() {
+    return inject(DRAWER_RENDER_STRATEGY_CONTEXT);
+}
+
+const DRAWER_STACK_CONTEXT = new InjectionToken("WIREKYT.DRAWER_STACK_CONTEXT");
+function injectDrawerStackContext() {
+    return inject(DRAWER_STACK_CONTEXT);
+}
+function injectDrawerStackContextOptional() {
+    return inject(DRAWER_STACK_CONTEXT, { optional: true });
+}
+
+function useDrawer(options) {
+    const locale = injectLocale();
+    const environment = injectEnvironment();
+    const ancestorStack = injectDrawerStackContextOptional();
+    const fallbackId = createId();
+    return useMachine({
+        machine: drawer.machine,
+        context: () => {
+            const props = options.context();
+            return {
+                ...props,
+                dir: locale.dir,
+                getRootNode: environment.getRootNode,
+                id: props.id ?? fallbackId,
+                stack: props.stack ?? ancestorStack?.stack,
+            };
+        },
+        connect: (service, normalize) => drawer.connect(service, normalize),
+    });
+}
+
+class DrawerRoot extends PresenceBase {
+    id = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    ids = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ids" }] : /* istanbul ignore next */ []));
+    open = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    defaultOpen = input(false, { ...(ngDevMode ? { debugName: "defaultOpen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    modal = input(true, { ...(ngDevMode ? { debugName: "modal" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    closeOnInteractOutside = input(true, { ...(ngDevMode ? { debugName: "closeOnInteractOutside" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    closeOnEscape = input(true, { ...(ngDevMode ? { debugName: "closeOnEscape" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    preventScroll = input(true, { ...(ngDevMode ? { debugName: "preventScroll" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    trapFocus = input(true, { ...(ngDevMode ? { debugName: "trapFocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    restoreFocus = input(true, { ...(ngDevMode ? { debugName: "restoreFocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    initialFocusEl = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialFocusEl" }] : /* istanbul ignore next */ []));
+    finalFocusEl = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "finalFocusEl" }] : /* istanbul ignore next */ []));
+    role = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
+    triggerValue = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerValue" }] : /* istanbul ignore next */ []));
+    defaultTriggerValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultTriggerValue" }] : /* istanbul ignore next */ []));
+    snapPoints = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "snapPoints" }] : /* istanbul ignore next */ []));
+    swipeDirection = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "swipeDirection" }] : /* istanbul ignore next */ []));
+    snapToSequentialPoints = input(false, { ...(ngDevMode ? { debugName: "snapToSequentialPoints" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    swipeVelocityThreshold = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "swipeVelocityThreshold" }] : /* istanbul ignore next */ []));
+    closeThreshold = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeThreshold" }] : /* istanbul ignore next */ []));
+    preventDragOnScroll = input(true, { ...(ngDevMode ? { debugName: "preventDragOnScroll" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    snapPoint = model(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "snapPoint" }] : /* istanbul ignore next */ []));
+    defaultSnapPoint = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultSnapPoint" }] : /* istanbul ignore next */ []));
+    stack = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "stack" }] : /* istanbul ignore next */ []));
+    escapeKeyDown = output();
+    focusOutside = output();
+    interactOutside = output();
+    pointerDownOutside = output();
+    requestDismiss = output();
+    openChangeDetails = output();
+    triggerValueChangeDetails = output();
+    snapPointChangeDetails = output();
+    machine = useDrawer({
+        context: () => ({
+            id: this.id(),
+            ids: this.ids(),
+            open: this.open(),
+            defaultOpen: this.defaultOpen(),
+            modal: this.modal(),
+            closeOnInteractOutside: this.closeOnInteractOutside(),
+            closeOnEscape: this.closeOnEscape(),
+            preventScroll: this.preventScroll(),
+            trapFocus: this.trapFocus(),
+            restoreFocus: this.restoreFocus(),
+            initialFocusEl: this.initialFocusEl(),
+            finalFocusEl: this.finalFocusEl(),
+            role: this.role(),
+            triggerValue: this.triggerValue(),
+            defaultTriggerValue: this.defaultTriggerValue(),
+            snapPoints: this.snapPoints(),
+            swipeDirection: this.swipeDirection(),
+            snapToSequentialPoints: this.snapToSequentialPoints(),
+            swipeVelocityThreshold: this.swipeVelocityThreshold(),
+            closeThreshold: this.closeThreshold(),
+            preventDragOnScroll: this.preventDragOnScroll(),
+            snapPoint: this.snapPoint(),
+            defaultSnapPoint: this.defaultSnapPoint(),
+            stack: this.stack(),
+            onOpenChange: (details) => {
+                if (this.open() !== details.open)
+                    this.open.set(details.open);
+                this.openChangeDetails.emit(details);
+            },
+            onTriggerValueChange: (details) => {
+                if (this.triggerValue() !== details.value)
+                    this.triggerValue.set(details.value);
+                this.triggerValueChangeDetails.emit(details);
+            },
+            onSnapPointChange: (details) => {
+                if (this.snapPoint() !== details.snapPoint)
+                    this.snapPoint.set(details.snapPoint);
+                this.snapPointChangeDetails.emit(details);
+            },
+            onEscapeKeyDown: (event) => this.escapeKeyDown.emit(event),
+            onFocusOutside: (event) => this.focusOutside.emit(event),
+            onInteractOutside: (event) => this.interactOutside.emit(event),
+            onPointerDownOutside: (event) => this.pointerDownOutside.emit(event),
+            onRequestDismiss: (event) => this.requestDismiss.emit(event),
+        }),
+    });
+    state = this.machine.state;
+    api = this.machine.api;
+    service = this.machine.service;
+    send = this.machine.send;
+    presence = this.createPresence(() => this.api().open);
+    contextCarrier = buildRootCarrier({
+        providers: [
+            { provide: PRESENCE_CONTEXT, useValue: this.presence },
+            { provide: DRAWER_RENDER_STRATEGY_CONTEXT, useValue: this },
+        ],
+        root: this,
+        rootToken: DRAWER_CONTEXT,
+        originInjector: inject(Injector),
+        environmentInjector: inject(EnvironmentInjector),
+    });
+    getContextCarrier() {
+        return this.contextCarrier;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerRoot, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: DrawerRoot, isStandalone: true, selector: "[drawer-root]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ids: { classPropertyName: "ids", publicName: "ids", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, closeOnInteractOutside: { classPropertyName: "closeOnInteractOutside", publicName: "closeOnInteractOutside", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, preventScroll: { classPropertyName: "preventScroll", publicName: "preventScroll", isSignal: true, isRequired: false, transformFunction: null }, trapFocus: { classPropertyName: "trapFocus", publicName: "trapFocus", isSignal: true, isRequired: false, transformFunction: null }, restoreFocus: { classPropertyName: "restoreFocus", publicName: "restoreFocus", isSignal: true, isRequired: false, transformFunction: null }, initialFocusEl: { classPropertyName: "initialFocusEl", publicName: "initialFocusEl", isSignal: true, isRequired: false, transformFunction: null }, finalFocusEl: { classPropertyName: "finalFocusEl", publicName: "finalFocusEl", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, triggerValue: { classPropertyName: "triggerValue", publicName: "triggerValue", isSignal: true, isRequired: false, transformFunction: null }, defaultTriggerValue: { classPropertyName: "defaultTriggerValue", publicName: "defaultTriggerValue", isSignal: true, isRequired: false, transformFunction: null }, snapPoints: { classPropertyName: "snapPoints", publicName: "snapPoints", isSignal: true, isRequired: false, transformFunction: null }, swipeDirection: { classPropertyName: "swipeDirection", publicName: "swipeDirection", isSignal: true, isRequired: false, transformFunction: null }, snapToSequentialPoints: { classPropertyName: "snapToSequentialPoints", publicName: "snapToSequentialPoints", isSignal: true, isRequired: false, transformFunction: null }, swipeVelocityThreshold: { classPropertyName: "swipeVelocityThreshold", publicName: "swipeVelocityThreshold", isSignal: true, isRequired: false, transformFunction: null }, closeThreshold: { classPropertyName: "closeThreshold", publicName: "closeThreshold", isSignal: true, isRequired: false, transformFunction: null }, preventDragOnScroll: { classPropertyName: "preventDragOnScroll", publicName: "preventDragOnScroll", isSignal: true, isRequired: false, transformFunction: null }, snapPoint: { classPropertyName: "snapPoint", publicName: "snapPoint", isSignal: true, isRequired: false, transformFunction: null }, defaultSnapPoint: { classPropertyName: "defaultSnapPoint", publicName: "defaultSnapPoint", isSignal: true, isRequired: false, transformFunction: null }, stack: { classPropertyName: "stack", publicName: "stack", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", triggerValue: "triggerValueChange", snapPoint: "snapPointChange", escapeKeyDown: "escapeKeyDown", focusOutside: "focusOutside", interactOutside: "interactOutside", pointerDownOutside: "pointerDownOutside", requestDismiss: "requestDismiss", openChangeDetails: "openChangeDetails", triggerValueChangeDetails: "triggerValueChangeDetails", snapPointChangeDetails: "snapPointChangeDetails" }, providers: [
+            {
+                provide: PRESENCE_CONTEXT,
+                useFactory: (root) => root.presence,
+                deps: [forwardRef(() => DrawerRoot)],
+            },
+            { provide: DRAWER_RENDER_STRATEGY_CONTEXT, useExisting: forwardRef(() => DrawerRoot) },
+            { provide: DRAWER_CONTEXT, useExisting: forwardRef(() => DrawerRoot) },
+            {
+                provide: DRAWER_CONTEXT_CARRIER,
+                useFactory: (root) => root.getContextCarrier(),
+                deps: [forwardRef(() => DrawerRoot)],
+            },
+        ], exportAs: ["drawerRoot"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerRoot, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-root]",
+                    standalone: true,
+                    exportAs: "drawerRoot",
+                    providers: [
+                        {
+                            provide: PRESENCE_CONTEXT,
+                            useFactory: (root) => root.presence,
+                            deps: [forwardRef(() => DrawerRoot)],
+                        },
+                        { provide: DRAWER_RENDER_STRATEGY_CONTEXT, useExisting: forwardRef(() => DrawerRoot) },
+                        { provide: DRAWER_CONTEXT, useExisting: forwardRef(() => DrawerRoot) },
+                        {
+                            provide: DRAWER_CONTEXT_CARRIER,
+                            useFactory: (root) => root.getContextCarrier(),
+                            deps: [forwardRef(() => DrawerRoot)],
+                        },
+                    ],
+                }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], ids: [{ type: i0.Input, args: [{ isSignal: true, alias: "ids", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], closeOnInteractOutside: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnInteractOutside", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], preventScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventScroll", required: false }] }], trapFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "trapFocus", required: false }] }], restoreFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "restoreFocus", required: false }] }], initialFocusEl: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocusEl", required: false }] }], finalFocusEl: [{ type: i0.Input, args: [{ isSignal: true, alias: "finalFocusEl", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], triggerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerValue", required: false }] }, { type: i0.Output, args: ["triggerValueChange"] }], defaultTriggerValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultTriggerValue", required: false }] }], snapPoints: [{ type: i0.Input, args: [{ isSignal: true, alias: "snapPoints", required: false }] }], swipeDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "swipeDirection", required: false }] }], snapToSequentialPoints: [{ type: i0.Input, args: [{ isSignal: true, alias: "snapToSequentialPoints", required: false }] }], swipeVelocityThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "swipeVelocityThreshold", required: false }] }], closeThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeThreshold", required: false }] }], preventDragOnScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventDragOnScroll", required: false }] }], snapPoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "snapPoint", required: false }] }, { type: i0.Output, args: ["snapPointChange"] }], defaultSnapPoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSnapPoint", required: false }] }], stack: [{ type: i0.Input, args: [{ isSignal: true, alias: "stack", required: false }] }], escapeKeyDown: [{ type: i0.Output, args: ["escapeKeyDown"] }], focusOutside: [{ type: i0.Output, args: ["focusOutside"] }], interactOutside: [{ type: i0.Output, args: ["interactOutside"] }], pointerDownOutside: [{ type: i0.Output, args: ["pointerDownOutside"] }], requestDismiss: [{ type: i0.Output, args: ["requestDismiss"] }], openChangeDetails: [{ type: i0.Output, args: ["openChangeDetails"] }], triggerValueChangeDetails: [{ type: i0.Output, args: ["triggerValueChangeDetails"] }], snapPointChangeDetails: [{ type: i0.Output, args: ["snapPointChangeDetails"] }] } });
+
+class DrawerRootProvider extends PresenceBase {
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    state = computed(() => this.value().state(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    api = computed(() => this.value().api(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "api" }] : /* istanbul ignore next */ []));
+    send = (event) => this.value().send(event);
+    get service() {
+        return this.value().service;
+    }
+    presence = this.createPresence(() => {
+        try {
+            return this.api().open;
+        }
+        catch {
+            return false;
+        }
+    });
+    contextCarrier = buildRootCarrier({
+        providers: [
+            { provide: PRESENCE_CONTEXT, useValue: this.presence },
+            { provide: DRAWER_RENDER_STRATEGY_CONTEXT, useValue: this },
+        ],
+        root: this,
+        rootToken: DRAWER_CONTEXT,
+        originInjector: inject(Injector),
+        environmentInjector: inject(EnvironmentInjector),
+    });
+    getContextCarrier() {
+        return this.contextCarrier;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerRootProvider, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: DrawerRootProvider, isStandalone: true, selector: "[drawer-root-provider]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+            {
+                provide: PRESENCE_CONTEXT,
+                useFactory: (provider) => provider.presence,
+                deps: [forwardRef(() => DrawerRootProvider)],
+            },
+            {
+                provide: DRAWER_RENDER_STRATEGY_CONTEXT,
+                useExisting: forwardRef(() => DrawerRootProvider),
+            },
+            { provide: DRAWER_CONTEXT, useExisting: forwardRef(() => DrawerRootProvider) },
+            {
+                provide: DRAWER_CONTEXT_CARRIER,
+                useFactory: (provider) => provider.getContextCarrier(),
+                deps: [forwardRef(() => DrawerRootProvider)],
+            },
+        ], exportAs: ["drawerRootProvider"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerRootProvider, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-root-provider]",
+                    standalone: true,
+                    exportAs: "drawerRootProvider",
+                    providers: [
+                        {
+                            provide: PRESENCE_CONTEXT,
+                            useFactory: (provider) => provider.presence,
+                            deps: [forwardRef(() => DrawerRootProvider)],
+                        },
+                        {
+                            provide: DRAWER_RENDER_STRATEGY_CONTEXT,
+                            useExisting: forwardRef(() => DrawerRootProvider),
+                        },
+                        { provide: DRAWER_CONTEXT, useExisting: forwardRef(() => DrawerRootProvider) },
+                        {
+                            provide: DRAWER_CONTEXT_CARRIER,
+                            useFactory: (provider) => provider.getContextCarrier(),
+                            deps: [forwardRef(() => DrawerRootProvider)],
+                        },
+                    ],
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
+
+class DrawerTrigger {
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectDrawerContext();
+        const presence = injectPresenceContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                const props = context.api().getTriggerProps({ value: this.value() });
+                return {
+                    ...props,
+                    "aria-controls": presence.unmounted() ? undefined : props["aria-controls"],
+                };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: DrawerTrigger, isStandalone: true, selector: "[drawer-trigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["drawerTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-trigger]",
+                    standalone: true,
+                    exportAs: "drawerTrigger",
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] } });
+
+class DrawerBackdrop {
+    constructor() {
+        const context = injectDrawerContext();
+        const renderStrategy = injectDrawerRenderStrategyContext();
+        const presence = usePresence({
+            context: () => ({
+                present: context.api().open,
+                lazyMount: renderStrategy.lazyMount(),
+                unmountOnExit: renderStrategy.unmountOnExit(),
+            }),
+        });
+        const template = inject((TemplateRef), { optional: true });
+        const container = inject(ViewContainerRef);
+        const host = inject(ElementRef);
+        const elementRef = template ? { nativeElement: null } : host;
+        let view;
+        effect(() => {
+            const unmounted = presence.unmounted();
+            if (template) {
+                if (unmounted) {
+                    elementRef.nativeElement = null;
+                    container.clear();
+                    view = undefined;
+                }
+                else if (!view) {
+                    view = container.createEmbeddedView(template);
+                    elementRef.nativeElement =
+                        view.rootNodes.find((node) => node.nodeType === 1) ?? null;
+                }
+            }
+            untracked(() => presence.setNode(elementRef.nativeElement));
+        });
+        bindProps({
+            elementRef,
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                presence.unmounted();
+                return { ...context.api().getBackdropProps(), ...presence.getPresenceProps() };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerBackdrop, isStandalone: true, selector: "[drawer-backdrop]", exportAs: ["drawerBackdrop"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerBackdrop, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-backdrop]",
+                    standalone: true,
+                    exportAs: "drawerBackdrop",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerPositioner {
+    constructor() {
+        const context = injectDrawerContext();
+        const presence = injectPresenceContext();
+        const template = inject((TemplateRef), { optional: true });
+        const container = inject(ViewContainerRef);
+        const host = inject(ElementRef);
+        const elementRef = template ? { nativeElement: null } : host;
+        let view;
+        effect(() => {
+            const unmounted = presence.unmounted();
+            if (template) {
+                if (unmounted) {
+                    elementRef.nativeElement = null;
+                    container.clear();
+                    view = undefined;
+                }
+                else if (!view) {
+                    view = container.createEmbeddedView(template);
+                    elementRef.nativeElement =
+                        view.rootNodes.find((node) => node.nodeType === 1) ?? null;
+                }
+            }
+        });
+        bindProps({
+            elementRef,
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                const unmounted = presence.unmounted();
+                return { ...context.api().getPositionerProps(), hidden: unmounted };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerPositioner, isStandalone: true, selector: "[drawer-positioner]", exportAs: ["drawerPositioner"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerPositioner, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-positioner]",
+                    standalone: true,
+                    exportAs: "drawerPositioner",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerContent {
+    draggable = input(true, { ...(ngDevMode ? { debugName: "draggable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    constructor() {
+        const context = injectDrawerContext();
+        const presence = injectPresenceContext();
+        const template = inject((TemplateRef), { optional: true });
+        const container = inject(ViewContainerRef);
+        const host = inject(ElementRef);
+        const elementRef = template ? { nativeElement: null } : host;
+        let view;
+        effect(() => {
+            const unmounted = presence.unmounted();
+            if (template) {
+                if (unmounted) {
+                    elementRef.nativeElement = null;
+                    container.clear();
+                    view = undefined;
+                }
+                else if (!view) {
+                    view = container.createEmbeddedView(template);
+                    elementRef.nativeElement =
+                        view.rootNodes.find((node) => node.nodeType === 1) ?? null;
+                }
+            }
+            untracked(() => presence.setNode(elementRef.nativeElement));
+        });
+        bindProps({
+            elementRef,
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => {
+                presence.unmounted();
+                return {
+                    ...context.api().getContentProps({ draggable: this.draggable() }),
+                    ...presence.getPresenceProps(),
+                };
+            },
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: DrawerContent, isStandalone: true, selector: "[drawer-content]", inputs: { draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["drawerContent"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerContent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-content]",
+                    standalone: true,
+                    exportAs: "drawerContent",
+                }]
+        }], ctorParameters: () => [], propDecorators: { draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }] } });
+
+class DrawerTitle {
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getTitleProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerTitle, isStandalone: true, selector: "[drawer-title]", exportAs: ["drawerTitle"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerTitle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-title]",
+                    standalone: true,
+                    exportAs: "drawerTitle",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerDescription {
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getDescriptionProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerDescription, isStandalone: true, selector: "[drawer-description]", exportAs: ["drawerDescription"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerDescription, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-description]",
+                    standalone: true,
+                    exportAs: "drawerDescription",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerCloseTrigger {
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getCloseTriggerProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerCloseTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerCloseTrigger, isStandalone: true, selector: "[drawer-close-trigger]", exportAs: ["drawerCloseTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerCloseTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-close-trigger]",
+                    standalone: true,
+                    exportAs: "drawerCloseTrigger",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerGrabber {
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getGrabberProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerGrabber, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerGrabber, isStandalone: true, selector: "[drawer-grabber]", exportAs: ["drawerGrabber"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerGrabber, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-grabber]",
+                    standalone: true,
+                    exportAs: "drawerGrabber",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerGrabberIndicator {
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getGrabberIndicatorProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerGrabberIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerGrabberIndicator, isStandalone: true, selector: "[drawer-grabber-indicator]", exportAs: ["drawerGrabberIndicator"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerGrabberIndicator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-grabber-indicator]",
+                    standalone: true,
+                    exportAs: "drawerGrabberIndicator",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerSwipeArea {
+    /** Whether the swipe area is disabled. */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** The swipe direction that opens the drawer. */
+    swipeDirection = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "swipeDirection" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const context = injectDrawerContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context
+                .api()
+                .getSwipeAreaProps({ disabled: this.disabled(), swipeDirection: this.swipeDirection() }),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerSwipeArea, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: DrawerSwipeArea, isStandalone: true, selector: "[drawer-swipe-area]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, swipeDirection: { classPropertyName: "swipeDirection", publicName: "swipeDirection", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["drawerSwipeArea"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerSwipeArea, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-swipe-area]",
+                    standalone: true,
+                    exportAs: "drawerSwipeArea",
+                }]
+        }], ctorParameters: () => [], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], swipeDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "swipeDirection", required: false }] }] } });
+
+class DrawerIndent {
+    constructor() {
+        const context = injectDrawerStackContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getIndentProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerIndent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerIndent, isStandalone: true, selector: "[drawer-indent]", exportAs: ["drawerIndent"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerIndent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-indent]",
+                    standalone: true,
+                    exportAs: "drawerIndent",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerIndentBackground {
+    constructor() {
+        const context = injectDrawerStackContext();
+        bindProps({
+            elementRef: inject(ElementRef),
+            renderer: inject(Renderer2),
+            destroyRef: inject(DestroyRef),
+            props: () => context.api().getIndentBackgroundProps(),
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerIndentBackground, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerIndentBackground, isStandalone: true, selector: "[drawer-indent-background]", exportAs: ["drawerIndentBackground"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerIndentBackground, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-indent-background]",
+                    standalone: true,
+                    exportAs: "drawerIndentBackground",
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerStack {
+    stack = drawer.createStack();
+    snapshot = signal(this.stack.getSnapshot(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "snapshot" }] : /* istanbul ignore next */ []));
+    unsubscribe = this.stack.subscribe(() => this.snapshot.set(this.stack.getSnapshot()));
+    context = {
+        stack: this.stack,
+        api: computed(() => drawer.connectStack(this.snapshot(), normalizeProps)),
+    };
+    constructor() {
+        inject(DestroyRef).onDestroy(() => this.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerStack, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerStack, isStandalone: true, selector: "[drawer-stack]", providers: [{ provide: DRAWER_STACK_CONTEXT, useFactory: () => inject(DrawerStack).context }], exportAs: ["drawerStack"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerStack, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-stack]",
+                    standalone: true,
+                    exportAs: "drawerStack",
+                    providers: [{ provide: DRAWER_STACK_CONTEXT, useFactory: () => inject(DrawerStack).context }],
+                }]
+        }], ctorParameters: () => [] });
+
+class DrawerContext {
+    static ngTemplateContextGuard(_directive, context) {
+        void context;
+        return true;
+    }
+    drawer = injectDrawerContext();
+    templateRef = inject(TemplateRef);
+    viewContainer = inject(ViewContainerRef);
+    constructor() {
+        const view = this.viewContainer.createEmbeddedView(this.templateRef, {
+            $implicit: this.drawer.api,
+            api: this.drawer.api,
+        });
+        effect(() => {
+            this.drawer.api();
+            view.detectChanges();
+        });
+        inject(DestroyRef).onDestroy(() => view.destroy());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerContext, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: DrawerContext, isStandalone: true, selector: "[drawer-context]", exportAs: ["drawerContext"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: DrawerContext, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[drawer-context]",
+                    standalone: true,
+                    exportAs: "drawerContext",
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DRAWER_CONTEXT, DRAWER_CONTEXT_CARRIER, DRAWER_RENDER_STRATEGY_CONTEXT, DRAWER_STACK_CONTEXT, DrawerBackdrop, DrawerCloseTrigger, DrawerContent, DrawerContext, DrawerDescription, DrawerGrabber, DrawerGrabberIndicator, DrawerIndent, DrawerIndentBackground, DrawerPositioner, DrawerRoot, DrawerRootProvider, DrawerStack, DrawerSwipeArea, DrawerTitle, DrawerTrigger, injectDrawerContext, injectDrawerContextCarrier, injectDrawerRenderStrategyContext, injectDrawerStackContext, useDrawer };
+//# sourceMappingURL=wirekyt-angular-drawer.mjs.map