@angular/flex-layout - npm Package Versions

7.0.0-beta.22 (2018-12-19)

Bug Fixes

• core: allow for breakpoints with periods in them (#921) (84e811b), closes #776
• core: avoid duplicate mediaQuery activations (#937) (23592ee)
• core: avoid race condition between registration and activation (#923) (232fc6e)
• core: clear recent styles after responsive deactivation (#927) (d322ea7), closes #697 #296
• flex-offset: correct type when using with 'strictNullChecks' (#929) (21b6d29)
• fxLayoutGap: account for responsive fxHide on children elements (#931) (7759b6c), closes #606
• fxLayoutGap: respond correctly to layout changes (#919) (676ddf7)
• ngStyle: do not truncate URLs (#938) (1548727), closes #935
• ngStyle: should work with preexisting styles (#939) (4be5cef)

Features

• core: add static scss mixin (#940) (ffd8331), closes #783

Used for extra styling more easily at build time (instead of runtime with the HTML API), this feature (sass mixin) allows developers to generate and include Layout mediaQuery css to their own stylesheets.

NOTE: This feature is marked as experimental and is subject to change unless posted otherwise. To use, import the new SASS file as follows:

@import '~@angular/flex-layout/mq';

// This translates to (min-width: 0) and (max-width: 599px) {}
@include layout-bp(xs) {
  background-color: red;
}

Feedback on this feature is very much welcome, and we are open to adding additional functionality based on user interest.

<a name="7.0.0-beta.21"></a>

7.0.0-beta.21 (2018-12-15)

Bug Fixes

• core: register all breakpoints at startup (#916) (8f1a085), closes #915

<a name="7.0.0-beta.20"></a>

7.0.0-beta.20 (2018-12-14)

Beta 20 brings about numerous, high-visibility improvements to the library with very minimal API changes. These include:

• StyleBuilders: style memoization and support for easy customization of injected styles
• MediaMarshaller: centralizes handling of mediaQuery events to trigger layout style injections

StyleBuilders

With the introduction of StyleBuilders, users now have the flexibility to augment or replace our style generation algorithms. They also allow us to memoize style generation to improve performance. With the introduction of MediaMarshaller, we are able to dramatically reduce the size and complexity of the library and improve the usability of custom breakpoints.

Bug Fixes

• fxLayoutAlign: add space-between and space-around options (#845) (5e3ec0e), closes #841
• fxLayoutAlign: do not apply cross-axis stretch styles when not needed (#877) (3cd5bc1), closes #876
• show-hide: account for multiple directives on the same element (ad3e9c9)
• show-hide: work with Angular components and elements without fxLayout (#881) (3a0ec5d), closes #848 #724

Features

• core: add ability to override style building (#884) (9148e87), closes #689
• core: add centralized media marshal service (#900) (cd05cb4), closes #903 #692
• core: add memoization to style generation (#888) (4600672)
• flex: add support for rem units (#901) (5990ed0), closes #898
• media-observer: migrate ObservableMedia (#892) (1205588), closes #885

BREAKING CHANGES

• media-observer: ObservableMedia is now deprecated in anticipation of RxJS v7. The new API is called MediaObserver, and provides the exact same functionality as ObservableMedia, except you cannot directly subscribe to it,

Developers should subscribe to MediaObserver's media$ property; in place of subscribing directly to ObservableMedia.

<a name="7.0.0-beta.19"></a>

7.0.0-beta.19 (2018-10-05)

Bug Fixes

• build: upgrade to Angular and Material v7 and add strict flags (5ddccb5), closes #851 #855
• module: do not require breakpoints in withConfig (#853) (76c110e), closes #846

<a name="6.0.0-beta.18"></a>

6.0.0-beta.18 (2018-08-31)

Bug Fixes

• build: update to TypeScript 2.9 and RxJS 6.3 (aa8fb8c), closes #828 #827

<a name="6.0.0-beta.17"></a>

6.0.0-beta.17 (2018-07-27)

Bug Fixes

• fxFlex: do not eagerly listen to layout changes (#771) (dc431d8), closes #700 #733
• module: make withConfig AOT compatible (85e3145)
• use correct xl breakpoint (#809) (b64b1b3)

Performance Improvements

• remove duplicate function calls (#773) (bc7f77f), closes #761

<a name="6.0.0-beta.16"></a>

5.0.0-beta.15 (2018-06-05)

Bug Fixes

• fxFlex: enable parent flex styles by default (76d14b7)

<a name="5.0.0-beta.14"></a>

6.0.0-beta.16 (2018-06-07)

With Beta 16, we have added support + API for CSS Grid. Now @angular/flex-layout supports both Flexbox and CSS Grid layouts.

Bug Fixes

• breakpoints: use correct orientation mediaquery (666aa0a), closes #763

Features

• grid: add CSS Grid directives and demo (#712) (b8c86be)
• lib: add config options for flex basis and other tokens (f01e551)

BREAKING CHANGES

• lib: * Four configuration tokens have been removed:

• • ADD_FLEX_STYLES
• • ADD_ORIENTATION_BREAKPOINTS
• • DISABLE_DEFAULT_BREAKPOINTS
• • DISABLE_VENDOR_PREFIXES

These tokens have been consolidated into a new configuration token:

• • LAYOUT_CONFIG

• The default column flex-basis has been reverted to 1e-9px. To have that value be auto instead, set the config in your top-level module as follows:

FlexLayoutModule.withConfig({useColumnBasisZero: false})

<a name="6.0.0-beta.15"></a>

6.0.0-beta.15 (2018-04-13)

Features

• core: add validateBasis to core export (#706) (c603a86)

<a name="5.0.0-beta.15"></a>