bromcom-ui 2.8.0-rc.10-d → 2.8.0-rc.10-e

package/dist/collection/components/other/modal-2/modal-2.js

@@ -1,450 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-    r = Reflect.decorate(decorators, target, key, desc);
-  else
-    for (var i = decorators.length - 1; i >= 0; i--)
-      if (d = decorators[i])
-        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { IsLoad } from "@bcm/decorator";
-import { Generate } from "@bcm/helpers";
-import { Bcm } from "@bcm/model";
-import { delay } from "@bcm/utils";
-import { Host, h } from "@stencil/core";
-import cs from "classnames";
-export class BcmModal2 {
-  constructor() {
-    this._id = Generate.UID();
-    this.isShow = false;
-    this.center = false;
-    this.zIndex = "10400";
-    this.size = Bcm.Size.medium;
-    this.backdrop = true;
-    this.fullWidth = false;
-    this.fullScreen = false;
-    this.overflow = true;
-    this.isShowModal = false;
-    this.shake = false;
-  }
-  // Listen to the click event on the component and its children
-  handleClick(e) {
-    // Check if the click event is triggered on a child element with "data-dismiss" attribute
-    const dismiss = Generate.findEventPathHasAttribute(e, "data-dismiss");
-    // Check if the click event is triggered on the overlay element and backdrop is "static"
-    const target = e.target;
-    const isClickOverlay = target.attributes.getNamedItem("is-click-overlay");
-    if (isClickOverlay && this.backdrop === "static") {
-      // Shake the modal if the overlay is clicked and backdrop is "static"
-      this.shakeModal();
-    }
-    else if (dismiss || isClickOverlay) {
-      // Hide the modal if the "data-dismiss" element is clicked
-      this.hide();
-      e.preventDefault();
-      e.stopPropagation();
-    }
-  }
-  // Listen to the keydown event on the document element
-  handleKeyDown(ev) {
-    // Get the top modal in the DOM with "is-show" attribute
-    const topModal = Array.from(document.querySelectorAll("bcm-modal-2[is-show]")).pop();
-    if (topModal !== this.el) {
-      return;
-    }
-    if (ev.key === "Escape") {
-      if (this.backdrop === "static") {
-        // Shake the modal if the backdrop is "static" and Escape key is pressed
-        this.shakeModal();
-      }
-      else {
-        // Hide the modal if Escape key is pressed
-        this.hide();
-      }
-      ev.preventDefault();
-      ev.stopPropagation();
-      ev.stopImmediatePropagation();
-    }
-  }
-  // Shake the modal by toggling "shake" state
-  shakeModal() {
-    this.shake = true;
-    setTimeout(() => (this.shake = false), 300);
-  }
-  // Hide the modal by emitting "bcm-modal-before-close" event
-  async hide() {
-    this.modalBeforeClose.emit();
-  }
-  // Listen to "bcm-modal-before-close" event and hide the modal if defaultPrevented is not set
-  async hideModal(e) {
-    if (e.defaultPrevented) {
-      return;
-    }
-    if (e.target === this.el) {
-      this.isShowModal = false;
-      await delay(150);
-      this.isShow = false;
-      this.modalClose.emit();
-    }
-  }
-  // Show the modal by emitting "bcm-modal-before-open" event
-  async show() {
-    this.modalBeforeOpen.emit();
-  }
-  // Listen to "bcm-modal-before-open" event and show the modal if defaultPrevented is not set
-  async showModal(e) {
-    if (e.defaultPrevented) {
-      return;
-    }
-    if (e.target === this.el) {
-      this.isShow = true;
-      await delay(50);
-      this.isShowModal = true;
-      document.body.appendChild(this.el);
-      this.modalOpen.emit();
-    }
-  }
-  // Get the width of the modal based on the size
-  getWidth(size) {
-    const sizes = {
-      small: "576px",
-      medium: "768px",
-      large: "992px",
-      xlarge: "1024px",
-      xxlarge: "1200px",
-      xxxlarge: "1700px",
-    };
-    return sizes[size] || size;
-  }
-  // Get the modal size
-  setSize() {
-    const { fullScreen, fullWidth, size, overflow } = this;
-    let minHeight = "auto";
-    let height = "auto";
-    let width = fullWidth ? "100%" : this.getWidth(size);
-    if (fullScreen) {
-      height = overflow ? "100vh" : "auto";
-      width = "100vw";
-      minHeight = "100vh";
-    }
-    return { width, minHeight, height };
-  }
-  render() {
-    return (h(Host, { class: { "tw-hidden": !this.isShow } }, h("bcm-overlay", { "z-index": +this.zIndex - 1, opacity: this.isShowModal ? "0.5" : "0" }), h("div", { class: cs("tw-fixed tw-inset-0", "tw-flex tw-h-full tw-w-full tw-items-start tw-justify-center", "tw-overflow-y-scroll tw-overscroll-contain tw-font-sans", this.center ? "tw-items-center" : ""), style: {
-        zIndex: this.zIndex,
-      }, "is-click-overlay": true }, h("div", { class: cs("tw-flex tw-w-full tw-flex-col", "tw-relative tw-z-modal tw-bg-white", "tw--translate-y-[20px] tw-transform tw-opacity-0 tw-transition tw-duration-300 tw-ease-in-out", this.fullScreen ? "" : `tw-m-4 tw-rounded-lg ${this.overflow ? "tw-max-h-[90vh]" : ""} `, this.shake ? "tw-animate-shake" : ""), style: Object.assign(Object.assign({}, this.setSize()), (this.isShowModal
-        ? {
-          transform: "translateY(0)",
-          opacity: "1",
-        }
-        : {})) }, h("slot", { name: "header" }), h("bcm-scroll-area", { "is-disabled": !this.overflow }, h("slot", null)), h("slot", { name: "footer" })))));
-  }
-  static get is() { return "bcm-modal-2"; }
-  static get properties() {
-    return {
-      "_id": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "id",
-        "reflect": true,
-        "defaultValue": "Generate.UID()"
-      },
-      "isShow": {
-        "type": "boolean",
-        "mutable": true,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "is-show",
-        "reflect": true,
-        "defaultValue": "false"
-      },
-      "center": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "center",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "zIndex": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "z-index",
-        "reflect": false,
-        "defaultValue": "\"10400\""
-      },
-      "size": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "size",
-        "reflect": false,
-        "defaultValue": "Bcm.Size.medium"
-      },
-      "backdrop": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean | \"static\"",
-          "resolved": "\"static\" | boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "backdrop",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "fullWidth": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "full-width",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "fullScreen": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "full-screen",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "overflow": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "overflow",
-        "reflect": false,
-        "defaultValue": "true"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "isShowModal": {},
-      "shake": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "modalClose",
-        "name": "bcm-modal-close",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "modalOpen",
-        "name": "bcm-modal-open",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "modalBeforeClose",
-        "name": "bcm-modal-before-close",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "modalBeforeOpen",
-        "name": "bcm-modal-before-open",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }];
-  }
-  static get methods() {
-    return {
-      "hide": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": []
-        }
-      },
-      "show": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
-  static get listeners() {
-    return [{
-        "name": "click",
-        "method": "handleClick",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "keydown",
-        "method": "handleKeyDown",
-        "target": "document",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "bcm-modal-before-close",
-        "method": "hideModal",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "bcm-modal-before-open",
-        "method": "showModal",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }];
-  }
-}
-__decorate([
-  IsLoad()
-], BcmModal2.prototype, "el", void 0);

