bromcom-ui 2.10.1-rc.0 → 2.10.1-rc.2

package/dist/cjs/bcm-icon.cjs.entry.js

@@ -1,39 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-c591ecec.js');
-
-const iconCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}.bcm-icon.hidden{display:none}";
-
-const customIconList = {
-  "message-bot": "message-bot.svg",
-};
-const BcmIcon = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.hidden = false;
-    this.icon = undefined;
-  }
-  getIcon() {
-    const { icon } = this;
-    if (icon in customIconList) {
-      const _icon = index.getAssetPath("./static/" + customIconList[icon]);
-      return (index.h("div", { class: "tw-flex tw-h-fit tw-w-fit tw-items-center tw-justify-center" }, index.h("img", { src: `${_icon}`, alt: icon, class: "tw-h-fit tw-w-fit" })));
-    }
-    return index.h("i", { class: `${icon}` });
-  }
-  render() {
-    const { /*icon,*/ hidden } = this;
-    return index.h(index.Host, { class: `bcm-icon fa ${hidden ? "hidden" : ""}` }, this.getIcon());
-  }
-  static get assetsDirs() { return ["static"]; }
-  get el() { return index.getElement(this); }
-};
-BcmIcon.style = iconCss;
-
-exports.bcm_icon = BcmIcon;

package/dist/cjs/bcm-label_2.cjs.entry.js

@@ -1,126 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-c591ecec.js');
-const index$1 = require('./index-95ae50d0.js');
-const generate = require('./generate-e214b3de.js');
-const bcm = require('./bcm-489c9b1a.js');
-const labelTemplate = require('./label-template-d9bee58a.js');
-require('./color-helper-c3a819ea.js');
-require('./datetime-helper-eaf4fadb.js');
-require('./number-helper-3a911c0f.js');
-require('./string-helper-f9184277.js');
-require('./validators-910556c5.js');
-const tooltipHelper = require('./tooltip-helper-410ac258.js');
-require('./element-dragger-a8562f82.js');
-require('./_commonjsHelpers-ed84c3ca.js');
-require('./package-f9f70acc.js');
-require('./colors-078851ec.js');
-require('./slot-template-c8e2816c.js');
-require('./colors-56282b00.js');
-require('./utils-fc077139.js');
-require('./floating-ui-21890d11.js');
-
-const labelCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}";
-
-const BcmLabel = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this._id = generate.Generate.UID();
-    this.required = false;
-    this.value = undefined;
-    this.size = "medium";
-    this.form = undefined;
-    this.htmlFor = undefined;
-    this.hidden = false;
-    this.type = bcm.Bcm.Status.default;
-    this.tooltip = undefined;
-  }
-  render() {
-    const { required, value, size, form, htmlFor, hidden, type, tooltip } = this;
-    const hostClasses = index$1.classnames('bcm-label', { hidden });
-    const Label = (index.h(labelTemplate.LabelTemplate, { form: form, htmlFor: htmlFor, value: value, size: size, type: type, required: required }));
-    return (index.h(index.Host, { class: hostClasses }, Label, tooltip && (index.h("bcm-tooltip", { message: tooltip, placement: 'top', trigger: 'hover' }, index.h("bcm-icon", { icon: "far fa-question-circle" })))));
-  }
-  get el() { return index.getElement(this); }
-};
-BcmLabel.style = labelCss;
-
-const BcmTooltip = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.bcmTooltipShow = index.createEvent(this, "bcmTooltipShow", 7);
-    this.bcmTooltipHide = index.createEvent(this, "bcmTooltipHide", 7);
-    this._id = generate.Generate.UID();
-    this.message = "";
-    this.placement = bcm.Bcm$1.Placement.top;
-    this.trigger = bcm.Bcm$1.TriggerType.click;
-    this.open = false;
-    this.color = "slate";
-    this.size = bcm.Bcm$1.Size.medium;
-    this.openDelay = 0;
-    this.closeDelay = 0;
-    this.autoHide = false;
-    this.targetId = undefined;
-    this.tooltip = undefined;
-  }
-  emitShow() {
-    this.bcmTooltipShow.emit();
-  }
-  emitHide() {
-    this.bcmTooltipHide.emit();
-  }
-  connectedCallback() {
-    this.tooltip = new tooltipHelper.Tooltip({
-      targetId: this.targetId || this._id,
-      message: this.message,
-      placement: this.placement,
-      color: this.color,
-      trigger: this.trigger,
-      size: this.size,
-      openDelay: this.openDelay,
-      closeDelay: this.closeDelay,
-      autoHide: this.autoHide,
-      emitShow: () => this.emitShow(),
-      emitHide: () => this.emitHide(),
-    });
-  }
-  componentDidLoad() {
-    this.tooltip.listener();
-  }
-  componentDidRender() {
-    this.tooltip.message = this.message;
-    this.tooltip.placement = this.placement;
-    this.tooltip.color = this.color;
-    this.tooltip.trigger = this.trigger;
-    this.tooltip.size = this.size;
-    this.tooltip.openDelay = this.openDelay;
-    this.tooltip.closeDelay = this.closeDelay;
-    this.tooltip.autoHide = this.autoHide;
-    this.tooltip.update();
-  }
-  disconnectedCallback() {
-    this.tooltip.destroy();
-  }
-  async show() {
-    this.tooltip.show();
-  }
-  async hide() {
-    this.tooltip.hide();
-  }
-  async toggle() {
-    this.tooltip.toggle();
-  }
-  render() {
-    return (index.h(index.Host, { class: "tw-inline-flex tw-h-fit tw-w-fit", role: "tooltip", "aria-hidden": "true" }, index.h("slot", null)));
-  }
-  get el() { return index.getElement(this); }
-};
-
-exports.bcm_label = BcmLabel;
-exports.bcm_tooltip = BcmTooltip;

