Skip to content

cesium-cephalopod

Pre-release
Pre-release
Compare
Choose a tag to compare
@jelbourn jelbourn released this 07 Apr 21:13

Breaking changes

Package structure

The package structure for Angular Material has changed to match that of Angular itself. This has
a few ramifications on applications consuming Angular Material:

  • Deep imports will no longer work, e.g., @angular/material/core/a11y. All public symbols
    should be imported directly from @angular/material. Deep imports have always been an anti-pattern,
    but our previous package structure inadvertently allowed them.
  • The imports for theming have changed.
    ** For prebuilt themes, you can now find the CSS files in the prebuilt-themes/ directory in the
    package root. For angular-cli projects, this will look something like
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

** For custom themes, you can now import theming.scss directly from the package root. Again, with
angular-cli, this will look something like:

@import '~@angular/material/theming';

Removal of deprecated symbols

  • The deprecated, Md-prefixed aliases for LiveAnnouncer, Platform, and
    UniqueSelectionDispacther have been removed.

MaterialModule

  • MaterialModule (and MaterialRootModule) have been marked as deprecated.

We've found that, with the current state of tree-shaking in the world,
that using an aggregate NgModule like MaterialModule leads to tools
not being able to eliminate code for components that aren't used.

In order to ensure that users end up with the smallest code size
possible, we're deprecating MaterialModule, to be removed in the a
subsequent release.

To replace MaterialModule, users can create their own "Material"
modul within their application (e.g., GmailMaterialModule) that
imports only the set of components actually used in the application.

Angular 4

  • Angular Material now depends on Angular 4.
  • Now that animations have been refactored into a separate package, users of @angular/material
    need to explicitly import BrowserAnimationsModule (or NoopAnimationsModule) from
    @angular/package-browser/animations as well as installing @angular/animations.

