ion-reorder.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. /*!
  2. * (C) Ionic http://ionicframework.com - MIT License
  3. */
  4. import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
  5. import { r as reorderThreeOutline, s as reorderTwoSharp } from './index7.js';
  6. import { b as getIonMode } from './ionic-global.js';
  7. import { d as defineCustomElement$2 } from './icon.js';
  8. const reorderIosCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:2.125rem;opacity:0.4}";
  9. const IonReorderIosStyle0 = reorderIosCss;
  10. const reorderMdCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:1.9375rem;opacity:0.3}";
  11. const IonReorderMdStyle0 = reorderMdCss;
  12. const Reorder = /*@__PURE__*/ proxyCustomElement(class Reorder extends HTMLElement {
  13. constructor() {
  14. super();
  15. this.__registerHost();
  16. this.__attachShadow();
  17. }
  18. onClick(ev) {
  19. const reorderGroup = this.el.closest('ion-reorder-group');
  20. ev.preventDefault();
  21. // Only stop event propagation if the reorder is inside of an enabled
  22. // reorder group. This allows interaction with clickable children components.
  23. if (!reorderGroup || !reorderGroup.disabled) {
  24. ev.stopImmediatePropagation();
  25. }
  26. }
  27. render() {
  28. const mode = getIonMode(this);
  29. const reorderIcon = mode === 'ios' ? reorderThreeOutline : reorderTwoSharp;
  30. return (h(Host, { key: '17adf3165f4e09283d5d6434d7cd47bd23519048', class: mode }, h("slot", { key: 'd00d1cd97c689fc5c7b7175a2051cf697fe22871' }, h("ion-icon", { key: 'eec219aebde6083de98358be3e75965c5a5dc3d0', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
  31. }
  32. get el() { return this; }
  33. static get style() { return {
  34. ios: IonReorderIosStyle0,
  35. md: IonReorderMdStyle0
  36. }; }
  37. }, [33, "ion-reorder", undefined, [[2, "click", "onClick"]]]);
  38. function defineCustomElement$1() {
  39. if (typeof customElements === "undefined") {
  40. return;
  41. }
  42. const components = ["ion-reorder", "ion-icon"];
  43. components.forEach(tagName => { switch (tagName) {
  44. case "ion-reorder":
  45. if (!customElements.get(tagName)) {
  46. customElements.define(tagName, Reorder);
  47. }
  48. break;
  49. case "ion-icon":
  50. if (!customElements.get(tagName)) {
  51. defineCustomElement$2();
  52. }
  53. break;
  54. } });
  55. }
  56. const IonReorder = Reorder;
  57. const defineCustomElement = defineCustomElement$1;
  58. export { IonReorder, defineCustomElement };