bromcom-ui 2.9.1-rc.0 → 2.9.1-rc.1

package/dist/components/bcm-modal.js

@@ -16,9 +16,10 @@ const BcmModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
-    this.close = createEvent(this, "bcm-close", 7);
-    this.modalBeforeClose = createEvent(this, "bcm-modal-before-close", 7);
-    this.modalBeforeOpen = createEvent(this, "bcm-modal-before-open", 7);
+    this.close = createEvent(this, "bcm-close", 3);
+    this.modalClose = createEvent(this, "bcm-modal-close", 3);
+    this.modalBeforeClose = createEvent(this, "bcm-modal-before-close", 3);
+    this.modalBeforeOpen = createEvent(this, "bcm-modal-before-open", 3);
     this.modalSlots = {};
     this._id = Generate.UID();
     this.isShow = false;
@@ -67,6 +68,7 @@ const BcmModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     if (obj === null || obj === void 0 ? void 0 : obj.force) {
       this.isShow = false;
       this.close.emit(); // Deprecated
+      this.modalClose.emit();
       return;
     }
     this.modalBeforeClose.emit(this.el);
@@ -103,6 +105,7 @@ const BcmModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     if (e.target === this.el) {
       this.isShow = false;
       this.close.emit(); // Deprecated
+      this.modalClose.emit();
     }
   }
   _openHandler() {
@@ -155,7 +158,7 @@ const BcmModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "fullWidth": [1028, "full-width"],
     "hide": [64],
     "show": [64]
-  }, [[8, "click", "handleSubmit"], [4, "keydown", "keyboardNavigation"], [4, "bcm-modal-before-open", "showModal"], [4, "bcm-modal-before-close", "hideModal"]]]);
+  }, [[8, "click", "handleSubmit"], [4, "keydown", "keyboardNavigation"], [0, "bcm-modal-before-open", "showModal"], [0, "bcm-modal-before-close", "hideModal"]]]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;

package/dist/components/generate.js

@@ -5,7 +5,7 @@
 import { Build } from '@stencil/core/internal/client';
 import { c as colors } from './colors2.js';
 
