Mdc migration #232
Merged
Mdc migration #232
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Via `ng generate @angular/material:mdc-migration`
Especially `mat-icon-button` will crash at runtime if used in combination with any other `mat-*button`. That also means that out of the box we cannot have a raised `mat-icon-button`. So we reproduce the result by applying the new custom classes such as `icon-button-circle-accent` for icon with color, or alternatively the existing class `mat-elevation-z4` for an icon without color.
`matLine` was mis-used, and its equivalent `matListItemLine` is not what we want in most cases. Instead, we usually need `matListItemTitle`, except that it is not even mandatory to specify it.
Tab stretching is a terrible UX where words float in the middle of nowhere, making it extremely hard to understand their purpose in best case scenario. In the worst case scenario, then the second/third tab name will accidentally align with the blocks contained in the first (selected) tab. So the second/third tab name will actually look like they are the title of the first tab content 🤮 Also, the fact that we lost the very fine line underlining the whole tab group really makes the situation worse, but I guess we can at least live that absence.
PowerKiKi
commented
Feb 8, 2023
projects/natural/src/lib/modules/table-button/table-button.component.html
Outdated
Show resolved
Hide resolved
PowerKiKi
commented
Mar 2, 2023
It's mostly the same as the default Material, with the only exception of button's letter-spacing
We lose the possibility to set a label, but that was never used at all. And instead we gain a much easier interoperability with `<mat-icon>` special layouting done by Angular Material. In most cases `[size]` probably should not be used anymore, since Angular Material will do the work for us. But we keep it for corner cases.
This would show no icon at all
`satisfies` rejects extra properties, which tends to be good thing for
us, especially when we write some kind of configuration value. Eg:
```diff
- {a: 1, extraProp: 2} as Config; // incorrectly compiles
+ {a: 1, extraProp: 2} satisfies Config; // correctly error at compile time
```
Also, `as` is also too permissive and might accept totally wrong type in
some cases, such as:
```diff
- condition: {equal: {value: true}} as ProductFilterGroupCondition,
+ condition: {equal: {value: true}} satisfies ProductFilterGroupConditionIsActive,
```
This reverts commit 13fe224.
We use the standard `align="end"` instead of custom mechanic. This should be de default of Angular Component, but it is not yet, see angular/components#13620
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.