@angular/flex-layout/fesm2015/angular-flex-layout-flex.mjs.map

Angular Flex-Layout =======

{"version":3,"file":"angular-flex-layout-flex.mjs","sources":["../../../../projects/libs/flex-layout/flex/layout/layout.ts","../../../../projects/libs/flex-layout/flex/layout-gap/layout-gap.ts","../../../../projects/libs/flex-layout/flex/flex/flex.ts","../../../../projects/libs/flex-layout/flex/flex-order/flex-order.ts","../../../../projects/libs/flex-layout/flex/flex-offset/flex-offset.ts","../../../../projects/libs/flex-layout/flex/flex-align/flex-align.ts","../../../../projects/libs/flex-layout/flex/flex-fill/flex-fill.ts","../../../../projects/libs/flex-layout/flex/layout-align/layout-align.ts","../../../../projects/libs/flex-layout/flex/module.ts","../../../../projects/libs/flex-layout/flex/public-api.ts","../../../../projects/libs/flex-layout/flex/angular-flex-layout-flex.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, OnChanges, Injectable, Inject} from '@angular/core';\nimport {\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  MediaMarshaller,\n  LAYOUT_CONFIG,\n  LayoutConfigOptions,\n} from '@angular/flex-layout/core';\n\nimport {buildLayoutCSS} from '@angular/flex-layout/_private-utils';\n\nexport interface LayoutStyleDisplay {\n  readonly display: string;\n}\n\n@Injectable({providedIn: 'root'})\nexport class LayoutStyleBuilder extends StyleBuilder {\n  buildStyles(input: string, {display}: LayoutStyleDisplay) {\n    const css = buildLayoutCSS(input);\n    return {\n      ...css,\n      display: display === 'none' ? display : css.display,\n    };\n  }\n}\n\nconst inputs = [\n  'fxLayout', 'fxLayout.xs', 'fxLayout.sm', 'fxLayout.md',\n  'fxLayout.lg', 'fxLayout.xl', 'fxLayout.lt-sm', 'fxLayout.lt-md',\n  'fxLayout.lt-lg', 'fxLayout.lt-xl', 'fxLayout.gt-xs', 'fxLayout.gt-sm',\n  'fxLayout.gt-md', 'fxLayout.gt-lg'\n];\nconst selector = `\n  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],\n  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],\n  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],\n  [fxLayout.gt-md], [fxLayout.gt-lg]\n`;\n\n/**\n * 'layout' flexbox styling directive\n * Defines the positioning flow direction for the child elements: row or column\n * Optional values: column or row (default)\n * @see https://css-tricks.com/almanac/properties/f/flex-direction/\n *\n */\n@Directive()\nexport class LayoutDirective extends BaseDirective2 implements OnChanges {\n\n  protected override DIRECTIVE_KEY = 'layout';\n\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              styleBuilder: LayoutStyleBuilder,\n              marshal: MediaMarshaller,\n              @Inject(LAYOUT_CONFIG) private _config: LayoutConfigOptions) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.init();\n  }\n\n  protected override updateWithValue(input: string) {\n    const detectLayoutDisplay = this._config.detectLayoutDisplay;\n    const display = detectLayoutDisplay ? this.styler.lookupStyle(this.nativeElement, 'display') : '';\n    this.styleCache = cacheMap.get(display) ?? new Map();\n    cacheMap.set(display, this.styleCache);\n\n    if (this.currentValue !== input) {\n      this.addStyles(input, {display});\n      this.currentValue = input;\n    }\n  }\n}\n\n@Directive({selector, inputs})\nexport class DefaultLayoutDirective extends LayoutDirective {\n  protected override inputs = inputs;\n}\n\ntype CacheMap = Map<string, StyleDefinition>;\nconst cacheMap = new Map<string, CacheMap>();\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n  Directive,\n  ElementRef,\n  OnDestroy,\n  NgZone,\n  Injectable,\n  AfterContentInit,\n  Inject,\n} from '@angular/core';\nimport {Directionality} from '@angular/cdk/bidi';\nimport {\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  MediaMarshaller,\n  ElementMatcher,\n  LAYOUT_CONFIG,\n  LayoutConfigOptions,\n  ɵmultiply as multiply,\n} from '@angular/flex-layout/core';\nimport {LAYOUT_VALUES} from '@angular/flex-layout/_private-utils';\nimport {Subject} from 'rxjs';\nimport {takeUntil} from 'rxjs/operators';\n\n\nexport interface LayoutGapParent {\n  directionality: string;\n  items: HTMLElement[];\n  layout: string;\n}\n\nconst CLEAR_MARGIN_CSS = {\n  'margin-left': null,\n  'margin-right': null,\n  'margin-top': null,\n  'margin-bottom': null\n};\n\n@Injectable({providedIn: 'root'})\nexport class LayoutGapStyleBuilder extends StyleBuilder {\n  constructor(private _styler: StyleUtils,\n              @Inject(LAYOUT_CONFIG) private _config: LayoutConfigOptions) {\n    super();\n  }\n\n  buildStyles(gapValue: string, parent: LayoutGapParent) {\n    if (gapValue.endsWith(GRID_SPECIFIER)) {\n      gapValue = gapValue.slice(0, gapValue.indexOf(GRID_SPECIFIER));\n      gapValue = multiply(gapValue, this._config.multiplier);\n\n      // Add the margin to the host element\n      return buildGridMargin(gapValue, parent.directionality);\n    } else {\n      return {};\n    }\n  }\n\n  override sideEffect(gapValue: string, _styles: StyleDefinition, parent: LayoutGapParent) {\n    const items = parent.items;\n    if (gapValue.endsWith(GRID_SPECIFIER)) {\n      gapValue = gapValue.slice(0, gapValue.indexOf(GRID_SPECIFIER));\n      gapValue = multiply(gapValue, this._config.multiplier);\n      // For each `element` children, set the padding\n      const paddingStyles = buildGridPadding(gapValue, parent.directionality);\n      this._styler.applyStyleToElements(paddingStyles, parent.items);\n    } else {\n      gapValue = multiply(gapValue, this._config.multiplier);\n      gapValue = this.addFallbackUnit(gapValue);\n\n      const lastItem = items.pop()!;\n\n      // For each `element` children EXCEPT the last,\n      // set the margin right/bottom styles...\n      const gapCss = buildGapCSS(gapValue, parent);\n      this._styler.applyStyleToElements(gapCss, items);\n\n      // Clear all gaps for all visible elements\n      this._styler.applyStyleToElements(CLEAR_MARGIN_CSS, [lastItem]);\n    }\n  }\n\n  private addFallbackUnit(value: string) {\n    return !isNaN(+value) ? `${value}${this._config.defaultUnit}` : value;\n  }\n}\n\nconst inputs = [\n  'fxLayoutGap', 'fxLayoutGap.xs', 'fxLayoutGap.sm', 'fxLayoutGap.md',\n  'fxLayoutGap.lg', 'fxLayoutGap.xl', 'fxLayoutGap.lt-sm', 'fxLayoutGap.lt-md',\n  'fxLayoutGap.lt-lg', 'fxLayoutGap.lt-xl', 'fxLayoutGap.gt-xs', 'fxLayoutGap.gt-sm',\n  'fxLayoutGap.gt-md', 'fxLayoutGap.gt-lg'\n];\nconst selector = `\n  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],\n  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],\n  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],\n  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]\n`;\n\n/**\n * 'layout-padding' styling directive\n *  Defines padding of child elements in a layout container\n */\n@Directive()\nexport class LayoutGapDirective extends BaseDirective2 implements AfterContentInit, OnDestroy {\n  protected layout = 'row';  // default flex-direction\n  protected override DIRECTIVE_KEY = 'layout-gap';\n  protected observerSubject = new Subject<void>();\n\n  /** Special accessor to query for all child 'element' nodes regardless of type, class, etc */\n  protected get childrenNodes(): HTMLElement[] {\n    const obj = this.nativeElement.children;\n    const buffer: any[] = [];\n\n    // iterate backwards ensuring that length is an UInt32\n    for (let i = obj.length; i--;) {\n      buffer[i] = obj[i];\n    }\n    return buffer;\n  }\n\n  constructor(elRef: ElementRef,\n              protected zone: NgZone,\n              protected directionality: Directionality,\n              protected styleUtils: StyleUtils,\n              styleBuilder: LayoutGapStyleBuilder,\n              marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    const extraTriggers = [this.directionality.change, this.observerSubject.asObservable()];\n    this.init(extraTriggers);\n    this.marshal\n      .trackValue(this.nativeElement, 'layout')\n      .pipe(takeUntil(this.destroySubject))\n      .subscribe(this.onLayoutChange.bind(this));\n  }\n\n  // *********************************************\n  // Lifecycle Methods\n  // *********************************************\n\n  ngAfterContentInit() {\n    this.buildChildObservable();\n    this.triggerUpdate();\n  }\n\n  override ngOnDestroy() {\n    super.ngOnDestroy();\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  // *********************************************\n  // Protected methods\n  // *********************************************\n\n  /**\n   * Cache the parent container 'flex-direction' and update the 'margin' styles\n   */\n  protected onLayoutChange(matcher: ElementMatcher) {\n    const layout: string = matcher.value;\n    // Make sure to filter out 'wrap' option\n    const direction = layout.split(' ');\n    this.layout = direction[0];\n    if (!LAYOUT_VALUES.find(x => x === this.layout)) {\n      this.layout = 'row';\n    }\n    this.triggerUpdate();\n  }\n\n  /**\n   *\n   */\n  protected override updateWithValue(value: string) {\n    // Gather all non-hidden Element nodes\n    const items = this.childrenNodes\n      .filter(el => el.nodeType === 1 && this.willDisplay(el))\n      .sort((a, b) => {\n        const orderA = +this.styler.lookupStyle(a, 'order');\n        const orderB = +this.styler.lookupStyle(b, 'order');\n        if (isNaN(orderA) || isNaN(orderB) || orderA === orderB) {\n          return 0;\n        } else {\n          return orderA > orderB ? 1 : -1;\n        }\n      });\n\n    if (items.length > 0) {\n      const directionality = this.directionality.value;\n      const layout = this.layout;\n      if (layout === 'row' && directionality === 'rtl') {\n        this.styleCache = layoutGapCacheRowRtl;\n      } else if (layout === 'row' && directionality !== 'rtl') {\n        this.styleCache = layoutGapCacheRowLtr;\n      } else if (layout === 'column' && directionality === 'rtl') {\n        this.styleCache = layoutGapCacheColumnRtl;\n      } else if (layout === 'column' && directionality !== 'rtl') {\n        this.styleCache = layoutGapCacheColumnLtr;\n      }\n      this.addStyles(value, {directionality, items, layout});\n    }\n  }\n\n  /** We need to override clearStyles because in most cases mru isn't populated */\n  protected override clearStyles() {\n    const gridMode = Object.keys(this.mru).length > 0;\n    const childrenStyle = gridMode ? 'padding' :\n      getMarginType(this.directionality.value, this.layout);\n\n    // If there are styles on the parent remove them\n    if (gridMode) {\n      super.clearStyles();\n    }\n\n    // Then remove the children styles too\n    this.styleUtils.applyStyleToElements({[childrenStyle]: ''}, this.childrenNodes);\n  }\n\n  /** Determine if an element will show or hide based on current activation */\n  protected willDisplay(source: HTMLElement): boolean {\n    const value = this.marshal.getValue(source, 'show-hide');\n    return value === true ||\n      (value === undefined && this.styleUtils.lookupStyle(source, 'display') !== 'none');\n  }\n\n  protected buildChildObservable(): void {\n    this.zone.runOutsideAngular(() => {\n      if (typeof MutationObserver !== 'undefined') {\n        this.observer = new MutationObserver((mutations: MutationRecord[]) => {\n          const validatedChanges = (it: MutationRecord): boolean => {\n            return (it.addedNodes && it.addedNodes.length > 0) ||\n              (it.removedNodes && it.removedNodes.length > 0);\n          };\n\n          // update gap styles only for child 'added' or 'removed' events\n          if (mutations.some(validatedChanges)) {\n            this.observerSubject.next();\n          }\n        });\n        this.observer.observe(this.nativeElement, {childList: true});\n      }\n    });\n  }\n\n  protected observer?: MutationObserver;\n}\n\n@Directive({selector, inputs})\nexport class DefaultLayoutGapDirective extends LayoutGapDirective {\n  protected override inputs = inputs;\n}\n\nconst layoutGapCacheRowRtl: Map<string, StyleDefinition> = new Map();\nconst layoutGapCacheColumnRtl: Map<string, StyleDefinition> = new Map();\nconst layoutGapCacheRowLtr: Map<string, StyleDefinition> = new Map();\nconst layoutGapCacheColumnLtr: Map<string, StyleDefinition> = new Map();\n\nconst GRID_SPECIFIER = ' grid';\n\nfunction buildGridPadding(value: string, directionality: string): StyleDefinition {\n  const [between, below] = value.split(' ');\n  const bottom = below ?? between;\n  let paddingRight = '0px', paddingBottom = bottom, paddingLeft = '0px';\n\n  if (directionality === 'rtl') {\n    paddingLeft = between;\n  } else {\n    paddingRight = between;\n  }\n\n  return {'padding': `0px ${paddingRight} ${paddingBottom} ${paddingLeft}`};\n}\n\nfunction buildGridMargin(value: string, directionality: string): StyleDefinition {\n  const [between, below] = value.split(' ');\n  const bottom = below ?? between;\n  const minus = (str: string) => `-${str}`;\n  let marginRight = '0px', marginBottom = minus(bottom), marginLeft = '0px';\n\n  if (directionality === 'rtl') {\n    marginLeft = minus(between);\n  } else {\n    marginRight = minus(between);\n  }\n\n  return {'margin': `0px ${marginRight} ${marginBottom} ${marginLeft}`};\n}\n\nfunction getMarginType(directionality: string, layout: string) {\n  switch (layout) {\n    case 'column':\n      return 'margin-bottom';\n    case 'column-reverse':\n      return 'margin-top';\n    case 'row':\n      return directionality === 'rtl' ? 'margin-left' : 'margin-right';\n    case 'row-reverse':\n      return directionality === 'rtl' ? 'margin-right' : 'margin-left';\n    default :\n      return directionality === 'rtl' ? 'margin-left' : 'margin-right';\n  }\n}\n\nfunction buildGapCSS(gapValue: string,\n                     parent: {directionality: string, layout: string}): StyleDefinition {\n  const key = getMarginType(parent.directionality, parent.layout);\n  const margins: {[key: string]: string | null} = {...CLEAR_MARGIN_CSS};\n  margins[key] = gapValue;\n  return margins;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Inject, Injectable, Input, OnInit} from '@angular/core';\nimport {\n  BaseDirective2,\n  LayoutConfigOptions,\n  LAYOUT_CONFIG,\n  StyleUtils,\n  validateBasis,\n  StyleBuilder,\n  StyleDefinition,\n  MediaMarshaller,\n  ElementMatcher,\n} from '@angular/flex-layout/core';\nimport {takeUntil} from 'rxjs/operators';\n\nimport {extendObject} from '@angular/flex-layout/_private-utils';\nimport {isFlowHorizontal} from '@angular/flex-layout/_private-utils';\n\ninterface FlexBuilderParent {\n  direction: string;\n  hasWrap: boolean;\n}\n\n@Injectable({providedIn: 'root'})\nexport class FlexStyleBuilder extends StyleBuilder {\n  constructor(@Inject(LAYOUT_CONFIG) protected layoutConfig: LayoutConfigOptions) {\n    super();\n  }\n  buildStyles(input: string, parent: FlexBuilderParent) {\n    let [grow, shrink, ...basisParts]: (string|number)[] = input.split(' ');\n    let basis = basisParts.join(' ');\n\n    // The flex-direction of this element's flex container. Defaults to 'row'.\n    const direction = (parent.direction.indexOf('column') > -1) ? 'column' : 'row';\n\n    const max = isFlowHorizontal(direction) ? 'max-width' : 'max-height';\n    const min = isFlowHorizontal(direction) ? 'min-width' : 'min-height';\n\n    const hasCalc = String(basis).indexOf('calc') > -1;\n    const usingCalc = hasCalc || (basis === 'auto');\n    const isPercent = String(basis).indexOf('%') > -1 && !hasCalc;\n    const hasUnits = String(basis).indexOf('px') > -1 || String(basis).indexOf('rem') > -1 ||\n      String(basis).indexOf('em') > -1 || String(basis).indexOf('vw') > -1 ||\n      String(basis).indexOf('vh') > -1;\n\n    let isValue = (hasCalc || hasUnits);\n\n    grow = (grow == '0') ? 0 : grow;\n    shrink = (shrink == '0') ? 0 : shrink;\n\n    // make box inflexible when shrink and grow are both zero\n    // should not set a min when the grow is zero\n    // should not set a max when the shrink is zero\n    const isFixed = !grow && !shrink;\n\n    let css: {[key: string]: string | number | null} = {};\n\n    // flex-basis allows you to specify the initial/starting main-axis size of the element,\n    // before anything else is computed. It can either be a percentage or an absolute value.\n    // It is, however, not the breaking point for flex-grow/shrink properties\n    //\n    // flex-grow can be seen as this:\n    //   0: Do not stretch. Either size to element's content width, or obey 'flex-basis'.\n    //   1: (Default value). Stretch; will be the same size to all other flex items on\n    //       the same row since they have a default value of 1.\n    //   ≥2 (integer n): Stretch. Will be n times the size of other elements\n    //      with 'flex-grow: 1' on the same row.\n\n    // Use `null` to clear existing styles.\n    const clearStyles = {\n      'max-width': null,\n      'max-height': null,\n      'min-width': null,\n      'min-height': null\n    };\n    switch (basis || '') {\n      case '':\n        const useColumnBasisZero = this.layoutConfig.useColumnBasisZero !== false;\n        basis = direction === 'row' ? '0%' : (useColumnBasisZero ? '0.000000001px' : 'auto');\n        break;\n      case 'initial':   // default\n      case 'nogrow':\n        grow = 0;\n        basis = 'auto';\n        break;\n      case 'grow':\n        basis = '100%';\n        break;\n      case 'noshrink':\n        shrink = 0;\n        basis = 'auto';\n        break;\n      case 'auto':\n        break;\n      case 'none':\n        grow = 0;\n        shrink = 0;\n        basis = 'auto';\n        break;\n      default:\n        // Defaults to percentage sizing unless `px` is explicitly set\n        if (!isValue && !isPercent && !isNaN(basis as any)) {\n          basis = basis + '%';\n        }\n\n        // Fix for issue 280\n        if (basis === '0%') {\n          isValue = true;\n        }\n\n        if (basis === '0px') {\n          basis = '0%';\n        }\n\n        // fix issue #5345\n        if (hasCalc) {\n          css = extendObject(clearStyles, {\n            'flex-grow': grow,\n            'flex-shrink': shrink,\n            'flex-basis': isValue ? basis : '100%'\n          });\n        } else {\n          css = extendObject(clearStyles, {\n            'flex': `${grow} ${shrink} ${isValue ? basis : '100%'}`\n          });\n        }\n\n        break;\n    }\n\n    if (!(css['flex'] || css['flex-grow'])) {\n      if (hasCalc) {\n        css = extendObject(clearStyles, {\n          'flex-grow': grow,\n          'flex-shrink': shrink,\n          'flex-basis': basis\n        });\n      } else {\n        css = extendObject(clearStyles, {\n          'flex': `${grow} ${shrink} ${basis}`\n        });\n      }\n    }\n\n    // Fix for issues 277, 534, and 728\n    if (basis !== '0%' && basis !== '0px' && basis !== '0.000000001px' && basis !== 'auto') {\n      css[min] = isFixed || (isValue && grow) ? basis : null;\n      css[max] = isFixed || (!usingCalc && shrink) ? basis : null;\n    }\n\n    // Fix for issue 528\n    if (!css[min] && !css[max]) {\n      if (hasCalc) {\n        css = extendObject(clearStyles, {\n          'flex-grow': grow,\n          'flex-shrink': shrink,\n          'flex-basis': basis\n        });\n      } else {\n        css = extendObject(clearStyles, {\n          'flex': `${grow} ${shrink} ${basis}`\n        });\n      }\n    } else {\n      // Fix for issue 660\n      if (parent.hasWrap) {\n        css[hasCalc ? 'flex-basis' : 'flex'] = css[max] ?\n          (hasCalc ? css[max] : `${grow} ${shrink} ${css[max]}`) :\n          (hasCalc ? css[min] : `${grow} ${shrink} ${css[min]}`);\n      }\n    }\n\n    return extendObject(css, {'box-sizing': 'border-box'}) as StyleDefinition;\n  }\n}\n\nconst inputs = [\n  'fxFlex', 'fxFlex.xs', 'fxFlex.sm', 'fxFlex.md',\n  'fxFlex.lg', 'fxFlex.xl', 'fxFlex.lt-sm', 'fxFlex.lt-md',\n  'fxFlex.lt-lg', 'fxFlex.lt-xl', 'fxFlex.gt-xs', 'fxFlex.gt-sm',\n  'fxFlex.gt-md', 'fxFlex.gt-lg'\n];\nconst selector = `\n  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],\n  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],\n  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],\n  [fxFlex.gt-md], [fxFlex.gt-lg]\n`;\n\n/**\n * Directive to control the size of a flex item using flex-basis, flex-grow, and flex-shrink.\n * Corresponds to the css `flex` shorthand property.\n *\n * @see https://css-tricks.com/snippets/css/a-guide-to-flexbox/\n */\n@Directive()\nexport class FlexDirective extends BaseDirective2 implements OnInit {\n\n  protected override DIRECTIVE_KEY = 'flex';\n  protected direction?: string = undefined;\n  protected wrap?: boolean = undefined;\n\n\n  @Input('fxShrink')\n  get shrink(): string { return this.flexShrink; }\n  set shrink(value: string) {\n    this.flexShrink = value || '1';\n    this.triggerReflow();\n  }\n\n  @Input('fxGrow')\n  get grow(): string { return this.flexGrow; }\n  set grow(value: string) {\n    this.flexGrow = value || '1';\n    this.triggerReflow();\n  }\n\n  protected flexGrow = '1';\n  protected flexShrink = '1';\n\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              @Inject(LAYOUT_CONFIG) protected layoutConfig: LayoutConfigOptions,\n              styleBuilder: FlexStyleBuilder,\n              protected override marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.init();\n  }\n\n  ngOnInit() {\n    if (this.parentElement) {\n      this.marshal.trackValue(this.parentElement, 'layout')\n        .pipe(takeUntil(this.destroySubject))\n        .subscribe(this.onLayoutChange.bind(this));\n      this.marshal.trackValue(this.nativeElement, 'layout-align')\n        .pipe(takeUntil(this.destroySubject))\n        .subscribe(this.triggerReflow.bind(this));\n    }\n  }\n\n  /**\n   * Caches the parent container's 'flex-direction' and updates the element's style.\n   * Used as a handler for layout change events from the parent flex container.\n   */\n  protected onLayoutChange(matcher: ElementMatcher) {\n    const layout: string = matcher.value;\n    const layoutParts = layout.split(' ');\n    this.direction = layoutParts[0];\n    this.wrap = layoutParts[1] !== undefined && layoutParts[1] === 'wrap';\n    this.triggerUpdate();\n  }\n\n  /** Input to this is exclusively the basis input value */\n  protected override updateWithValue(value: string) {\n    const addFlexToParent = this.layoutConfig.addFlexToParent !== false;\n    if (this.direction === undefined) {\n      this.direction = this.getFlexFlowDirection(this.parentElement!, addFlexToParent);\n    }\n    if (this.wrap === undefined) {\n      this.wrap = this.hasWrap(this.parentElement!);\n    }\n    const direction = this.direction;\n    const isHorizontal = direction.startsWith('row');\n    const hasWrap = this.wrap;\n    if (isHorizontal && hasWrap) {\n      this.styleCache = flexRowWrapCache;\n    } else if (isHorizontal && !hasWrap) {\n      this.styleCache = flexRowCache;\n    } else if (!isHorizontal && hasWrap) {\n      this.styleCache = flexColumnWrapCache;\n    } else if (!isHorizontal && !hasWrap) {\n      this.styleCache = flexColumnCache;\n    }\n    const basis = String(value).replace(';', '');\n    const parts = validateBasis(basis, this.flexGrow, this.flexShrink);\n    this.addStyles(parts.join(' '), {direction, hasWrap});\n  }\n\n  /** Trigger a style reflow, usually based on a shrink/grow input event */\n  protected triggerReflow() {\n    const activatedValue = this.activatedValue;\n    if (activatedValue !== undefined) {\n      const parts = validateBasis(activatedValue + '', this.flexGrow, this.flexShrink);\n      this.marshal.updateElement(this.nativeElement, this.DIRECTIVE_KEY, parts.join(' '));\n    }\n  }\n}\n\n@Directive({inputs, selector})\nexport class DefaultFlexDirective extends FlexDirective {\n  protected override inputs = inputs;\n}\n\nconst flexRowCache: Map<string, StyleDefinition> = new Map();\nconst flexColumnCache: Map<string, StyleDefinition> = new Map();\nconst flexRowWrapCache: Map<string, StyleDefinition> = new Map();\nconst flexColumnWrapCache: Map<string, StyleDefinition> = new Map();\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, OnChanges, Injectable} from '@angular/core';\nimport {\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  MediaMarshaller,\n} from '@angular/flex-layout/core';\n\n@Injectable({providedIn: 'root'})\nexport class FlexOrderStyleBuilder extends StyleBuilder {\n  buildStyles(value: string) {\n    return {order: (value && parseInt(value, 10)) || ''};\n  }\n}\n\nconst inputs = [\n  'fxFlexOrder', 'fxFlexOrder.xs', 'fxFlexOrder.sm', 'fxFlexOrder.md',\n  'fxFlexOrder.lg', 'fxFlexOrder.xl', 'fxFlexOrder.lt-sm', 'fxFlexOrder.lt-md',\n  'fxFlexOrder.lt-lg', 'fxFlexOrder.lt-xl', 'fxFlexOrder.gt-xs', 'fxFlexOrder.gt-sm',\n  'fxFlexOrder.gt-md', 'fxFlexOrder.gt-lg'\n];\nconst selector = `\n  [fxFlexOrder], [fxFlexOrder.xs], [fxFlexOrder.sm], [fxFlexOrder.md],\n  [fxFlexOrder.lg], [fxFlexOrder.xl], [fxFlexOrder.lt-sm], [fxFlexOrder.lt-md],\n  [fxFlexOrder.lt-lg], [fxFlexOrder.lt-xl], [fxFlexOrder.gt-xs], [fxFlexOrder.gt-sm],\n  [fxFlexOrder.gt-md], [fxFlexOrder.gt-lg]\n`;\n\n/**\n * 'flex-order' flexbox styling directive\n * Configures the positional ordering of the element in a sorted layout container\n * @see https://css-tricks.com/almanac/properties/o/order/\n */\n@Directive()\nexport class FlexOrderDirective extends BaseDirective2 implements OnChanges {\n\n  protected override DIRECTIVE_KEY = 'flex-order';\n\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              styleBuilder: FlexOrderStyleBuilder,\n              marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.init();\n  }\n\n  protected override styleCache = flexOrderCache;\n}\n\nconst flexOrderCache: Map<string, StyleDefinition> = new Map();\n\n@Directive({selector, inputs})\nexport class DefaultFlexOrderDirective extends FlexOrderDirective {\n  protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, OnChanges, Injectable, Inject} from '@angular/core';\nimport {Directionality} from '@angular/cdk/bidi';\nimport {\n  MediaMarshaller,\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  ɵmultiply as multiply,\n  LAYOUT_CONFIG,\n  LayoutConfigOptions,\n} from '@angular/flex-layout/core';\nimport {isFlowHorizontal} from '@angular/flex-layout/_private-utils';\nimport {takeUntil} from 'rxjs/operators';\n\n\nexport interface FlexOffsetParent {\n  layout: string;\n  isRtl: boolean;\n}\n\n@Injectable({providedIn: 'root'})\nexport class FlexOffsetStyleBuilder extends StyleBuilder {\n  constructor(@Inject(LAYOUT_CONFIG) private _config: LayoutConfigOptions) {\n    super();\n  }\n\n  buildStyles(offset: string, parent: FlexOffsetParent) {\n    offset ||= '0';\n    offset = multiply(offset, this._config.multiplier);\n    const isPercent = String(offset).indexOf('%') > -1;\n    const isPx = String(offset).indexOf('px') > -1;\n    if (!isPx && !isPercent && !isNaN(+offset)) {\n      offset = `${offset}%`;\n    }\n    const horizontalLayoutKey = parent.isRtl ? 'margin-right' : 'margin-left';\n    const styles: StyleDefinition = isFlowHorizontal(parent.layout) ?\n      {[horizontalLayoutKey]: offset} : {'margin-top': offset};\n\n    return styles;\n  }\n}\n\nconst inputs = [\n  'fxFlexOffset', 'fxFlexOffset.xs', 'fxFlexOffset.sm', 'fxFlexOffset.md',\n  'fxFlexOffset.lg', 'fxFlexOffset.xl', 'fxFlexOffset.lt-sm', 'fxFlexOffset.lt-md',\n  'fxFlexOffset.lt-lg', 'fxFlexOffset.lt-xl', 'fxFlexOffset.gt-xs', 'fxFlexOffset.gt-sm',\n  'fxFlexOffset.gt-md', 'fxFlexOffset.gt-lg'\n];\nconst selector = `\n  [fxFlexOffset], [fxFlexOffset.xs], [fxFlexOffset.sm], [fxFlexOffset.md],\n  [fxFlexOffset.lg], [fxFlexOffset.xl], [fxFlexOffset.lt-sm], [fxFlexOffset.lt-md],\n  [fxFlexOffset.lt-lg], [fxFlexOffset.lt-xl], [fxFlexOffset.gt-xs], [fxFlexOffset.gt-sm],\n  [fxFlexOffset.gt-md], [fxFlexOffset.gt-lg]\n`;\n\n/**\n * 'flex-offset' flexbox styling directive\n * Configures the 'margin-left' of the element in a layout container\n */\n@Directive()\nexport class FlexOffsetDirective extends BaseDirective2 implements OnChanges {\n  protected override DIRECTIVE_KEY = 'flex-offset';\n\n  constructor(elRef: ElementRef,\n              protected directionality: Directionality,\n              styleBuilder: FlexOffsetStyleBuilder,\n              marshal: MediaMarshaller,\n              styler: StyleUtils) {\n    super(elRef, styleBuilder, styler, marshal);\n    this.init([this.directionality.change]);\n    // Parent DOM `layout-gap` with affect the nested child with `flex-offset`\n    if (this.parentElement) {\n      this.marshal\n        .trackValue(this.parentElement, 'layout-gap')\n        .pipe(takeUntil(this.destroySubject))\n        .subscribe(this.triggerUpdate.bind(this));\n    }\n  }\n\n  // *********************************************\n  // Protected methods\n  // *********************************************\n\n  /**\n   * Using the current fxFlexOffset value, update the inline CSS\n   * NOTE: this will assign `margin-left` if the parent flex-direction == 'row',\n   *       otherwise `margin-top` is used for the offset.\n   */\n  protected override updateWithValue(value: string|number = ''): void {\n    // The flex-direction of this element's flex container. Defaults to 'row'.\n    const layout = this.getFlexFlowDirection(this.parentElement!, true);\n    const isRtl = this.directionality.value === 'rtl';\n    if (layout === 'row' && isRtl) {\n      this.styleCache = flexOffsetCacheRowRtl;\n    } else if (layout === 'row' && !isRtl) {\n      this.styleCache = flexOffsetCacheRowLtr;\n    } else if (layout === 'column' && isRtl) {\n      this.styleCache = flexOffsetCacheColumnRtl;\n    } else if (layout === 'column' && !isRtl) {\n      this.styleCache = flexOffsetCacheColumnLtr;\n    }\n    this.addStyles(value + '', {layout, isRtl});\n  }\n}\n\n@Directive({selector, inputs})\nexport class DefaultFlexOffsetDirective extends FlexOffsetDirective {\n  protected override inputs = inputs;\n}\n\nconst flexOffsetCacheRowRtl: Map<string, StyleDefinition> = new Map();\nconst flexOffsetCacheColumnRtl: Map<string, StyleDefinition> = new Map();\nconst flexOffsetCacheRowLtr: Map<string, StyleDefinition> = new Map();\nconst flexOffsetCacheColumnLtr: Map<string, StyleDefinition> = new Map();\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Injectable} from '@angular/core';\nimport {\n  MediaMarshaller,\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n} from '@angular/flex-layout/core';\n\n@Injectable({providedIn: 'root'})\nexport class FlexAlignStyleBuilder extends StyleBuilder {\n  buildStyles(input: string) {\n    input = input || 'stretch';\n    const styles: StyleDefinition = {};\n\n    // Cross-axis\n    switch (input) {\n      case 'start':\n        styles['align-self'] = 'flex-start';\n        break;\n      case 'end':\n        styles['align-self'] = 'flex-end';\n        break;\n      default:\n        styles['align-self'] = input;\n        break;\n    }\n\n    return styles;\n  }\n}\n\nconst inputs = [\n  'fxFlexAlign', 'fxFlexAlign.xs', 'fxFlexAlign.sm', 'fxFlexAlign.md',\n  'fxFlexAlign.lg', 'fxFlexAlign.xl', 'fxFlexAlign.lt-sm', 'fxFlexAlign.lt-md',\n  'fxFlexAlign.lt-lg', 'fxFlexAlign.lt-xl', 'fxFlexAlign.gt-xs', 'fxFlexAlign.gt-sm',\n  'fxFlexAlign.gt-md', 'fxFlexAlign.gt-lg'\n];\nconst selector = `\n  [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md],\n  [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md],\n  [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm],\n  [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]\n`;\n\n/**\n * 'flex-align' flexbox styling directive\n * Allows element-specific overrides for cross-axis alignments in a layout container\n * @see https://css-tricks.com/almanac/properties/a/align-self/\n */\n@Directive()\nexport class FlexAlignDirective extends BaseDirective2 {\n\n  protected override DIRECTIVE_KEY = 'flex-align';\n\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              styleBuilder: FlexAlignStyleBuilder,\n              marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.init();\n  }\n\n  protected override styleCache = flexAlignCache;\n}\n\nconst flexAlignCache: Map<string, StyleDefinition> = new Map();\n\n@Directive({selector, inputs})\nexport class DefaultFlexAlignDirective extends FlexAlignDirective {\n  protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Injectable} from '@angular/core';\nimport {\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  MediaMarshaller,\n} from '@angular/flex-layout/core';\n\nconst FLEX_FILL_CSS = {\n  'margin': 0,\n  'width': '100%',\n  'height': '100%',\n  'min-width': '100%',\n  'min-height': '100%'\n};\n\n@Injectable({providedIn: 'root'})\nexport class FlexFillStyleBuilder extends StyleBuilder {\n  buildStyles(_input: string) {\n    return FLEX_FILL_CSS;\n  }\n}\n\n/**\n * 'fxFill' flexbox styling directive\n *  Maximizes width and height of element in a layout container\n *\n *  NOTE: fxFill is NOT responsive API!!\n */\n@Directive({selector: `[fxFill], [fxFlexFill]`})\nexport class FlexFillDirective extends BaseDirective2 {\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              styleBuilder: FlexFillStyleBuilder,\n              marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.addStyles('');\n  }\n\n  protected override styleCache = flexFillCache;\n}\n\nconst flexFillCache: Map<string, StyleDefinition> = new Map();\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Injectable} from '@angular/core';\nimport {\n  BaseDirective2,\n  StyleBuilder,\n  StyleDefinition,\n  StyleUtils,\n  MediaMarshaller,\n  ElementMatcher,\n} from '@angular/flex-layout/core';\nimport {takeUntil} from 'rxjs/operators';\n\nimport {extendObject} from '@angular/flex-layout/_private-utils';\nimport {LAYOUT_VALUES, isFlowHorizontal} from '@angular/flex-layout/_private-utils';\n\nexport interface LayoutAlignParent {\n  layout: string;\n  inline: boolean;\n}\n\n@Injectable({providedIn: 'root'})\nexport class LayoutAlignStyleBuilder extends StyleBuilder {\n  buildStyles(align: string, parent: LayoutAlignParent) {\n    const css: StyleDefinition = {}, [mainAxis, crossAxis] = align.split(' ');\n\n    // Main axis\n    switch (mainAxis) {\n      case 'center':\n        css['justify-content'] = 'center';\n        break;\n      case 'space-around':\n        css['justify-content'] = 'space-around';\n        break;\n      case 'space-between':\n        css['justify-content'] = 'space-between';\n        break;\n      case 'space-evenly':\n        css['justify-content'] = 'space-evenly';\n        break;\n      case 'end':\n      case 'flex-end':\n        css['justify-content'] = 'flex-end';\n        break;\n      case 'start':\n      case 'flex-start':\n      default :\n        css['justify-content'] = 'flex-start';  // default main axis\n        break;\n    }\n\n    // Cross-axis\n    switch (crossAxis) {\n      case 'start':\n      case 'flex-start':\n        css['align-items'] = css['align-content'] = 'flex-start';\n        break;\n      case 'center':\n        css['align-items'] = css['align-content'] = 'center';\n        break;\n      case 'end':\n      case 'flex-end':\n        css['align-items'] = css['align-content'] = 'flex-end';\n        break;\n      case 'space-between':\n        css['align-content'] = 'space-between';\n        css['align-items'] = 'stretch';\n        break;\n      case 'space-around':\n        css['align-content'] = 'space-around';\n        css['align-items'] = 'stretch';\n        break;\n      case 'baseline':\n        css['align-content'] = 'stretch';\n        css['align-items'] = 'baseline';\n        break;\n      case 'stretch':\n      default : // 'stretch'\n        css['align-items'] = css['align-content'] = 'stretch';   // default cross axis\n        break;\n    }\n\n    return extendObject(css, {\n      'display' : parent.inline ? 'inline-flex' : 'flex',\n      'flex-direction' : parent.layout,\n      'box-sizing' : 'border-box',\n      'max-width': crossAxis === 'stretch' ?\n        !isFlowHorizontal(parent.layout) ? '100%' : null : null,\n      'max-height': crossAxis === 'stretch' ?\n        isFlowHorizontal(parent.layout) ? '100%' : null : null,\n    }) as StyleDefinition;\n  }\n}\n\nconst inputs = [\n  'fxLayoutAlign', 'fxLayoutAlign.xs', 'fxLayoutAlign.sm', 'fxLayoutAlign.md',\n  'fxLayoutAlign.lg', 'fxLayoutAlign.xl', 'fxLayoutAlign.lt-sm', 'fxLayoutAlign.lt-md',\n  'fxLayoutAlign.lt-lg', 'fxLayoutAlign.lt-xl', 'fxLayoutAlign.gt-xs', 'fxLayoutAlign.gt-sm',\n  'fxLayoutAlign.gt-md', 'fxLayoutAlign.gt-lg'\n];\nconst selector = `\n  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],\n  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],\n  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],\n  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]\n`;\n\n/**\n * 'layout-align' flexbox styling directive\n *  Defines positioning of child elements along main and cross axis in a layout container\n *  Optional values: {main-axis} values or {main-axis cross-axis} value pairs\n *\n *  @see https://css-tricks.com/almanac/properties/j/justify-content/\n *  @see https://css-tricks.com/almanac/properties/a/align-items/\n *  @see https://css-tricks.com/almanac/properties/a/align-content/\n */\n@Directive()\nexport class LayoutAlignDirective extends BaseDirective2 {\n  protected override DIRECTIVE_KEY = 'layout-align';\n  protected layout = 'row';  // default flex-direction\n  protected inline = false;  // default inline value\n\n  constructor(elRef: ElementRef,\n              styleUtils: StyleUtils,\n              styleBuilder: LayoutAlignStyleBuilder,\n              marshal: MediaMarshaller) {\n    super(elRef, styleBuilder, styleUtils, marshal);\n    this.init();\n    this.marshal.trackValue(this.nativeElement, 'layout')\n      .pipe(takeUntil(this.destroySubject))\n      .subscribe(this.onLayoutChange.bind(this));\n  }\n\n  // *********************************************\n  // Protected methods\n  // *********************************************\n\n  /**\n   *\n   */\n  protected override updateWithValue(value: string) {\n    const layout = this.layout || 'row';\n    const inline = this.inline;\n    if (layout === 'row' && inline) {\n      this.styleCache = layoutAlignHorizontalInlineCache;\n    } else if (layout === 'row' && !inline) {\n      this.styleCache = layoutAlignHorizontalCache;\n    } else if (layout === 'row-reverse' && inline) {\n      this.styleCache = layoutAlignHorizontalRevInlineCache;\n    } else if (layout === 'row-reverse' && !inline) {\n      this.styleCache = layoutAlignHorizontalRevCache;\n    } else if (layout === 'column' && inline) {\n      this.styleCache = layoutAlignVerticalInlineCache;\n    } else if (layout === 'column' && !inline) {\n      this.styleCache = layoutAlignVerticalCache;\n    } else if (layout === 'column-reverse' && inline) {\n      this.styleCache = layoutAlignVerticalRevInlineCache;\n    } else if (layout === 'column-reverse' && !inline) {\n      this.styleCache = layoutAlignVerticalRevCache;\n    }\n    this.addStyles(value, {layout, inline});\n  }\n\n  /**\n   * Cache the parent container 'flex-direction' and update the 'flex' styles\n   */\n  protected onLayoutChange(matcher: ElementMatcher) {\n    const layoutKeys: string[] = matcher.value.split(' ');\n    this.layout = layoutKeys[0];\n    this.inline = matcher.value.includes('inline');\n    if (!LAYOUT_VALUES.find(x => x === this.layout)) {\n      this.layout = 'row';\n    }\n    this.triggerUpdate();\n  }\n}\n\n@Directive({selector, inputs})\nexport class DefaultLayoutAlignDirective extends LayoutAlignDirective {\n  protected override inputs = inputs;\n}\n\nconst layoutAlignHorizontalCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignVerticalCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignHorizontalRevCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignVerticalRevCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignHorizontalInlineCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignVerticalInlineCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignHorizontalRevInlineCache: Map<string, StyleDefinition> = new Map();\nconst layoutAlignVerticalRevInlineCache: Map<string, StyleDefinition> = new Map();\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {NgModule} from '@angular/core';\nimport {BidiModule} from '@angular/cdk/bidi';\nimport {CoreModule} from '@angular/flex-layout/core';\n\nimport {DefaultLayoutDirective} from './layout/layout';\nimport {DefaultLayoutGapDirective} from './layout-gap/layout-gap';\nimport {DefaultFlexDirective} from './flex/flex';\nimport {DefaultFlexOrderDirective} from './flex-order/flex-order';\nimport {DefaultFlexOffsetDirective} from './flex-offset/flex-offset';\nimport {DefaultFlexAlignDirective} from './flex-align/flex-align';\nimport {FlexFillDirective} from './flex-fill/flex-fill';\nimport {DefaultLayoutAlignDirective} from './layout-align/layout-align';\n\n\nconst ALL_DIRECTIVES = [\n  DefaultLayoutDirective,\n  DefaultLayoutGapDirective,\n  DefaultLayoutAlignDirective,\n  DefaultFlexOrderDirective,\n  DefaultFlexOffsetDirective,\n  FlexFillDirective,\n  DefaultFlexAlignDirective,\n  DefaultFlexDirective,\n];\n\n/**\n * *****************************************************************\n * Define module for the Flex API\n * *****************************************************************\n */\n\n@NgModule({\n  imports: [CoreModule, BidiModule],\n  declarations: [...ALL_DIRECTIVES],\n  exports: [...ALL_DIRECTIVES]\n})\nexport class FlexModule {\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './module';\n\nexport * from './flex/flex';\nexport * from './flex-align/flex-align';\nexport * from './flex-fill/flex-fill';\nexport * from './flex-offset/flex-offset';\nexport * from './flex-order/flex-order';\nexport * from './layout/layout';\nexport * from './layout-align/layout-align';\nexport * from './layout-gap/layout-gap';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["inputs","selector","multiply","i1","i2"],"mappings":";;;;;;;;;;AAAA;;;;;;AAMG;AAmBG,MAAO,kBAAmB,SAAQ,YAAY,CAAA;AAClD,IAAA,WAAW,CAAC,KAAa,EAAE,EAAC,OAAO,EAAqB,EAAA;AACtD,QAAA,MAAM,GAAG,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAClC,QAAA,OAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACK,GAAG,CACN,EAAA,EAAA,OAAO,EAAE,OAAO,KAAK,MAAM,GAAG,OAAO,GAAG,GAAG,CAAC,OAAO,EACnD,CAAA,CAAA;KACH;;+GAPU,kBAAkB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;AAAlB,kBAAA,CAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,cADN,MAAM,EAAA,CAAA,CAAA;2FAClB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAD9B,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC,CAAA;;AAWhC,MAAMA,QAAM,GAAG;AACb,IAAA,UAAU,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa;AACvD,IAAA,aAAa,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB;AAChE,IAAA,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;AACtE,IAAA,gBAAgB,EAAE,gBAAgB;CACnC,CAAC;AACF,MAAMC,UAAQ,GAAG,CAAA;;;;;CAKhB,CAAC;AAEF;;;;;;AAMG;AAEG,MAAO,eAAgB,SAAQ,cAAc,CAAA;IAIjD,WAAY,CAAA,KAAiB,EACjB,UAAsB,EACtB,YAAgC,EAChC,OAAwB,EACO,OAA4B,EAAA;QACrE,KAAK,CAAC,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC;AADP,QAAA,IAAO,CAAA,OAAA,GAAP,OAAO,CAAqB;AANpD,QAAA,IAAa,CAAA,aAAA,GAAG,QAAQ,CAAC;QAQ1C,IAAI,CAAC,IAAI,EAAE,CAAC;KACb;AAEkB,IAAA,eAAe,CAAC,KAAa,EAAA;;AAC9C,QAAA,MAAM,mBAAmB,GAAG,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC;QAC7D,MAAM,OAAO,GAAG,mBAAmB,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC,GAAG,EAAE,CAAC;AAClG,QAAA,IAAI,CAAC,UAAU,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,IAAI,GAAG,EAAE,CAAC;QACrD,QAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAEvC,QAAA,IAAI,IAAI,CAAC,YAAY,KAAK,KAAK,EAAE;YAC/B,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,EAAC,OAAO,EAAC,CAAC,CAAC;AACjC,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;AAC3B,SAAA;KACF;;AAvBU,eAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,oIAQN,aAAa,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;gGARtB,eAAe,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;2FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAD3B,SAAS;;;8BASK,MAAM;+BAAC,aAAa,CAAA;;;AAmB7B,MAAO,sBAAuB,SAAQ,eAAe,CAAA;AAD3D,IAAA,WAAA,GAAA;;AAEqB,QAAA,IAAM,CAAA,MAAA,GAAGD,QAAM,CAAC;KACpC;;mHAFY,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;uGAAtB,sBAAsB,EAAA,QAAA,EAAA,sPAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBADlC,SAAS;mBAAC,YAACC,UAAQ,UAAED,QAAM,EAAC,CAAA;;AAM7B,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAoB;;ACxF5C;;;;;;AAMG;AAiCH,MAAM,gBAAgB,GAAG;AACvB,IAAA,aAAa,EAAE,IAAI;AACnB,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,YAAY,EAAE,IAAI;AAClB,IAAA,eAAe,EAAE,IAAI;CACtB,CAAC;AAGI,MAAO,qBAAsB,SAAQ,YAAY,CAAA;IACrD,WAAoB,CAAA,OAAmB,EACI,OAA4B,EAAA;AACrE,QAAA,KAAK,EAAE,CAAC;AAFU,QAAA,IAAO,CAAA,OAAA,GAAP,OAAO,CAAY;AACI,QAAA,IAAO,CAAA,OAAA,GAAP,OAAO,CAAqB;KAEtE;IAED,WAAW,CAAC,QAAgB,EAAE,MAAuB,EAAA;AACnD,QAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC;YAC/D,QAAQ,GAAGE,SAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;;YAGvD,OAAO,eAAe,CAAC,QAAQ,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;AACzD,SAAA;AAAM,aAAA;AACL,YAAA,OAAO,EAAE,CAAC;AACX,SAAA;KACF;AAEQ,IAAA,UAAU,CAAC,QAAgB,EAAE,OAAwB,EAAE,MAAuB,EAAA;AACrF,QAAA,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;AAC3B,QAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;AACrC,YAAA,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC;YAC/D,QAAQ,GAAGA,SAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;;YAEvD,MAAM,aAAa,GAAG,gBAAgB,CAAC,QAAQ,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;YACxE,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,aAAa,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;AAChE,SAAA;AAAM,aAAA;YACL,QAAQ,GAAGA,SAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;AACvD,YAAA,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;AAE1C,YAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,EAAG,CAAC;;;YAI9B,MAAM,MAAM,GAAG,WAAW,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;YAC7C,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;;YAGjD,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,gBAAgB,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;AACjE,SAAA;KACF;AAEO,IAAA,eAAe,CAAC,KAAa,EAAA;QACnC,OAAO,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,GAAG,CAAG,EAAA,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,GAAG,KAAK,CAAC;KACvE;;AA5CU,qBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,4CAEZ,aAAa,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;AAFtB,qBAAA,CAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,cADT,MAAM,EAAA,CAAA,CAAA;2FAClB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBADjC,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC,CAAA;;;8BAGjB,MAAM;+BAAC,aAAa,CAAA;;;AA6CnC,MAAMF,QAAM,GAAG;AACb,IAAA,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;AACnE,IAAA,gBAAgB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,mBAAmB;AAC5E,IAAA,mBAAmB,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,mBAAmB;AAClF,IAAA,mBAAmB,EAAE,mBAAmB;CACzC,CAAC;AACF,MAAMC,UAAQ,GAAG,CAAA;;;;;CAKhB,CAAC;AAEF;;;AAGG;AAEG,MAAO,kBAAmB,SAAQ,cAAc,CAAA;IAiBpD,WAAY,CAA