@coreui/angular 4.3.0 → 4.3.4

package/fesm2020/coreui-angular.mjs

@@ -13,6 +13,7 @@ import { createPopper } from '@popperjs/core';
 import * as i1$2 from '@angular/cdk/layout';
 import * as i3$1 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
+import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
 import * as i5 from '@coreui/icons-angular';
 import { IconModule } from '@coreui/icons-angular';
 
@@ -6848,6 +6849,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                     args: [DOCUMENT]
                 }] }, { type: SidebarService }]; } });
 
+var _SidebarComponent_narrow, _SidebarComponent_overlaid, _SidebarComponent_unfoldable, _SidebarComponent_visible, _SidebarComponent_onMobile, _SidebarComponent_layoutChangeSubscription, _SidebarComponent_stateToggleSubscription, _SidebarComponent_stateInitial;
 class SidebarComponent {
     constructor(document, renderer, breakpointObserver, sidebarService, backdropService) {
         this.document = document;
@@ -6855,14 +6857,21 @@ class SidebarComponent {
         this.breakpointObserver = breakpointObserver;
         this.sidebarService = sidebarService;
         this.backdropService = backdropService;
-        this._narrow = false;
-        this._overlaid = false;
-        this._unfoldable = false;
-        this._visible = false;
-        this.onMobile = false;
+        _SidebarComponent_narrow.set(this, false);
+        _SidebarComponent_overlaid.set(this, false);
+        _SidebarComponent_unfoldable.set(this, false);
+        _SidebarComponent_visible.set(this, false);
+        _SidebarComponent_onMobile.set(this, false);
+        _SidebarComponent_layoutChangeSubscription.set(this, void 0);
+        _SidebarComponent_stateToggleSubscription.set(this, void 0);
         this.state = {
-            sidebar: this
+            sidebar: this,
         };
+        _SidebarComponent_stateInitial.set(this, {
+            narrow: false,
+            visible: false,
+            unfoldable: false,
+        });
         /**
          * Place sidebar in non-static positions. [docs]
          * @default 'fixed'
@@ -6880,78 +6889,87 @@ class SidebarComponent {
      * @type boolean
      */
     set narrow(value) {
-        this._narrow = coerceBooleanProperty(value);
+        __classPrivateFieldSet(this, _SidebarComponent_narrow, coerceBooleanProperty(value), "f");
     }
     get narrow() {
-        return this._narrow;
+        return __classPrivateFieldGet(this, _SidebarComponent_narrow, "f");
     }
     /**
      * Set sidebar to overlaid variant.
      * @type boolean
      */
     set overlaid(value) {
-        this._overlaid = coerceBooleanProperty(value);
+        __classPrivateFieldSet(this, _SidebarComponent_overlaid, coerceBooleanProperty(value), "f");
     }
     get overlaid() {
-        return this._overlaid;
+        return __classPrivateFieldGet(this, _SidebarComponent_overlaid, "f");
     }
     /**
      * Expand narrowed sidebar on hover. [docs]
      */
     set unfoldable(value) {
-        this._unfoldable = coerceBooleanProperty(value);
+        __classPrivateFieldSet(this, _SidebarComponent_unfoldable, coerceBooleanProperty(value), "f");
     }
     get unfoldable() {
-        return this._unfoldable;
+        return __classPrivateFieldGet(this, _SidebarComponent_unfoldable, "f");
     }
     /**
      * Toggle the visibility of sidebar component. [docs]
      */
     set visible(value) {
-        this._visible = coerceBooleanProperty(value);
-        this.visibleChange.emit(this._visible);
+        const visible = coerceBooleanProperty(value);
+        if (__classPrivateFieldGet(this, _SidebarComponent_visible, "f") !== visible) {
+            __classPrivateFieldSet(this, _SidebarComponent_visible, visible, "f");
+            this.visibleChange.emit(__classPrivateFieldGet(this, _SidebarComponent_visible, "f"));
+        }
     }
     get visible() {
-        return this._visible;
+        return __classPrivateFieldGet(this, _SidebarComponent_visible, "f");
     }
     set sidebarState(value) {
         const newState = value;
         if ('toggle' in newState) {
             if (newState.toggle === 'visible') {
                 newState.visible = !this.state.visible;
-                this.visible = newState.visible && !this.overlaid;
+                this.visible = newState.visible;
             }
             else if (newState.toggle === 'unfoldable') {
                 newState.unfoldable = !this.state.unfoldable;
                 this.unfoldable = newState.unfoldable;
             }
         }
+        else {
+            this.visible = (newState.visible ?? this.visible) && !this.overlaid;
+        }
         this.state = {
             ...this.state,
-            ...newState
+            ...newState,
         };
-        this.state.mobile && this.state.visible ? this.backdropService.setBackdrop(this) : this.backdropService.clearBackdrop();
+        this.state.mobile && this.state.visible
+            ? this.backdropService.setBackdrop(this)
+            : this.backdropService.clearBackdrop();
     }
     get sidebarState() {
         return this.state;
     }
     get getMobileBreakpoint() {
-        const element = this.document.firstElementChild;
-        const mobileBreakpoint = getComputedStyle(element).getPropertyValue('--cui-mobile-breakpoint') || 'md';
+        const element = this.document.documentElement;
+        const mobileBreakpoint = getComputedStyle(element).getPropertyValue('--cui-mobile-breakpoint') ||
+            'md';
         const breakpointValue = getComputedStyle(element).getPropertyValue(`--cui-breakpoint-${mobileBreakpoint.trim()}`) || '768px';
-        return `${parseFloat(breakpointValue.trim()) - .02}px` || '767.98px';
+        return `${parseFloat(breakpointValue.trim()) - 0.02}px` || '767.98px';
     }
     get getClasses() {
-        const { mobile, unfoldable, visible } = this.sidebarState;
+        const { mobile, visible } = this.sidebarState;
         return {
             sidebar: true,
             'sidebar-fixed': this.position === 'fixed' && !mobile,
             'sidebar-narrow': this.narrow && !this.unfoldable,
-            'sidebar-narrow-unfoldable': unfoldable,
+            'sidebar-narrow-unfoldable': this.unfoldable,
             'sidebar-overlaid': this.overlaid,
             [`sidebar-${this.size}`]: !!this.size,
-            show: visible && this.onMobile,
-            hide: !visible && !this.onMobile
+            show: visible && __classPrivateFieldGet(this, _SidebarComponent_onMobile, "f"),
+            hide: !visible,
         };
     }
     ngOnInit() {
@@ -6984,49 +7002,54 @@ class SidebarComponent {
         }
     }
     setInitialState() {
-        this.sidebarService.toggle({
+        __classPrivateFieldSet(this, _SidebarComponent_stateInitial, {
             narrow: this.narrow,
             visible: this.visible,
             unfoldable: this.unfoldable,
-            sidebar: this
+        }, "f");
+        this.sidebarService.toggle({
+            ...__classPrivateFieldGet(this, _SidebarComponent_stateInitial, "f"),
+            sidebar: this,
         });
     }
     stateToggleSubscribe(subscribe = true) {
         if (subscribe) {
-            this.stateToggleSubscription = this.sidebarService.sidebarState$.subscribe((state) => {
+            __classPrivateFieldSet(this, _SidebarComponent_stateToggleSubscription, this.sidebarService.sidebarState$.subscribe((state) => {
                 if (this === state.sidebar || this.id === state.id) {
                     this.sidebarState = state;
                 }
-            });
+            }), "f");
         }
         else {
-            this.stateToggleSubscription.unsubscribe();
+            __classPrivateFieldGet(this, _SidebarComponent_stateToggleSubscription, "f").unsubscribe();
         }
     }
     layoutChangeSubscribe(subscribe = true) {
         const onMobile = `(max-width: ${this.getMobileBreakpoint})`;
         if (subscribe) {
             const layoutChanges = this.breakpointObserver.observe([onMobile]);
-            this.layoutChangeSubscription = layoutChanges.subscribe((result) => {
+            __classPrivateFieldSet(this, _SidebarComponent_layoutChangeSubscription, layoutChanges.subscribe((result) => {
                 const isOnMobile = result.breakpoints[onMobile];
-                if (this.onMobile !== isOnMobile) {
-                    this.onMobile = isOnMobile;
+                const isUnfoldable = isOnMobile ? false : this.unfoldable;
+                if (__classPrivateFieldGet(this, _SidebarComponent_onMobile, "f") !== isOnMobile) {
+                    __classPrivateFieldSet(this, _SidebarComponent_onMobile, isOnMobile, "f");
                     this.sidebarService.toggle({
                         mobile: isOnMobile,
-                        unfoldable: isOnMobile ? false : this.unfoldable,
-                        visible: isOnMobile ? false : this.visible,
-                        sidebar: this
+                        unfoldable: isUnfoldable,
+                        visible: isOnMobile ? !isOnMobile : __classPrivateFieldGet(this, _SidebarComponent_stateInitial, "f").visible,
+                        sidebar: this,
                     });
                 }
-            });
+            }), "f");
         }
         else {
-            this.layoutChangeSubscription.unsubscribe();
+            __classPrivateFieldGet(this, _SidebarComponent_layoutChangeSubscription, "f").unsubscribe();
         }
     }
 }
+_SidebarComponent_narrow = new WeakMap(), _SidebarComponent_overlaid = new WeakMap(), _SidebarComponent_unfoldable = new WeakMap(), _SidebarComponent_visible = new WeakMap(), _SidebarComponent_onMobile = new WeakMap(), _SidebarComponent_layoutChangeSubscription = new WeakMap(), _SidebarComponent_stateToggleSubscription = new WeakMap(), _SidebarComponent_stateInitial = new WeakMap();
 SidebarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SidebarComponent, deps: [{ token: DOCUMENT }, { token: i0.Renderer2 }, { token: i1$2.BreakpointObserver }, { token: SidebarService }, { token: SidebarBackdropService }], target: i0.ɵɵFactoryTarget.Component });
-SidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SidebarComponent, selector: "c-sidebar", inputs: { id: "id", narrow: "narrow", overlaid: "overlaid", position: "position", size: "size", unfoldable: "unfoldable", visible: "visible" }, outputs: { visibleChange: "visibleChange" }, host: { properties: { "class": "this.getClasses" } }, exportAs: ["cSidebar"], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
+SidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SidebarComponent, selector: "c-sidebar", inputs: { colorScheme: "colorScheme", id: "id", narrow: "narrow", overlaid: "overlaid", placement: "placement", position: "position", size: "size", unfoldable: "unfoldable", visible: "visible" }, outputs: { visibleChange: "visibleChange" }, host: { properties: { "class": "this.getClasses" } }, exportAs: ["cSidebar"], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SidebarComponent, decorators: [{
             type: Component,
             args: [{
@@ -7034,15 +7057,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                     exportAs: 'cSidebar',
                     template: '<ng-content></ng-content>',
                 }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
-                }] }, { type: i0.Renderer2 }, { type: i1$2.BreakpointObserver }, { type: SidebarService }, { type: SidebarBackdropService }]; }, propDecorators: { id: [{
+                }] }, { type: i0.Renderer2 }, { type: i1$2.BreakpointObserver }, { type: SidebarService }, { type: SidebarBackdropService }]; }, propDecorators: { colorScheme: [{
+                type: Input
+            }], id: [{
                 type: Input
             }], narrow: [{
                 type: Input
             }], overlaid: [{
                 type: Input
+            }], placement: [{
+                type: Input
             }], position: [{
                 type: Input
             }], size: [{