refactor(checkbox): remove legacy property and support for legacy syntax (#29043)
BREAKING CHANGE: The `legacy` property and support for the legacy syntax, which involved placing an `ion-checkbox` inside of an `ion-item` with an `ion-label`, have been removed from checkbox. For more information on migrating from the legacy checkbox syntax, refer to the [Checkbox documentation](https://ionicframework.com/docs/api/checkbox#migrating-from-legacy-checkbox-syntax).
@ -39,44 +39,12 @@
|
||||
<ion-label>Disabled Item Anchor</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox disabled checked> Disabled Checkbox </ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-range disabled value="10">
|
||||
<span slot="label">Disabled Range</span>
|
||||
</ion-range>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
<ion-label>Multiple Input Disabled Items</ion-label>
|
||||
</ion-list-header>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start" aria-label="Checkbox"></ion-checkbox>
|
||||
<ion-label>Checkbox + Range</ion-label>
|
||||
<ion-range disabled value="45" aria-label="Range"></ion-range>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox aria-label="Checkbox" slot="start"></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox aria-label="Checkbox" disabled slot="start"></ion-checkbox>
|
||||
<ion-label>Checkbox + Buttons</ion-label>
|
||||
<ion-button slot="end">Default</ion-button>
|
||||
<ion-button slot="end">Buttons</ion-button>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start" disabled aria-label="Checkbox"></ion-checkbox>
|
||||
<ion-searchbar></ion-searchbar>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</ion-content>
|
||||
|
||||
<ion-footer>
|
||||
|
||||
|
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 19 KiB |
|
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 15 KiB |
@ -38,46 +38,12 @@
|
||||
<ion-item disabled href="#">
|
||||
<ion-label>Disabled Item Anchor</ion-label>
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label>Disabled Checkbox</ion-label>
|
||||
<ion-checkbox disabled checked slot="start" legacy="true"></ion-checkbox>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Disabled Range</ion-label>
|
||||
<ion-range disabled value="10" legacy="true"></ion-range>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
<ion-label>Multiple Input Disabled Items</ion-label>
|
||||
</ion-list-header>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox disabled slot="start" legacy="true"></ion-checkbox>
|
||||
<ion-label>Checkbox</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start" legacy="true"></ion-checkbox>
|
||||
<ion-label>Checkbox + Range</ion-label>
|
||||
<ion-range disabled value="45"></ion-range>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox disabled slot="start" legacy="true"></ion-checkbox>
|
||||
<ion-label>Checkbox + Buttons</ion-label>
|
||||
<ion-button slot="end">Default</ion-button>
|
||||
<ion-button slot="end">Buttons</ion-button>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-checkbox slot="start" disabled legacy="true"></ion-checkbox>
|
||||
<ion-label>Disabled Checkbox</ion-label>
|
||||
<ion-searchbar></ion-searchbar>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</ion-content>
|
||||
|
||||
<ion-footer>
|
||||
|
||||
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 15 KiB |