From b6b2d34fd446feb06cf0143946a014d19231a78e Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Tue, 2 Feb 2021 13:19:19 -0500 Subject: [PATCH 1/5] fix(app): keyboard no longer hides when using contenteditable (#22857) resolves #22856 --- core/src/utils/input-shims/hacks/input-blurring.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/utils/input-shims/hacks/input-blurring.ts b/core/src/utils/input-shims/hacks/input-blurring.ts index 8b98c18104..0df400db73 100644 --- a/core/src/utils/input-shims/hacks/input-blurring.ts +++ b/core/src/utils/input-shims/hacks/input-blurring.ts @@ -1,6 +1,6 @@ import { addEventListener, removeEventListener } from '../../helpers'; -const SKIP_SELECTOR = 'input, textarea, [no-blur]'; +const SKIP_SELECTOR = 'input, textarea, [no-blur], [contenteditable]'; export const enableInputBlurring = () => { let focused = true; From 487349f02a41344db2478735d27bf79f2a1c99b3 Mon Sep 17 00:00:00 2001 From: Mike Hartington Date: Tue, 2 Feb 2021 16:44:33 -0500 Subject: [PATCH 2/5] fix(schematics): update ngAdd schematic (#22858) * fix(schematics): update ngAdd schematic Closes https://github.com/ionic-team/angular-toolkit/issues/415 Closes https://github.com/ionic-team/angular-toolkit/issues/419 * Update angular/src/schematics/utils/config.ts Co-authored-by: Liam DeBeasi * Update angular/src/schematics/add/index.ts Co-authored-by: Liam DeBeasi Co-authored-by: Liam DeBeasi --- angular/src/schematics/add/index.ts | 12 ++++++++---- angular/src/schematics/utils/config.ts | 4 ++-- 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/angular/src/schematics/add/index.ts b/angular/src/schematics/add/index.ts index a2465e29e7..2d0de24367 100644 --- a/angular/src/schematics/add/index.ts +++ b/angular/src/schematics/add/index.ts @@ -40,20 +40,23 @@ function addIonicAngularModuleToAppModule(projectSourceRoot: Path): Rule { function addIonicStyles(projectName: string, projectSourceRoot: Path): Rule { return (host: Tree) => { const ionicStyles = [ + 'node_modules/@ionic/angular/css/core.css', 'node_modules/@ionic/angular/css/normalize.css', 'node_modules/@ionic/angular/css/structure.css', 'node_modules/@ionic/angular/css/typography.css', - 'node_modules/@ionic/angular/css/core.css', + 'node_modules/@ionic/angular/css/display.css', 'node_modules/@ionic/angular/css/padding.css', 'node_modules/@ionic/angular/css/float-elements.css', 'node_modules/@ionic/angular/css/text-alignment.css', 'node_modules/@ionic/angular/css/text-transformation.css', 'node_modules/@ionic/angular/css/flex-utils.css', `${projectSourceRoot}/theme/variables.css` - ].forEach(entry => { + ] + + ionicStyles.forEach(entry => { addStyle(host, projectName, entry); }); - return host; + return host; }; } @@ -64,7 +67,8 @@ function addIonicons(projectName: string): Rule { input: 'node_modules/ionicons/dist/ionicons/svg', output: './svg' }; - addAsset(host, projectName, ioniconsGlob); + addAsset(host, projectName, 'build', ioniconsGlob); + addAsset(host, projectName, 'test', ioniconsGlob); return host; }; } diff --git a/angular/src/schematics/utils/config.ts b/angular/src/schematics/utils/config.ts index 39f0576431..dc2f1881b2 100644 --- a/angular/src/schematics/utils/config.ts +++ b/angular/src/schematics/utils/config.ts @@ -62,10 +62,10 @@ export function addStyle(host: Tree, projectName: string, stylePath: string) { writeConfig(host, config); } -export function addAsset(host: Tree, projectName: string, asset: string | {glob: string; input: string; output: string}) { +export function addAsset(host: Tree, projectName: string, architect: string, asset: string | {glob: string; input: string; output: string}) { const config = readConfig(host); const appConfig = getAngularAppConfig(config, projectName); - appConfig.architect.build.options.assets.push(asset); + appConfig.architect[architect].options.assets.push(asset); writeConfig(host, config); } From ff0f1da9f11915b48c4258af7c48c4513785f3fc Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 4 Feb 2021 11:00:46 -0500 Subject: [PATCH 3/5] fix(vue): ionChange events now propagate correctly (#22872) resolves #22870 --- core/package-lock.json | 14 ++++---- core/package.json | 2 +- core/stencil.config.ts | 6 ++-- packages/vue/src/ionic-vue.ts | 15 +++++++-- packages/vue/src/proxies.ts | 36 ++++++++++++++------- packages/vue/src/vue-component-lib/utils.ts | 10 +++--- 6 files changed, 53 insertions(+), 30 deletions(-) diff --git a/core/package-lock.json b/core/package-lock.json index 23f05fa73e..de95ebcd10 100644 --- a/core/package-lock.json +++ b/core/package-lock.json @@ -17,7 +17,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", @@ -1657,9 +1657,9 @@ "dev": true }, "node_modules/@stencil/vue-output-target": { - "version": "0.2.5", - "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.2.5.tgz", - "integrity": "sha512-EnCZbJDD7y2nTnaFXo4PJrEgP9CNvJARZQrnvz93rMDKCzm+19C9goU4D6A1ysblLVvZSTm3wELKSM1auRUm0Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.3.0.tgz", + "integrity": "sha512-uiBe+o7M+NU0gMRgJfrlepxLPBXK0lX4TL2jIPwhBfxYw++pbtg7BLRO2HxE69GR0nxw+7Uf3uJzOGbMsl+ZUQ==", "dev": true, "peerDependencies": { "@stencil/core": ">=1.8.0" @@ -16390,9 +16390,9 @@ "dev": true }, "@stencil/vue-output-target": { - "version": "0.2.5", - "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.2.5.tgz", - "integrity": "sha512-EnCZbJDD7y2nTnaFXo4PJrEgP9CNvJARZQrnvz93rMDKCzm+19C9goU4D6A1ysblLVvZSTm3wELKSM1auRUm0Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.3.0.tgz", + "integrity": "sha512-uiBe+o7M+NU0gMRgJfrlepxLPBXK0lX4TL2jIPwhBfxYw++pbtg7BLRO2HxE69GR0nxw+7Uf3uJzOGbMsl+ZUQ==", "dev": true }, "@stylelint/postcss-css-in-js": { diff --git a/core/package.json b/core/package.json index 3df1d70887..49c6b80888 100644 --- a/core/package.json +++ b/core/package.json @@ -38,7 +38,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", diff --git a/core/stencil.config.ts b/core/stencil.config.ts index bd1db3cddd..d331a5d8ca 100644 --- a/core/stencil.config.ts +++ b/core/stencil.config.ts @@ -91,12 +91,14 @@ export const config: Config = { { elements: ['ion-checkbox', 'ion-toggle'], targetAttr: 'checked', - event: 'ionChange' + event: 'v-ionChange', + externalEvent: 'ionChange' }, { elements: ['ion-datetime', 'ion-input', 'ion-radio-group', 'ion-radio', 'ion-range', 'ion-searchbar', 'ion-segment', 'ion-segment-button', 'ion-select', 'ion-textarea'], targetAttr: 'value', - event: 'ionChange' + event: 'v-ionChange', + externalEvent: 'ionChange' } ], }), diff --git a/packages/vue/src/ionic-vue.ts b/packages/vue/src/ionic-vue.ts index 9878dbd674..0e166d86fe 100644 --- a/packages/vue/src/ionic-vue.ts +++ b/packages/vue/src/ionic-vue.ts @@ -2,8 +2,17 @@ import { App, Plugin } from 'vue'; import { IonicConfig, setupConfig } from '@ionic/core'; import { applyPolyfills, defineCustomElements } from '@ionic/core/loader'; -const ael = (el: any, eventName: string, cb: any, opts: any) => el.addEventListener(eventName.toLowerCase(), cb, opts); -const rel = (el: any, eventName: string, cb: any, opts: any) => el.removeEventListener(eventName.toLowerCase(), cb, opts); +/** + * We need to make sure that the web component fires an event + * that will not conflict with the user's @ionChange binding, + * otherwise the binding's callback will fire before any + * v-model values have been updated. + */ +const transformEventName = (eventName: string) => { + return eventName === 'ionChange' ? 'v-ionchange' : eventName.toLowerCase(); +} +const ael = (el: any, eventName: string, cb: any, opts: any) => el.addEventListener(transformEventName(eventName), cb, opts); +const rel = (el: any, eventName: string, cb: any, opts: any) => el.removeEventListener(transformEventName(eventName), cb, opts); export const IonicVue: Plugin = { @@ -17,7 +26,7 @@ export const IonicVue: Plugin = { await applyPolyfills(); await defineCustomElements(window, { exclude: ['ion-tabs'], - ce: (eventName: string, opts: any) => new CustomEvent(eventName.toLowerCase(), opts), + ce: (eventName: string, opts: any) => new CustomEvent(transformEventName(eventName), opts), ael, rel } as any); diff --git a/packages/vue/src/proxies.ts b/packages/vue/src/proxies.ts index 2b1e03b932..e8bda1f50a 100644 --- a/packages/vue/src/proxies.ts +++ b/packages/vue/src/proxies.ts @@ -97,7 +97,8 @@ export const IonCheckbox = /*@__PURE__*/ defineContainer('ion-c ], { "modelProp": "checked", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -180,7 +181,8 @@ export const IonDatetime = /*@__PURE__*/ defineContainer('ion-d ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -294,7 +296,8 @@ export const IonInput = /*@__PURE__*/ defineContainer('ion-input', ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -445,7 +448,8 @@ export const IonRadio = /*@__PURE__*/ defineContainer('ion-radio', ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -457,7 +461,8 @@ export const IonRadioGroup = /*@__PURE__*/ defineContainer('i ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -481,7 +486,8 @@ export const IonRange = /*@__PURE__*/ defineContainer('ion-range', ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -551,7 +557,8 @@ export const IonSearchbar = /*@__PURE__*/ defineContainer('ion ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -567,7 +574,8 @@ export const IonSegment = /*@__PURE__*/ defineContainer('ion-seg ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -579,7 +587,8 @@ export const IonSegmentButton = /*@__PURE__*/ defineContainer('ion-selec ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -695,7 +705,8 @@ export const IonTextarea = /*@__PURE__*/ defineContainer('ion-t ], { "modelProp": "value", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); @@ -722,7 +733,8 @@ export const IonToggle = /*@__PURE__*/ defineContainer('ion-toggl ], { "modelProp": "checked", - "modelUpdateEvent": "ionChange" + "modelUpdateEvent": "v-ionChange", + "externalModelUpdateEvent": "ionChange" }); diff --git a/packages/vue/src/vue-component-lib/utils.ts b/packages/vue/src/vue-component-lib/utils.ts index 46a512d02f..e9a994c9a4 100644 --- a/packages/vue/src/vue-component-lib/utils.ts +++ b/packages/vue/src/vue-component-lib/utils.ts @@ -17,6 +17,7 @@ interface NavManager { interface ComponentOptions { modelProp?: string; modelUpdateEvent?: string; + externalModelUpdateEvent?: string; } const getComponentClasses = (classes: unknown) => { @@ -40,7 +41,7 @@ const getElementClasses = (ref: Ref, componentClasses: * integrations. */ export const defineContainer = (name: string, componentProps: string[] = [], componentOptions: ComponentOptions = {}) => { - const { modelProp, modelUpdateEvent } = componentOptions; + const { modelProp, modelUpdateEvent, externalModelUpdateEvent } = componentOptions; /** * Create a Vue component wrapper around a Web Component. @@ -66,8 +67,7 @@ export const defineContainer = (name: string, componentProps: string[] = * native web component, but the v-model will * not have been updated yet. */ - emit(modelUpdateEvent, e); - e.stopImmediatePropagation(); + emit(externalModelUpdateEvent, e); }); } }; @@ -112,7 +112,7 @@ export const defineContainer = (name: string, componentProps: string[] = ref: containerRef, class: getElementClasses(containerRef, classes), onClick: handleClick, - onVnodeBeforeMount: (modelUpdateEvent) ? onVnodeBeforeMount : undefined + onVnodeBeforeMount: (modelUpdateEvent && externalModelUpdateEvent) ? onVnodeBeforeMount : undefined }; if (modelProp) { @@ -130,7 +130,7 @@ export const defineContainer = (name: string, componentProps: string[] = Container.props = [...componentProps, ROUTER_LINK_VALUE]; if (modelProp) { Container.props.push(MODEL_VALUE); - Container.emits = [UPDATE_VALUE_EVENT, modelUpdateEvent]; + Container.emits = [UPDATE_VALUE_EVENT, externalModelUpdateEvent]; } return Container; From cb2c9b63e848359b473d69856dbc3e37f6073cdf Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 4 Feb 2021 11:13:52 -0500 Subject: [PATCH 4/5] 5.5.4 --- CHANGELOG.md | 13 +++++++++++++ angular/package-lock.json | 10 +++++----- angular/package.json | 4 ++-- core/package-lock.json | 4 ++-- core/package.json | 2 +- docs/package.json | 2 +- packages/angular-server/package-lock.json | 10 +++++----- packages/angular-server/package.json | 4 ++-- packages/react-router/package.json | 10 +++++----- packages/react/package.json | 4 ++-- packages/vue-router/package-lock.json | 4 ++-- packages/vue-router/package.json | 2 +- packages/vue/package-lock.json | 10 +++++----- packages/vue/package.json | 4 ++-- 14 files changed, 48 insertions(+), 35 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 79510330d0..1cb51fe181 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,16 @@ +## [5.5.4](https://github.com/ionic-team/ionic/compare/v5.5.3...v5.5.4) (2021-02-04) + + +### Bug Fixes + +* **angular:** update ngAdd schematic ([#22858](https://github.com/ionic-team/ionic/issues/22858)) ([487349f](https://github.com/ionic-team/ionic/commit/487349f02a41344db2478735d27bf79f2a1c99b3)) +* **app:** keyboard no longer hides when using contenteditable ([#22857](https://github.com/ionic-team/ionic/issues/22857)) ([b6b2d34](https://github.com/ionic-team/ionic/commit/b6b2d34fd446feb06cf0143946a014d19231a78e)), closes [#22856](https://github.com/ionic-team/ionic/issues/22856) +* **ios**: scroll assist no longer prevents first click event from firing ([#22845](https://github.com/ionic-team/ionic/issues/22845)) ([f7d4c21](https://github.com/ionic-team/ionic/commit/f7d4c21b64e27f9b655bc1ab2522d6357dc6010f)), closes [#21871](https://github.com/ionic-team/ionic/issues/21871) +* **select:** class on component now indicates when select is open ([#22846](https://github.com/ionic-team/ionic/issues/22846)) ([1a5accc](https://github.com/ionic-team/ionic/commit/1a5accc5f707f84063469c0bd3e5e153489f1e5d)), closes [#22801](https://github.com/ionic-team/ionic/issues/22801) +* **vue:** ionChange events now propagate correctly ([#22872](https://github.com/ionic-team/ionic/issues/22872)) ([ff0f1da](https://github.com/ionic-team/ionic/commit/ff0f1da9f11915b48c4258af7c48c4513785f3fc)), closes [#22870](https://github.com/ionic-team/ionic/issues/22870) + + + ## [5.5.3](https://github.com/ionic-team/ionic/compare/v5.5.2...v5.5.3) (2021-01-28) diff --git a/angular/package-lock.json b/angular/package-lock.json index 58de2cd451..3a27f20ddb 100644 --- a/angular/package-lock.json +++ b/angular/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/angular", - "version": "5.5.3", + "version": "5.5.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/angular", - "version": "5.5.3", + "version": "5.5.4", "license": "MIT", "dependencies": { "@ionic/core": "file:../core", @@ -43,7 +43,7 @@ } }, "../core": { - "version": "5.5.2", + "version": "5.5.3", "license": "MIT", "dependencies": { "ionicons": "^5.1.2", @@ -54,7 +54,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", @@ -5179,7 +5179,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", diff --git a/angular/package.json b/angular/package.json index 1681736f07..c7a610b779 100644 --- a/angular/package.json +++ b/angular/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/angular", - "version": "5.5.3", + "version": "5.5.4", "description": "Angular specific wrappers for @ionic/core", "keywords": [ "ionic", @@ -42,7 +42,7 @@ "validate": "npm i && npm run lint && npm run test && npm run build" }, "dependencies": { - "@ionic/core": "5.5.3", + "@ionic/core": "5.5.4", "tslib": "^1.9.3" }, "peerDependencies": { diff --git a/core/package-lock.json b/core/package-lock.json index de95ebcd10..8ce5922d47 100644 --- a/core/package-lock.json +++ b/core/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/core", - "version": "5.5.3", + "version": "5.5.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/core", - "version": "5.5.3", + "version": "5.5.4", "license": "MIT", "dependencies": { "ionicons": "^5.1.2", diff --git a/core/package.json b/core/package.json index 49c6b80888..e52f75c0bc 100644 --- a/core/package.json +++ b/core/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/core", - "version": "5.5.3", + "version": "5.5.4", "description": "Base components for Ionic", "keywords": [ "ionic", diff --git a/docs/package.json b/docs/package.json index b5ba2e3e8b..a8c22e1875 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/docs", - "version": "5.5.3", + "version": "5.5.4", "description": "Pre-packaged API documentation for the Ionic docs.", "main": "core.json", "types": "core.d.ts", diff --git a/packages/angular-server/package-lock.json b/packages/angular-server/package-lock.json index 80cb59478b..6dcf1059af 100644 --- a/packages/angular-server/package-lock.json +++ b/packages/angular-server/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/angular-server", - "version": "5.5.3", + "version": "5.5.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/angular-server", - "version": "5.5.3", + "version": "5.5.4", "license": "MIT", "devDependencies": { "@angular/animations": "8.2.13", @@ -32,7 +32,7 @@ } }, "../../core": { - "version": "5.5.2", + "version": "5.5.3", "dev": true, "license": "MIT", "dependencies": { @@ -44,7 +44,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", @@ -5440,7 +5440,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json index 4c8edd1ad5..0134282494 100644 --- a/packages/angular-server/package.json +++ b/packages/angular-server/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/angular-server", - "version": "5.5.3", + "version": "5.5.4", "description": "Angular SSR Module for Ionic", "keywords": [ "ionic", @@ -49,7 +49,7 @@ "@angular/core": "8.2.13", "@angular/platform-browser": "8.2.13", "@angular/platform-server": "8.2.13", - "@ionic/core": "5.5.3", + "@ionic/core": "5.5.4", "ng-packagr": "5.7.1", "tslint": "^5.12.1", "tslint-ionic-rules": "0.0.21", diff --git a/packages/react-router/package.json b/packages/react-router/package.json index 8923eade6f..df46804d85 100644 --- a/packages/react-router/package.json +++ b/packages/react-router/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/react-router", - "version": "5.5.3", + "version": "5.5.4", "description": "React Router wrapper for @ionic/react", "keywords": [ "ionic", @@ -39,16 +39,16 @@ "tslib": "*" }, "peerDependencies": { - "@ionic/core": "5.5.3", - "@ionic/react": "5.5.3", + "@ionic/core": "5.5.4", + "@ionic/react": "5.5.4", "react": ">=16.8.6", "react-dom": ">=16.8.6", "react-router": "^5.0.1", "react-router-dom": "^5.0.1" }, "devDependencies": { - "@ionic/core": "5.5.3", - "@ionic/react": "5.5.3", + "@ionic/core": "5.5.4", + "@ionic/react": "5.5.4", "@rollup/plugin-node-resolve": "^8.1.0", "@testing-library/jest-dom": "^5.11.6", "@testing-library/react": "^11.2.2", diff --git a/packages/react/package.json b/packages/react/package.json index 4c342d2c40..b495b19eb4 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/react", - "version": "5.5.3", + "version": "5.5.4", "description": "React specific wrapper for @ionic/core", "keywords": [ "ionic", @@ -39,7 +39,7 @@ "css/" ], "dependencies": { - "@ionic/core": "5.5.3", + "@ionic/core": "5.5.4", "ionicons": "^5.1.2", "tslib": "*" }, diff --git a/packages/vue-router/package-lock.json b/packages/vue-router/package-lock.json index ef3df7b6ac..d4377c0248 100644 --- a/packages/vue-router/package-lock.json +++ b/packages/vue-router/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/vue-router", - "version": "5.5.3", + "version": "5.5.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/vue-router", - "version": "5.5.3", + "version": "5.5.4", "license": "MIT", "dependencies": { "@ionic/core": "file:../../core" diff --git a/packages/vue-router/package.json b/packages/vue-router/package.json index 578fc8339b..d8443ee54e 100644 --- a/packages/vue-router/package.json +++ b/packages/vue-router/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/vue-router", - "version": "5.5.3", + "version": "5.5.4", "description": "Vue Router integration for @ionic/vue", "scripts": { "test.spec": "jest", diff --git a/packages/vue/package-lock.json b/packages/vue/package-lock.json index b8a57ace14..17b7ef4d4b 100644 --- a/packages/vue/package-lock.json +++ b/packages/vue/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/vue", - "version": "5.5.3", + "version": "5.5.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/vue", - "version": "5.5.3", + "version": "5.5.4", "license": "MIT", "dependencies": { "@ionic/core": "file:../../core", @@ -23,7 +23,7 @@ } }, "../../core": { - "version": "5.5.2", + "version": "5.5.3", "license": "MIT", "dependencies": { "ionicons": "^5.1.2", @@ -34,7 +34,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", @@ -589,7 +589,7 @@ "@rollup/plugin-virtual": "^2.0.3", "@stencil/core": "2.1.2", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "0.2.5", + "@stencil/vue-output-target": "0.3.0", "@types/jest": "^26.0.10", "@types/node": "^14.6.0", "@types/puppeteer": "3.0.1", diff --git a/packages/vue/package.json b/packages/vue/package.json index 584b4f073a..a5e61748e5 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/vue", - "version": "5.5.3", + "version": "5.5.4", "description": "Vue specific wrapper for @ionic/core", "scripts": { "lint": "echo add linter", @@ -56,7 +56,7 @@ "vue-router": "^4.0.0-rc.4" }, "dependencies": { - "@ionic/core": "5.5.3", + "@ionic/core": "5.5.4", "ionicons": "^5.1.2" }, "vetur": { From 8cb2ea680428c132641b015e890abcfda9453972 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 5 Feb 2021 12:55:57 -0500 Subject: [PATCH 5/5] test(): update modal dark theme, fix styles test (#22884) --- .../themes/test/css-variables/css/dark.css | 12 ++++++++--- .../themes/test/css-variables/css/toolbar.css | 6 +++--- core/src/themes/test/css-variables/index.html | 21 +++++++++++++------ 3 files changed, 27 insertions(+), 12 deletions(-) diff --git a/core/src/themes/test/css-variables/css/dark.css b/core/src/themes/test/css-variables/css/dark.css index 2f95414a7f..ef0b5f8bc9 100644 --- a/core/src/themes/test/css-variables/css/dark.css +++ b/core/src/themes/test/css-variables/css/dark.css @@ -63,7 +63,7 @@ --ion-color-light-tint: #383a3e; } -.ios { +.ios body { --ion-background-color: #000000; --ion-background-color-rgb: 0,0,0; @@ -96,7 +96,7 @@ --ion-toolbar-color: #fff; } -.md { +.md body { --ion-background-color: #121212; --ion-background-color-rgb: 18,18,18; @@ -126,4 +126,10 @@ --ion-color-step-950: #f3f3f3; --ion-item-background: #1a1b1e; -} \ No newline at end of file +} + +ion-modal.ios { + --ion-background-color: var(--ion-color-step-100); + --ion-toolbar-background: var(--ion-color-step-150); + --ion-toolbar-border-color: var(--ion-color-step-250); +} diff --git a/core/src/themes/test/css-variables/css/toolbar.css b/core/src/themes/test/css-variables/css/toolbar.css index 693e988e70..4c37eb8a21 100644 --- a/core/src/themes/test/css-variables/css/toolbar.css +++ b/core/src/themes/test/css-variables/css/toolbar.css @@ -16,11 +16,11 @@ --ion-toolbar-color: var(--ion-color-light); } -.md { +.md body { --ion-toolbar-segment-color: rgba(var(--ion-color-light-rgb), .7); --ion-toolbar-segment-color-checked: var(--ion-color-light); } -.ios { +.ios body { --ion-toolbar-segment-color-checked: var(--ion-color-primary); -} \ No newline at end of file +} diff --git a/core/src/themes/test/css-variables/index.html b/core/src/themes/test/css-variables/index.html index 64d1e7b1e2..e3337995c0 100644 --- a/core/src/themes/test/css-variables/index.html +++ b/core/src/themes/test/css-variables/index.html @@ -921,22 +921,31 @@ // create component to open const element = document.createElement('div'); element.innerHTML = ` - + Super Modal - -

Content of doom

-
Here's some more content
- Dismiss Modal + + + + Super Modal + + +
+

Content of doom

+
Here's some more content
+ Dismiss Modal +
`; // present the modal const modalElement = Object.assign(document.createElement('ion-modal'), { - component: element + component: element, + swipeToClose: true, + presentingElement: document.querySelector('ion-tabs') }); // listen for close event