22 Commits

Author SHA1 Message Date
284eb8ecaf feat: add ionic theme architecture (#29132)
Issue number: Internal

---------

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

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

Adds the base architecture to add a new theme configuration to Ionic
Framework components.
- Components can now specify an additional stylesheet for the `ionic`
theme.
- Developers can specify the `theme` and `mode` independently to control
look and feel of a component.

Test infrastructure has been updated to add support for testing the
theme configuration with Playwright.
- Existing `themes` test configuration has been renamed to `palettes`

This PR is just the initial effort to decouple Ionic's architecture to
separate look and feel and allow our dev team to start introducing the
new component appearance to the UI. There will be additional changes
required to completely add support for the Ionic theme. These changes
are targeted against the `next` branch and are not expected to be used
in a production environment at this time.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->


## Other information

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

---------

Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com>
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
2024-03-18 15:45:01 -04:00
1091534397 chore: sync with main 2024-02-07 11:48:46 -05:00
f6fc22bba6 fix(action-sheet, alert, toast): button roles autocomplete with available options (#27940)
Issue number: resolves #27965

---------


https://www.youtube.com/watch?v=a_m7jxrTlaw&list=PLIvujZeVDLMx040-j1W4WFs1BxuTGdI_b&index=3


<!-- 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. -->
There is a lack of autocomplete support for AlertButton attribute of
`role` (there may be similar situations for other components too,
however, I was working on this component and found it).

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

- Support for autocomplete for the two types defined `cancel` and
`destructive`, and also supports any arbitrary string if passed in.

## 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. -->
I suggest there to be some global interface similar to the following:
```
interface LooseAutocomplete<T extends string> = T | Omit<string, T>;
```
I referenced this great [video](https://youtu.be/a_m7jxrTlaw) from Matt
@mattpocock

---------

Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
2024-01-30 14:53:40 +00:00
e76d72989a feat(action-sheet): add disabled button (#28723)
Issue number: N/A
---------

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

Action sheet buttons cannot be disabled. This behavior exists in iOS 17.

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

- Action sheet buttons can be disabled

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->


## Other information

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

---------

Co-authored-by: ionitron <hi@ionicframework.com>
2023-12-19 16:48:25 -05:00
5ce4ec0439 feat(action-sheet): add htmlAttributes property for passing attributes to buttons (#27863)
Issue number: N/A

---------

## What is the current behavior?
Buttons containing only icons are not accessible as there is no way to
pass an `aria-label` attribute (or any other html attribute).

## What is the new behavior?
- Adds the `htmlAttributes` property on the `ActionSheetButton`
interface
- Passes the `htmlAttributes` to the buttons (both the buttons array and
the cancelButton)
- Adds two tests to verify `aria-label` and `aria-labelled-by` are
passed to a button with and without the cancel role - this was done
because action sheet breaks these buttons up when rendering

## Does this introduce a breaking change?

- [ ] Yes
- [x] No
2023-07-31 12:23:46 -04:00
322a1dbcd0 refactor(types): remove overlay attribute interfaces (#26181)
BREAKING CHANGE:

`ActionSheetAttributes`, `AlertAttributes`, `AlertTextareaAttributes`, `AlertInputAttributes`, `LoadingAttributes`, `ModalAttributes`, `PickerAttributes`, `PopoverAttributes`, and `ToastAttributes` have been removed. Developers should use `{ [key: string]: any }` instead.
2022-10-28 16:12:28 -04:00
9fbaaf95eb chore(): simplify overlay attribute types (#25074) 2022-04-07 14:11:30 -04:00
5676bab316 lint(eslint): migrate to eslint and prettier (#25046) 2022-04-04 11:12:53 -04:00
ecb30af4d8 chore(): resolve merge conflicts for beta 2021-09-15 12:02:43 -04:00
bd96a81ff8 feat(action-sheet, loading, modal, picker, popover): pass HTML attributes to host element (#23929) 2021-09-15 10:02:19 -04:00
30f8508296 feat(action-sheet): add data property to ActionSheetButton (#23744)
resolves #23700

Co-authored-by: Liam DeBeasi <liamdebeasi@icloud.com>
2021-08-09 11:32:57 -04:00
9e24a0b493 feat(action-sheet, alert): add id to AlertButton and ActionSheetButton (#18992)
resolves #22959

Co-authored-by: Liam DeBeasi <liamdebeasi@icloud.com>
2021-06-29 14:17:19 -04:00
7703da28f8 fix(toast, action-sheet): allow button handler to return Promise<void> (#21259) 2020-05-26 15:27:14 -04:00
c982856dba feat(toast): add "color" prop (#16100)
This commit also refactors ion-toast, so it uses shadow-dom,
this is required since CSS variables
does not work well in non-shadow-dom components.

fixes #16099
2018-10-26 18:53:02 +02:00
dc976cc745 feat(overlays): expose animation customization 2018-10-04 17:21:15 +02:00
f8eafa7a21 fix(all): lint errors 2018-09-24 18:20:52 +02:00
cc960c3d48 fix(overlays): expose mode, id, keyboardClose
fixes #15366
2018-08-29 16:19:51 +02:00
8b768fb73d fix(overlay): expose "animated" API
fixes #14775
2018-08-26 19:06:50 +02:00
bd5a4a0294 refactor(overlays): enableBackdropDismiss => backdropDismiss 2018-08-13 18:32:24 +02:00
c1b61d0fee chore(): update to ionic-rules/strict 2018-07-29 23:10:38 +02:00
826e02bcf0 fix(select): cssClass + strong typed 2018-04-27 18:25:49 +02:00
053c375521 refactor(all): allow external imports 2018-04-24 16:12:02 +02:00