feat(base-components): add ability to remove ios and md theme (#26669)

This commit is contained in:
Liam DeBeasi
2023-01-24 16:18:35 -05:00
committed by GitHub
parent 4d24b328e2
commit 18f109c7da
114 changed files with 1585 additions and 383 deletions

View File

@ -4,7 +4,7 @@ import { Component, Element, Event, Host, Prop, State, Watch, h } from '@stencil
import { checkmarkOutline, removeOutline, ellipseOutline } from 'ionicons/icons';
import { config } from '../../global/config';
import { getIonMode } from '../../global/ionic-global';
import { getIonStylesheet } from '../../global/ionic-global';
import type { Color, Gesture, GestureDetail, Mode, StyleEventDetail, ToggleChangeEventDetail } from '../../interface';
import type { LegacyFormController } from '../../utils/forms';
import { createLegacyFormController } from '../../utils/forms';
@ -16,6 +16,7 @@ import { isRTL } from '../../utils/rtl';
import { createColorClasses, hostContext } from '../../utils/theme';
/**
* @virtualProp {true | false} useBase - useBase determines if base components is enabled.
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*
* @slot - The label text to associate with the toggle. Use the "labelPlacement" property to control where the label is placed relative to the toggle.
@ -26,6 +27,7 @@ import { createColorClasses, hostContext } from '../../utils/theme';
@Component({
tag: 'ion-toggle',
styleUrls: {
base: 'toggle.scss',
ios: 'toggle.ios.scss',
md: 'toggle.md.scss',
},
@ -267,7 +269,7 @@ export class Toggle implements ComponentInterface {
}
private renderToggleControl() {
const mode = getIonMode(this);
const mode = getIonStylesheet(this);
const { enableOnOffLabels, checked } = this;
return (
@ -299,7 +301,7 @@ export class Toggle implements ComponentInterface {
private renderToggle() {
const { activated, color, checked, disabled, el, justify, labelPlacement, inputId, name } = this;
const mode = getIonMode(this);
const mode = getIonStylesheet(this);
const value = this.getValue();
const rtl = isRTL(el) ? 'rtl' : 'ltr';
renderHiddenInput(true, el, name, checked ? value : '', disabled);
@ -369,7 +371,7 @@ Developers can dismiss this warning by removing their usage of the "legacy" prop
}
const { activated, color, checked, disabled, el, inputId, name } = this;
const mode = getIonMode(this);
const mode = getIonStylesheet(this);
const { label, labelId, labelText } = getAriaLabel(el, inputId);
const value = this.getValue();
const rtl = isRTL(el) ? 'rtl' : 'ltr';