fix(): update to Stencil One 🎉🎊

This commit is contained in:
Manu MA
2019-06-19 21:33:50 +02:00
committed by GitHub
parent 7f1829eb21
commit b40f7d36d5
572 changed files with 14833 additions and 10323 deletions

View File

@ -1,6 +1,6 @@
import { Component, ComponentInterface, Listen, Prop, State } from '@stencil/core';
import { Component, ComponentInterface, Listen, Prop, State, h } from '@stencil/core';
import { Mode } from '../../interface';
import { getIonMode } from '../../global/ionic-global';
@Component({
tag: 'ion-menu-toggle',
@ -8,7 +8,6 @@ import { Mode } from '../../interface';
shadow: true
})
export class MenuToggle implements ComponentInterface {
mode!: Mode;
@Prop({ context: 'document' }) doc!: Document;
@ -38,7 +37,7 @@ export class MenuToggle implements ComponentInterface {
@Listen('click')
async onClick() {
const menuCtrl = await getMenuController(this.doc);
const menuCtrl = await getMenuController(document);
if (menuCtrl) {
const menu = await menuCtrl.get(this.menu);
if (menu) {
@ -47,10 +46,10 @@ export class MenuToggle implements ComponentInterface {
}
}
@Listen('body:ionMenuChange')
@Listen('body:ionSplitPaneVisible')
@Listen('ionMenuChange', { target: 'body' })
@Listen('ionSplitPaneVisible', { target: 'body' })
async updateVisibility() {
const menuCtrl = await getMenuController(this.doc);
const menuCtrl = await getMenuController(document);
if (menuCtrl) {
const menu = await menuCtrl.get(this.menu);
if (menu && await menu.isActive()) {
@ -62,11 +61,12 @@ export class MenuToggle implements ComponentInterface {
}
hostData() {
const mode = getIonMode(this);
const hidden = this.autoHide && !this.visible;
return {
'aria-hidden': hidden ? 'true' : null,
class: {
[`${this.mode}`]: true,
[`${mode}`]: true,
'menu-toggle-hidden': hidden,
}
};

View File

@ -17,6 +17,19 @@ In case it's desired to keep `ion-menu-toggle` always visible, the `autoHide` pr
| `menu` | `menu` | Optional property that maps to a Menu's `menuId` prop. Can also be `start` or `end` for the menu side. This is used to find the correct menu to toggle. If this property is not used, `ion-menu-toggle` will toggle the first menu that is active. | `string \| undefined` | `undefined` |
## Dependencies
### Used by
- [ion-menu-button](../menu-button)
### Graph
```mermaid
graph TD;
ion-menu-button --> ion-menu-toggle
style ion-menu-toggle fill:#f9f,stroke:#333,stroke-width:4px
```
----------------------------------------------
*Built with [StencilJS](https://stenciljs.com/)*

View File

@ -8,8 +8,8 @@
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../scripts/testing/scripts.js"></script>
<script src="../../../../../dist/ionic.js"></script>
</head>
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
<body>
<ion-app>

View File

@ -8,8 +8,8 @@
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../scripts/testing/scripts.js"></script>
<script src="../../../../../dist/ionic.js"></script>
</head>
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
<body>
<ion-app>

View File

@ -8,8 +8,8 @@
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../scripts/testing/scripts.js"></script>
<script src="../../../../../dist/ionic.js"></script>
</head>
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
<body>
<ion-app>

View File

@ -8,8 +8,8 @@
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../scripts/testing/scripts.js"></script>
<script src="../../../../../dist/ionic.js"></script>
</head>
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
<body>
<ion-app>