55 Commits

Author SHA1 Message Date
c70432e693 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`
2023-10-09 21:05:09 +00:00
5b7e422dc0 fix(radio,toggle,checkbox,select): padded space is clickable in items (#28136)
Issue number: Resolves #27169

---------

<!-- 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. -->

Clicking the padded space within an `ion-item` will not pass the click
event to the slotted `ion-radio`, `ion-checkbox`, `ion-select` or
`ion-toggle`.

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

- The padded space at the start of `.item-native` and at the end of
`.item-inner` is clickable to activate a control.
- When the item is clicked, we check if the event is a result of
clicking the control or clicking the item's padded space. If the click
event is on the control, we don't need to do anything and let the
default behavior occur. If the click event is on the padded space, we
manually call the `.click()` method for the interactive element.
- The cursor pointer displays when hovering over the padded space when a
slotted interactive control is present.


## 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. -->
2023-09-20 03:27:36 +00:00
e6c7bb60e7 feat(checkbox, radio, toggle, range): stacked labels for form controls (#28075)
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Co-authored-by: ionitron <hi@ionicframework.com>
2023-09-01 09:30:59 -07:00
0a0345a84a refactor(many): use utils import (#27160) 2023-04-12 13:25:14 -07:00
f829672a6a fix(many): disabled control in item does not receive active/hover states (#26867)
Resolves #26706
2023-03-14 10:32:55 -04:00
67578f6246 chore: format string values in comments with double quotes (#26857) 2023-02-28 21:16:15 -05:00
1457ce7be4 refactor(many): clarify deprecation warning (#26834) 2023-02-21 13:58:22 -05:00
7578aa3c59 fix(select): emit single ionChange event for popover option selection (#26796)
Resolves #26789
2023-02-20 20:20:32 -05:00
7312b0696d fix(checkbox): screen readers announce state correctly (#26817)
resolves #25740
2023-02-20 09:45:27 -05:00
87bc749040 fix(checkbox, radio): label is announced once on ios (#26770)
resolves #26769
2023-02-09 12:36:29 -05:00
1a8bd6d8c6 chore(deps): update to stencil v3 (#26663) 2023-01-31 18:07:22 -05:00
63f8525284 fix(many): legacy form control does not warn when using aria-labelledby (#26699)
resolves #26698
2023-01-30 16:02:00 -05:00
b78b454e08 revert(): revert base components feature (#26692)
The Ionic Framework team would like to re-evaluate our approach to improving customization options when building mobile applications. We are looking at other solutions that a) make customizing an app UI easier and b) are applicable to a broader set of developers.
2023-01-30 11:52:36 -05:00
18f109c7da feat(base-components): add ability to remove ios and md theme (#26669) 2023-01-24 16:18:35 -05:00
9d52e70361 feat(checkbox): component can be used outside ion-item (#26518) 2023-01-05 13:49:04 -06:00
a6b2629ede feat(checkbox): ionChange fires on user interaction (#25923)
BREAKING CHANGE:

`ionChange` is no longer emitted when the `checked` property of `ion-checkbox` is modified externally. `ionChange` is only emitted from user committed changes, such as clicking or tapping the checkbox.
2022-09-13 16:27:34 -04:00
5676bab316 lint(eslint): migrate to eslint and prettier (#25046) 2022-04-04 11:12:53 -04:00
c20408369b fix(select): ensure popover options with number values are searched for correctly (#23998) 2021-10-04 11:19:49 -05:00
dc430af906 fix(all): reflect color property as an attribute for vue (#23345)
resolves #23323
2021-05-21 19:26:53 -04:00
07868354aa fix(a11y): only preventDefault for the onClick event (#22573) 2020-11-25 16:56:51 -05:00
c45c8d5564 fix(checkbox): click events on ion-item now fire properly (#22561)
resolves #22557
2020-11-24 14:31:24 -05:00
7214a8401b fix(checkbox): use a native input to fix a11y issues with axe and screen readers (#22402)
fixes #21644
fixes #20517
fixes #17796
2020-11-12 11:25:33 -05:00
753fd2f910 chore(colorClass): update createColorClasses() for ts4 (#21896)
Change the createColorClasses() fn so the returned type and jsx class property work well with typescript 4
2020-08-10 09:18:41 -05:00
d4b9151396 feat(checkbox): add parts support for container, mark (#20950) 2020-04-23 12:19:24 -04:00
8a88dd25b6 feat(item): add hover and focused states (#18606)
references #18279 references #17624
2019-06-25 17:29:14 -04:00
34dfc3ce98 refactor(all): updating to newest stencil apis (#18578)
* chore(): update ionicons

* refactor(all): updating to newest stencil apis

* fix lint issues

* more changes

* moreee

* fix treeshaking

* fix config

* fix checkbox

* fix stuff

* chore(): update ionicons

* fix linting errors
2019-06-23 11:26:42 +02:00
b40f7d36d5 fix(): update to Stencil One 🎉🎊 2019-06-19 21:33:50 +02:00
e5c8c10029 fix(components): include mode classes on components for use in shadow (#17838)
- removes mode-less component classes from the internal CSS, use element instead
- adds mode specific classes `md` or `ios` for styling inside of shadow components
- adds e2e test that verifies mode classes exist on all ionic components, plus checks for specific classes that the components need for internal styling

fixes #17608
2019-04-16 17:28:21 -04:00
c641ae10ed feat(checkbox): implement indeterminate state (#16951)
This adds an `indeterminate` prop to the `ion-checkbox` component, which visually renders the checkbox with a dash to indicate an indeterminate state.

closes #16943
2019-03-04 11:16:41 -05:00
2b4d7b7be9 fix(angular): apply validation classes properly
* fix(angular): add validation classes to ion-item

* fix(inputs): focus handling

fixes #17171
fixes #16052
fixes #15572
fixes #16452
fixes #17063
2019-01-19 22:56:00 +01:00
6364e4e2a1 fix(inputs): keyboard focus improvements (#16838)
fixes #16815
fixes #16872
fixes #13978
fixes #16610
2019-01-11 19:36:02 +01:00
3d656ac312 docs(all): improve type docs for event 2018-12-28 20:38:24 +01:00
fd79b57748 fix(inputs): fix aria with shadow-dom (#16329) 2018-11-16 19:26:55 +01:00
ecc2c55370 docs(all): possible values are extracted by stencil (#16190)
* docs(all): possible values are extracted by stencil

* add defaults

* remove all hardcoded defaults

* update stencil
2018-11-02 00:06:40 +01:00
240171a928 fix(checkbox): match MD spec (#16186)
* fix(checkbox): prevent transition inheritance

* fix(checkbox): use SVG for checkbox icon

* fix(checkbox): match MD spec size

* refactor(checkbox): use height/width custom props over size

* fix(checkbox): match MD spec off state border color

* feat(checkbox): animate check path for MD
2018-11-01 14:13:06 -05:00
1733c9489c docs(): value for toggle and checkbox (#16102)
* docs(): value for toggle and checkbox

fixes #16074

* update docs
2018-10-26 20:18:53 +02:00
ef6895acbd fix(inputs): disabled handling (#16071) 2018-10-25 22:50:06 +02:00
a72fced6fe fix(all): docs for all missing props 2018-10-11 16:24:08 -05:00
a999c1f0a9 perf(): prevent unnecesary event listener changes 2018-10-09 16:03:14 -05:00
e81af2d5aa fix(picker): stop animation when it's closed
fixes #15854
2018-10-08 14:53:47 -05:00
c49d896e08 refactor(all): using ComponentInterface 2018-09-14 18:47:00 +02:00
21d1f2e2dd fix(item): update hostContext to use ion-item element
fixes styling issues with children elements using the .in-item class
2018-09-13 11:46:13 -04:00
e7416435d8 refactor(all): additional tslint rules 2018-09-01 18:06:59 +02:00
2e7d355edf fix(input): event interfaces 2018-08-12 01:18:59 +02:00
c1b61d0fee chore(): update to ionic-rules/strict 2018-07-29 23:10:38 +02:00
f0c15384a2 docs(components): update color documentation 2018-07-24 11:59:32 -04:00
8324bd1f7f fix(inputs): inputs work inside <form> 2018-07-24 00:00:54 +02:00
a7f1f4daa7 refactor(components): update to use shadow DOM and work with css variables
- updates components to use shadow DOM or scoped if they require css variables
- moves global styles to an external stylesheet that needs to be imported
- adds support for additional colors and removes the Sass loops to generate colors for each component
- several property renames, bug fixes, and test updates

Co-authored-by: Manu Mtz.-Almeida <manu.mtza@gmail.com>
Co-authored-by: Adam Bradley <adambradley25@gmail.com>
Co-authored-by: Cam Wiegert <cam@camwiegert.com>
2018-07-09 12:57:21 -04:00
3cdc696847 docs(): update usage and examples 2018-05-30 12:41:30 -04:00
618f708bc4 fix(all): strong typing for color 2018-05-14 13:51:30 +02:00