diff --git a/core/api.txt b/core/api.txt index 14736c3556d..f73c8ff8c07 100644 --- a/core/api.txt +++ b/core/api.txt @@ -1325,6 +1325,8 @@ ion-radio,shadow ion-radio,prop,alignment,"center" | "start" | undefined,undefined,false,false ion-radio,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-radio,prop,disabled,boolean,false,false,false +ion-radio,prop,errorText,string | undefined,undefined,false,false +ion-radio,prop,helperText,string | undefined,undefined,false,false ion-radio,prop,justify,"end" | "space-between" | "start" | undefined,undefined,false,false ion-radio,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false ion-radio,prop,mode,"ios" | "md",undefined,false,false @@ -1341,8 +1343,11 @@ ion-radio,css-prop,--color-checked,md ion-radio,css-prop,--inner-border-radius,ios ion-radio,css-prop,--inner-border-radius,md ion-radio,part,container +ion-radio,part,error-text +ion-radio,part,helper-text ion-radio,part,label ion-radio,part,mark +ion-radio,part,supporting-text ion-radio-group,none ion-radio-group,prop,allowEmptySelection,boolean,false,false,false diff --git a/core/src/components.d.ts b/core/src/components.d.ts index b7675233d18..ce21a528916 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -2275,6 +2275,14 @@ export namespace Components { * If `true`, the user cannot interact with the radio. */ "disabled": boolean; + /** + * Text that is placed under the radio label and displayed when an error is detected. + */ + "errorText"?: string; + /** + * Text that is placed under the radio label and displayed when no error is detected. + */ + "helperText"?: string; /** * How to pack the label and radio within a line. `"start"`: The label and radio will appear on the left in LTR and on the right in RTL. `"end"`: The label and radio will appear on the right in LTR and on the left in RTL. `"space-between"`: The label and radio will appear on opposite ends of the line with space between the two elements. Setting this property will change the radio `display` to `block`. */ @@ -7041,6 +7049,14 @@ declare namespace LocalJSX { * If `true`, the user cannot interact with the radio. */ "disabled"?: boolean; + /** + * Text that is placed under the radio label and displayed when an error is detected. + */ + "errorText"?: string; + /** + * Text that is placed under the radio label and displayed when no error is detected. + */ + "helperText"?: string; /** * How to pack the label and radio within a line. `"start"`: The label and radio will appear on the left in LTR and on the right in RTL. `"end"`: The label and radio will appear on the right in LTR and on the left in RTL. `"space-between"`: The label and radio will appear on opposite ends of the line with space between the two elements. Setting this property will change the radio `display` to `block`. */ diff --git a/core/src/components/radio/radio.scss b/core/src/components/radio/radio.scss index 8f875811e88..a32f68f763a 100644 --- a/core/src/components/radio/radio.scss +++ b/core/src/components/radio/radio.scss @@ -140,46 +140,53 @@ input { align-items: center; } -// Radio Justify -// -------------------------------------------------- +// Radio Bottom Content +// ---------------------------------------------------------------- + +.radio-bottom { + @include padding(4px, null, null, null); + + display: flex; -:host(.radio-justify-space-between) .radio-wrapper { justify-content: space-between; -} -:host(.radio-justify-start) .radio-wrapper { - justify-content: start; + font-size: dynamic-font(12px); + + white-space: normal; } -:host(.radio-justify-end) .radio-wrapper { - justify-content: end; +:host(.radio-label-placement-stacked) .radio-bottom { + font-size: dynamic-font(16px); } -// Radio Align -// -------------------------------------------------- +// Radio Hint Text +// ---------------------------------------------------------------- -:host(.radio-alignment-start) .radio-wrapper { - align-items: start; -} +/** + * Error text should only be shown when .ion-invalid is + * present on the radio. Otherwise the helper text should + * be shown. + */ +.radio-bottom .error-text { + display: none; -:host(.radio-alignment-center) .radio-wrapper { - align-items: center; + color: ion-color(danger, base); } -// Justify Content & Align Items -// --------------------------------------------- +.radio-bottom .helper-text { + display: block; -// The radio should be displayed as block when either justify -// or alignment is set; otherwise, these properties will have no -// visible effect. -:host(.radio-justify-space-between), -:host(.radio-justify-start), -:host(.radio-justify-end), -:host(.radio-alignment-start), -:host(.radio-alignment-center) { + color: $text-color-step-300; +} + +:host(.ion-touched.ion-invalid) .radio-bottom .error-text { display: block; } +:host(.ion-touched.ion-invalid) .radio-bottom .helper-text { + display: none; +} + // Radio Label Placement - Start // ---------------------------------------------------------------- @@ -209,6 +216,8 @@ input { */ :host(.radio-label-placement-end) .radio-wrapper { flex-direction: row-reverse; + + justify-content: start; } /** @@ -251,6 +260,8 @@ input { */ :host(.radio-label-placement-stacked) .radio-wrapper { flex-direction: column; + + text-align: center; } :host(.radio-label-placement-stacked) .label-text-wrapper { @@ -277,3 +288,43 @@ input { :host(.radio-label-placement-stacked.radio-alignment-center) .label-text-wrapper { @include transform-origin(center, top); } + +// Radio Justify +// -------------------------------------------------- + +:host(.radio-justify-space-between) .radio-wrapper { + justify-content: space-between; +} + +:host(.radio-justify-start) .radio-wrapper { + justify-content: start; +} + +:host(.radio-justify-end) .radio-wrapper { + justify-content: end; +} + +// Radio Align +// -------------------------------------------------- + +:host(.radio-alignment-start) .radio-wrapper { + align-items: start; +} + +:host(.radio-alignment-center) .radio-wrapper { + align-items: center; +} + +// Justify Content & Align Items +// --------------------------------------------- + +// The radio should be displayed as block when either justify +// or alignment is set; otherwise, these properties will have no +// visible effect. +:host(.radio-justify-space-between), +:host(.radio-justify-start), +:host(.radio-justify-end), +:host(.radio-alignment-start), +:host(.radio-alignment-center) { + display: block; +} diff --git a/core/src/components/radio/radio.tsx b/core/src/components/radio/radio.tsx index bb343c8c858..eab6f44ac7e 100644 --- a/core/src/components/radio/radio.tsx +++ b/core/src/components/radio/radio.tsx @@ -15,6 +15,9 @@ import type { Color } from '../../interface'; * @part container - The container for the radio mark. * @part label - The label text describing the radio. * @part mark - The checkmark or dot used to indicate the checked state. + * @part supporting-text - Supporting text displayed beneath the radio label. + * @part helper-text - Supporting text displayed beneath the radio label when the radio is valid. + * @part error-text - Supporting text displayed beneath the radio label when the radio is invalid and touched. */ @Component({ tag: 'ion-radio', @@ -26,6 +29,8 @@ import type { Color } from '../../interface'; }) export class Radio implements ComponentInterface { private inputId = `ion-rb-${radioButtonIds++}`; + private helperTextId = `${this.inputId}-helper-text`; + private errorTextId = `${this.inputId}-error-text`; private radioGroup: HTMLIonRadioGroupElement | null = null; @Element() el!: HTMLIonRadioElement; @@ -58,6 +63,16 @@ export class Radio implements ComponentInterface { */ @Prop() disabled = false; + /** + * Text that is placed under the radio label and displayed when an error is detected. + */ + @Prop() errorText?: string; + + /** + * Text that is placed under the radio label and displayed when no error is detected. + */ + @Prop() helperText?: string; + /** * the value of the radio. */ @@ -212,6 +227,48 @@ export class Radio implements ComponentInterface { ); } + private getHintTextID(): string | undefined { + const { el, helperText, errorText, helperTextId, errorTextId } = this; + + if (el.classList.contains('ion-touched') && el.classList.contains('ion-invalid') && errorText) { + return errorTextId; + } + + if (helperText) { + return helperTextId; + } + + return undefined; + } + + /** + * Responsible for rendering helper text and error text. + * This element should only be rendered if hint text is set. + */ + private renderHintText() { + const { helperText, errorText, helperTextId, errorTextId } = this; + + /** + * undefined and empty string values should + * be treated as not having helper/error text. + */ + const hasHintText = !!helperText || !!errorText; + if (!hasHintText) { + return; + } + + return ( +
+
+ {helperText} +
+
+ {errorText} +
+
+ ); + } + render() { const { checked, disabled, color, el, justify, labelPlacement, hasLabel, buttonTabindex, alignment } = this; const mode = getIonMode(this); @@ -237,6 +294,8 @@ export class Radio implements ComponentInterface { role="radio" aria-checked={checked ? 'true' : 'false'} aria-disabled={disabled ? 'true' : null} + aria-describedby={this.getHintTextID()} + aria-invalid={this.getHintTextID() === this.errorTextId} tabindex={buttonTabindex} > diff --git a/core/src/components/radio/test/bottom-content/index.html b/core/src/components/radio/test/bottom-content/index.html new file mode 100644 index 00000000000..30ec712f39c --- /dev/null +++ b/core/src/components/radio/test/bottom-content/index.html @@ -0,0 +1,154 @@ + + + + + Radio - Bottom Content + + + + + + + + + + + + + + Radio - Bottom Content + + + + +
+
+

No Hint

+ Label +
+ +
+

No Hint: Stacked

+ Label +
+ +
+

Helper Text: Label Start

+ Label +
+ +
+

Helper Text: Label End

+ Label +
+ +
+

Helper Text: Label Stacked

+ Label +
+ +
+

Helper Text: Label Fixed

+ Label +
+ +
+

Error Text: Label Start

+ Label +
+ +
+

Error Text: Label End

+ Label +
+ +
+

Error Text: Label Stacked

+ Label +
+ +
+

Error Text: Label Fixed

+ Label +
+
+ + + + + + + + diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts b/core/src/components/radio/test/bottom-content/radio.e2e.ts new file mode 100644 index 00000000000..b3f779c29a3 --- /dev/null +++ b/core/src/components/radio/test/bottom-content/radio.e2e.ts @@ -0,0 +1,263 @@ +import { expect } from '@playwright/test'; +import { configs, test } from '@utils/test/playwright'; + +/** + * Functionality is the same across modes & directions + */ +configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => { + test.describe(title('radio: bottom content functionality'), () => { + test('should not render bottom content if no hint is enabled', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const bottomEl = page.locator('ion-radio .radio-bottom'); + await expect(bottomEl).toHaveCount(0); + }); + test('helper text should be visible initially', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const helperText = page.locator('ion-radio .helper-text'); + const errorText = page.locator('ion-radio .error-text'); + await expect(helperText).toBeVisible(); + await expect(helperText).toHaveText('Helper text'); + await expect(errorText).toBeHidden(); + }); + test('radio should have an aria-describedby attribute when helper text is present', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const radio = page.locator('ion-radio'); + const helperText = page.locator('ion-radio .helper-text'); + const helperTextId = await helperText.getAttribute('id'); + const ariaDescribedBy = await radio.getAttribute('aria-describedby'); + + expect(ariaDescribedBy).toBe(helperTextId); + }); + test('error text should be visible when radio is invalid', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const helperText = page.locator('ion-radio .helper-text'); + const errorText = page.locator('ion-radio .error-text'); + await expect(helperText).toBeHidden(); + await expect(errorText).toBeVisible(); + await expect(errorText).toHaveText('Error text'); + }); + + test('radio should have an aria-describedby attribute when error text is present', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const radio = page.locator('ion-radio'); + const errorText = page.locator('ion-radio .error-text'); + const errorTextId = await errorText.getAttribute('id'); + const ariaDescribedBy = await radio.getAttribute('aria-describedby'); + + expect(ariaDescribedBy).toBe(errorTextId); + }); + test('radio should have aria-invalid attribute when radio is invalid', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const radio = page.locator('ion-radio'); + + await expect(radio).toHaveAttribute('aria-invalid'); + }); + test('radio should not have aria-invalid attribute when radio is valid', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const radio = page.locator('ion-radio'); + + await expect(radio).not.toHaveAttribute('aria-invalid'); + }); + test('radio should not have aria-describedby attribute when no hint or error text is present', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const radio = page.locator('ion-radio'); + + await expect(radio).not.toHaveAttribute('aria-describedby'); + }); + }); +}); + +/** + * Rendering is different across modes + */ +configs({ modes: ['ios', 'md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => { + test.describe(title('radio: helper text rendering'), () => { + // Check the default label placement, end, and stacked + [undefined, 'end', 'stacked'].forEach((labelPlacement) => { + test(`${ + labelPlacement ? `${labelPlacement} label - ` : '' + }should not have visual regressions when rendering helper text`, async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const bottomEl = page.locator('ion-radio'); + await expect(bottomEl).toHaveScreenshot( + screenshot(`radio-helper-text${labelPlacement ? `-${labelPlacement}` : ''}`) + ); + }); + + test(`${ + labelPlacement ? `${labelPlacement} label - ` : '' + }should not have visual regressions when rendering helper text with wrapping text`, async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const bottomEl = page.locator('ion-radio'); + await expect(bottomEl).toHaveScreenshot( + screenshot(`radio-helper-text${labelPlacement ? `-${labelPlacement}` : ''}-wrapping`) + ); + }); + }); + }); + + test.describe(title('radio: error text rendering'), () => { + test('should not have visual regressions when rendering error text', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const bottomEl = page.locator('ion-radio'); + await expect(bottomEl).toHaveScreenshot(screenshot(`radio-error-text`)); + }); + test('should not have visual regressions when rendering error text with a stacked label', async ({ page }) => { + await page.setContent( + ` + + Label + + `, + config + ); + + const bottomEl = page.locator('ion-radio'); + await expect(bottomEl).toHaveScreenshot(screenshot(`radio-error-text-stacked-label`)); + }); + }); +}); + +/** + * Customizing supporting text is the same across modes and directions + */ +configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => { + test.describe(title('radio: supporting text customization'), () => { + test('should not have visual regressions when rendering helper text with custom css', async ({ page }) => { + await page.setContent( + ` + + + Label + + `, + config + ); + + const helperText = page.locator('ion-radio'); + await expect(helperText).toHaveScreenshot(screenshot(`radio-helper-text-custom-css`)); + }); + test('should not have visual regressions when rendering error text with custom css', async ({ page }) => { + await page.setContent( + ` + + + Label + + `, + config + ); + + const errorText = page.locator('ion-radio'); + await expect(errorText).toHaveScreenshot(screenshot(`radio-error-text-custom-css`)); + }); + }); +}); diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..5dd0e516967 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..10360c19e3f Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..c772a48223e Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-custom-css-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..3dbccc4d695 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..55c30f3b3f1 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..9bfabe4fb37 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..ae7bb239000 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..1b8f8c46c86 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..61c1d940f4e Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..886bbb26a65 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..8f30deb3f38 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..1df2d5ba0d2 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..94b921761ab Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..4801d868513 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..c17798efaf0 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-error-text-stacked-label-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..9ff7f987581 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..aafa0a31754 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..92637b764fb Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-custom-css-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..868b8807cea Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..d668bf4f533 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..1349b891275 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..4d49188d1f9 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..7e33b8b4fa1 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..06201557201 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..5fb627d9b20 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..6929245d545 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..0daeec04de2 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..f60fcfe1695 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..25c7897e80c Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..308dda06010 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-end-wrapping-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..76b8e0e50b6 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..8a47dd1e904 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..5e59c00a004 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..a007f1404d4 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..a9e996cf884 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..796b26ce10d Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..3ffbc7a89b0 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..ae679b533aa Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..2841f44578a Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..44fbf471f27 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..e932cc72a60 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..fc790beac57 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..c06a5c42b14 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..abb890f891a Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..7d27181eeac Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..a457d93a2ed Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..8f93886faee Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..93bba9373e5 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-stacked-wrapping-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..43d8899129e Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..948587e6f99 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..aadd2a3f9dc Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..638c7cbd182 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..9bfd8ddd54a Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..4023b3755d1 Binary files /dev/null and b/core/src/components/radio/test/bottom-content/radio.e2e.ts-snapshots/radio-helper-text-wrapping-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/radio/test/item/index.html b/core/src/components/radio/test/item/index.html index 36e46779fd2..b77f20bf86d 100644 --- a/core/src/components/radio/test/item/index.html +++ b/core/src/components/radio/test/item/index.html @@ -49,6 +49,17 @@

Placement Start

+
+

Default Justify

+ + + + Enable Notifications + + + +
+

Justify Start

@@ -85,6 +96,17 @@

Justify Space Between

Placement End

+
+

Default Justify

+ + + + Enable Notifications + + + +
+

Justify Start

@@ -121,6 +143,17 @@

Justify Space Between

Placement Fixed

+
+

Default Justify

+ + + + Enable Notifications + + + +
+

Justify Start

@@ -204,6 +237,39 @@

Multiline Label

+
+ + + + + Enable Notifications Enable Notifications Enable Notifications + + + + +
+
+ + + + + Enable Notifications Enable Notifications Enable Notifications + + + + +
+
+ + + + + Enable Notifications Enable Notifications Enable Notifications + + + + +
diff --git a/core/src/components/radio/test/item/radio.e2e.ts b/core/src/components/radio/test/item/radio.e2e.ts index 4fdf34bd4e1..48c07554949 100644 --- a/core/src/components/radio/test/item/radio.e2e.ts +++ b/core/src/components/radio/test/item/radio.e2e.ts @@ -40,7 +40,7 @@ configs().forEach(({ title, screenshot, config }) => { configs({ directions: ['ltr'], modes: ['md'] }).forEach(({ title, screenshot, config }) => { test.describe(title('radio: long label in item'), () => { - test('should render margins correctly when using long label in item', async ({ page }) => { + test('should not have visual regressions when using long label in item', async ({ page }) => { await page.setContent( ` @@ -60,8 +60,27 @@ configs({ directions: ['ltr'], modes: ['md'] }).forEach(({ title, screenshot, co }); }); + test.describe(title('radio: end label in item'), () => { + test('should not have visual regressions when using end label in item', async ({ page }) => { + await page.setContent( + ` + + + + Enable Notifications + + + + `, + config + ); + const list = page.locator('ion-list'); + await expect(list).toHaveScreenshot(screenshot(`radio-end-label-in-item`)); + }); + }); + test.describe(title('radio: stacked label in item'), () => { - test('should render margins correctly when using stacked label in item', async ({ page }) => { + test('should not have visual regressions when using stacked label in item', async ({ page }) => { await page.setContent( ` diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Chrome-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 00000000000..066133dadd4 Binary files /dev/null and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Firefox-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 00000000000..4f69486fbf2 Binary files /dev/null and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Safari-linux.png b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 00000000000..0436e063863 Binary files /dev/null and b/core/src/components/radio/test/item/radio.e2e.ts-snapshots/radio-end-label-in-item-md-ltr-Mobile-Safari-linux.png differ diff --git a/packages/angular/src/directives/proxies.ts b/packages/angular/src/directives/proxies.ts index 9d6d23b5c17..c0d3e78e28e 100644 --- a/packages/angular/src/directives/proxies.ts +++ b/packages/angular/src/directives/proxies.ts @@ -1607,14 +1607,14 @@ export declare interface IonProgressBar extends Components.IonProgressBar {} @ProxyCmp({ - inputs: ['alignment', 'color', 'disabled', 'justify', 'labelPlacement', 'mode', 'name', 'value'] + inputs: ['alignment', 'color', 'disabled', 'errorText', 'helperText', 'justify', 'labelPlacement', 'mode', 'name', 'value'] }) @Component({ selector: 'ion-radio', changeDetection: ChangeDetectionStrategy.OnPush, template: '', // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property - inputs: ['alignment', 'color', 'disabled', 'justify', 'labelPlacement', 'mode', 'name', 'value'], + inputs: ['alignment', 'color', 'disabled', 'errorText', 'helperText', 'justify', 'labelPlacement', 'mode', 'name', 'value'], }) export class IonRadio { protected el: HTMLIonRadioElement; diff --git a/packages/angular/standalone/src/directives/proxies.ts b/packages/angular/standalone/src/directives/proxies.ts index c7d111f7bef..31fa869f6f7 100644 --- a/packages/angular/standalone/src/directives/proxies.ts +++ b/packages/angular/standalone/src/directives/proxies.ts @@ -1614,14 +1614,14 @@ export declare interface IonProgressBar extends Components.IonProgressBar {} @ProxyCmp({ defineCustomElementFn: defineIonRadio, - inputs: ['alignment', 'color', 'disabled', 'justify', 'labelPlacement', 'mode', 'name', 'value'] + inputs: ['alignment', 'color', 'disabled', 'errorText', 'helperText', 'justify', 'labelPlacement', 'mode', 'name', 'value'] }) @Component({ selector: 'ion-radio', changeDetection: ChangeDetectionStrategy.OnPush, template: '', // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property - inputs: ['alignment', 'color', 'disabled', 'justify', 'labelPlacement', 'mode', 'name', 'value'], + inputs: ['alignment', 'color', 'disabled', 'errorText', 'helperText', 'justify', 'labelPlacement', 'mode', 'name', 'value'], standalone: true }) export class IonRadio { diff --git a/packages/vue/src/proxies.ts b/packages/vue/src/proxies.ts index a866edde10a..58db8595c65 100644 --- a/packages/vue/src/proxies.ts +++ b/packages/vue/src/proxies.ts @@ -678,6 +678,8 @@ export const IonRadio = /*@__PURE__*/ defineContainer