Commit Graph

669 Commits

Author SHA1 Message Date
ionitron
a2923aaeb3 chore(): update package lock files 2024-03-27 13:34:23 +00:00
ionitron
eeab96de55 v7.8.2 2024-03-27 13:33:47 +00:00
ionitron
7ca6b80b04 chore(): update package lock files 2024-03-20 13:19:42 +00:00
ionitron
4cd8fb15af v7.8.1 2024-03-20 13:18:53 +00:00
Liam DeBeasi
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
ionitron
7be6d9f72d chore(): update package lock files 2024-03-13 13:48:18 +00:00
ionitron
400013d6cb v7.8.0 2024-03-13 13:47:29 +00:00
ionitron
ddcda78ac9 chore(): update package lock files 2024-03-13 13:15:50 +00:00
ionitron
82e90f28b4 v7.7.5 2024-03-13 13:15:09 +00:00
ionitron
77914f3a28 chore(): update package lock files 2024-03-06 18:05:34 +00:00
ionitron
911519a5f8 v7.7.4 2024-03-06 18:04:51 +00:00
ionitron
842a65c9be chore(): update package lock files 2024-02-21 15:24:31 +00:00
ionitron
3fd66e76b5 v7.7.3 2024-02-21 15:23:45 +00:00
ionitron
76c003a3a1 chore(): update package lock files 2024-02-14 14:27:02 +00:00
ionitron
ae873e7028 v7.7.2 2024-02-14 14:26:08 +00:00
ionitron
a0afeeb50e chore(): update package lock files 2024-02-07 14:21:09 +00:00
ionitron
66fcb70151 v7.7.1 2024-02-07 14:20:32 +00:00
Sean Perkins
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
Maria Hutt
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
ionitron
7bb08f9ce4 chore(): update package lock files 2024-01-31 15:18:19 +00:00
ionitron
e672805406 v7.7.0 2024-01-31 15:17:39 +00:00
ionitron
fae7b24d2a chore(): update package lock files 2024-01-31 14:27:13 +00:00
ionitron
1de5ff9302 v7.6.7 2024-01-31 14:26:24 +00:00
Liam DeBeasi
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
Amanda Johnston
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
ionitron
67bee73513 chore(): update package lock files 2024-01-24 14:15:49 +00:00
ionitron
0c4e1fcdb4 v7.6.6 2024-01-24 14:15:07 +00:00
Liam DeBeasi
0fb88315df chore: update package lock 2024-01-17 09:41:15 -05:00
Liam DeBeasi
71e485d770 chore: clean up changelog 2024-01-17 09:31:16 -05:00
ionitron
e2708ff651 v7.6.5 2024-01-17 14:23:09 +00:00
Liam DeBeasi
076c9fed29 merge release-7.6.4 2024-01-10 11:28:13 -05:00
Liam DeBeasi
b2e40cdcb8 chore: update package lock files 2024-01-03 09:57:18 -05:00
ionitron
ebb9ae9c11 v7.6.3 2024-01-03 14:52:37 +00:00
ionitron
bfd497f825 chore(): update package lock files 2023-12-19 14:45:31 +00:00
ionitron
8d841b4225 v7.6.2 2023-12-19 14:45:17 +00:00
Liam DeBeasi
f6531fa2be chore: bump package-lock 2023-12-13 09:31:00 -05:00
ionitron
150ea1a8ad v7.6.1 2023-12-13 14:27:51 +00:00
Sean Perkins
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
ionitron
f3799f332b chore(): update package lock files 2023-12-06 15:33:57 +00:00
ionitron
90ce7f00fa v7.6.0 2023-12-06 15:33:45 +00:00
ionitron
5573fde6a2 chore(): update package lock files 2023-12-06 15:04:35 +00:00
ionitron
507d5ee1da v7.5.8 2023-12-06 15:04:23 +00:00
ionitron
2e1261a52c chore(): update package lock files 2023-11-29 15:05:23 +00:00
ionitron
3a35fdd2f5 v7.5.7 2023-11-29 15:05:12 +00:00
ionitron
93ed25693c chore(): update package lock files 2023-11-21 14:31:53 +00:00
ionitron
f6a740dce5 v7.5.6 2023-11-21 14:31:40 +00:00
ionitron
9bb45b3772 chore(): update package lock files 2023-11-15 15:27:39 +00:00
ionitron
78ce39f8c6 v7.5.5 2023-11-15 15:27:28 +00:00
Liam DeBeasi
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
ionitron
95b52ac8ba chore(): update package lock files 2023-11-08 14:49:04 +00:00