@theseam/ui-common 0.3.8 → 0.3.10

package/bundles/theseam-ui-common-framework.umd.js

@@ -261,6 +261,21 @@
         _contentFooterTpl: [{ type: i0.ContentChild, args: [BaseLayoutContentFooterDirective, { static: true, read: i0.TemplateRef },] }]
     };
 
+    var BaseLayoutSideBarFooterDirective = /** @class */ (function () {
+        function BaseLayoutSideBarFooterDirective(_elementRef) {
+            this._elementRef = _elementRef;
+        }
+        return BaseLayoutSideBarFooterDirective;
+    }());
+    BaseLayoutSideBarFooterDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[seamBaseLayoutSideBarFooter]'
+                },] }
+    ];
+    BaseLayoutSideBarFooterDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+
     var TheSeamBaseLayoutModule = /** @class */ (function () {
         function TheSeamBaseLayoutModule() {
         }
@@ -272,6 +287,7 @@
                         TheSeamBaseLayoutComponent,
                         BaseLayoutContentDirective,
                         BaseLayoutSideBarDirective,
+                        BaseLayoutSideBarFooterDirective,
                         BaseLayoutTopBarDirective,
                         BaseLayoutNavToggleDirective,
                         BaseLayoutContentHeaderDirective,
@@ -288,6 +304,7 @@
                         TheSeamBaseLayoutComponent,
                         BaseLayoutContentDirective,
                         BaseLayoutSideBarDirective,
+                        BaseLayoutSideBarFooterDirective,
                         BaseLayoutTopBarDirective,
                         BaseLayoutNavToggleDirective,
                         BaseLayoutContentHeaderDirective,
@@ -1750,8 +1767,9 @@
                     (EXPANDED_STATES.indexOf(toState) !== -1 && COLLAPSED_STATES.indexOf(fromState) !== -1)));
     }
     var SideNavComponent = /** @class */ (function () {
-        function SideNavComponent(_layout, _sideNav, _baseLayoutRef) {
+        function SideNavComponent(_viewContainerRef, _layout, _sideNav, _baseLayoutRef) {
             var _this = this;
+            this._viewContainerRef = _viewContainerRef;
             this._layout = _layout;
             this._sideNav = _sideNav;
             this._baseLayoutRef = _baseLayoutRef;
@@ -1766,9 +1784,10 @@
             this.expanded$ = this._expanded.asObservable();
             this._overlay = new rxjs.BehaviorSubject(false);
             this.overlay$ = this._overlay.asObservable();
+            this.toggleExpand = new i0.EventEmitter();
             this._backdropHidden = new rxjs.BehaviorSubject(true);
             this.items$ = this._items.asObservable().pipe(operators.switchMap(function (items) { return _this._sideNav.createItemsObservable(items); }), operators.shareReplay({ bufferSize: 1, refCount: true }));
-            this.isMobile$ = this._layout.isMobile$.pipe(operators.tap(function (isMobile) { return isMobile && _this.collapse(); }));
+            this.isMobile$ = this._layout.isMobile$.pipe(operators.tap(function (isMobile) { return isMobile ? _this.collapse() : _this.expand(); }));
             this.sideNavExpandedState$ = rxjs.combineLatest([this.expanded$, this.overlay$]).pipe(operators.map(function (_a) {
                 var _b = __read(_a, 2), expanded = _b[0], overlay = _b[1];
                 return expanded
@@ -1784,7 +1803,14 @@
         });
         Object.defineProperty(SideNavComponent.prototype, "expanded", {
             get: function () { return this._expanded.value; },
-            set: function (value) { this._expanded.next(coercion.coerceBooleanProperty(value)); },
+            set: function (value) {
+                var expanded = coercion.coerceBooleanProperty(value);
+                var emit = expanded !== this.expanded;
+                this._expanded.next(expanded);
+                if (emit) {
+                    this.toggleExpand.emit(coercion.coerceBooleanProperty(value));
+                }
+            },
             enumerable: false,
             configurable: true
         });
@@ -1805,6 +1831,9 @@
             this.sideNavExpandedState$
                 .pipe(operators.takeUntil(this._ngUnsubscribe))
                 .subscribe(function (v) { return _this._sideNavExpand = v; });
+            if (this._sideBarFooterTpl) {
+                this._sideBarFooterPortal = new portal.TemplatePortal(this._sideBarFooterTpl, this._viewContainerRef);
+            }
         };
         SideNavComponent.prototype.ngOnDestroy = function () {
             this._ngUnsubscribe.next();
@@ -1837,7 +1866,7 @@
     SideNavComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'seam-side-nav',
-                    template: "<div class=\"side-nav-backdrop\" *ngIf=\"isMobile$ | async\"\n  [@sideNavBackdrop]=\"_sideNavExpand\"\n  [class.side-nav-backdrop-hidden]=\"_backdropHidden | async\"></div>\n\n<div class=\"side-nav-inner-wrapper\" [@sideNavExpand]=\"_sideNavExpand\"\n  (@sideNavExpand.start)=\"animateStart()\"\n  (@sideNavExpand.done)=\"animateEnd()\">\n  <nav class=\"nav side-nav-content\">\n    <seam-side-nav-toggle *ngIf=\"hasHeaderToggle\"\n      [expanded]=\"expanded$ | async\"\n      (toggleExpand)=\"toggle()\">\n    </seam-side-nav-toggle>\n    <div class=\"side-nav-items-container\" seamOverlayScrollbar>\n      <seam-side-nav-item *ngFor=\"let item of items$ | async\"\n        [compact]=\"!(expanded$ | async)\"\n        [itemType]=\"$any(item)?.itemType\"\n        [icon]=\"$any(item)?.icon\"\n        [label]=\"$any(item)?.label\"\n        [link]=\"$any(item)?.link\"\n        [badgeText]=\"$any(item)?.badge?.text\"\n        [badgeTheme]=\"$any(item)?.badge?.theme || 'danger'\"\n        [badgeSrContent]=\"$any(item)?.badge?.srContent\"\n        [badgeTooltip]=\"$any(item)?.badge?.tooltip\"\n        [queryParams]=\"$any(item)?.queryParams\"\n        [children]=\"$any(item)?.children\"\n        [active]=\"$any(item).__state.active\"\n        [expanded]=\"$any(item).__state.expanded\">\n      </seam-side-nav-item>\n    </div>\n  </nav>\n</div>\n",
+                    template: "<div class=\"side-nav-backdrop\" *ngIf=\"isMobile$ | async\"\n  [@sideNavBackdrop]=\"_sideNavExpand\"\n  [class.side-nav-backdrop-hidden]=\"_backdropHidden | async\"></div>\n\n<div class=\"side-nav-inner-wrapper\" [@sideNavExpand]=\"_sideNavExpand\"\n  (@sideNavExpand.start)=\"animateStart()\"\n  (@sideNavExpand.done)=\"animateEnd()\">\n  <nav class=\"nav side-nav-content\">\n    <seam-side-nav-toggle *ngIf=\"hasHeaderToggle\"\n      [expanded]=\"expanded$ | async\"\n      (toggleExpand)=\"toggle()\">\n    </seam-side-nav-toggle>\n    <div class=\"side-nav-items-container\" seamOverlayScrollbar>\n      <seam-side-nav-item *ngFor=\"let item of items$ | async\"\n        [compact]=\"!(expanded$ | async)\"\n        [itemType]=\"$any(item)?.itemType\"\n        [icon]=\"$any(item)?.icon\"\n        [label]=\"$any(item)?.label\"\n        [link]=\"$any(item)?.link\"\n        [badgeText]=\"$any(item)?.badge?.text\"\n        [badgeTheme]=\"$any(item)?.badge?.theme || 'danger'\"\n        [badgeSrContent]=\"$any(item)?.badge?.srContent\"\n        [badgeTooltip]=\"$any(item)?.badge?.tooltip\"\n        [queryParams]=\"$any(item)?.queryParams\"\n        [children]=\"$any(item)?.children\"\n        [active]=\"$any(item).__state.active\"\n        [expanded]=\"$any(item).__state.expanded\">\n      </seam-side-nav-item>\n    </div>\n    <ng-template [cdkPortalOutlet]=\"_sideBarFooterPortal\"></ng-template>\n  </nav>\n</div>\n",
                     providers: [
                         TheSeamSideNavService
                     ],
@@ -1910,6 +1939,7 @@
                 },] }
     ];
     SideNavComponent.ctorParameters = function () { return [
+        { type: i0.ViewContainerRef },
         { type: layout.TheSeamLayoutService },
         { type: TheSeamSideNavService },
         { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [THESEAM_BASE_LAYOUT_REF,] }] }
@@ -1919,7 +1949,9 @@
         hasHeaderToggle: [{ type: i0.Input }],
         items: [{ type: i0.Input }],
         expanded: [{ type: i0.Input }],
-        overlay: [{ type: i0.Input }]
+        overlay: [{ type: i0.Input }],
+        toggleExpand: [{ type: i0.Output }],
+        _sideBarFooterTpl: [{ type: i0.ContentChild, args: [BaseLayoutSideBarFooterDirective, { static: true, read: i0.TemplateRef },] }]
     };
     __decorate([
         core.InputBoolean()
@@ -2148,7 +2180,8 @@
                         a11y.A11yModule,
                         scrollbar.TheSeamScrollbarModule,
                         layout.TheSeamLayoutModule,
-                        ngBootstrap.NgbTooltipModule
+                        ngBootstrap.NgbTooltipModule,
+                        portal.PortalModule
                     ],
                     exports: [
                         SideNavItemComponent,
@@ -3330,14 +3363,15 @@
     exports.slider = slider;
     exports.stepper = stepper;
     exports.transformer = transformer;
-    exports["ɵa"] = TheSeamSideNavService;
-    exports["ɵb"] = TheSeamSchemaFormControlsModule;
-    exports["ɵc"] = TheSeamSchemaFormCheckboxComponent;
-    exports["ɵd"] = TheSeamSchemaFormSubmitComponent;
-    exports["ɵe"] = TheSeamSchemaFormSelectComponent;
-    exports["ɵf"] = TheSeamSchemaFormInputComponent;
-    exports["ɵg"] = TheSeamSchemaFormNumberComponent;
-    exports["ɵh"] = TheSeamSchemaFormSubmitSplitComponent;
+    exports["ɵa"] = BaseLayoutSideBarFooterDirective;
+    exports["ɵb"] = TheSeamSideNavService;
+    exports["ɵc"] = TheSeamSchemaFormControlsModule;
+    exports["ɵd"] = TheSeamSchemaFormCheckboxComponent;
+    exports["ɵe"] = TheSeamSchemaFormSubmitComponent;
+    exports["ɵf"] = TheSeamSchemaFormSelectComponent;
+    exports["ɵg"] = TheSeamSchemaFormInputComponent;
+    exports["ɵh"] = TheSeamSchemaFormNumberComponent;
+    exports["ɵi"] = TheSeamSchemaFormSubmitSplitComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });