fix(checkbox, radio, toggle): disabled elements are not interactive (#28294)

Issue number: resolves #28293

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

Disabled toggles, radios, and checkboxes can still be enabled by
manually dispatching a click event on them.


## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Toggles, radios, and checkboxes no longer activate if `disabled` is
set to `true`

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

Dev build: `7.4.4-dev.11696545130.1171e7a9`

core/src/components/checkbox/checkbox.tsx

@@ -211,6 +211,10 @@ export class Checkbox implements ComponentInterface {
   };
 
   private onClick = (ev: MouseEvent) => {
+    if (this.disabled) {
+      return;
+    }
+
     this.toggleChecked(ev);
   };
 

core/src/components/checkbox/test/checkbox.spec.ts

@@ -0,0 +1,24 @@
+import { newSpecPage } from '@stencil/core/testing';
+
+import { Checkbox } from '../checkbox';
+
+describe('ion-checkbox: disabled', () => {
+  it('clicking disabled checkbox should not toggle checked state', async () => {
+    const page = await newSpecPage({
+      components: [Checkbox],
+      html: `
+        <ion-checkbox disabled="true">Checkbox</ion-checkbox>
+      `,
+    });
+
+    const checkbox = page.body.querySelector('ion-checkbox');
+
+    expect(checkbox.checked).toBe(false);
+
+    checkbox.click();
+
+    await page.waitForChanges();
+
+    expect(checkbox.checked).toBe(false);
+  });
+});