text: /**
   * @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
   */
  import { __extends } from 'tslib';
  import { Directive, ElementRef, Input, Inject, Optional, PLATFORM_ID, IterableDiffers, KeyValueDiffers, Renderer2, Self, SecurityContext, NgModule } from '@angular/core';
  import { isPlatformServer, NgClass, NgStyle } from '@angular/common';
  import { BaseDirective, MediaMonitor, SERVER_TOKEN, StyleUtils, BaseDirectiveAdapter, CoreModule } from '@angular/flex-layout/core';
  import { LayoutDirective } from '@angular/flex-layout/flex';
  import { DomSanitizer } from '@angular/platform-browser';
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /**
   * 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/
   */
  var ImgSrcDirective = /** @class */ (function (_super) {
      __extends(ImgSrcDirective, _super);
      /* tslint:enable */
      function ImgSrcDirective(_elRef, _monitor, _styler, _platformId, _serverModuleLoaded) {
          var _this = _super.call(this, _monitor, _elRef, _styler) || this;
          _this._elRef = _elRef;
          _this._monitor = _monitor;
          _this._styler = _styler;
          _this._platformId = _platformId;
          _this._serverModuleLoaded = _serverModuleLoaded;
          _this._cacheInput('src', _elRef.nativeElement.getAttribute('src') || '');
          if (isPlatformServer(_this._platformId) && _this._serverModuleLoaded) {
              _this.nativeElement.setAttribute('src', '');
          }
          return _this;
      }
      Object.defineProperty(ImgSrcDirective.prototype, "srcBase", {
          /* tslint:disable */
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this.cacheDefaultSrc(val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcXs', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcLg', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcXl', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcLtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcLtSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcLtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcLtMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcLtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcLtLg', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcLtXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcLtXl', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcGtXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcGtXs', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcGtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcGtSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcGtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcGtMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "srcGtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('srcGtLg', val); },
          enumerable: true,
          configurable: true
      });
      /**
       * Listen for responsive changes to update the img.src attribute
       */
      /**
       * Listen for responsive changes to update the img.src attribute
       * @return {?}
       */
      ImgSrcDirective.prototype.ngOnInit = /**
       * Listen for responsive changes to update the img.src attribute
       * @return {?}
       */
      function () {
          var _this = this;
          _super.prototype.ngOnInit.call(this);
          if (this.hasResponsiveKeys) {
              // Listen for responsive changes
              this._listenForMediaQueryChanges('src', this.defaultSrc, function () {
                  _this._updateSrcFor();
              });
          }
          this._updateSrcFor();
      };
      /**
       * Update the 'src' property of the host <img> element
       */
      /**
       * Update the 'src' property of the host <img> element
       * @return {?}
       */
      ImgSrcDirective.prototype.ngOnChanges = /**
       * Update the 'src' property of the host <img> element
       * @return {?}
       */
      function () {
          if (this.hasInitialized) {
              this._updateSrcFor();
          }
      };
      /**
       * 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()`
       */
      /**
       * 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()`
       * @return {?}
       */
      ImgSrcDirective.prototype._updateSrcFor = /**
       * 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()`
       * @return {?}
       */
      function () {
          if (this.hasResponsiveKeys) {
              /** @type {?} */
              var url = this.activatedValue || this.defaultSrc;
              if (isPlatformServer(this._platformId) && this._serverModuleLoaded) {
                  this._styler.applyStyleToElement(this.nativeElement, { 'content': url ? "url(" + url + ")" : '' });
              }
              else {
                  this.nativeElement.setAttribute('src', String(url));
              }
          }
      };
      /**
       * Cache initial value of 'src', this will be used as fallback when breakpoint
       * activations change.
       * NOTE: The default 'src' property is not bound using @Input(), so perform
       * a post-ngOnInit() lookup of the default src value (if any).
       */
      /**
       * Cache initial value of 'src', this will be used as fallback when breakpoint
       * activations change.
       * NOTE: The default 'src' property is not bound using \@Input(), so perform
       * a post-ngOnInit() lookup of the default src value (if any).
       * @param {?=} value
       * @return {?}
       */
      ImgSrcDirective.prototype.cacheDefaultSrc = /**
       * Cache initial value of 'src', this will be used as fallback when breakpoint
       * activations change.
       * NOTE: The default 'src' property is not bound using \@Input(), so perform
       * a post-ngOnInit() lookup of the default src value (if any).
       * @param {?=} value
       * @return {?}
       */
      function (value) {
          this._cacheInput('src', value || '');
      };
      Object.defineProperty(ImgSrcDirective.prototype, "defaultSrc", {
          /**
           * Empty values are maintained, undefined values are exposed as ''
           */
          get: /**
           * Empty values are maintained, undefined values are exposed as ''
           * @return {?}
           */
          function () {
              return this._queryInput('src') || '';
          },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ImgSrcDirective.prototype, "hasResponsiveKeys", {
          /**
           * Does the <img> have 1 or more src.<xxx> responsive inputs
           * defined... these will be mapped to activated breakpoints.
           */
          get: /**
           * Does the <img> have 1 or more src.<xxx> responsive inputs
           * defined... these will be mapped to activated breakpoints.
           * @return {?}
           */
          function () {
              return Object.keys(this._inputMap).length > 1;
          },
          enumerable: true,
          configurable: true
      });
      ImgSrcDirective.decorators = [
          { type: Directive, args: [{
                      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"
                  },] },
      ];
      /** @nocollapse */
      ImgSrcDirective.ctorParameters = function () { return [
          { type: ElementRef },
          { type: MediaMonitor },
          { type: StyleUtils },
          { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
          { type: Boolean, decorators: [{ type: Optional }, { type: Inject, args: [SERVER_TOKEN,] }] }
      ]; };
      ImgSrcDirective.propDecorators = {
          srcBase: [{ type: Input, args: ['src',] }],
          srcXs: [{ type: Input, args: ['src.xs',] }],
          srcSm: [{ type: Input, args: ['src.sm',] }],
          srcMd: [{ type: Input, args: ['src.md',] }],
          srcLg: [{ type: Input, args: ['src.lg',] }],
          srcXl: [{ type: Input, args: ['src.xl',] }],
          srcLtSm: [{ type: Input, args: ['src.lt-sm',] }],
          srcLtMd: [{ type: Input, args: ['src.lt-md',] }],
          srcLtLg: [{ type: Input, args: ['src.lt-lg',] }],
          srcLtXl: [{ type: Input, args: ['src.lt-xl',] }],
          srcGtXs: [{ type: Input, args: ['src.gt-xs',] }],
          srcGtSm: [{ type: Input, args: ['src.gt-sm',] }],
          srcGtMd: [{ type: Input, args: ['src.gt-md',] }],
          srcGtLg: [{ type: Input, args: ['src.gt-lg',] }]
      };
      return ImgSrcDirective;
  }(BaseDirective));
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /**
   * 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
   */
  var ClassDirective = /** @class */ (function (_super) {
      __extends(ClassDirective, _super);
      /* tslint:enable */
      function ClassDirective(monitor, _iterableDiffers, _keyValueDiffers, _ngEl, _renderer, _ngClassInstance, _styler) {
          var _this = _super.call(this, monitor, _ngEl, _styler) || this;
          _this.monitor = monitor;
          _this._iterableDiffers = _iterableDiffers;
          _this._keyValueDiffers = _keyValueDiffers;
          _this._ngEl = _ngEl;
          _this._renderer = _renderer;
          _this._ngClassInstance = _ngClassInstance;
          _this._styler = _styler;
          _this._base = new BaseDirectiveAdapter('ngClass', _this.monitor, _this._ngEl, _this._styler);
          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(_this._iterableDiffers, _this._keyValueDiffers, _this._ngEl, _this._renderer);
          }
          return _this;
      }
      Object.defineProperty(ClassDirective.prototype, "ngClassBase", {
          /**
           * Intercept ngClass assignments so we cache the default classes
           * which are merged with activated styles or used as fallbacks.
           * Note: Base ngClass values are applied during ngDoCheck()
           */
          set: /**
           * Intercept ngClass assignments so we cache the default classes
           * which are merged with activated styles or used as fallbacks.
           * Note: Base ngClass values are applied during ngDoCheck()
           * @param {?} val
           * @return {?}
           */
          function (val) {
              /** @type {?} */
              var key = 'ngClass';
              this._base.cacheInput(key, val, true);
              this._ngClassInstance.ngClass = this._base.queryInput(key);
          },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "klazz", {
          /**
           * Capture class assignments so we cache the default classes
           * which are merged with activated styles and used as fallbacks.
           */
          set: /**
           * Capture class assignments so we cache the default classes
           * which are merged with activated styles and used as fallbacks.
           * @param {?} val
           * @return {?}
           */
          function (val) {
              /** @type {?} */
              var key = 'class';
              this._base.cacheInput(key, val);
              this._ngClassInstance.klass = val;
          },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassXs", {
          /* tslint:disable */
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassXs', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassLg', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassXl', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassLtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassLtSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassLtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassLtMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassLtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassLtLg', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassLtXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassLtXl', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassGtXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassGtXs', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassGtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassGtSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassGtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassGtMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ClassDirective.prototype, "ngClassGtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngClassGtLg', val, true); },
          enumerable: true,
          configurable: true
      });
      // ******************************************************************
      // Lifecycle Hooks
      // ******************************************************************
      /**
       * For @Input changes on the current mq activation property
       */
      /**
       * For \@Input changes on the current mq activation property
       * @param {?} changes
       * @return {?}
       */
      ClassDirective.prototype.ngOnChanges = /**
       * For \@Input changes on the current mq activation property
       * @param {?} changes
       * @return {?}
       */
      function (changes) {
          if (this._base.activeKey in changes) {
              this._ngClassInstance.ngClass = this._base.mqActivation.activatedInput || '';
          }
      };
      /**
       * @return {?}
       */
      ClassDirective.prototype.ngOnInit = /**
       * @return {?}
       */
      function () {
          this._configureMQListener();
      };
      /**
       * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
       */
      /**
       * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
       * @return {?}
       */
      ClassDirective.prototype.ngDoCheck = /**
       * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
       * @return {?}
       */
      function () {
          this._ngClassInstance.ngDoCheck();
      };
      /**
       * @return {?}
       */
      ClassDirective.prototype.ngOnDestroy = /**
       * @return {?}
       */
      function () {
          this._base.ngOnDestroy();
      };
      // ******************************************************************
      // Internal Methods
      // ******************************************************************
      /**
       * Build an mqActivation object that bridges mql change events to onMediaQueryChange handlers
       * NOTE: We delegate subsequent activity to the NgClass logic
       *       Identify the activated input value and update the ngClass iterables...
       *       Use ngDoCheck() to actually apply the values to the element
       */
      /**
       * Build an mqActivation object that bridges mql change events to onMediaQueryChange handlers
       * NOTE: We delegate subsequent activity to the NgClass logic
       *       Identify the activated input value and update the ngClass iterables...
       *       Use ngDoCheck() to actually apply the values to the element
       * @param {?=} baseKey
       * @return {?}
       */
      ClassDirective.prototype._configureMQListener = /**
       * Build an mqActivation object that bridges mql change events to onMediaQueryChange handlers
       * NOTE: We delegate subsequent activity to the NgClass logic
       *       Identify the activated input value and update the ngClass iterables...
       *       Use ngDoCheck() to actually apply the values to the element
       * @param {?=} baseKey
       * @return {?}
       */
      function (baseKey) {
          var _this = this;
          if (baseKey === void 0) { baseKey = 'ngClass'; }
          /** @type {?} */
          var fallbackValue = this._base.queryInput(baseKey);
          this._base.listenForMediaQueryChanges(baseKey, fallbackValue, function (changes) {
              _this._ngClassInstance.ngClass = changes.value || '';
              _this._ngClassInstance.ngDoCheck();
          });
      };
      ClassDirective.decorators = [
          { type: Directive, args: [{
                      selector: "\n    [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  "
                  },] },
      ];
      /** @nocollapse */
      ClassDirective.ctorParameters = function () { return [
          { type: MediaMonitor },
          { type: IterableDiffers },
          { type: KeyValueDiffers },
          { type: ElementRef },
          { type: Renderer2 },
          { type: NgClass, decorators: [{ type: Optional }, { type: Self }] },
          { type: StyleUtils }
      ]; };
      ClassDirective.propDecorators = {
          ngClassBase: [{ type: Input, args: ['ngClass',] }],
          klazz: [{ type: Input, args: ['class',] }],
          ngClassXs: [{ type: Input, args: ['ngClass.xs',] }],
          ngClassSm: [{ type: Input, args: ['ngClass.sm',] }],
          ngClassMd: [{ type: Input, args: ['ngClass.md',] }],
          ngClassLg: [{ type: Input, args: ['ngClass.lg',] }],
          ngClassXl: [{ type: Input, args: ['ngClass.xl',] }],
          ngClassLtSm: [{ type: Input, args: ['ngClass.lt-sm',] }],
          ngClassLtMd: [{ type: Input, args: ['ngClass.lt-md',] }],
          ngClassLtLg: [{ type: Input, args: ['ngClass.lt-lg',] }],
          ngClassLtXl: [{ type: Input, args: ['ngClass.lt-xl',] }],
          ngClassGtXs: [{ type: Input, args: ['ngClass.gt-xs',] }],
          ngClassGtSm: [{ type: Input, args: ['ngClass.gt-sm',] }],
          ngClassGtMd: [{ type: Input, args: ['ngClass.gt-md',] }],
          ngClassGtLg: [{ type: Input, args: ['ngClass.gt-lg',] }]
      };
      return ClassDirective;
  }(BaseDirective));
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /** @type {?} */
  var FALSY = ['false', false, 0];
  /**
   * For fxHide selectors, we invert the 'value'
   * and assign to the equivalent fxShow selector cache
   *  - When 'hide' === '' === true, do NOT show the element
   *  - When 'hide' === false or 0... we WILL show the element
   * @param {?} hide
   * @return {?}
   */
  function negativeOf(hide) {
      return (hide === '') ? false :
          ((hide === 'false') || (hide === 0)) ? true : !hide;
  }
  /**
   * 'show' Layout API directive
   *
   */
  var ShowHideDirective = /** @class */ (function (_super) {
      __extends(ShowHideDirective, _super);
      /* tslint:enable */
      function ShowHideDirective(monitor, layout, elRef, styleUtils, platformId, serverModuleLoaded) {
          var _this = _super.call(this, monitor, elRef, styleUtils) || this;
          _this.layout = layout;
          _this.elRef = elRef;
          _this.styleUtils = styleUtils;
          _this.platformId = platformId;
          _this.serverModuleLoaded = serverModuleLoaded;
          /**
           * Original dom Elements CSS display style
           */
          _this._display = '';
          if (layout) {
              /**
                     * The Layout can set the display:flex (and incorrectly affect the Hide/Show directives.
                     * Whenever Layout [on the same element] resets its CSS, then update the Hide/Show CSS
                     */
              _this._layoutWatcher = layout.layout$.subscribe(function () { return _this._updateWithValue(); });
          }
          return _this;
      }
      Object.defineProperty(ShowHideDirective.prototype, "show", {
          /* tslint:disable */
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('show', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showXs', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLg', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showXl', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showLtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showLtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showLtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtLg', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showLtXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtXl', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showGtXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtXs', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showGtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtSm', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showGtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtMd', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "showGtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtLg', val); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hide", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('show', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showXs', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showSm', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showMd', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLg', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showXl', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideLtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtSm', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideLtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtMd', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideLtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtLg', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideLtXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showLtXl', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideGtXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtXs', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideGtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtSm', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideGtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtMd', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(ShowHideDirective.prototype, "hideGtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._cacheInput('showGtLg', negativeOf(val)); },
          enumerable: true,
          configurable: true
      });
      // *********************************************
      // Lifecycle Methods
      // *********************************************
      /**
       * 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.
       */
      /**
       * 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.
       * @return {?}
       */
      ShowHideDirective.prototype._getDisplayStyle = /**
       * 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.
       * @return {?}
       */
      function () {
          return this.layout ? 'flex' : _super.prototype._getDisplayStyle.call(this);
      };
      /**
       * 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
       */
      /**
       * 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
       * @param {?} changes
       * @return {?}
       */
      ShowHideDirective.prototype.ngOnChanges = /**
       * 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
       * @param {?} changes
       * @return {?}
       */
      function (changes) {
          if (this.hasInitialized && (changes['show'] != null || this._mqActivation)) {
              this._updateWithValue();
          }
      };
      /**
       * After the initial onChanges, build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       */
      /**
       * After the initial onChanges, build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       * @return {?}
       */
      ShowHideDirective.prototype.ngOnInit = /**
       * After the initial onChanges, build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       * @return {?}
       */
      function () {
          var _this = this;
          _super.prototype.ngOnInit.call(this);
          this._display = this._getDisplayStyle();
          /** @type {?} */
          var value = this._getDefaultVal('show', true);
          // Build _mqActivation controller
          this._listenForMediaQueryChanges('show', value, function (changes) {
              _this._updateWithValue(changes.value);
          });
          this._updateWithValue();
      };
      /**
       * @return {?}
       */
      ShowHideDirective.prototype.ngOnDestroy = /**
       * @return {?}
       */
      function () {
          _super.prototype.ngOnDestroy.call(this);
          if (this._layoutWatcher) {
              this._layoutWatcher.unsubscribe();
          }
      };
      // *********************************************
      // Protected methods
      // *********************************************
      /** Validate the visibility value and then update the host's inline display style */
      /**
       * Validate the visibility value and then update the host's inline display style
       * @param {?=} value
       * @return {?}
       */
      ShowHideDirective.prototype._updateWithValue = /**
       * Validate the visibility value and then update the host's inline display style
       * @param {?=} value
       * @return {?}
       */
      function (value) {
          value = value || this._getDefaultVal('show', true);
          if (this._mqActivation) {
              value = this._mqActivation.activatedInput;
          }
          /** @type {?} */
          var shouldShow = this._validateTruthy(value);
          this._applyStyleToElement(this._buildCSS(shouldShow));
          if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {
              this.nativeElement.style.setProperty('display', '');
          }
      };
      /** Build the CSS that should be assigned to the element instance */
      /**
       * Build the CSS that should be assigned to the element instance
       * @param {?} show
       * @return {?}
       */
      ShowHideDirective.prototype._buildCSS = /**
       * Build the CSS that should be assigned to the element instance
       * @param {?} show
       * @return {?}
       */
      function (show) {
          return { 'display': show ? this._display : 'none' };
      };
      /**  Validate the to be not FALSY */
      /**
       * Validate the to be not FALSY
       * @param {?=} show
       * @return {?}
       */
      ShowHideDirective.prototype._validateTruthy = /**
       * Validate the to be not FALSY
       * @param {?=} show
       * @return {?}
       */
      function (show) {
          if (show === void 0) { show = ''; }
          return (FALSY.indexOf(show) === -1);
      };
      ShowHideDirective.decorators = [
          { type: Directive, args: [{
                      selector: "\n  [fxShow],\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],\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"
                  },] },
      ];
      /** @nocollapse */
      ShowHideDirective.ctorParameters = function () { return [
          { type: MediaMonitor },
          { type: LayoutDirective, decorators: [{ type: Optional }, { type: Self }] },
          { type: ElementRef },
          { type: StyleUtils },
          { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
          { type: Boolean, decorators: [{ type: Optional }, { type: Inject, args: [SERVER_TOKEN,] }] }
      ]; };
      ShowHideDirective.propDecorators = {
          show: [{ type: Input, args: ['fxShow',] }],
          showXs: [{ type: Input, args: ['fxShow.xs',] }],
          showSm: [{ type: Input, args: ['fxShow.sm',] }],
          showMd: [{ type: Input, args: ['fxShow.md',] }],
          showLg: [{ type: Input, args: ['fxShow.lg',] }],
          showXl: [{ type: Input, args: ['fxShow.xl',] }],
          showLtSm: [{ type: Input, args: ['fxShow.lt-sm',] }],
          showLtMd: [{ type: Input, args: ['fxShow.lt-md',] }],
          showLtLg: [{ type: Input, args: ['fxShow.lt-lg',] }],
          showLtXl: [{ type: Input, args: ['fxShow.lt-xl',] }],
          showGtXs: [{ type: Input, args: ['fxShow.gt-xs',] }],
          showGtSm: [{ type: Input, args: ['fxShow.gt-sm',] }],
          showGtMd: [{ type: Input, args: ['fxShow.gt-md',] }],
          showGtLg: [{ type: Input, args: ['fxShow.gt-lg',] }],
          hide: [{ type: Input, args: ['fxHide',] }],
          hideXs: [{ type: Input, args: ['fxHide.xs',] }],
          hideSm: [{ type: Input, args: ['fxHide.sm',] }],
          hideMd: [{ type: Input, args: ['fxHide.md',] }],
          hideLg: [{ type: Input, args: ['fxHide.lg',] }],
          hideXl: [{ type: Input, args: ['fxHide.xl',] }],
          hideLtSm: [{ type: Input, args: ['fxHide.lt-sm',] }],
          hideLtMd: [{ type: Input, args: ['fxHide.lt-md',] }],
          hideLtLg: [{ type: Input, args: ['fxHide.lt-lg',] }],
          hideLtXl: [{ type: Input, args: ['fxHide.lt-xl',] }],
          hideGtXs: [{ type: Input, args: ['fxHide.gt-xs',] }],
          hideGtSm: [{ type: Input, args: ['fxHide.gt-sm',] }],
          hideGtMd: [{ type: Input, args: ['fxHide.gt-md',] }],
          hideGtLg: [{ type: Input, args: ['fxHide.gt-lg',] }]
      };
      return ShowHideDirective;
  }(BaseDirective));
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /**
   * Extends an object with the *enumerable* and *own* properties of one or more source objects,
   * similar to Object.assign.
   *
   * @param {?} dest The object which will have properties copied to it.
   * @param {...?} sources The source objects from which properties will be copied.
   * @return {?}
   */
  function extendObject(dest) {
      var sources = [];
      for (var _i = 1; _i < arguments.length; _i++) {
          sources[_i - 1] = arguments[_i];
      }
      if (dest == null) {
          throw TypeError('Cannot convert undefined or null to object');
      }
      for (var _a = 0, sources_1 = sources; _a < sources_1.length; _a++) {
          var source = sources_1[_a];
          if (source != null) {
              for (var key in source) {
                  if (source.hasOwnProperty(key)) {
                      dest[key] = source[key];
                  }
              }
          }
      }
      return dest;
  }
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /**
   * NgStyle allowed inputs
   */
  var /**
   * NgStyle allowed inputs
   */
  NgStyleKeyValue = /** @class */ (function () {
      function NgStyleKeyValue(key, value, noQuotes) {
          if (noQuotes === void 0) { 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(/;/, '');
      }
      return NgStyleKeyValue;
  }());
  /**
   * @param {?} target
   * @return {?}
   */
  function getType(target) {
      /** @type {?} */
      var 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',...]
   * @param {?} source
   * @param {?=} delimiter
   * @return {?}
   */
  function buildRawList(source, delimiter) {
      if (delimiter === void 0) { delimiter = ';'; }
      return String(source)
          .trim()
          .split(delimiter)
          .map(function (val) { return val.trim(); })
          .filter(function (val) { return val !== ''; });
  }
  /**
   * Convert array of key:value strings to a iterable map object
   * @param {?} styles
   * @param {?=} sanitize
   * @return {?}
   */
  function buildMapFromList(styles, sanitize) {
      /** @type {?} */
      var sanitizeValue = function (it) {
          if (sanitize) {
              it.value = sanitize(it.value);
          }
          return it;
      };
      return styles
          .map(stringToKeyValue)
          .filter(function (entry) { return !!entry; })
          .map(sanitizeValue)
          .reduce(keyValuesToMap, /** @type {?} */ ({}));
  }
  /**
   * Convert Set<string> or raw Object to an iterable NgStyleMap
   * @param {?} source
   * @param {?=} sanitize
   * @return {?}
   */
  function buildMapFromSet(source, sanitize) {
      /** @type {?} */
      var list = [];
      if (getType(source) === 'set') {
          (/** @type {?} */ (source)).forEach(function (entry) { return list.push(entry); });
      }
      else {
          Object.keys(source).forEach(function (key) {
              list.push(key + ":" + ((/** @type {?} */ (source)))[key]);
          });
      }
      return buildMapFromList(list, sanitize);
  }
  /**
   * Convert 'key:value' -> [key, value]
   * @param {?} it
   * @return {?}
   */
  function stringToKeyValue(it) {
      var _a = it.split(':'), key = _a[0], val = _a[1];
      return new NgStyleKeyValue(key, val);
  }
  /**
   * Convert [ [key,value] ] -> { key : value }
   * @param {?} map
   * @param {?} entry
   * @return {?}
   */
  function keyValuesToMap(map, entry) {
      if (!!entry.key) {
          map[entry.key] = entry.value;
      }
      return map;
  }
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /**
   * Directive to add responsive support for ngStyle.
   *
   */
  var StyleDirective = /** @class */ (function (_super) {
      __extends(StyleDirective, _super);
      /* tslint:enable */
      /**
       *  Constructor for the ngStyle subclass; which adds selectors and
       *  a MediaQuery Activation Adapter
       */
      function StyleDirective(monitor, _sanitizer, _ngEl, _renderer, _differs, _ngStyleInstance, _styler) {
          var _this = _super.call(this, monitor, _ngEl, _styler) || this;
          _this.monitor = monitor;
          _this._sanitizer = _sanitizer;
          _this._ngEl = _ngEl;
          _this._renderer = _renderer;
          _this._differs = _differs;
          _this._ngStyleInstance = _ngStyleInstance;
          _this._styler = _styler;
          _this._base = new BaseDirectiveAdapter('ngStyle', _this.monitor, _this._ngEl, _this._styler);
          if (!_this._ngStyleInstance) {
              // 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._ngStyleInstance = new NgStyle(_this._differs, _this._ngEl, _this._renderer);
          }
          _this._buildCacheInterceptor();
          _this._fallbackToStyle();
          return _this;
      }
      Object.defineProperty(StyleDirective.prototype, "ngStyleBase", {
          /**
           * Intercept ngStyle assignments so we cache the default styles
           * which are merged with activated styles or used as fallbacks.
           */
          set: /**
           * Intercept ngStyle assignments so we cache the default styles
           * which are merged with activated styles or used as fallbacks.
           * @param {?} val
           * @return {?}
           */
          function (val) {
              /** @type {?} */
              var key = 'ngStyle';
              this._base.cacheInput(key, val, true); // convert val to hashmap
              this._ngStyleInstance.ngStyle = this._base.queryInput(key);
          },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleXs", {
          /* tslint:disable */
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleXs', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleLg', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleXl', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleLtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleLtSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleLtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleLtMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleLtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleLtLg', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleLtXl", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleLtXl', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleGtXs", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleGtXs', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleGtSm", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleGtSm', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleGtMd", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleGtMd', val, true); },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(StyleDirective.prototype, "ngStyleGtLg", {
          set: /**
           * @param {?} val
           * @return {?}
           */
          function (val) { this._base.cacheInput('ngStyleGtLg', val, true); },
          enumerable: true,
          configurable: true
      });
      // ******************************************************************
      // Lifecycle Hooks
      // ******************************************************************
      /** For @Input changes on the current mq activation property */
      /**
       * For \@Input changes on the current mq activation property
       * @param {?} changes
       * @return {?}
       */
      StyleDirective.prototype.ngOnChanges = /**
       * For \@Input changes on the current mq activation property
       * @param {?} changes
       * @return {?}
       */
      function (changes) {
          if (this._base.activeKey in changes) {
              this._ngStyleInstance.ngStyle = this._base.mqActivation.activatedInput || '';
          }
      };
      /**
       * @return {?}
       */
      StyleDirective.prototype.ngOnInit = /**
       * @return {?}
       */
      function () {
          this._configureMQListener();
      };
      /** For ChangeDetectionStrategy.onPush and ngOnChanges() updates */
      /**
       * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
       * @return {?}
       */
      StyleDirective.prototype.ngDoCheck = /**
       * For ChangeDetectionStrategy.onPush and ngOnChanges() updates
       * @return {?}
       */
      function () {
          this._ngStyleInstance.ngDoCheck();
      };
      /**
       * @return {?}
       */
      StyleDirective.prototype.ngOnDestroy = /**
       * @return {?}
       */
      function () {
          this._base.ngOnDestroy();
      };
      // ******************************************************************
      // Internal Methods
      // ******************************************************************
      /**
       * Build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       */
      /**
       * Build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       * @param {?=} baseKey
       * @return {?}
       */
      StyleDirective.prototype._configureMQListener = /**
       * Build an mqActivation object that bridges
       * mql change events to onMediaQueryChange handlers
       * @param {?=} baseKey
       * @return {?}
       */
      function (baseKey) {
          var _this = this;
          if (baseKey === void 0) { baseKey = 'ngStyle'; }
          /** @type {?} */
          var fallbackValue = this._base.queryInput(baseKey);
          this._base.listenForMediaQueryChanges(baseKey, fallbackValue, function (changes) {
              _this._ngStyleInstance.ngStyle = changes.value || '';
              _this._ngStyleInstance.ngDoCheck();
          });
      };
      // ************************************************************************
      // Private Internal Methods
      // ************************************************************************
      /** Build intercept to convert raw strings to ngStyleMap */
      /**
       * Build intercept to convert raw strings to ngStyleMap
       * @return {?}
       */
      StyleDirective.prototype._buildCacheInterceptor = /**
       * Build intercept to convert raw strings to ngStyleMap
       * @return {?}
       */
      function () {
          var _this = this;
          /** @type {?} */
          var cacheInput = this._base.cacheInput.bind(this._base);
          this._base.cacheInput = function (key, source, cacheRaw, merge) {
              if (cacheRaw === void 0) { cacheRaw = false; }
              if (merge === void 0) { merge = true; }
              /** @type {?} */
              var styles = _this._buildStyleMap(source);
              if (merge) {
                  styles = extendObject({}, _this._base.inputMap['ngStyle'], styles);
              }
              cacheInput(key, styles, cacheRaw);
          };
      };
      /**
       * 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
       */
      /**
       * 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
       * @param {?} styles
       * @return {?}
       */
      StyleDirective.prototype._buildStyleMap = /**
       * 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
       * @param {?} styles
       * @return {?}
       */
      function (styles) {
          var _this = this;
          /** @type {?} */
          var sanitizer = function (val) {
              // Always safe-guard (aka sanitize) style property values
              return _this._sanitizer.sanitize(SecurityContext.STYLE, val) || '';
          };
          if (styles) {
              switch (getType(styles)) {
                  case 'string': return buildMapFromList$1(buildRawList(styles), sanitizer);
                  case 'array': return buildMapFromList$1(/** @type {?} */ (styles), sanitizer);
                  case 'set': return buildMapFromSet(styles, sanitizer);
                  default: return buildMapFromSet(styles, sanitizer);
              }
          }
          return styles;
      };
      /** Initial lookup of raw 'class' value (if any) */
      /**
       * Initial lookup of raw 'class' value (if any)
       * @return {?}
       */
      StyleDirective.prototype._fallbackToStyle = /**
       * Initial lookup of raw 'class' value (if any)
       * @return {?}
       */
      function () {
          if (!this._base.queryInput('ngStyle')) {
              this.ngStyleBase = this._getAttributeValue('style') || '';
          }
      };
      StyleDirective.decorators = [
          { type: Directive, args: [{
                      selector: "\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  "
                  },] },
      ];
      /** @nocollapse */
      StyleDirective.ctorParameters = function () { return [
          { type: MediaMonitor },
          { type: DomSanitizer },
          { type: ElementRef },
          { type: Renderer2 },
          { type: KeyValueDiffers },
          { type: NgStyle, decorators: [{ type: Optional }, { type: Self }] },
          { type: StyleUtils }
      ]; };
      StyleDirective.propDecorators = {
          ngStyleBase: [{ type: Input, args: ['ngStyle',] }],
          ngStyleXs: [{ type: Input, args: ['ngStyle.xs',] }],
          ngStyleSm: [{ type: Input, args: ['ngStyle.sm',] }],
          ngStyleMd: [{ type: Input, args: ['ngStyle.md',] }],
          ngStyleLg: [{ type: Input, args: ['ngStyle.lg',] }],
          ngStyleXl: [{ type: Input, args: ['ngStyle.xl',] }],
          ngStyleLtSm: [{ type: Input, args: ['ngStyle.lt-sm',] }],
          ngStyleLtMd: [{ type: Input, args: ['ngStyle.lt-md',] }],
          ngStyleLtLg: [{ type: Input, args: ['ngStyle.lt-lg',] }],
          ngStyleLtXl: [{ type: Input, args: ['ngStyle.lt-xl',] }],
          ngStyleGtXs: [{ type: Input, args: ['ngStyle.gt-xs',] }],
          ngStyleGtSm: [{ type: Input, args: ['ngStyle.gt-sm',] }],
          ngStyleGtMd: [{ type: Input, args: ['ngStyle.gt-md',] }],
          ngStyleGtLg: [{ type: Input, args: ['ngStyle.gt-lg',] }]
      };
      return StyleDirective;
  }(BaseDirective));
  /**
   * Build a styles map from a list of styles, while sanitizing bad values first
   * @param {?} styles
   * @param {?=} sanitize
   * @return {?}
   */
  function buildMapFromList$1(styles, sanitize) {
      /** @type {?} */
      var sanitizeValue = function (it) {
          if (sanitize) {
              it.value = sanitize(it.value);
          }
          return it;
      };
      return styles
          .map(stringToKeyValue)
          .filter(function (entry) { return !!entry; })
          .map(sanitizeValue)
          .reduce(keyValuesToMap, /** @type {?} */ ({}));
  }
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  /** @type {?} */
  var ALL_DIRECTIVES = [
      ShowHideDirective,
      ClassDirective,
      StyleDirective,
      ImgSrcDirective
  ];
  /**
   * *****************************************************************
   * Define module for the Extended API
   * *****************************************************************
   */
  var ExtendedModule = /** @class */ (function () {
      function ExtendedModule() {
      }
      ExtendedModule.decorators = [
          { type: NgModule, args: [{
                      imports: [CoreModule],
                      declarations: ALL_DIRECTIVES.slice(),
                      exports: ALL_DIRECTIVES.slice()
                  },] },
      ];
      return ExtendedModule;
  }());
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  
  /**
   * @fileoverview added by tsickle
   * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
   */
  
  export { ExtendedModule, ClassDirective, ImgSrcDirective, negativeOf, ShowHideDirective, StyleDirective };
  //# sourceMappingURL=extended.es5.js.map
  