@agnos-ui/angular-headless 0.0.1-alpha.4 → 0.0.1-alpha.6

package/fesm2022/agnos-ui-angular-headless.mjs

@@ -1,31 +1,57 @@
-import { toReadableStore, createWidgetsConfig, createAccordion as createAccordion$1, createAlert as createAlert$1, createModal as createModal$1, createPagination as createPagination$1, createRating as createRating$1, createSelect as createSelect$1, createProgressbar as createProgressbar$1 } from '@agnos-ui/core';
-export * from '@agnos-ui/core';
-import { writable, computed } from '@amadeus-it-group/tansu';
+import { createAccordion as createAccordion$1 } from '@agnos-ui/core/components/accordion';
+export * from '@agnos-ui/core/components/accordion';
+import { createAlert as createAlert$1 } from '@agnos-ui/core/components/alert';
+export * from '@agnos-ui/core/components/alert';
+import { createModal as createModal$1 } from '@agnos-ui/core/components/modal';
+export * from '@agnos-ui/core/components/modal';
+import { createPagination as createPagination$1 } from '@agnos-ui/core/components/pagination';
+export * from '@agnos-ui/core/components/pagination';
+import { createProgressbar as createProgressbar$1 } from '@agnos-ui/core/components/progressbar';
+export * from '@agnos-ui/core/components/progressbar';
+import { createRating as createRating$1 } from '@agnos-ui/core/components/rating';
+export * from '@agnos-ui/core/components/rating';
+import { createSelect as createSelect$1 } from '@agnos-ui/core/components/select';
+export * from '@agnos-ui/core/components/select';
+export * from '@agnos-ui/core/components/slider';
+export * from '@agnos-ui/core/services/siblingsInert';
+export * from '@agnos-ui/core/services/portal';
+export * from '@agnos-ui/core/services/navManager';
+export * from '@agnos-ui/core/services/intersection';
+export * from '@agnos-ui/core/services/focustrack';
+export * from '@agnos-ui/core/services/floatingUI';
+export * from '@agnos-ui/core/services/extendWidget';
+export * from '@agnos-ui/core/services/transitions/simpleClassTransition';
+export * from '@agnos-ui/core/services/transitions/cssTransitions';
+export * from '@agnos-ui/core/services/transitions/collapse';
+export * from '@agnos-ui/core/services/transitions/bootstrap';
+export * from '@agnos-ui/core/services/transitions/baseTransitions';
+export * from '@agnos-ui/core/utils/writables';
 import * as i0 from '@angular/core';
-import { inject, NgZone, Injectable, signal, DestroyRef, Injector, runInInjectionContext, SkipSelf, Optional, InjectionToken, createComponent, EnvironmentInjector, TemplateRef, reflectComponentType, ViewContainerRef, Directive, Input, ElementRef } from '@angular/core';
+import { NgZone, inject, Injectable, signal, DestroyRef, ElementRef, Directive, Input, Injector, runInInjectionContext, SkipSelf, Optional, InjectionToken, booleanAttribute, numberAttribute, TemplateRef, EnvironmentInjector, createComponent, reflectComponentType, ViewContainerRef } from '@angular/core';
+import { toReadableStore } from '@agnos-ui/core/utils/stores';
+export * from '@agnos-ui/core/utils/stores';
+export * from '@agnos-ui/core/utils/directive';
+import { toSlotContextWidget } from '@agnos-ui/core/types';
+export * from '@agnos-ui/core/types';
+import { createWidgetsConfig } from '@agnos-ui/core/config';
+export * from '@agnos-ui/core/config';
+import { writable, computed } from '@amadeus-it-group/tansu';
 import { DOCUMENT } from '@angular/common';
 
