bromcom-ui 2.7.37-rc.3 → 2.7.37-rc.4-0

package/dist/components/bcm-result.js

@@ -0,0 +1,105 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as classnames } from './index2.js';
+import { I as IsLoad } from './is-load-decorator.js';
+import { d as defineCustomElement$2 } from './icon.js';
+
+const statuses = {
+  success: {
+    icon: 'far fa-check-circle',
+    color: 'green-6'
+  },
+  info: {
+    icon: 'far fa-info-circle',
+    color: 'blue-6'
+  },
+  warning: {
+    icon: 'far fa-warning',
+    color: 'warmyellow-6'
+  },
+  error: {
+    icon: 'far fa-times-circle',
+    color: 'grey-10'
+  }
+};
+
+const resultCss = "@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}:host{display:block}:host(.hidden){display:none}.result{display:flex;flex-direction:column;align-items:center;padding:32px 24px}.result .content{margin-top:24px}.result .content .heading{margin-bottom:8px}.result .content .heading,.result .content .desc{display:block;text-align:center}.result .content .extra{background-color:#F5F5F5;padding:24px 24px;margin:32px 0}@media screen and (min-width: 576px){.result .content .extra{padding:24px 40px}}.result .content .buttons{display:flex;justify-content:center;grid-gap:8px;flex-wrap:wrap}";
+
+var __decorate = (undefined && undefined.__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;
+};
+const BcmResult$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.status = null;
+    this.hidden = false;
+  }
+  getIcon() {
+    if (this.status != null) {
+      const icon = statuses[this.status].icon;
+      return (h("div", { class: "icon" }, h("bcm-icon", { icon: icon })));
+    }
+  }
+  componentDidRender() {
+    const slot = this.el.shadowRoot.querySelector('slot').assignedElements();
+    slot.map(el => {
+      if (String(el.tagName).toLowerCase() === 'bcm-result-footer') {
+        el.slot = 'footer';
+        this.footerArea = true;
+        this.footerHtml = el.innerHTML;
+        el.innerHTML = "";
+      }
+    });
+  }
+  render() {
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("div", { class: "result" }, this.getIcon(), h("div", { class: "content" }, h("span", { class: "heading size-5 weight-semibold" }, this.heading), h("span", { class: "desc size-2" }, this.description), h("div", { class: "extra" }, h("slot", null)), (this.footerArea && (h("div", { class: "buttons", innerHTML: this.footerHtml })))))));
+  }
+  get el() { return this; }
+  static get style() { return resultCss; }
+}, [1, "bcm-result", {
+    "status": [1025],
+    "heading": [1025],
+    "description": [1025],
+    "hidden": [1028],
+    "footerArea": [32],
+    "footerHtml": [32]
+  }]);
+__decorate([
+  IsLoad()
+], BcmResult$1.prototype, "el", void 0);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["bcm-result", "bcm-icon"];
+  components.forEach(tagName => { switch (tagName) {
+    case "bcm-result":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BcmResult$1);
+      }
+      break;
+    case "bcm-icon":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const BcmResult = BcmResult$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BcmResult, defineCustomElement };

package/dist/components/bcm-search.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BcmSearch extends Components.BcmSearch, HTMLElement {}
+export const BcmSearch: {
+  prototype: BcmSearch;
+  new (): BcmSearch;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/bcm-search.js

@@ -0,0 +1,10 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+import { B as BcmSearch$1, d as defineCustomElement$1 } from './search.js';
+
+const BcmSearch = BcmSearch$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BcmSearch, defineCustomElement };

package/dist/components/bcm-select-box.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BcmSelectBox extends Components.BcmSelectBox, HTMLElement {}
+export const BcmSelectBox: {
+  prototype: BcmSelectBox;
+  new (): BcmSelectBox;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/bcm-select-box.js

@@ -0,0 +1,10 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+import { B as BcmSelectBox$1, d as defineCustomElement$1 } from './select-box.js';
+
+const BcmSelectBox = BcmSelectBox$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BcmSelectBox, defineCustomElement };

package/dist/components/bcm-select-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BcmSelectGroup extends Components.BcmSelectGroup, HTMLElement {}
+export const BcmSelectGroup: {
+  prototype: BcmSelectGroup;
+  new (): BcmSelectGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/bcm-select-group.js

@@ -0,0 +1,48 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as classnames } from './index2.js';
+
+const groupCss = "@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}:host{display:block}:host(.hidden){display:none}.group{display:none}.group.visible{display:block}.group-title{color:var(--bcm-color-grey-7);padding:4px 8px;display:block}";
+
+const BcmSelectGroup$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.visible = true;
+    this.hidden = false;
+  }
+  render() {
+    const classes = classnames('group', {
+      'visible': this.visible
+    });
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("div", { class: classes }, h("span", { class: "group-title size-1" }, " ", this.heading, " "), h("slot", null))));
+  }
+  static get style() { return groupCss; }
+}, [1, "bcm-select-group", {
+    "heading": [1025],
+    "visible": [1028],
+    "hidden": [1028]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["bcm-select-group"];
+  components.forEach(tagName => { switch (tagName) {
+    case "bcm-select-group":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BcmSelectGroup$1);
+      }
+      break;
+  } });
+}
+
+const BcmSelectGroup = BcmSelectGroup$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BcmSelectGroup, defineCustomElement };

package/dist/components/bcm-select-option.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BcmSelectOption extends Components.BcmSelectOption, HTMLElement {}
+export const BcmSelectOption: {
+  prototype: BcmSelectOption;
+  new (): BcmSelectOption;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/bcm-select-option.js

@@ -0,0 +1,57 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as classnames } from './index2.js';
+
+const optionCss = "@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}:host{display:block;width:100%;box-sizing:border-box;min-width:256px}:host(.hidden){display:none}:host-context(bcm-select-group) .option{padding-left:16px}.option{display:none;padding:4px 8px;cursor:pointer;color:var(--bcm-color-grey-8);box-sizing:border-box;width:100%}.option:hover:not(.disabled){background-color:var(--bcm-color-prime-blue-1)}.option.selected:not(.disabled){background-color:var(--bcm-color-grey-3)}.option.disabled{background-color:var(--bcm-color-grey-5);color:var(--bcm-color-grey-6);cursor:not-allowed}.option.disabled:not(.selected){background-color:var(--bcm-color-prime-blue-1)}.option.visible{display:inline-flex}";
+
+const BcmSelectOption$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.visible = true;
+    this.hidden = false;
+  }
+  async getLabel() {
+    return this.host.innerHTML;
+  }
+  render() {
+    const classes = classnames('option', 'size-2', {
+      'selected weight-semibold': this.selected,
+      'disabled': this.disabled,
+      'visible': this.visible
+    });
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("span", { class: classes }, h("slot", null))));
+  }
+  get host() { return this; }
+  static get style() { return optionCss; }
+}, [1, "bcm-select-option", {
+    "value": [1025],
+    "selected": [1540],
+    "disabled": [1028],
+    "visible": [1028],
+    "hidden": [1028],
+    "getLabel": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["bcm-select-option"];
+  components.forEach(tagName => { switch (tagName) {
+    case "bcm-select-option":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BcmSelectOption$1);
+      }
+      break;
+  } });
+}
+
+const BcmSelectOption = BcmSelectOption$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BcmSelectOption, defineCustomElement };

package/dist/components/bcm-select.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BcmSelect extends Components.BcmSelect, HTMLElement {}
+export const BcmSelect: {
+  prototype: BcmSelect;
+  new (): BcmSelect;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;