package/dist/collection/components/other/overlay/overlay.js

@@ -1,101 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { Host, h } from "@stencil/core";
-import cs from "classnames";
-import colors from "tailwindcss/colors";
-export class BcmOverlay {
-  constructor() {
-    this.center = false;
-    this.color = colors.black;
-    this.opacity = "0.5";
-    this.zIndex = "10400";
-  }
-  render() {
-    return (h(Host, { class: cs("tw-fixed tw-inset-0 tw-transition", {
-        "tw-flex tw-items-center tw-justify-center": this.center,
-      }), style: {
-        backgroundColor: `${this.color}`,
-        opacity: this.opacity,
-        zIndex: this.zIndex,
-      } }, h("slot", null)));
-  }
-  static get is() { return "bcm-overlay"; }
-  static get properties() {
-    return {
-      "center": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "center",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "color": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "\"#000\"",
-          "resolved": "\"#000\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color",
-        "reflect": false,
-        "defaultValue": "colors.black"
-      },
-      "opacity": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "opacity",
-        "reflect": false,
-        "defaultValue": "\"0.5\""
-      },
-      "zIndex": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "z-index",
-        "reflect": false,
-        "defaultValue": "\"10400\""
-      }
-    };
-  }
-}

package/dist/collection/components/other/scroll-area/scroll-area.js

@@ -1,77 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { Host, h } from "@stencil/core";
-import cs from "classnames";
-export class BcmScrollArea {
-  constructor() {
-    this.width = "inherit";
-    this.height = "inherit";
-    this.isDisabled = false;
-  }
-  render() {
-    return (h(Host, { class: cs("tw-block", {
-        "tw-overflow-y-scroll tw-overscroll-contain": !this.isDisabled,
-      }), style: { width: this.width, height: this.height } }, h("slot", null)));
-  }
-  static get is() { return "bcm-scroll-area"; }
-  static get properties() {
-    return {
-      "width": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "width",
-        "reflect": false,
-        "defaultValue": "\"inherit\""
-      },
-      "height": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "height",
-        "reflect": false,
-        "defaultValue": "\"inherit\""
-      },
-      "isDisabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "is-disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-}