-const createPatchSlots = (set) => {
-    let lastValue = {};
-    return (object) => {
-        const newValue = {};
-        let hasChange = false;
-        for (const key of Object.keys(object)) {
-            const objectKey = object[key];
-            if (objectKey != null) {
-                // only use defined slots
-                newValue[key] = objectKey;
-            }
-            if (objectKey != lastValue[key]) {
-                hasChange = true;
-            }
-        }
-        if (hasChange) {
-            lastValue = newValue;
-            set(newValue);
-        }
-    };
-};
+const createAccordion = createAccordion$1;
+
+const createAlert = createAlert$1;
+
+const createModal = createModal$1;
+
+const createPagination = createPagination$1;
+
+const createProgressbar = createProgressbar$1;
+
+const createRating = createRating$1;
+
+const createSelect = createSelect$1;
+
 const noop = () => { };
 const identity = (a) => a;
 const createObjectWrapper = (wrap) => (object) => {
@@ -51,7 +77,7 @@ class ZoneWrapper {
                     this.#runNeeded = true;
                     if (!this.#runPlanned) {
                         this.#runPlanned = true;
-                        (async () => {
+                        void (async () => {
                             await 0;
                             this.#runPlanned = false;
                             if (this.#runNeeded) {
@@ -81,15 +107,16 @@ class ZoneWrapper {
         this.#runNeeded = false;
         return this.#zone.run(fn);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ZoneWrapper, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ZoneWrapper, providedIn: 'root' }); }
+    static { this.ɵfac = function ZoneWrapper_Factory(t) { return new (t || ZoneWrapper)(); }; }
+    static { this.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: ZoneWrapper, factory: ZoneWrapper.ɵfac, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ZoneWrapper, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ZoneWrapper, [{
+        type: Injectable,
+        args: [{
+                providedIn: 'root',
+            }]
+    }], null, null); })();
+
 const toAngularSignal = (tansuSignal) => {
     const zoneWrapper = inject(ZoneWrapper);
     const res = signal(undefined);
@@ -100,23 +127,147 @@ const toAngularSignal = (tansuSignal) => {
     inject(DestroyRef).onDestroy(zoneWrapper.outsideNgZone(subscription));
     return res;
 };
-const callWidgetFactoryWithConfig = ({ factory, defaultConfig, widgetConfig, events, }) => {
-    const zoneWrapper = inject(ZoneWrapper);
-    factory = zoneWrapper.outsideNgZone(factory);
-    const defaultConfig$ = toReadableStore(defaultConfig);
+
+// All calls of the directive in this class are done asynchronously (with await 0)
+// in order to avoid ExpressionChangedAfterItHasBeenCheckedError
+// or the corresponding issue with signals (https://github.com/angular/angular/issues/50320)
+// This is relevant especially if calling the directive changes variables used in a template.
+const useDirectiveForHost = (use, params) => {
+    const ref = inject(ElementRef);
+    let instance = use?.(ref.nativeElement, params);
+    async function destroyDirectiveInstance() {
+        const oldInstance = instance;
+        instance = undefined;
+        use = undefined;
+        if (oldInstance?.destroy) {
+            await 0;
+            oldInstance.destroy?.();
+        }
+    }
+    inject(DestroyRef).onDestroy(destroyDirectiveInstance);
+    async function update(newUse, newParams) {
+        if (newUse !== use) {
+            void destroyDirectiveInstance();
+            use = newUse;
+            params = newParams;
+            if (newUse) {
+                await 0;
+                // checks that the directive did not change while waiting:
+                if (use === newUse && !instance) {
+                    instance = use(ref.nativeElement, params);
+                }
+            }
+        }
+        else if (newParams != params) {
+            params = newParams;
+            await 0;
+            instance?.update?.(params);
+        }
+    }
+    return { update };
+};
+class UseDirective {
+    #useDirective = useDirectiveForHost();
+    ngOnChanges() {
+        void this.#useDirective.update(this.use, this.params);
+    }
+    static { this.ɵfac = function UseDirective_Factory(t) { return new (t || UseDirective)(); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: UseDirective, selectors: [["", "auUse", ""]], inputs: { use: ["auUse", "use"], params: ["auUseParams", "params"] }, standalone: true, features: [i0.ɵɵNgOnChangesFeature] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(UseDirective, [{
+        type: Directive,
+        args: [{
+                standalone: true,
+                selector: '[auUse]',
+            }]
+    }], null, { use: [{
+            type: Input,
+            args: ['auUse']
+        }], params: [{
+            type: Input,
+            args: ['auUseParams']
+        }] }); })();
+
+class ComponentTemplate {
+    constructor(component, templateProp) {
+        this.component = component;
+        this.templateProp = templateProp;
+    }
+}
+class SlotComponent {
+    static { this.ɵfac = function SlotComponent_Factory(t) { return new (t || SlotComponent)(); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SlotComponent, inputs: { state: "state", widget: "widget" } }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SlotComponent, [{
+        type: Directive
+    }], null, { state: [{
+            type: Input
+        }], widget: [{
+            type: Input
+        }] }); })();
+
+const createPatchSlots = (set) => {
+    let lastValue = {};
+    return (object) => {
+        const newValue = {};
+        let hasChange = false;
+        for (const key of Object.keys(object)) {
+            const objectKey = object[key];
+            if (objectKey != null) {
+                // only use defined slots
+                newValue[key] = objectKey;
+            }
+            if (objectKey != lastValue[key]) {
+                hasChange = true;
+            }
+        }
+        if (hasChange) {
+            lastValue = newValue;
+            set(newValue);
+        }
+    };
+};
+const callWidgetFactoryWithConfig = ({ factory, defaultConfig, widgetConfig, events, afterInit, }) => {
+    const injector = inject(Injector);
     const slots$ = writable({});
-    events = zoneWrapper.insideNgZoneWrapFunctionsObject(events);
-    const widget = factory({
-        config: computed(() => ({ ...defaultConfig$(), ...widgetConfig?.(), ...slots$(), ...events })),
-    });
-    return {
-        ...widget,
-        patch: zoneWrapper.outsideNgZone(widget.patch),
-        directives: zoneWrapper.outsideNgZoneWrapDirectivesObject(widget.directives),
-        actions: zoneWrapper.outsideNgZoneWrapFunctionsObject(widget.actions),
-        api: zoneWrapper.outsideNgZoneWrapFunctionsObject(widget.api),
+    const props = {};
+    let initDone;
+    const res = {
+        initialized: new Promise((resolve) => {
+            initDone = resolve;
+        }),
         patchSlots: createPatchSlots(slots$.set),
+        patch(newProps) {
+            // temporary function replaced in ngInit
+            Object.assign(props, newProps);
+        },
+        ngInit() {
+            runInInjectionContext(injector, () => {
+                const zoneWrapper = inject(ZoneWrapper);
+                factory = zoneWrapper.outsideNgZone(factory);
+                const defaultConfig$ = toReadableStore(defaultConfig);
+                events = zoneWrapper.insideNgZoneWrapFunctionsObject(events);
+                const widget = factory({
+                    config: computed(() => ({ ...defaultConfig$(), ...widgetConfig?.(), ...slots$(), ...events })),
+                    props,
+                });
+                const wrappedWidget = {
+                    ...widget,
+                    patch: zoneWrapper.outsideNgZone(widget.patch),
+                    directives: zoneWrapper.outsideNgZoneWrapDirectivesObject(widget.directives),
+                    actions: zoneWrapper.outsideNgZoneWrapFunctionsObject(widget.actions),
+                    api: zoneWrapper.outsideNgZoneWrapFunctionsObject(widget.api),
+                };
+                Object.assign(res, wrappedWidget, {
+                    widget: toSlotContextWidget(wrappedWidget),
+                    ngState: toAngularSignal(wrappedWidget.state$),
+                });
+                afterInit?.();
+                initDone();
+            });
+        },
     };
+    return res;
 };
 function patchSimpleChanges(patchFn, changes) {
     const obj = {};
@@ -127,6 +278,41 @@ function patchSimpleChanges(patchFn, changes) {
     }
     patchFn(obj);
 }
+/**
+ * Stores the result of the first call to the getter and returns that result directly for subsequent calls
+ *
+ * Applies to: class getters
+ */
+const CachedProperty = (target, property, descriptor) => {
+    const originalGet = descriptor.get;
+    descriptor.get = function () {
+        const value = originalGet?.call(this);
+        Object.defineProperty(this, property, { value, writable: false });
+        return value;
+    };
+};
+class BaseWidgetDirective {
+    get api() {
+        return this._widget.api;
+    }
+    get state() {
+        return this._widget.ngState;
+    }
+    get widget() {
+        return this._widget.widget;
+    }
+    ngOnChanges(changes) {
+        patchSimpleChanges(this._widget.patch, changes);
+    }
+    ngOnInit() {
+        this._widget.ngInit();
+    }
+    static { this.ɵfac = function BaseWidgetDirective_Factory(t) { return new (t || BaseWidgetDirective)(); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: BaseWidgetDirective, features: [i0.ɵɵNgOnChangesFeature] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BaseWidgetDirective, [{
+        type: Directive
+    }], null, null); })();
 
 const widgetsConfigFactory = (widgetsConfigInjectionToken = new InjectionToken('widgetsConfig')) => {
     /**
@@ -207,11 +393,12 @@ const widgetsConfigFactory = (widgetsConfigInjectionToken = new InjectionToken('
         const widgetsConfig = inject(widgetsConfigInjectionToken, { optional: true });
         return computed(() => widgetsConfig?.()[widgetName]);
     };
-    const callWidgetFactory = ({ factory, widgetName = null, defaultConfig = {}, events, }) => callWidgetFactoryWithConfig({
+    const callWidgetFactory = ({ factory, widgetName = null, defaultConfig = {}, events, afterInit, }) => callWidgetFactoryWithConfig({
         factory,
         widgetConfig: widgetName ? injectWidgetConfig(widgetName) : null,
         defaultConfig,
         events,
+        afterInit,
     });
     return {
         /**
@@ -226,12 +413,56 @@ const widgetsConfigFactory = (widgetsConfigInjectionToken = new InjectionToken('
 };
 const { widgetsConfigInjectionToken, provideWidgetsConfig, injectWidgetConfig, injectWidgetsConfig, callWidgetFactory } = widgetsConfigFactory();
 
-class ComponentTemplate {
-    constructor(component, templateProp) {
-        this.component = component;
-        this.templateProp = templateProp;
+/**
+ * Transforms a value (typically a string) to a boolean.
+ * Intended to be used as a transform function of an input.
+ *
+ *  @usageNotes
+ *  ```typescript
+ *  @Input({ transform: auBooleanAttribute }) status: boolean | undefined;
+ *  ```
+ * @param value Value to be transformed.
+ */
+function auBooleanAttribute(value) {
+    if (value === undefined) {
+        return undefined;
+    }
+    return booleanAttribute(value);
+}
+/**
+ * Transforms a value (typically a string) to a number.
+ * Intended to be used as a transform function of an input.
+ * @param value Value to be transformed.
+ *
+ *  @usageNotes
+ *  ```typescript
+ *  @Input({ transform: auNumberAttribute }) id: number | undefined;
+ *  ```
+ */
+function auNumberAttribute(value) {
+    if (value === undefined) {
+        return undefined;
+    }
+    return numberAttribute(value);
+}
+
+class SlotDefaultDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
     }
+    ngOnInit() {
+        this.auSlotDefault.update((value) => ({ ...value, slotDefault: this.templateRef }));
+    }
+    static { this.ɵfac = function SlotDefaultDirective_Factory(t) { return new (t || SlotDefaultDirective)(); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SlotDefaultDirective, selectors: [["", "auSlotDefault", ""]], inputs: { auSlotDefault: "auSlotDefault" }, standalone: true }); }
 }
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SlotDefaultDirective, [{
+        type: Directive,
+        args: [{ selector: '[auSlotDefault]', standalone: true }]
+    }], null, { auSlotDefault: [{
+            type: Input,
+            args: ['auSlotDefault']
+        }] }); })();
 
 class SlotHandler {
     constructor(viewContainerRef, document) {
@@ -411,115 +642,30 @@ class SlotDirective {
         this._slotHandler?.destroy();
         this._slotHandler = undefined;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SlotDirective, isStandalone: true, selector: "[auSlot]", inputs: { slot: ["auSlot", "slot"], props: ["auSlotProps", "props"] }, usesOnChanges: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlotDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[auSlot]',
-                    standalone: true,
-                }]
-        }], propDecorators: { slot: [{
-                type: Input,
-                args: ['auSlot']
-            }], props: [{
-                type: Input,
-                args: ['auSlotProps']
-            }] } });
-
-class SlotDefaultDirective {
-    constructor() {
-        this.templateRef = inject((TemplateRef));
-    }
-    ngOnInit() {
-        this.auSlotDefault.update((value) => ({ ...value, slotDefault: this.templateRef }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlotDefaultDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: SlotDefaultDirective, isStandalone: true, selector: "[auSlotDefault]", inputs: { auSlotDefault: "auSlotDefault" }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlotDefaultDirective, decorators: [{
-            type: Directive,
-            args: [{ selector: '[auSlotDefault]', standalone: true }]
-        }], propDecorators: { auSlotDefault: [{
-                type: Input,
-                args: ['auSlotDefault']
-            }] } });
-
-// All calls of the directive in this class are done asynchronously (with await 0)
-// in order to avoid ExpressionChangedAfterItHasBeenCheckedError
-// or the corresponding issue with signals (https://github.com/angular/angular/issues/50320)
-// This is relevant especially if calling the directive changes variables used in a template.
-const useDirectiveForHost = (use, params) => {
-    const ref = inject(ElementRef);
-    let instance = use?.(ref.nativeElement, params);
-    async function destroyDirectiveInstance() {
-        const oldInstance = instance;
-        instance = undefined;
-        use = undefined;
-        if (oldInstance?.destroy) {
-            await 0;
-            oldInstance.destroy?.();
-        }
-    }
-    inject(DestroyRef).onDestroy(destroyDirectiveInstance);
-    async function update(newUse, newParams) {
-        if (newUse !== use) {
-            destroyDirectiveInstance();
-            use = newUse;
-            params = newParams;
-            if (newUse) {
-                await 0;
-                // checks that the directive did not change while waiting:
-                if (use === newUse && !instance) {
-                    instance = use(ref.nativeElement, params);
-                }
-            }
-        }
-        else if (newParams != params) {
-            params = newParams;
-            await 0;
-            instance?.update?.(params);
-        }
-    }
-    return { update };
-};
-class UseDirective {
-    #useDirective = useDirectiveForHost();
-    ngOnChanges() {
-        this.#useDirective.update(this.use, this.params);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: UseDirective, isStandalone: true, selector: "[auUse]", inputs: { use: ["auUse", "use"], params: ["auUseParams", "params"] }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = function SlotDirective_Factory(t) { return new (t || SlotDirective)(); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SlotDirective, selectors: [["", "auSlot", ""]], inputs: { slot: ["auSlot", "slot"], props: ["auSlotProps", "props"] }, standalone: true, features: [i0.ɵɵNgOnChangesFeature] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UseDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    standalone: true,
-                    selector: '[auUse]',
-                }]
-        }], propDecorators: { use: [{
-                type: Input,
-                args: ['auUse']
-            }], params: [{
-                type: Input,
-                args: ['auUseParams']
-            }] } });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SlotDirective, [{
+        type: Directive,
+        args: [{
+                selector: '[auSlot]',
+                standalone: true,
+            }]
+    }], null, { slot: [{
+            type: Input,
+            args: ['auSlot']
+        }], props: [{
+            type: Input,
+            args: ['auSlotProps']
+        }] }); })();
 
 /*
  * Public API Surface of @agnos-ui/angular-headless
  */