package/dist/cjs/bcm-linked.cjs.entry.js

@@ -1,219 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-c591ecec.js');
-require('./color-helper-c3a819ea.js');
-require('./datetime-helper-eaf4fadb.js');
-const generate = require('./generate-e214b3de.js');
-require('./number-helper-3a911c0f.js');
-require('./string-helper-f9184277.js');
-require('./validators-910556c5.js');
-require('./element-dragger-a8562f82.js');
-const utils = require('./utils-fc077139.js');
-const floatingUi = require('./floating-ui-21890d11.js');
-const bcm = require('./bcm-489c9b1a.js');
-require('./colors-56282b00.js');
-require('./colors-078851ec.js');
-require('./_commonjsHelpers-ed84c3ca.js');
-require('./package-f9f70acc.js');
-
-const BcmLinked = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.bcmOpen = index.createEvent(this, "bcm-open", 7);
-    this._id = generate.Generate.UID();
-    this.placement = bcm.Bcm$1.Placement["bottom-start"];
-    this.trigger = bcm.Bcm$1.TriggerType.click;
-    this.targetId = "";
-    this.height = undefined;
-    this.maxHeight = undefined;
-    this.minHeight = "50px";
-    this.isOpen = false;
-    this.hideDelay = 500;
-    this.isMouseOverLink = false;
-    window.addEventListener("scroll", () => this.calculatePosition(), true);
-    window.addEventListener("wheel", () => this.calculatePosition(), true);
-    window.addEventListener("resize", () => this.calculatePosition(), true);
-  }
-  target() {
-    const target = document.querySelectorAll(`[id="${this.targetId}"]`);
-    if (target.length > 0) {
-      target.length > 1 && console.warn(`[bcm-linked] - Target id "${this.targetId}" is duplicated`);
-      return target[0];
-    }
-    else {
-      // console.warn(`[bcm-linked] - id="${this._id}" was removed from the dom because id="${this.targetId}" could not be found.`);
-      this.el.remove();
-      return null;
-    }
-  }
-  detectClone() {
-    const linked = document.querySelectorAll(`[target-id="${this.targetId}"]`);
-    if (linked.length > 0) {
-      linked.forEach((item) => {
-        if (item.id !== this._id) {
-          console.warn(`[bcm-linked] - id="${this._id}" was removed from the dom because id="${this.targetId}" is duplicated.`);
-          item.remove();
-        }
-      });
-    }
-  }
-  dismissEvent() {
-    document.dispatchEvent(new CustomEvent("linked-data-dismiss", { detail: { id: this._id } }));
-  }
-  checkDataDismiss(e) {
-    generate.Generate.findEventPathHasAttribute(e, "data-dismiss") && this.dismissEvent();
-  }
-  hideChildLinked() {
-    this.el.querySelectorAll("[is-linked][linked-is-open]").forEach(item => {
-      var _a;
-      (_a = document.querySelector(`#${item.getAttribute("is-linked")}[is-open]`)) === null || _a === void 0 ? void 0 : _a.hide(false);
-    });
-  }
-  calculatePosition() {
-    const el = this.el;
-    if (el && this.target()) {
-      if (this.isOpen) {
-        floatingUi.FloatingUI({
-          ref: this.target(),
-          floating: el,
-          placement: this.placement,
-          offset: 4,
-          autoHidden: el.getAttribute("main-linked") === "true" ? false : true,
-          autoSize: true,
-          style: {
-            height: this.height,
-            maxHeight: this.maxHeight,
-            minHeight: this.minHeight,
-          },
-        });
-      }
-      else {
-        el.style.visibility = "hidden";
-        el.style.opacity = "0";
-      }
-    }
-  }
-  init() {
-    const target = this.target();
-    this.trigger === bcm.Bcm$1.TriggerType.hover && this.listenMouseOver();
-    if (target) {
-      target.setAttribute("is-linked", this.el.id);
-      if (!generate.Generate.getAncestor(target, "bcm-linked")) {
-        this.el.setAttribute("main-linked", "true");
-      }
-      else {
-        this.el.removeAttribute("main-linked");
-      }
-    }
-  }
-  componentDidLoad() {
-    this.init();
-  }
-  triggerWatch(newValue) {
-    if (newValue === bcm.Bcm$1.TriggerType.hover) {
-      this.listenMouseOver();
-    }
-  }
-  watchIsOpen() {
-    this.bcmOpen.emit(this.isOpen);
-  }
-  onLinkedDataDismis() {
-    this.hide(false);
-  }
-  onBcmFloatingIsHide(e) {
-    if (e.detail.id === this._id) {
-      this.hide(false);
-    }
-  }
-  async show(wait = true) {
-    wait && (await utils.delay(50));
-    this.detectClone();
-    const target = this.target();
-    if (target) {
-      const bcmOverlayContainer = document.querySelector("#bcm-overlay-container");
-      bcmOverlayContainer.appendChild(this.el);
-      target.setAttribute("linked-is-open", "true");
-      this.isOpen = true;
-      this.calculatePosition();
-    }
-    else {
-      this.hide(false);
-    }
-    return this.isOpen;
-  }
-  async hide(wait = true) {
-    wait && (await utils.delay(50));
-    const target = this.target();
-    this.isMouseOverLink = false;
-    if (target) {
-      target.removeAttribute("linked-is-open");
-      this.hideChildLinked();
-      this.isOpen = false;
-    }
-    return this.isOpen;
-  }
-  async toggle(wait = true) {
-    return this.isOpen ? await this.hide(wait) : await this.show(wait);
-  }
-  clickListener(e) {
-    if (!this.target())
-      return;
-    if (this.trigger === bcm.Bcm$1.TriggerType.hover || this.trigger === bcm.Bcm$1.TriggerType.custom)
-      return;
-    const isTarget = generate.Generate.findEventPath(e, this.target());
-    const isSelf = generate.Generate.findEventPath(e, this.el);
-    const isLinked = generate.Generate.findEventPathWithNodeName(e, "BCM-LINKED");
-    if (!isTarget && !isSelf && !isLinked) {
-      this.hide();
-      this.bcmOpen.emit(this.isOpen);
-      return;
-    }
-    if (this.isOpen) {
-      isTarget && this.hide(false);
-      isSelf && this.checkDataDismiss(e);
-      if (this.el.getAttribute("main-linked") === "true" && !isTarget && !isSelf && !isLinked) {
-        this.dismissEvent();
-      }
-    }
-    else {
-      isTarget && this.show(false);
-    }
-  }
-  listenMouseOver() {
-    var _a, _b;
-    this.el.addEventListener("mouseover", () => (this.isMouseOverLink = true));
-    this.el.addEventListener("mouseleave", () => {
-      this.isMouseOverLink = false;
-      this.handleMouseLeave();
-    });
-    (_a = this.target()) === null || _a === void 0 ? void 0 : _a.addEventListener("mouseenter", this.handleMouseEnter.bind(this));
-    (_b = this.target()) === null || _b === void 0 ? void 0 : _b.addEventListener("mouseleave", this.handleMouseLeave.bind(this));
-  }
-  handleMouseLeave() {
-    setTimeout(() => {
-      !this.isMouseOverLink && this.hide();
-    }, this.hideDelay);
-  }
-  handleMouseEnter() {
-    clearTimeout(this.timeoutId);
-    this.isMouseOverLink = false;
-    this.show();
-  }
-  render() {
-    const openStyle = this.isOpen ? { visibility: "visible", opacity: "1" } : { visibility: "hidden", opacity: "0" };
-    return (index.h(index.Host, { class: "tw-invisible tw-absolute tw-left-0 tw-top-0 tw-z-tooltip  tw-block tw-overscroll-contain  tw-scroll-smooth tw-rounded tw-bg-white  tw-opacity-0 tw-shadow tw-transition-opacity tw-duration-100", style: Object.assign(Object.assign({}, openStyle), { overflow: "auto" }) }, index.h("slot", null)));
-  }
-  get el() { return index.getElement(this); }
-  static get watchers() { return {
-    "trigger": ["triggerWatch"],
-    "isOpen": ["watchIsOpen"]
-  }; }
-};
-
-exports.bcm_linked = BcmLinked;