Bug Fixes

  • autocomplete: "undefined" being displayed on empty control with ngModel (#3535) (675c9df), closes #3529
  • autocomplete: aria-expanded should be updated when panel hides (#3494) (932b4a0)
  • autocomplete: do not trigger submit on ENTER (#3727) (bedf5a1), closes #3159
  • autocomplete: fix down arrow use with ngIf (#3493) (a4e2de7)
  • autocomplete: fix key manager instantiation (#3274) (c21ff40)
  • autocomplete: not showing panel on first focus in certain cases (#3775) (75996b5)
  • autocomplete: prevent opening on load in IE (#3190) (a4da08b), closes #3183
  • autocomplete: remove max width for autocomplete panel (#3297) (738e9bf), closes #3198
  • autocomplete: update overlay ref width on menu trigger (#3573) (6915e8a)
  • button: add transition to focus overlay (#2850) (6cdd8db)
  • button: persist theme color of button when leaving hover state (#3629) (3ad6ff0)
  • button: square ripple in compatibility mode (#3167) (ceb472b), closes #3164
  • button: use FocusOriginMonitor for focus styles (#3294) (5d6920d)
  • button-toggle: fix color for selected button toggle and selected disabled button toggle (#3418) (be167c9), closes #3382
  • button-toggle: only show focus style when focused via keyboard (#3232) (d744a5f)
  • card: removed header height (#3450) (17bf5e5), closes #3288
  • card: unable to override elevation (#3139) (4ee16a9), closes #3123
  • checkbox: add focus indication (#3403) (01188d9), closes #3102
  • checkbox: create ripple on label mousedown (#3206) (3edf105), closes #3030
  • checkbox: focus origin for focus method (#3763) (7a60489)
  • checkbox: show checkbox animation only if user click or indeterminate state (#3137) (f4323b2), closes #2783
  • checkbox: switch checkbox behaviors for click and change events (#3146) (8aa9857)
  • chips: Fix adding new chips on demo page (#3426) (2d16a24)
  • compatibility: remove ink bar from compatibility check (#3267) (c203589)
  • connected-overlay: direction not being updated (#3293) (817dcfd), closes #3241
  • connected-position: error if none of the initial positions fit in viewport (#3189) (a306a8e)
  • core: log warning if doctype is missing (#2849) (22b0660), closes #2351
  • demo: remove input route from demo app (#2922) (6bac315)
  • dialog: delay focus until animation is done (#3774) (d7d2b16), closes #3722
  • dialog: leaking component instance references (#2875) (e120e8d), closes #2734
  • dialog: leaking MdDialogContainer references (#2944) (8e6720b), closes #2876
  • docs: only rewrite relative links (#3339) (cb57660), closes #3147
  • focus-trap: avoid closure compiler issues when adding anchors (#3448) (8b2ae0d)
  • focus-trap: enabled property not being coerced (#3417) (d81445b)
  • focus-trap: exception when element contains SVG on IE (#3432) (d06ad75), closes #3410
  • input: baseline alignment on textarea (#3714) (7cff349)
  • input: change dividerColor to color (#3726) (2ccf0ae)
  • input: don't add empty prefix & suffix wrappers (#3724) (6d6c12d)
  • input: don't animate label when value is set programmatically (#3691) (dc5c869)
  • input: fix blank aria-describedBy (#3713) (cb85eeb)
  • input: fix chrome autofill style (#3366) (f40b1b2)
  • input: label animation shifting sibling labels (#3568) (f8cdd92), closes #3541
  • input: make all icons in input containers the correct size (#3489) (359c9bb)
  • input: make icons in prefix/suffix the right size (#3342) (63d4359)
  • input: make sure injected NgControl belongs to the input (#3700) (220163e)
  • input: overflow-y scrollbar is displayed (IE) (#3571) (7ffaf9e), closes #3570
  • input: remove jitter that occurs on focus (#3343) (eba7641)
  • interactivity-checker: cast node name to lowercase for isInputElement function (#3281) (8f76f96)
  • list: add font-family style to subheader (#3056) (3464011)
  • list-key-manager: exception when no initial active item (#3431) (842896b), closes #3317
  • menu: incorrect text alignment in IE/Edge (#3268) (5ef3084), closes #3254
  • menu: not emitting close event when closing via the backdrop (#3300) (0f28daf), closes #3295
  • menu,tooltip: Ensure subscription exists before unsubscribing. (#3078) (84b5c3b)
  • aot runtime issues (#3807) (f40296e)
  • change selectors for MdCardXlImage and MdCardAvatar (#3134) (6e1f50b)
  • coverage issue with saucelabs (#3540) (4d4a63e)
  • select: allow custom aria-label (#3765) (038a337), closes #3762
  • deprecate MaterialModule (#3840) (3f5894e)
  • overlay: ensure proper stacking order when attaching (#3581) (aa5925b), closes #3574
  • package.json: Fix failing npm run api command (#3462) (bf2b615)
  • portal-host: unable to clear and portal reference not being set (#3302) (7fcb93b)
  • progress-spinner: not redrawing when changing modes (#3672) (1ae81a4), closes #3648
  • pseudo-checkbox: alignment issue and border color (#3144) (1f19ef0)
  • radio: add focus indication (#3402) (c934753), closes #3102
  • ripple: different durations for ripple elements (#3136) (5c7a96b), closes #3109
  • ripple: fade-out-all should hide all ripples (#3400) (5cc50d2)
  • ripple: fix ripple color in dark theme (#3094) (a91ae72)
  • ripple: rename selector for the ripple (#3482) (58c5d17)
  • scripts: change all paths in docs pushing script to relative paths (#3091) (60aa9e9)
  • scroll-dispatcher: unable to unsubscribe from global listener (#3729) (68db6ba)
  • scrollable: check if scrollable exists before unregistering (#3050) (b358c6c)
  • select: animation jump in Chrome and blurry text in IE (#3328) (09c6386), closes #3327 #1953
  • select: exception if selected value is accessed on init (#3785) (e82457c), closes #3750
  • select: initial value not being displayed with FormControl and OnPush (#3434) (819fa0b)
  • select: show focus indicator even with validation errors (#3743) (e964734), closes #3742
  • select: unable to set a tabindex (#3479) (11dec36), closes #3474
  • select: wrong item order in label in rtl (#3567) (52ea7a3)
  • sidenav: throw error when sidenav has 2 sidenavs on the same side at the same time (#3369) (324da5b)
  • sidenav: use vw instead of percentage for sidenav min width (#3046) (c638e20)
  • slide-toggle: fix unavailable unmonitor call (#3862) (904c71e)
  • slide-toggle: input not updated after drag (#3067) (5cdeb75)
  • slide-toggle: invalid change events with no new value (#3555) (5346353), closes #3526
  • slide-toggle: occasional element jumping (#3311) (beb0edf)
  • slide-toggle: remove host element margin (#3761) (cd0b853)
  • slide-toggle: ripple fade-in too slow (#3170) (369931e)
  • slider: unable to reset tickInterval after it has been set (#3488) (b9b014a), closes #3452
  • tab: use MD_RIPPLE_GLOBAL_OPTIONS in tab (#3553) (ee853b9)
  • tab-nav: add constructor back for ripple (#3537) (f27617a)
  • tabs: change color for disabled tab label (#3483) (290f710), closes #3481
  • tabs: missing mat class on tab group (#3038) (d97debe)
  • tabs: re-align ink bar on direction change (#3622) (07793a4), closes #3615
  • tabs: remove body and header from compatibility (#3168) (b939cd8)
  • tabs: remove flex; bring ink into same parent as links (#3331) (00de2d7)
  • tabs: set tab body content to 100% (#3162) (cbd1ff9), closes #3153
  • toolbar: incorrect height for soft-keyboards (#3312) (d1abc9e), closes #3233
  • tooltip: avoid capturing the initial tap on mobile (#2423) (85ba82a), closes #2326

Features

Performance Improvements

  • ripple: avoid triggering change detection (#3066) (1a67107)
  • scroll-dispatcher: avoid triggering change detection on scroll (#3687) (5c2b449)
  • scroll-dispatcher: lazily subscribe to global events (#3270) (c1004cb), closes #3237