667 Commits

Author SHA1 Message Date
7ca6b80b04 chore(): update package lock files 2024-03-20 13:19:42 +00:00
4cd8fb15af v7.8.1 2024-03-20 13:18:53 +00:00
58d217d0cf fix(react): avoid definitely typed errors with @types/react@18 (#29182)
Issue number: resolves #29178

---------

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

[DefinitelyTyped removed the `onPointerEnterCaptured` and
`onPointerLeaveCaptured` types for
`@types/react`](https://github.com/DefinitelyTyped/DefinitelyTyped/discussions/69006).
This caused issues when multiple versions of `@types/react` are
installed where an older version inlined these types, but they did not
exist in newer versions.

For Ionic React, we build with React 16 which did inline the types. In
an Ionic React starter app we build with React 18 which does not want
these types. As a result, there is a type mismatch.

Note that this type change is being [reverted in React
16-17](https://github.com/DefinitelyTyped/DefinitelyTyped/discussions/69006#discussioncomment-8826095)
so presumably this issue will go away in its own for those versions.
However, developers are building with React 18 too, so this issue will
persist for those developers.

However, React 17 should still have this problem (at least until the
change is reverted), yet the build here passes. The main difference is
that the `onPointer{Enter,Leave}Captured` event is no longer inlined.
After talking with the Stencil team this is the current understanding of
why the issue no longer reproduces.


**Building with React 17**

```ts
import type { JSX as LocalJSX } from '@ionic/core/components';
import React from 'react';
import type { IonicReactProps } from './IonicReactProps';
export declare const IonRouterOutlet: React.ForwardRefExoticComponent<Pick<LocalJSX.IonRouterOutlet & {
    basePath?: string | undefined;
    ref?: React.Ref<any> | undefined;
    ionPage?: boolean | undefined;
} & IonicReactProps & Omit<React.HTMLAttributes<HTMLIonRouterOutletElement>, "style" | "placeholder">, "children" | "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | keyof IonicReactProps | keyof LocalJSX.IonRouterOutlet | "basePath" | "ionPage"> & React.RefAttributes<HTMLIonRouterOutletElement>>;
```

**Building with React 18**

```ts
export declare const IonRouterOutlet: React.ForwardRefExoticComponent<Omit<LocalJSX.IonRouterOutlet & {
    basePath?: string | undefined;
    ref?: React.Ref<any> | undefined;
    ionPage?: boolean | undefined;
} & IonicReactProps & Omit<React.HTMLAttributes<HTMLIonRouterOutletElement>, "style" | "placeholder">, "ref"> & React.RefAttributes<HTMLIonRouterOutletElement>>;
```

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

- Updated types in our React test apps and verified that the [issue
reproduces there without this
fix](https://github.com/ionic-team/ionic-framework/actions/runs/8345186602).
- Updated Ionic React and Ionic React Router to build with React 17.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

Ionic v7 expects React 17 or newer, so building with React 17 instead of
React 16 is not a breaking change.

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

Dev build: `7.8.1-dev.11710859149.114e57ae` Verified with sample repro
2024-03-19 17:36:29 +00:00
7be6d9f72d chore(): update package lock files 2024-03-13 13:48:18 +00:00
400013d6cb v7.8.0 2024-03-13 13:47:29 +00:00
ddcda78ac9 chore(): update package lock files 2024-03-13 13:15:50 +00:00
82e90f28b4 v7.7.5 2024-03-13 13:15:09 +00:00
77914f3a28 chore(): update package lock files 2024-03-06 18:05:34 +00:00
911519a5f8 v7.7.4 2024-03-06 18:04:51 +00:00
842a65c9be chore(): update package lock files 2024-02-21 15:24:31 +00:00
3fd66e76b5 v7.7.3 2024-02-21 15:23:45 +00:00
76c003a3a1 chore(): update package lock files 2024-02-14 14:27:02 +00:00
ae873e7028 v7.7.2 2024-02-14 14:26:08 +00:00
a0afeeb50e chore(): update package lock files 2024-02-07 14:21:09 +00:00
66fcb70151 v7.7.1 2024-02-07 14:20:32 +00:00
5777ce2581 fix(react): route with redirect will mount page (#28961)
Issue number: resolves #28838

---------

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

In #28316 we resolved a longstanding misconfiguration where event
listeners being added to the page were not removed. This was due to
incorrect usage of `.bind` creating a new instance of the callback
functions.

By removing the event listener for `ionViewDidLeave`, before the
component has actually unmounted in react, resulted in the registered
destroy callback to not fire:
51c729eafc/packages/react/src/contexts/IonLifeCycleContext.tsx (L208-L216)
and
51c729eafc/packages/react/src/routing/ViewLifeCycleManager.tsx (L21-L32)

This resulted in a scenario that using a `Redirect` could cause the
wrong view to be unmounted (the entering view) and leave the user on an
empty screen.

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

- `ionViewDidEnter` event listener *is not* removed while the component
is unmounting. The browser will naturally remove the event listener when
the element node is detached from the DOM.
- Users are no longer presented with a white screen after clicking a
route that uses a redirect.

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

Dev-build: `7.6.7-dev.11706567011.11e782a9`
2024-02-06 23:20:57 +00:00
51c729eafc refactor(angular, react, vue): add missing test app msg (#28951)
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. -->

The packages, Angular, React, and Vue, will accept any `app_dir`
parameter when passing it to the build script. This can lead to a user
to entering a directory that doesn't exist within `test/apps`. If this
happens, then the build folder will include an incomplete test app.

For example:
1. `./build ng13`
2. This creates a `build/ng13` folder, but the folder only contains the
contents from the `base` folder. This causes it to be incomplete.

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

- Provides a message that the provided app directory doesn't exist.
- Does not create the incomplete app when an invalid app directory is
given.

## 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.
  4. Update the BREAKING.md file with the breaking change.
5. 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. -->

N/A
2024-02-01 17:04:58 +00:00
7bb08f9ce4 chore(): update package lock files 2024-01-31 15:18:19 +00:00
e672805406 v7.7.0 2024-01-31 15:17:39 +00:00
fae7b24d2a chore(): update package lock files 2024-01-31 14:27:13 +00:00
1de5ff9302 v7.6.7 2024-01-31 14:26:24 +00:00
b1c4c72474 refactor(react, react-router): build works on windows (#28904)
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. -->

React and React Router packages do not build correctly on Windows
because certain dependencies were not marked as external.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- 3rd party packages are correctly marked as external


## 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. -->
2024-01-29 18:15:50 +00:00
720a3cea99 test(react): re-enable picker tests (#28885)
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. -->

The `IonPicker` tests in the React app were skipped due to a Stencil bug
that has since been resolved.

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

Tests re-enabled.

## 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. -->
2024-01-26 21:16:14 +00:00
67bee73513 chore(): update package lock files 2024-01-24 14:15:49 +00:00
0c4e1fcdb4 v7.6.6 2024-01-24 14:15:07 +00:00
0fb88315df chore: update package lock 2024-01-17 09:41:15 -05:00
71e485d770 chore: clean up changelog 2024-01-17 09:31:16 -05:00
e2708ff651 v7.6.5 2024-01-17 14:23:09 +00:00
076c9fed29 merge release-7.6.4 2024-01-10 11:28:13 -05:00
b2e40cdcb8 chore: update package lock files 2024-01-03 09:57:18 -05:00
ebb9ae9c11 v7.6.3 2024-01-03 14:52:37 +00:00
bfd497f825 chore(): update package lock files 2023-12-19 14:45:31 +00:00
8d841b4225 v7.6.2 2023-12-19 14:45:17 +00:00
f6531fa2be chore: bump package-lock 2023-12-13 09:31:00 -05:00
150ea1a8ad v7.6.1 2023-12-13 14:27:51 +00:00
92f1b8627a fix(react): avoid type collision with @types/react@18.2.43 and greater (#28687)
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. -->

Ionic React projects using `@types/react@18.2.43` or greater will run
into a type-check error on build with `IonRouterOutlet` and potentially
other components:

```
Property 'placeholder' is missing in type '{ children: Element[]; }' but required in type 'Pick<IonRouterOutlet & { basePath?: string | undefined; ref?: Ref<any> | undefined; ionPage?: boolean | undefined; } & IonicReactProps & Omit<...>, "color" | ... 254 more ... | "ionPage">'.
```

Definitely typed decided to make a breaking type change in a patch
release:
b954269038


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

- Patches the type to allow for compatibility between React v16, 17 and
18.

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

### Testing

1. Create a new Ionic react project with the "list" template.
2. Run `npm run build`
3. Observe: Exception posted above
4. Install the dev-build
5. Run `npm run build`
6. Observe: No exception, build passes
7. You can additionally serve the app to verify no runtime
exceptions/broken behavior.

Dev-build: `7.6.1-dev.11702322681.17e39348`
2023-12-12 22:53:55 +00:00
f3799f332b chore(): update package lock files 2023-12-06 15:33:57 +00:00
90ce7f00fa v7.6.0 2023-12-06 15:33:45 +00:00
5573fde6a2 chore(): update package lock files 2023-12-06 15:04:35 +00:00
507d5ee1da v7.5.8 2023-12-06 15:04:23 +00:00
2e1261a52c chore(): update package lock files 2023-11-29 15:05:23 +00:00
3a35fdd2f5 v7.5.7 2023-11-29 15:05:12 +00:00
93ed25693c chore(): update package lock files 2023-11-21 14:31:53 +00:00
f6a740dce5 v7.5.6 2023-11-21 14:31:40 +00:00
9bb45b3772 chore(): update package lock files 2023-11-15 15:27:39 +00:00
78ce39f8c6 v7.5.5 2023-11-15 15:27:28 +00:00
aeeb84b77d refactor: introduce watch command (#28453)
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. -->

This is part of my work for hack day, but I wanted to tackle the
following problems:

1. There is no easy way to have angular, angular-server, vue,
vue-router, react, and react-router automatically recompile when you
make a change. Right now you have to manually run `npm run build` every
time you make a change.

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

- Adds `npm run build.watch` to let developers easily watch for changes
in each project.
## 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-11-09 16:50:19 +00:00
95b52ac8ba chore(): update package lock files 2023-11-08 14:49:04 +00:00
5bd4af2c51 v7.5.4 2023-11-08 14:48:46 +00:00
dfaa006a7a refactor: update to rollup 4 (#28459)
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. -->

The vue, vue-router, react, and react-router packages are bundled with a
version of rollup that are 2 major versions out of date.

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

- Update deps to rollup 4 and made any necessary changes as a result of
breaking changes
- Removed the react projects old treeshaking script. The rollup dep used
was incompatible with Rollup 4, and the script didn't work to begin
with.
- Removed the source maps and resolve plugins. These did not make any
difference in the final result, and source maps are still included in
the final build.
- Removed a PURE annotation from an import. Rollup 4 warns about this,
and this PURE annotation does not seem to be needed since every import
in this file uses "createReactComponent" to begin with.

## 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-11-07 15:21:46 +00:00