-const version = "2.9.1-rc.0";
+const version = "2.9.1-rc.1";
 
 /**
  * 'status' prop predefined values

package/dist/components/list.js

@@ -858,8 +858,8 @@ const BcmList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.bcmChecklist = createEvent(this, "bcm-checklist", 7);
     this.bcmSelected = createEvent(this, "bcm-selected", 7);
     this.change = createEvent(this, "bcm-change", 7);
-    this.open = createEvent(this, "bcm-open", 7);
-    this.close = createEvent(this, "bcm-close", 7);
+    this.open = createEvent(this, "bcm-open", 3);
+    this.close = createEvent(this, "bcm-close", 3);
     this.debounce = null;
     this.debounceHandler = Generate.debounceInput(() => this.listenResize(), 300, false);
     this._id = Generate.UID();

package/dist/components/skeleton.js

@@ -2,41 +2,93 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import './color-helper.js';
+import './validators.js';
 import { G as Generate } from './generate.js';
+import './number-helper.js';
+import './string-helper.js';
+import './element-dragger.js';
+import './bcm.js';
+import { c as ce } from './index5.js';
+
+const skeletonStyle = ce({
+  slots: {
+    host: "tw-bg-gray-200 tw-w-full tw-inline-block",
+  },
+  variants: {
+    variant: {
+      rect: {
+        host: "tw-rounded-md",
+      },
+      circle: {
+        host: "tw-rounded-full tw-w-8 tw-h-8",
+      },
+    },
+    effect: {
+      pulse: {
+        host: "tw-animate-pulse",
+      },
+      ping: {
+        host: "tw-animate-ping",
+      },
+      none: {
+        host: "tw-animate-none",
+      },
+    },
+  },
+  defaultVariants: {
+    variant: "rect",
+    effect: "pulse",
+  },
+});
+
+const skeletonCss = "@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([hidden]){display:none}:host{display:block;position:relative;overflow:hidden}";
 
 const BcmSkeleton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
+    this.items = [];
     this._id = Generate.UID();
-    this.loading = true;
+    this.effect = "pulse";
+    this.variant = "rect";
+    this.count = 1;
+    this.hidden = false;
+    this.width = null;
+    this.height = "16px";
+    this.marginBottom = null;
+    this.customStyles = {};
   }
-  componentDidLoad() {
-    var _a;
-    const parentElement = (_a = this.el) === null || _a === void 0 ? void 0 : _a.parentElement;
-    if (parentElement) {
-      const hidden = document.createElement("span");
-      hidden.setAttribute("id", `${this._id}-span`);
-      hidden.classList.add("tw-hidden");
-      hidden.innerHTML = `<slot />`;
-      parentElement.appendChild(hidden);
-      if (parentElement.isConnected) {
-        this.loading = false;
-        parentElement.querySelector(`#${this._id}-span`).remove();
-      }
-    }
+  componentWillLoad() {
+    this.init();
+  }
+  componentWillUpdate() {
+    this.init();
+  }
+  init() {
+    this.items.length = this.count;
+    this.items.fill(1);
   }
   render() {
-    const SkeletonAnimate = () => {
-      return (h("div", { class: "tw-mx-auto tw-w-full tw-max-w-sm tw-rounded-md tw-border tw-border-blue-300 tw-p-4 tw-shadow" }, h("span", { class: "tw-hidden" }, h("slot", null)), h("div", { class: "tw-flex tw-animate-pulse tw-space-x-4" }, h("div", { class: "tw-h-10 tw-w-10 tw-rounded-full tw-bg-slate-200" }), h("div", { class: "tw-flex-1 tw-space-y-6 tw-py-1" }, h("div", { class: "tw-h-2 tw-rounded tw-bg-slate-200" }), h("div", { class: "tw-space-y-3" }, h("div", { class: "tw-grid tw-grid-cols-3 tw-gap-4" }, h("div", { class: "tw-col-span-2 tw-h-2 tw-rounded tw-bg-slate-200" }), h("div", { class: "tw-col-span-1 tw-h-2 tw-rounded tw-bg-slate-200" })), h("div", { class: "tw-h-2 tw-rounded tw-bg-slate-200" }))))));
-    };
-    return this.loading ? h(SkeletonAnimate, null) : h("slot", null);
+    const { variant, effect, width, height, marginBottom, customStyles } = this;
+    const style = Object.assign(Object.assign(Object.assign(Object.assign({}, (width ? { width } : {})), (height ? { height } : {})), (marginBottom ? { marginBottom } : {})), (typeof customStyles === "string" ? JSON.parse(customStyles) : customStyles));
+    const { host } = skeletonStyle({ variant, effect });
+    return (h(Host, null, this.items.map((_, index) => {
+      return h("div", { role: "status", part: "base", key: index, class: host(), "aria-busy": "true", "aria-live": "polite", style: style });
+    })));
   }
-  get el() { return this; }
-}, [4, "bcm-skeleton", {
+  static get style() { return skeletonCss; }
+}, [0, "bcm-skeleton", {
     "_id": [1537, "id"],
-    "loading": [1028]
+    "effect": [513],
+    "variant": [513],
+    "count": [514],
+    "hidden": [516],
+    "width": [1],
+    "height": [1],
+    "marginBottom": [1, "margin-bottom"],
+    "customStyles": [1, "custom-styles"]
   }]);
 function defineCustomElement() {
   if (typeof customElements === "undefined") {

package/dist/esm/{_commonjsHelpers-7002e5de.js → _commonjsHelpers-be0d4ec8.js}

@@ -37,4 +37,4 @@ function commonjsRequire () {
 	throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
 }
 
-export { commonjsGlobal as a, getDefaultExportFromCjs as b, createCommonjsModule as c, getAugmentedNamespace as g };
+export { commonjsGlobal as a, getAugmentedNamespace as b, createCommonjsModule as c, getDefaultExportFromCjs as g };

package/dist/esm/bcm-accordion.entry.js

@@ -2,11 +2,11 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { G as Generate } from './generate-c80869fa.js';
-import './package-20c9971a.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { G as Generate } from './generate-40dfe3b0.js';
+import './package-1618c1e9.js';
+import './colors-e1c31f79.js';
+import './_commonjsHelpers-be0d4ec8.js';
 
 const accordionCss = "@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}";
 

package/dist/esm/bcm-alert.entry.js

@@ -2,14 +2,14 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { G as Generate, s as snq, S as StatusProps, T as TypeProps } from './generate-c80869fa.js';
-import { c as classnames } from './index-00c8a8f7.js';
-import { c as createStore } from './index-7e71bbc8.js';
-import { S as StringHelper } from './string-helper-b0e05041.js';
-import './package-20c9971a.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { G as Generate, s as snq, S as StatusProps, T as TypeProps } from './generate-40dfe3b0.js';
+import { c as classnames } from './index-b84bc8c9.js';
+import { c as createStore } from './index-f38e3364.js';
+import { S as StringHelper } from './string-helper-5bd646f2.js';
+import './package-1618c1e9.js';
+import './colors-e1c31f79.js';
+import './_commonjsHelpers-be0d4ec8.js';
 import './bcm-d45dc47d.js';
 
 const { state } = createStore({

package/dist/esm/bcm-attendance.entry.js

@@ -2,11 +2,11 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { G as Generate } from './generate-c80869fa.js';
-import './package-20c9971a.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { G as Generate } from './generate-40dfe3b0.js';
+import './package-1618c1e9.js';
+import './colors-e1c31f79.js';
+import './_commonjsHelpers-be0d4ec8.js';
 
 const attendanceCss = "@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-attendance{width:fit-content;display:inline-flex;align-items:center;flex-direction:row;gap:4px}.bcm-attendance__item{display:flex;flex-direction:row;align-items:center;gap:1px}.bcm-attendance__item-am,.bcm-attendance__item-pm{display:block;width:calc( calc( 12px + 1px ) / 2 );height:calc( 12px + 1px );background-color:var(--bcm-new-ds-color-blue-500)}.bcm-attendance__item-am:hover,.bcm-attendance__item-pm:hover{background-color:var(--bcm-new-ds-color-blue-600)}.bcm-attendance__item-am{border-top-left-radius:100px;border-bottom-left-radius:100px}.bcm-attendance__item-pm{border-top-right-radius:100px;border-bottom-right-radius:100px}.bcm-attendance__item-status-present{background-color:var(--bcm-new-ds-color-emerald-500)}.bcm-attendance__item-status-present:hover{background-color:var(--bcm-new-ds-color-emerald-600)}.bcm-attendance__item-status-late{background-color:var(--bcm-new-ds-color-amber-500)}.bcm-attendance__item-status-late:hover{background-color:var(--bcm-new-ds-color-amber-600)}.bcm-attendance__item-status-absent{background-color:var(--bcm-new-ds-color-red-500)}.bcm-attendance__item-status-absent:hover{background-color:var(--bcm-new-ds-color-red-600)}.bcm-attendance__item-status-default{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-attendance__item-status-default:hover{background-color:var(--bcm-new-ds-color-slate-400)}";
 

package/dist/esm/bcm-autocomplete.entry.js

@@ -2,9 +2,9 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { c as classnames } from './index-00c8a8f7.js';
-import './_commonjsHelpers-7002e5de.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { c as classnames } from './index-b84bc8c9.js';
+import './_commonjsHelpers-be0d4ec8.js';
 
 const autocompleteCss = "@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:inline-block;width:fit-content;height:fit-content}:host(.hidden){display:none}:host(.full-width){width:100%;height:100%}:host(.full-width) .bcm-autocomplete{max-height:100%;max-width:100%}.bcm-autocomplete{background-color:var(--bcm-color-grey-1);display:flex;flex-direction:column;height:100%;width:100%;min-width:256px;max-width:256px;position:relative}.bcm-autocomplete-result{position:relative}.bcm-autocomplete-result .viewport{position:absolute;overflow:hidden;height:0;transition:height 0.3s ease;background-color:#ffffff;width:100%;z-index:10000}.bcm-autocomplete-result.open .viewport{height:256px}";
 

package/dist/esm/bcm-avatar_2.entry.js

@@ -2,20 +2,21 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { C as ColorHelper } from './color-helper-845ba523.js';
-import './validators-81296897.js';
-import { G as Generate } from './generate-c80869fa.js';
-import './number-helper-2eb7011a.js';
-import './string-helper-b0e05041.js';
-import './element-dragger-89bb52fd.js';
-import { a as Bcm } from './bcm-d45dc47d.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { C as ColorHelper } from './color-helper-c4fa9ebc.js';
+import './datetime-helper-df25808a.js';
+import { G as Generate } from './generate-40dfe3b0.js';
+import './number-helper-352d1d80.js';
+import './string-helper-5bd646f2.js';
+import './validators-68717171.js';
+import './element-dragger-7ea06c76.js';
+import { B as Bcm } from './bcm-d45dc47d.js';
 import { c as ce } from './index-3bc8c6e3.js';
 import './colors-1d7854ea.js';
-import './utils-57652744.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
-import './package-20c9971a.js';
+import './utils-b3338faf.js';
+import './colors-e1c31f79.js';
+import './_commonjsHelpers-be0d4ec8.js';
+import './package-1618c1e9.js';
 
 const avatarStyle = ce({
   slots: {

package/dist/esm/bcm-box.entry.js

@@ -2,7 +2,7 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-0615c2b8.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-4614b7f0.js';
 
 const BcmBox = class {
   constructor(hostRef) {

package/dist/esm/bcm-breadcrumb.entry.js

@@ -2,12 +2,12 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { c as classnames } from './index-00c8a8f7.js';
-import { G as Generate } from './generate-c80869fa.js';
-import './_commonjsHelpers-7002e5de.js';
-import './package-20c9971a.js';
-import './colors-ebea297f.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { c as classnames } from './index-b84bc8c9.js';
+import { G as Generate } from './generate-40dfe3b0.js';
+import './_commonjsHelpers-be0d4ec8.js';
+import './package-1618c1e9.js';
+import './colors-e1c31f79.js';
 
 const breadcrumbCss = "@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-breadcrumb{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;flex-wrap:wrap;color:var(--bcm-color-grey-7)}.bcm-breadcrumb__item{display:flex;align-items:center}.bcm-breadcrumb .seperator{cursor:default;display:inline-flex;align-items:center;justify-content:center;margin-left:8px;margin-right:8px;color:var(--bcm-color-grey-7)}.bcm-breadcrumb bcm-link:hover{color:var(--bcm-color-grey-7)}.bcm-breadcrumb .active{color:var(--bcm-color-grey-8)}.bcm-breadcrumb .active:hover{color:var(--bcm-color-grey-8)}.bcm-breadcrumb .is-link:hover{color:var(--bcm-color-prime-blue-6)}.bcm-breadcrumb .is-link:hover bcm-link,.bcm-breadcrumb .is-link:hover bcm-icon{color:var(--bcm-color-prime-blue-6)}.bcm-breadcrumb__dropdown-item{position:relative;display:inline-flex}.bcm-breadcrumb__dropdown-item summary{display:inline-flex;align-items:center;cursor:pointer}.bcm-breadcrumb__dropdown-item summary>span{display:inline-flex;align-items:center}.bcm-breadcrumb__dropdown-item summary::-webkit-details-marker{display:none}.bcm-breadcrumb__dropdown-item summary:focus{outline:none}.bcm-breadcrumb__dropdown-item summary.open bcm-link,.bcm-breadcrumb__dropdown-item summary.open bcm-icon{color:var(--bcm-color-prime-blue-6)}.bcm-breadcrumb__dropdown-item summary .down-icon{margin-left:4px}.bcm-breadcrumb__dropdown-submenu{position:absolute;min-width:140px;background-color:var(--bcm-color-grey-1);box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);margin-top:4px}.bcm-breadcrumb__dropdown-submenu .dropdown-item{display:flex;padding:4px 8px}.bcm-breadcrumb__dropdown-submenu .dropdown-item bcm-link{width:100%}";
 

package/dist/esm/bcm-button-group.entry.js

@@ -2,14 +2,14 @@
  * Built with Stencil
  * Copyright (c) Bromcom.
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-0615c2b8.js';
-import { G as Generate, s as snq } from './generate-c80869fa.js';
-import { B as Bcm } from './bcm-d45dc47d.js';
-import { c as classnames } from './index-00c8a8f7.js';
-import { S as StringHelper } from './string-helper-b0e05041.js';
-import './package-20c9971a.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4614b7f0.js';
+import { G as Generate, s as snq } from './generate-40dfe3b0.js';
+import { a as Bcm } from './bcm-d45dc47d.js';
+import { c as classnames } from './index-b84bc8c9.js';
+import { S as StringHelper } from './string-helper-5bd646f2.js';
+import './package-1618c1e9.js';
+import './colors-e1c31f79.js';
+import './_commonjsHelpers-be0d4ec8.js';
 
 const buttonGroupCss = "@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-button-group{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;flex-wrap:nowrap;width:fit-content;background-color:var(--bcm-new-ds-color-slate-300);border:1px solid var(--bcm-new-ds-color-slate-300);gap:1px;border-radius:4px}.bcm-button-group .bcm-button__container{border-radius:0;border:none}.bcm-button-group .bcm-button:first-child .bcm-button__container{border-top-left-radius:4px;border-bottom-left-radius:4px}.bcm-button-group .bcm-button:last-child .bcm-button__container{border-top-right-radius:4px;border-bottom-right-radius:4px}.bcm-button-group__vertical{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;flex-wrap:nowrap}.bcm-button-group__vertical .bcm-button{width:100%}.bcm-button-group__vertical .bcm-button__container{width:100%;border-radius:0}.bcm-button-group__vertical .bcm-button:first-child .bcm-button__container{border-radius:4px 4px 0 0}.bcm-button-group__vertical .bcm-button:last-child .bcm-button__container{border-radius:0 0 4px 4px}";