ion-menu-toggle.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. /*!
  2. * (C) Ionic http://ionicframework.com - MIT License
  3. */
  4. import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
  5. import { m as menuController } from './index5.js';
  6. import { b as getIonMode } from './ionic-global.js';
  7. import { u as updateVisibility } from './menu-toggle-util.js';
  8. const menuToggleCss = ":host(.menu-toggle-hidden){display:none}";
  9. const IonMenuToggleStyle0 = menuToggleCss;
  10. const MenuToggle = /*@__PURE__*/ proxyCustomElement(class MenuToggle extends HTMLElement {
  11. constructor() {
  12. super();
  13. this.__registerHost();
  14. this.__attachShadow();
  15. this.onClick = () => {
  16. return menuController.toggle(this.menu);
  17. };
  18. this.visible = false;
  19. this.menu = undefined;
  20. this.autoHide = true;
  21. }
  22. connectedCallback() {
  23. this.visibilityChanged();
  24. }
  25. async visibilityChanged() {
  26. this.visible = await updateVisibility(this.menu);
  27. }
  28. render() {
  29. const mode = getIonMode(this);
  30. const hidden = this.autoHide && !this.visible;
  31. return (h(Host, { key: '88e88fa13ac7f10ba3acfe378bd11cda0c7e2749', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
  32. [mode]: true,
  33. 'menu-toggle-hidden': hidden,
  34. } }, h("slot", { key: '0a14c7b63eda64702d2fd1b4bc7db4809892842d' })));
  35. }
  36. static get style() { return IonMenuToggleStyle0; }
  37. }, [1, "ion-menu-toggle", {
  38. "menu": [1],
  39. "autoHide": [4, "auto-hide"],
  40. "visible": [32]
  41. }, [[16, "ionMenuChange", "visibilityChanged"], [16, "ionSplitPaneVisible", "visibilityChanged"]]]);
  42. function defineCustomElement$1() {
  43. if (typeof customElements === "undefined") {
  44. return;
  45. }
  46. const components = ["ion-menu-toggle"];
  47. components.forEach(tagName => { switch (tagName) {
  48. case "ion-menu-toggle":
  49. if (!customElements.get(tagName)) {
  50. customElements.define(tagName, MenuToggle);
  51. }
  52. break;
  53. } });
  54. }
  55. const IonMenuToggle = MenuToggle;
  56. const defineCustomElement = defineCustomElement$1;
  57. export { IonMenuToggle, defineCustomElement };