-const createAccordion = createAccordion$1;
-const createAlert = createAlert$1;
-const createModal = createModal$1;
-const createPagination = createPagination$1;
-const createRating = createRating$1;
-const createSelect = createSelect$1;
-const createProgressbar = createProgressbar$1;
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ComponentTemplate, SlotDefaultDirective, SlotDirective, UseDirective, callWidgetFactory, callWidgetFactoryWithConfig, createAccordion, createAlert, createModal, createPagination, createProgressbar, createRating, createSelect, injectWidgetConfig, injectWidgetsConfig, patchSimpleChanges, provideWidgetsConfig, toAngularSignal, useDirectiveForHost, widgetsConfigFactory, widgetsConfigInjectionToken };
+export { BaseWidgetDirective, CachedProperty, ComponentTemplate, SlotComponent, SlotDefaultDirective, SlotDirective, UseDirective, ZoneWrapper, auBooleanAttribute, auNumberAttribute, callWidgetFactory, callWidgetFactoryWithConfig, createAccordion, createAlert, createModal, createPagination, createProgressbar, createRating, createSelect, injectWidgetConfig, injectWidgetsConfig, provideWidgetsConfig, toAngularSignal, useDirectiveForHost, widgetsConfigFactory, widgetsConfigInjectionToken };
 //# sourceMappingURL=agnos-ui-angular-headless.mjs.map