@coreui/angular-pro 5.3.9 → 5.3.11

package/fesm2022/coreui-angular-pro.mjs

@@ -1375,10 +1375,10 @@ class BackdropService {
             this.#unListen();
             this.#renderer.removeClass(backdropElement, 'show');
             setTimeout(() => {
-                this.#renderer.removeChild(this.#document.body, backdropElement);
                 if (this.activeBackdrop === backdropElement) {
                     this.resetScrollbar();
                 }
+                this.#renderer.removeChild(this.#document.body, backdropElement);
                 backdropElement = undefined;
             }, 300);
         }
@@ -11686,7 +11686,6 @@ class OffcanvasComponent {
          * @default true
          */
         this.ariaModal = input(true, { transform: booleanAttribute });
-        this.#show = false;
         /**
          * Allow body scrolling while offcanvas is visible.
          * @return boolean
@@ -11699,13 +11698,10 @@ class OffcanvasComponent {
          * @default false
          */
         this.visibleInput = input(false, { transform: booleanAttribute, alias: 'visible' });
-        this.visibleInputEffect = effect(() => {
-            const visible = this.visibleInput();
-            untracked(() => {
-                this.visible.set(visible);
-            });
+        this.visible = linkedSignal({
+            source: () => this.visibleInput(),
+            computation: (value) => value
         });
-        this.visible = signal(false);
         this.visibleEffect = effect(() => {
             const visible = this.visible();
             if (visible) {
@@ -11720,17 +11716,18 @@ class OffcanvasComponent {
         });
         /**
          * Event triggered on visible change.
-         * @return EventEmitter<boolean>
+         * @return <boolean>
          */
         this.visibleChange = output();
         this.hostClasses = computed(() => {
             const responsive = this.responsive();
             const placement = this.placement();
+            const visible = this.visible();
             return {
                 offcanvas: typeof responsive === 'boolean',
                 [`offcanvas-${responsive}`]: typeof responsive !== 'boolean',
                 [`offcanvas-${placement}`]: !!placement,
-                show: this.show
+                show: visible
             };
         });
         this.ariaHidden = computed(() => {
@@ -11748,18 +11745,14 @@ class OffcanvasComponent {
     #activeBackdrop;
     #backdropClickSubscription;
     #layoutChangeSubscription;
-    #show;
     get tabIndex() {
         return '-1';
     }
-    get animateTrigger() {
-        return this.visible() ? 'visible' : 'hidden';
-    }
     get show() {
-        return this.visible() && this.#show;
+        return this.visible();
     }
     set show(value) {
-        this.#show = value;
+        this.visible.set(value);
     }
     get responsiveBreakpoint() {
         const responsive = this.responsive();
@@ -11861,7 +11854,7 @@ class OffcanvasComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: OffcanvasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.4", type: OffcanvasComponent, isStandalone: true, selector: "c-offcanvas", inputs: { backdrop: { classPropertyName: "backdrop", publicName: "backdrop", isSignal: true, isRequired: false, transformFunction: null }, keyboard: { classPropertyName: "keyboard", publicName: "keyboard", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, ariaModal: { classPropertyName: "ariaModal", publicName: "ariaModal", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, visibleInput: { classPropertyName: "visibleInput", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "@showHide.start": "animateStart($event)", "@showHide.done": "animateDone($event)", "document:keydown": "onKeyDownHandler($event)" }, properties: { "@showHide": "animateTrigger", "attr.id": "id()", "attr.inert": "ariaHidden() || null", "attr.role": "role()", "attr.aria-modal": "ariaModal()", "attr.tabindex": "tabIndex", "class": "hostClasses()" } }, exportAs: ["cOffcanvas"], hostDirectives: [{ directive: ThemeDirective, inputs: ["dark", "dark"] }], ngImport: i0, template: "<div cdkTrapFocus cdkTrapFocusAutoCapture>\n  <ng-content />\n</div>\n\n", styles: [":host{display:none}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.1.4", type: OffcanvasComponent, isStandalone: true, selector: "c-offcanvas", inputs: { backdrop: { classPropertyName: "backdrop", publicName: "backdrop", isSignal: true, isRequired: false, transformFunction: null }, keyboard: { classPropertyName: "keyboard", publicName: "keyboard", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, ariaModal: { classPropertyName: "ariaModal", publicName: "ariaModal", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, visibleInput: { classPropertyName: "visibleInput", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "@showHide.start": "animateStart($event)", "@showHide.done": "animateDone($event)", "document:keydown": "onKeyDownHandler($event)" }, properties: { "@showHide": "this.visible() ? \"visible\" : \"hidden\"", "attr.id": "id()", "attr.inert": "ariaHidden() || null", "attr.role": "role()", "attr.aria-modal": "ariaModal()", "attr.tabindex": "tabIndex", "class": "hostClasses()" } }, exportAs: ["cOffcanvas"], hostDirectives: [{ directive: ThemeDirective, inputs: ["dark", "dark"] }], ngImport: i0, template: "<div cdkTrapFocus cdkTrapFocusAutoCapture>\n  <ng-content />\n</div>\n\n", styles: [":host{display:none}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
             trigger('showHide', [
                 state('visible', style({
                 // visibility: 'visible'
@@ -11887,7 +11880,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
                         ])
                     ], exportAs: 'cOffcanvas', imports: [A11yModule], hostDirectives: [{ directive: ThemeDirective, inputs: ['dark'] }], host: {
                         ngSkipHydration: 'true',
-                        '[@showHide]': 'animateTrigger',
+                        '[@showHide]': 'this.visible() ? "visible" : "hidden"',
                         '[attr.id]': 'id()',
                         '[attr.inert]': 'ariaHidden() || null',
                         '[attr.role]': 'role()',