@dugararchit/flex-layout 13.0.0-dugararchit

package/fesm2020/angular-flex-layout-extended.mjs

@@ -0,0 +1,612 @@
+import * as i0 from '@angular/core';
+import { Injectable, PLATFORM_ID, Directive, Inject, Input, Optional, Self, SecurityContext, NgModule } from '@angular/core';
+import * as i1 from '@angular/flex-layout/core';
+import { StyleBuilder, BaseDirective2, SERVER_TOKEN, LAYOUT_CONFIG, CoreModule } from '@angular/flex-layout/core';
+import * as i2 from '@angular/common';
+import { isPlatformServer, NgClass, NgStyle } from '@angular/common';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { takeUntil } from 'rxjs/operators';
+import * as i2$1 from '@angular/platform-browser';
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+class ImgSrcStyleBuilder extends StyleBuilder {
+    buildStyles(url) {
+        return { 'content': url ? `url(${url})` : '' };
+    }
+}
+ImgSrcStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+ImgSrcStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcStyleBuilder, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+class ImgSrcDirective extends BaseDirective2 {
+    constructor(elementRef, styleBuilder, styler, marshal, platformId, serverModuleLoaded) {
+        super(elementRef, styleBuilder, styler, marshal);
+        this.platformId = platformId;
+        this.serverModuleLoaded = serverModuleLoaded;
+        this.DIRECTIVE_KEY = 'img-src';
+        this.defaultSrc = '';
+        this.styleCache = imgSrcCache;
+        this.init();
+        this.setValue(this.nativeElement.getAttribute('src') || '', '');
+        if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {
+            this.nativeElement.setAttribute('src', '');
+        }
+    }
+    set src(val) {
+        this.defaultSrc = val;
+        this.setValue(this.defaultSrc, '');
+    }
+    /**
+     * Use the [responsively] activated input value to update
+     * the host img src attribute or assign a default `img.src=''`
+     * if the src has not been defined.
+     *
+     * Do nothing to standard `<img src="">` usages, only when responsive
+     * keys are present do we actually call `setAttribute()`
+     */
+    updateWithValue(value) {
+        const url = value || this.defaultSrc;
+        if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {
+            this.addStyles(url);
+        }
+        else {
+            this.nativeElement.setAttribute('src', url);
+        }
+    }
+}
+ImgSrcDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcDirective, deps: [{ token: i0.ElementRef }, { token: ImgSrcStyleBuilder }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: PLATFORM_ID }, { token: SERVER_TOKEN }], target: i0.ɵɵFactoryTarget.Directive });
+ImgSrcDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ImgSrcDirective, inputs: { src: "src" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ImgSrcDirective, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ImgSrcStyleBuilder }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [SERVER_TOKEN]
+                }] }]; }, propDecorators: { src: [{
+                type: Input,
+                args: ['src']
+            }] } });
+const imgSrcCache = new Map();
+const inputs$3 = [
+    'src.xs', 'src.sm', 'src.md', 'src.lg', 'src.xl',
+    'src.lt-sm', 'src.lt-md', 'src.lt-lg', 'src.lt-xl',
+    'src.gt-xs', 'src.gt-sm', 'src.gt-md', 'src.gt-lg'
+];
+const selector$3 = `
+  img[src.xs],    img[src.sm],    img[src.md],    img[src.lg],   img[src.xl],
+  img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],
+  img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]
+`;
+/**
+ * This directive provides a responsive API for the HTML <img> 'src' attribute
+ * and will update the img.src property upon each responsive activation.
+ *
+ * e.g.
+ *      <img src="defaultScene.jpg" src.xs="mobileScene.jpg"></img>
+ *
+ * @see https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-src/
+ */
+class DefaultImgSrcDirective extends ImgSrcDirective {
+    constructor() {
+        super(...arguments);
+        this.inputs = inputs$3;
+    }
+}
+DefaultImgSrcDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultImgSrcDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+DefaultImgSrcDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultImgSrcDirective, selector: "\n  img[src.xs],    img[src.sm],    img[src.md],    img[src.lg],   img[src.xl],\n  img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],\n  img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]\n", inputs: { "src.xs": "src.xs", "src.sm": "src.sm", "src.md": "src.md", "src.lg": "src.lg", "src.xl": "src.xl", "src.lt-sm": "src.lt-sm", "src.lt-md": "src.lt-md", "src.lt-lg": "src.lt-lg", "src.lt-xl": "src.lt-xl", "src.gt-xs": "src.gt-xs", "src.gt-sm": "src.gt-sm", "src.gt-md": "src.gt-md", "src.gt-lg": "src.gt-lg" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultImgSrcDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: selector$3, inputs: inputs$3 }]
+        }] });
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+class ClassDirective extends BaseDirective2 {
+    constructor(elementRef, styler, marshal, iterableDiffers, keyValueDiffers, renderer2, ngClassInstance) {
+        super(elementRef, null, styler, marshal);
+        this.ngClassInstance = ngClassInstance;
+        this.DIRECTIVE_KEY = 'ngClass';
+        if (!this.ngClassInstance) {
+            // Create an instance NgClass Directive instance only if `ngClass=""` has NOT been defined on
+            // the same host element; since the responsive variations may be defined...
+            this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2);
+        }
+        this.init();
+        this.setValue('', '');
+    }
+    /**
+     * Capture class assignments so we cache the default classes
+     * which are merged with activated styles and used as fallbacks.
+     */
+    set klass(val) {
+        this.ngClassInstance.klass = val;
+        this.setValue(val, '');
+    }
+    updateWithValue(value) {
+        this.ngClassInstance.ngClass = value;
+        this.ngClassInstance.ngDoCheck();
+    }
+    // ******************************************************************
+    // Lifecycle Hooks
+    // ******************************************************************
+    /**
+     * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
+     */
+    ngDoCheck() {
+        this.ngClassInstance.ngDoCheck();
+    }
+}
+ClassDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ClassDirective, deps: [{ token: i0.ElementRef }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: i0.IterableDiffers }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i2.NgClass, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+ClassDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ClassDirective, inputs: { klass: ["class", "klass"] }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ClassDirective, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: i0.IterableDiffers }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }, { type: i2.NgClass, decorators: [{
+                    type: Optional
+                }, {
+                    type: Self
+                }] }]; }, propDecorators: { klass: [{
+                type: Input,
+                args: ['class']
+            }] } });
+const inputs$2 = [
+    'ngClass', 'ngClass.xs', 'ngClass.sm', 'ngClass.md', 'ngClass.lg', 'ngClass.xl',
+    'ngClass.lt-sm', 'ngClass.lt-md', 'ngClass.lt-lg', 'ngClass.lt-xl',
+    'ngClass.gt-xs', 'ngClass.gt-sm', 'ngClass.gt-md', 'ngClass.gt-lg'
+];
+const selector$2 = `
+  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],
+  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],
+  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]
+`;
+/**
+ * Directive to add responsive support for ngClass.
+ * This maintains the core functionality of 'ngClass' and adds responsive API
+ * Note: this class is a no-op when rendered on the server
+ */
+class DefaultClassDirective extends ClassDirective {
+    constructor() {
+        super(...arguments);
+        this.inputs = inputs$2;
+    }
+}
+DefaultClassDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultClassDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+DefaultClassDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultClassDirective, selector: "\n  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],\n  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],\n  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]\n", inputs: { ngClass: "ngClass", "ngClass.xs": "ngClass.xs", "ngClass.sm": "ngClass.sm", "ngClass.md": "ngClass.md", "ngClass.lg": "ngClass.lg", "ngClass.xl": "ngClass.xl", "ngClass.lt-sm": "ngClass.lt-sm", "ngClass.lt-md": "ngClass.lt-md", "ngClass.lt-lg": "ngClass.lt-lg", "ngClass.lt-xl": "ngClass.lt-xl", "ngClass.gt-xs": "ngClass.gt-xs", "ngClass.gt-sm": "ngClass.gt-sm", "ngClass.gt-md": "ngClass.gt-md", "ngClass.gt-lg": "ngClass.gt-lg" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultClassDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: selector$2, inputs: inputs$2 }]
+        }] });
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+class ShowHideStyleBuilder extends StyleBuilder {
+    buildStyles(show, parent) {
+        const shouldShow = show === 'true';
+        return { 'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none' };
+    }
+}
+ShowHideStyleBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+ShowHideStyleBuilder.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideStyleBuilder, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+class ShowHideDirective extends BaseDirective2 {
+    constructor(elementRef, styleBuilder, styler, marshal, layoutConfig, platformId, serverModuleLoaded) {
+        super(elementRef, styleBuilder, styler, marshal);
+        this.layoutConfig = layoutConfig;
+        this.platformId = platformId;
+        this.serverModuleLoaded = serverModuleLoaded;
+        this.DIRECTIVE_KEY = 'show-hide';
+        /** Original DOM Element CSS display style */
+        this.display = '';
+        this.hasLayout = false;
+        this.hasFlexChild = false;
+    }
+    // *********************************************
+    // Lifecycle Methods
+    // *********************************************
+    ngAfterViewInit() {
+        this.trackExtraTriggers();
+        const children = Array.from(this.nativeElement.children);
+        for (let i = 0; i < children.length; i++) {
+            if (this.marshal.hasValue(children[i], 'flex')) {
+                this.hasFlexChild = true;
+                break;
+            }
+        }
+        if (DISPLAY_MAP.has(this.nativeElement)) {
+            this.display = DISPLAY_MAP.get(this.nativeElement);
+        }
+        else {
+            this.display = this.getDisplayStyle();
+            DISPLAY_MAP.set(this.nativeElement, this.display);
+        }
+        this.init();
+        // set the default to show unless explicitly overridden
+        const defaultValue = this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY, '');
+        if (defaultValue === undefined || defaultValue === '') {
+            this.setValue(true, '');
+        }
+        else {
+            this.triggerUpdate();
+        }
+    }
+    /**
+     * On changes to any @Input properties...
+     * Default to use the non-responsive Input value ('fxShow')
+     * Then conditionally override with the mq-activated Input's current value
+     */
+    ngOnChanges(changes) {
+        Object.keys(changes).forEach(key => {
+            if (this.inputs.indexOf(key) !== -1) {
+                const inputKey = key.split('.');
+                const bp = inputKey.slice(1).join('.');
+                const inputValue = changes[key].currentValue;
+                let shouldShow = inputValue !== '' ?
+                    inputValue !== 0 ? coerceBooleanProperty(inputValue) : false
+                    : true;
+                if (inputKey[0] === 'fxHide') {
+                    shouldShow = !shouldShow;
+                }
+                this.setValue(shouldShow, bp);
+            }
+        });
+    }
+    // *********************************************
+    // Protected methods
+    // *********************************************
+    /**
+     *  Watch for these extra triggers to update fxShow, fxHide stylings
+     */
+    trackExtraTriggers() {
+        this.hasLayout = this.marshal.hasValue(this.nativeElement, 'layout');
+        ['layout', 'layout-align'].forEach(key => {
+            this.marshal
+                .trackValue(this.nativeElement, key)
+                .pipe(takeUntil(this.destroySubject))
+                .subscribe(this.triggerUpdate.bind(this));
+        });
+    }
+    /**
+     * Override accessor to the current HTMLElement's `display` style
+     * Note: Show/Hide will not change the display to 'flex' but will set it to 'block'
+     * unless it was already explicitly specified inline or in a CSS stylesheet.
+     */
+    getDisplayStyle() {
+        return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?
+            'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);
+    }
+    /** Validate the visibility value and then update the host's inline display style */
+    updateWithValue(value = true) {
+        if (value === '') {
+            return;
+        }
+        const isServer = isPlatformServer(this.platformId);
+        this.addStyles(value ? 'true' : 'false', { display: this.display, isServer });
+        if (isServer && this.serverModuleLoaded) {
+            this.nativeElement.style.setProperty('display', '');
+        }
+        this.marshal.triggerUpdate(this.parentElement, 'layout-gap');
+    }
+}
+ShowHideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideDirective, deps: [{ token: i0.ElementRef }, { token: ShowHideStyleBuilder }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: LAYOUT_CONFIG }, { token: PLATFORM_ID }, { token: SERVER_TOKEN }], target: i0.ɵɵFactoryTarget.Directive });
+ShowHideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: ShowHideDirective, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ShowHideDirective, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ShowHideStyleBuilder }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [LAYOUT_CONFIG]
+                }] }, { type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [SERVER_TOKEN]
+                }] }]; } });
+const DISPLAY_MAP = new WeakMap();
+const inputs$1 = [
+    'fxShow', 'fxShow.print',
+    'fxShow.xs', 'fxShow.sm', 'fxShow.md', 'fxShow.lg', 'fxShow.xl',
+    'fxShow.lt-sm', 'fxShow.lt-md', 'fxShow.lt-lg', 'fxShow.lt-xl',
+    'fxShow.gt-xs', 'fxShow.gt-sm', 'fxShow.gt-md', 'fxShow.gt-lg',
+    'fxHide', 'fxHide.print',
+    'fxHide.xs', 'fxHide.sm', 'fxHide.md', 'fxHide.lg', 'fxHide.xl',
+    'fxHide.lt-sm', 'fxHide.lt-md', 'fxHide.lt-lg', 'fxHide.lt-xl',
+    'fxHide.gt-xs', 'fxHide.gt-sm', 'fxHide.gt-md', 'fxHide.gt-lg'
+];
+const selector$1 = `
+  [fxShow], [fxShow.print],
+  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],
+  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],
+  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],
+  [fxHide], [fxHide.print],
+  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],
+  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],
+  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]
+`;
+/**
+ * 'show' Layout API directive
+ */
+class DefaultShowHideDirective extends ShowHideDirective {
+    constructor() {
+        super(...arguments);
+        this.inputs = inputs$1;
+    }
+}
+DefaultShowHideDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultShowHideDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+DefaultShowHideDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultShowHideDirective, selector: "\n  [fxShow], [fxShow.print],\n  [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],\n  [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],\n  [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],\n  [fxHide], [fxHide.print],\n  [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],\n  [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],\n  [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]\n", inputs: { fxShow: "fxShow", "fxShow.print": "fxShow.print", "fxShow.xs": "fxShow.xs", "fxShow.sm": "fxShow.sm", "fxShow.md": "fxShow.md", "fxShow.lg": "fxShow.lg", "fxShow.xl": "fxShow.xl", "fxShow.lt-sm": "fxShow.lt-sm", "fxShow.lt-md": "fxShow.lt-md", "fxShow.lt-lg": "fxShow.lt-lg", "fxShow.lt-xl": "fxShow.lt-xl", "fxShow.gt-xs": "fxShow.gt-xs", "fxShow.gt-sm": "fxShow.gt-sm", "fxShow.gt-md": "fxShow.gt-md", "fxShow.gt-lg": "fxShow.gt-lg", fxHide: "fxHide", "fxHide.print": "fxHide.print", "fxHide.xs": "fxHide.xs", "fxHide.sm": "fxHide.sm", "fxHide.md": "fxHide.md", "fxHide.lg": "fxHide.lg", "fxHide.xl": "fxHide.xl", "fxHide.lt-sm": "fxHide.lt-sm", "fxHide.lt-md": "fxHide.lt-md", "fxHide.lt-lg": "fxHide.lt-lg", "fxHide.lt-xl": "fxHide.lt-xl", "fxHide.gt-xs": "fxHide.gt-xs", "fxHide.gt-sm": "fxHide.gt-sm", "fxHide.gt-md": "fxHide.gt-md", "fxHide.gt-lg": "fxHide.gt-lg" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultShowHideDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: selector$1, inputs: inputs$1 }]
+        }] });
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+/** NgStyle allowed inputs */
+class NgStyleKeyValue {
+    constructor(key, value, noQuotes = true) {
+        this.key = key;
+        this.value = value;
+        this.key = noQuotes ? key.replace(/['"]/g, '').trim() : key.trim();
+        this.value = noQuotes ? value.replace(/['"]/g, '').trim() : value.trim();
+        this.value = this.value.replace(/;/, '');
+    }
+}
+function getType(target) {
+    let what = typeof target;
+    if (what === 'object') {
+        return (target.constructor === Array) ? 'array' :
+            (target.constructor === Set) ? 'set' : 'object';
+    }
+    return what;
+}
+/**
+ * Split string of key:value pairs into Array of k-v pairs
+ * e.g.  'key:value; key:value; key:value;' -> ['key:value',...]
+ */
+function buildRawList(source, delimiter = ';') {
+    return String(source)
+        .trim()
+        .split(delimiter)
+        .map((val) => val.trim())
+        .filter(val => val !== '');
+}
+/** Convert array of key:value strings to a iterable map object */
+function buildMapFromList$1(styles, sanitize) {
+    const sanitizeValue = (it) => {
+        if (sanitize) {
+            it.value = sanitize(it.value);
+        }
+        return it;
+    };
+    return styles
+        .map(stringToKeyValue)
+        .filter(entry => !!entry)
+        .map(sanitizeValue)
+        .reduce(keyValuesToMap, {});
+}
+/** Convert Set<string> or raw Object to an iterable NgStyleMap */
+function buildMapFromSet(source, sanitize) {
+    let list = [];
+    if (getType(source) === 'set') {
+        source.forEach(entry => list.push(entry));
+    }
+    else {
+        Object.keys(source).forEach((key) => {
+            list.push(`${key}:${source[key]}`);
+        });
+    }
+    return buildMapFromList$1(list, sanitize);
+}
+/** Convert 'key:value' -> [key, value] */
+function stringToKeyValue(it) {
+    const [key, ...vals] = it.split(':');
+    return new NgStyleKeyValue(key, vals.join(':'));
+}
+/** Convert [ [key,value] ] -> { key : value } */
+function keyValuesToMap(map, entry) {
+    if (!!entry.key) {
+        map[entry.key] = entry.value;
+    }
+    return map;
+}
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+class StyleDirective extends BaseDirective2 {
+    constructor(elementRef, styler, marshal, sanitizer, differs, renderer2, ngStyleInstance, serverLoaded, platformId) {
+        super(elementRef, null, styler, marshal);
+        this.sanitizer = sanitizer;
+        this.ngStyleInstance = ngStyleInstance;
+        this.DIRECTIVE_KEY = 'ngStyle';
+        if (!this.ngStyleInstance) {
+            // Create an instance NgStyle Directive instance only if `ngStyle=""` has NOT been
+            // defined on the same host element; since the responsive variations may be defined...
+            this.ngStyleInstance = new NgStyle(elementRef, differs, renderer2);
+        }
+        this.init();
+        const styles = this.nativeElement.getAttribute('style') ?? '';
+        this.fallbackStyles = this.buildStyleMap(styles);
+        this.isServer = serverLoaded && isPlatformServer(platformId);
+    }
+    /** Add generated styles */
+    updateWithValue(value) {
+        const styles = this.buildStyleMap(value);
+        this.ngStyleInstance.ngStyle = { ...this.fallbackStyles, ...styles };
+        if (this.isServer) {
+            this.applyStyleToElement(styles);
+        }
+        this.ngStyleInstance.ngDoCheck();
+    }
+    /** Remove generated styles */
+    clearStyles() {
+        this.ngStyleInstance.ngStyle = this.fallbackStyles;
+        this.ngStyleInstance.ngDoCheck();
+    }
+    /**
+     * Convert raw strings to ngStyleMap; which is required by ngStyle
+     * NOTE: Raw string key-value pairs MUST be delimited by `;`
+     *       Comma-delimiters are not supported due to complexities of
+     *       possible style values such as `rgba(x,x,x,x)` and others
+     */
+    buildStyleMap(styles) {
+        // Always safe-guard (aka sanitize) style property values
+        const sanitizer = (val) => this.sanitizer.sanitize(SecurityContext.STYLE, val) ?? '';
+        if (styles) {
+            switch (getType(styles)) {
+                case 'string': return buildMapFromList(buildRawList(styles), sanitizer);
+                case 'array': return buildMapFromList(styles, sanitizer);
+                case 'set': return buildMapFromSet(styles, sanitizer);
+                default: return buildMapFromSet(styles, sanitizer);
+            }
+        }
+        return {};
+    }
+    // ******************************************************************
+    // Lifecycle Hooks
+    // ******************************************************************
+    /** For ChangeDetectionStrategy.onPush and ngOnChanges() updates */
+    ngDoCheck() {
+        this.ngStyleInstance.ngDoCheck();
+    }
+}
+StyleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: StyleDirective, deps: [{ token: i0.ElementRef }, { token: i1.StyleUtils }, { token: i1.MediaMarshaller }, { token: i2$1.DomSanitizer }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: i2.NgStyle, optional: true, self: true }, { token: SERVER_TOKEN }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Directive });
+StyleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: StyleDirective, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: StyleDirective, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.StyleUtils }, { type: i1.MediaMarshaller }, { type: i2$1.DomSanitizer }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }, { type: i2.NgStyle, decorators: [{
+                    type: Optional
+                }, {
+                    type: Self
+                }] }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [SERVER_TOKEN]
+                }] }, { type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }]; } });
+const inputs = [
+    'ngStyle',
+    'ngStyle.xs', 'ngStyle.sm', 'ngStyle.md', 'ngStyle.lg', 'ngStyle.xl',
+    'ngStyle.lt-sm', 'ngStyle.lt-md', 'ngStyle.lt-lg', 'ngStyle.lt-xl',
+    'ngStyle.gt-xs', 'ngStyle.gt-sm', 'ngStyle.gt-md', 'ngStyle.gt-lg'
+];
+const selector = `
+  [ngStyle],
+  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],
+  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],
+  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]
+`;
+/**
+ * Directive to add responsive support for ngStyle.
+ *
+ */
+class DefaultStyleDirective extends StyleDirective {
+    constructor() {
+        super(...arguments);
+        this.inputs = inputs;
+    }
+}
+DefaultStyleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+DefaultStyleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.2", type: DefaultStyleDirective, selector: "\n  [ngStyle],\n  [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],\n  [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],\n  [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]\n", inputs: { ngStyle: "ngStyle", "ngStyle.xs": "ngStyle.xs", "ngStyle.sm": "ngStyle.sm", "ngStyle.md": "ngStyle.md", "ngStyle.lg": "ngStyle.lg", "ngStyle.xl": "ngStyle.xl", "ngStyle.lt-sm": "ngStyle.lt-sm", "ngStyle.lt-md": "ngStyle.lt-md", "ngStyle.lt-lg": "ngStyle.lt-lg", "ngStyle.lt-xl": "ngStyle.lt-xl", "ngStyle.gt-xs": "ngStyle.gt-xs", "ngStyle.gt-sm": "ngStyle.gt-sm", "ngStyle.gt-md": "ngStyle.gt-md", "ngStyle.gt-lg": "ngStyle.gt-lg" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DefaultStyleDirective, decorators: [{
+            type: Directive,
+            args: [{ selector, inputs }]
+        }] });
+/** Build a styles map from a list of styles, while sanitizing bad values first */
+function buildMapFromList(styles, sanitize) {
+    const sanitizeValue = (it) => {
+        if (sanitize) {
+            it.value = sanitize(it.value);
+        }
+        return it;
+    };
+    return styles
+        .map(stringToKeyValue)
+        .filter(entry => !!entry)
+        .map(sanitizeValue)
+        .reduce(keyValuesToMap, {});
+}
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+const ALL_DIRECTIVES = [
+    DefaultShowHideDirective,
+    DefaultClassDirective,
+    DefaultStyleDirective,
+    DefaultImgSrcDirective,
+];
+/**
+ * *****************************************************************
+ * Define module for the Extended API
+ * *****************************************************************
+ */
+class ExtendedModule {
+}
+ExtendedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ExtendedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, declarations: [DefaultShowHideDirective,
+        DefaultClassDirective,
+        DefaultStyleDirective,
+        DefaultImgSrcDirective], imports: [CoreModule], exports: [DefaultShowHideDirective,
+        DefaultClassDirective,
+        DefaultStyleDirective,
+        DefaultImgSrcDirective] });
+ExtendedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, imports: [[CoreModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: ExtendedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CoreModule],
+                    declarations: [...ALL_DIRECTIVES],
+                    exports: [...ALL_DIRECTIVES]
+                }]
+        }] });
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ClassDirective, DefaultClassDirective, DefaultImgSrcDirective, DefaultShowHideDirective, DefaultStyleDirective, ExtendedModule, ImgSrcDirective, ImgSrcStyleBuilder, ShowHideDirective, ShowHideStyleBuilder, StyleDirective };
+//# sourceMappingURL=angular-flex-layout-extended.mjs.map