mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-16 10:01:59 +08:00
refactor(framework-delegate): conditionally use for host element for modal and nav
This commit is contained in:
48
packages/react/package-lock.json
generated
48
packages/react/package-lock.json
generated
@ -5,15 +5,15 @@
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
"@ionic/core": {
|
||||
"version": "0.0.2-30",
|
||||
"resolved": "https://registry.npmjs.org/@ionic/core/-/core-0.0.2-30.tgz",
|
||||
"integrity": "sha512-s5a8QEdUJzGNapsfRCi4oACz9bZ0jTFQ+zmOvBdy+KKBhDnQqGYNDRAz9ED/T/Vkvk7IqX/QCkWs1I5/xw3k2g==",
|
||||
"version": "0.0.2-32",
|
||||
"resolved": "https://registry.npmjs.org/@ionic/core/-/core-0.0.2-32.tgz",
|
||||
"integrity": "sha512-43Y6nzBM3HqnitRMcuXlX51XjfVDgHdQJQTf6Ybp+VXxJ6CxV/9cQ28XrvtESa40QRfCLHV5MRNwUajy7F4xJw==",
|
||||
"dev": true
|
||||
},
|
||||
"@stencil/core": {
|
||||
"version": "0.0.9-1",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-0.0.9-1.tgz",
|
||||
"integrity": "sha512-kCcLfolV2QMVu4iAzIBxiJ9L90jaLRZRvR8ureuDVoAjBQ+VSk7jS3kMGMjnPEHk8ctamj60tGvlkEzYbSmpkg==",
|
||||
"version": "0.1.1-0",
|
||||
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-0.1.1-0.tgz",
|
||||
"integrity": "sha512-F4frvyNcIJoWO+ht2Hw8nT7TS7IN0/WKx4vGUbdKWnSvIN4/V+gO5pu/Um3MccSEDFnp+VYMKEZk99scF2wX2g==",
|
||||
"requires": {
|
||||
"chokidar": "1.7.0",
|
||||
"jsdom": "11.3.0",
|
||||
@ -34,9 +34,9 @@
|
||||
}
|
||||
},
|
||||
"@types/node": {
|
||||
"version": "8.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-8.5.1.tgz",
|
||||
"integrity": "sha512-SrmAO+NhnsuG/6TychSl2VdxBZiw/d6V+8j+DFo8O3PwFi+QeYXWHhAw+b170aSc6zYab6/PjEWRZHIDN9mNUw=="
|
||||
"version": "8.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-8.5.5.tgz",
|
||||
"integrity": "sha512-JRnfoh0Ll4ElmIXKxbUfcOodkGvcNHljct6mO1X9hE/mlrMzAx0hYCLAD7sgT53YAY1HdlpzUcV0CkmDqUqTuA=="
|
||||
},
|
||||
"abab": {
|
||||
"version": "1.0.4",
|
||||
@ -49,22 +49,22 @@
|
||||
"integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
|
||||
},
|
||||
"acorn": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/acorn/-/acorn-5.2.1.tgz",
|
||||
"integrity": "sha512-jG0u7c4Ly+3QkkW18V+NRDN+4bWHdln30NL1ZL2AvFZZmQe/BfopYCtghCKKVBUSetZ4QKcyA0pY6/4Gw8Pv8w=="
|
||||
"version": "5.3.0",
|
||||
"resolved": "https://registry.npmjs.org/acorn/-/acorn-5.3.0.tgz",
|
||||
"integrity": "sha512-Yej+zOJ1Dm/IMZzzj78OntP/r3zHEaKcyNoU2lAaxPtrseM6rF0xwqoz5Q5ysAiED9hTjI2hgtvLXitlCN1/Ug=="
|
||||
},
|
||||
"acorn-globals": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-4.1.0.tgz",
|
||||
"integrity": "sha512-KjZwU26uG3u6eZcfGbTULzFcsoz6pegNKtHPksZPOUsiKo5bUmiBPa38FuHZ/Eun+XYh/JCCkS9AS3Lu4McQOQ==",
|
||||
"requires": {
|
||||
"acorn": "5.2.1"
|
||||
"acorn": "5.3.0"
|
||||
}
|
||||
},
|
||||
"ajv": {
|
||||
"version": "5.5.1",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.1.tgz",
|
||||
"integrity": "sha1-s4u4h22ehr7plJVqBOch6IskjrI=",
|
||||
"version": "5.5.2",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
|
||||
"integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=",
|
||||
"requires": {
|
||||
"co": "4.6.0",
|
||||
"fast-deep-equal": "1.0.0",
|
||||
@ -1532,7 +1532,7 @@
|
||||
"resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
|
||||
"integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=",
|
||||
"requires": {
|
||||
"ajv": "5.5.1",
|
||||
"ajv": "5.5.2",
|
||||
"har-schema": "2.0.0"
|
||||
}
|
||||
},
|
||||
@ -1793,7 +1793,7 @@
|
||||
"integrity": "sha512-aPZTDl4MplzQhx5bLztk6nzjbEslmO3Q3+z0WpCMutL1XJDhZIRzir6R1Y8S84LgeT/7jhQvgtUMkY6oPwvlUw==",
|
||||
"requires": {
|
||||
"abab": "1.0.4",
|
||||
"acorn": "5.2.1",
|
||||
"acorn": "5.3.0",
|
||||
"acorn-globals": "4.1.0",
|
||||
"array-equal": "1.0.0",
|
||||
"content-type-parser": "1.0.2",
|
||||
@ -1804,7 +1804,7 @@
|
||||
"html-encoding-sniffer": "1.0.2",
|
||||
"nwmatcher": "1.4.3",
|
||||
"parse5": "3.0.3",
|
||||
"pn": "1.0.0",
|
||||
"pn": "1.1.0",
|
||||
"request": "2.83.0",
|
||||
"request-promise-native": "1.0.5",
|
||||
"sax": "1.2.4",
|
||||
@ -2258,7 +2258,7 @@
|
||||
"resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz",
|
||||
"integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==",
|
||||
"requires": {
|
||||
"@types/node": "8.5.1"
|
||||
"@types/node": "8.5.5"
|
||||
}
|
||||
},
|
||||
"path-exists": {
|
||||
@ -2313,9 +2313,9 @@
|
||||
}
|
||||
},
|
||||
"pn": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/pn/-/pn-1.0.0.tgz",
|
||||
"integrity": "sha1-HPWjCw2AbNGPiPxBprXUrWFbO6k="
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz",
|
||||
"integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA=="
|
||||
},
|
||||
"prelude-ls": {
|
||||
"version": "1.1.2",
|
||||
@ -2595,7 +2595,7 @@
|
||||
"resolved": "https://registry.npmjs.org/rollup-plugin-commonjs/-/rollup-plugin-commonjs-8.2.5.tgz",
|
||||
"integrity": "sha512-RxzILEgDOFvUgnuPVXNCfZ5f7Mv6RlQ1OyW925kmWRCgmV2V+g6G5qmKUmgW2HUQxp0YqqvRkqbez4Q/o6fRog==",
|
||||
"requires": {
|
||||
"acorn": "5.2.1",
|
||||
"acorn": "5.3.0",
|
||||
"estree-walker": "0.5.1",
|
||||
"magic-string": "0.22.4",
|
||||
"resolve": "1.5.0",
|
||||
|
@ -33,8 +33,8 @@
|
||||
],
|
||||
"devDependencies": {
|
||||
"@ionic/core": "next",
|
||||
"react": "^16.2.0",
|
||||
"react-dom": "^16.2.0",
|
||||
"react": "latest",
|
||||
"react-dom": "latest",
|
||||
"typescript": "~2.5.2"
|
||||
},
|
||||
"dependencies": {
|
||||
|
@ -4,7 +4,9 @@ import ReactDOM from 'react-dom';
|
||||
import { FrameworkDelegate } from '@ionic/core';
|
||||
|
||||
export function attachViewToDom(parentElement: HTMLElement, reactComponent: any, propsOrData: any, classesToAdd: string[]) {
|
||||
const wrappingDiv = document.createElement('div');
|
||||
console.log('parentElement: ', parentElement);
|
||||
console.log('reactComponent: ', reactComponent);
|
||||
const wrappingDiv = shouldWrapInIonPage(parentElement) ? document.createElement('ion-page') : document.createElement('div');
|
||||
if (classesToAdd) {
|
||||
for (const clazz of classesToAdd) {
|
||||
wrappingDiv.classList.add(clazz);
|
||||
@ -22,7 +24,6 @@ export function attachViewToDom(parentElement: HTMLElement, reactComponent: any,
|
||||
reactElement: reactElement,
|
||||
instance: mountedComponentInstance
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
export function removeViewFromDom(parentElement: HTMLElement, childElement: HTMLElement): Promise<any> {
|
||||
@ -36,4 +37,12 @@ const Delegate: FrameworkDelegate = {
|
||||
removeViewFromDom: removeViewFromDom,
|
||||
};
|
||||
|
||||
export { Delegate }
|
||||
export { Delegate }
|
||||
|
||||
|
||||
export function shouldWrapInIonPage(element: HTMLElement) {
|
||||
if (element.tagName.toUpperCase() === 'ION-NAV' || element.classList.contains('modal-wrapper')) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
Reference in New Issue
Block a user