DSO Toolkit v90.0.0 🧞♂️
Deze release bevat een BREAKING change voor het volgende component:
- Label (HTML/CSS implementatie)
In deze release introduceren we een nieuwe set iconen. Alle iconen zijn nu op een 4px grid gebouwd. We hebben ook iconen verwijderd, hernoemd en toegevoegd.
Daarnaast is de Angular-integratie verbeterd: builds falen nu correct bij niet-kloppende props op DSO Toolkit componenten.
- Nieuwe iconenset
- Angular: Stricter type-checking op component props
Label (HTML/CSS implementatie)
De HTML/CSS implementatie van het component Label is in 🧽 Release 79.0.0 deprecated. In deze
release is deze implementatie verwijderd.
Migratiepad
Gebruik de Core implementatie van Label.
❌
<span class="dso-label dso-label-primary">Label content</span>
✅
<dso-label status="primary">Label content</dso-label>
Nieuwe iconenset
Migratiepad verwijderde en hernoemde iconen
❌
<dso-accordion-section icon="[Oud]" ...></dso-accordion-section>
<dso-icon icon="[Oud]"></dso-icon>
<dso-icon-button icon="[Oud]" ...></dso-icon-button>
✅
<dso-accordion-section icon="[Nieuw]" ...></dso-accordion-section>
<dso-icon icon="[Nieuw]"></dso-icon>
<dso-icon-button icon="[Nieuw]" ...></dso-icon-button>
Verwijderde iconen
| Oud | Nieuw |
|---|---|
| angle-down | chevron-down |
| angle-left | chevron-left |
| angle-right | chevron-right |
| angle-up | chevron-up |
Hernoemde iconen
| Oud | Nieuw |
|---|---|
| air | weather |
| balloon | balloon-outline |
| clock | clock-outline |
| copy | copy-outline |
| mail-outline | |
| help-active | help-solid |
| help | help-outline |
| house | home |
| info-active | info-solid |
| info | info-outline |
| location-outline | location-orange |
| postcard | |
| minus-circle | minus-circle-outline |
| minus-square | minus-square-outline |
| more | more-horizontal |
| plus-circle | plus-circle-outline |
| plus-square | plus-square-outline |
| procedures | settings |
| safety | security |
| status-danger | status-warning-red-solid |
| status-info | status-info-solid |
| status-warning-inline | status-warning-red-solid |
| status-warning-inline-negative | status-warning-red-outline |
| table | table-outline |
| times | cross |
| user-line | user-outline |
| user | user-solid |
| wip-wip | wip |
Nieuwe iconen
| Nieuw |
|---|
| balloon-solid |
| caret-up |
| chevron-down-down |
| chevron-down-up |
| chevron-up-down |
| chevron-up-up |
| clock-solid |
| copy-solid |
| internet |
| mail-solid |
| map |
| minus-circle-solid |
| minus-square-solid |
| more-vertical |
| pause |
| play |
| plus-circle-solid |
| plus-square-solid |
| question |
| share |
| status-forbidden |
| status-info-outline |
| stop |
| table-solid |
| user-solid |
Angular: Stricter type-checking op component props
De Angular output target gebruikt nu inlineProperties. Hierdoor controleert de Angular Language Service (en daarmee ook de build) of properties op DSO Toolkit componenten correct zijn gebruikt.
Voorheen werden fouten in component properties alleen runtime in de browserconsole gemeld. Vanaf nu worden deze fouten al tijdens de build gedetecteerd.
Wat betekent dit voor afnemers?
Angular-projecten die DSO Toolkit componenten gebruiken met onjuiste properties zullen nu een build-error krijgen. Dit is gewenst gedrag: fouten worden eerder ontdekt in plaats van stilzwijgend genegeerd.
Controleer na het updaten of je Angular-project nog succesvol bouwt. Eventuele build-fouten wijzen op properties die niet (meer) bestaan of een verkeerd type hebben. Corrigeer deze aan de hand van de foutmeldingen.