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

package/dist/collection/components/molecules/checkbox/checkbox.css

@@ -125,7 +125,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -428,7 +430,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -776,7 +780,9 @@
   margin: 0;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/drawer/drawer.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/dropdown/dropdown.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/error-layout/error-layout.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/expansion-panel/expansion-panel.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/input/input.css

@@ -125,7 +125,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -428,7 +430,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -776,7 +780,9 @@
   margin: 0;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/item/item.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/linked/linked.js

@@ -12,20 +12,20 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
         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 { Host, h } from '@stencil/core';
-import { Bcm } from '@bcm/model';
-import { delay, FloatingUI } from '@bcm/utils';
-import { Generate } from '@bcm/helpers';
-import { IsLoad } from '@bcm/decorator';
+import { Host, h } from "@stencil/core";
+import { Bcm } from "@bcm/model";
+import { delay, FloatingUI } from "@bcm/utils";
+import { Generate } from "@bcm/helpers";
+import { IsLoad } from "@bcm/decorator";
 export class BcmLinked {
   constructor() {
     this._id = Generate.UID();
-    this.placement = Bcm.Placement['bottom-start'];
+    this.placement = Bcm.Placement["bottom-start"];
     this.trigger = Bcm.TriggerType.click;
-    this.targetId = '';
+    this.targetId = "";
     this.height = undefined;
     this.maxHeight = undefined;
-    this.minHeight = '50px';
+    this.minHeight = "50px";
     this.isOpen = false;
   }
   target() {
@@ -41,15 +41,15 @@ export class BcmLinked {
     }
   }
   dismissEvent() {
-    document.dispatchEvent(new CustomEvent('linked-data-dismiss', { detail: { id: this._id } }));
+    document.dispatchEvent(new CustomEvent("linked-data-dismiss", { detail: { id: this._id } }));
   }
   checkDataDismiss(e) {
-    Generate.findEventPathHasAttribute(e, 'data-dismiss') && this.dismissEvent();
+    Generate.findEventPathHasAttribute(e, "data-dismiss") && this.dismissEvent();
   }
   hideChildLinked() {
-    this.el.querySelectorAll('[is-linked][linked-is-open]').forEach(item => {
+    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);
+      (_a = document.querySelector(`#${item.getAttribute("is-linked")}[is-open]`)) === null || _a === void 0 ? void 0 : _a.hide(false);
     });
   }
   calculatePosition() {
@@ -61,7 +61,7 @@ export class BcmLinked {
           floating: el,
           placement: this.placement,
           offset: 4,
-          autoHidden: el.getAttribute('main-linked') === 'true' ? false : true,
+          autoHidden: el.getAttribute("main-linked") === "true" ? false : true,
           autoSize: true,
           style: {
             height: this.height,
@@ -71,20 +71,20 @@ export class BcmLinked {
         });
       }
       else {
-        el.style.visibility = 'hidden';
-        el.style.opacity = '0';
+        el.style.visibility = "hidden";
+        el.style.opacity = "0";
       }
     }
   }
   init() {
     const target = this.target();
     if (target) {
-      target.setAttribute('is-linked', this.el.id);
-      if (!Generate.getAncestor(target, 'bcm-linked')) {
-        this.el.setAttribute('main-linked', 'true');
+      target.setAttribute("is-linked", this.el.id);
+      if (!Generate.getAncestor(target, "bcm-linked")) {
+        this.el.setAttribute("main-linked", "true");
       }
       else {
-        this.el.removeAttribute('main-linked');
+        this.el.removeAttribute("main-linked");
       }
     }
   }
@@ -106,7 +106,7 @@ export class BcmLinked {
     const target = this.target();
     if (target) {
       document.body.appendChild(this.el);
-      target.setAttribute('linked-is-open', 'true');
+      target.setAttribute("linked-is-open", "true");
       this.isOpen = true;
       this.calculatePosition();
     }
@@ -119,7 +119,7 @@ export class BcmLinked {
     wait && (await delay(50));
     const target = this.target();
     if (target) {
-      target.removeAttribute('linked-is-open');
+      target.removeAttribute("linked-is-open");
       this.hideChildLinked();
       this.isOpen = false;
     }
@@ -133,7 +133,7 @@ export class BcmLinked {
       return;
     const isTarget = Generate.findEventPath(e, this.target());
     const isSelf = Generate.findEventPath(e, this.el);
-    const isLinked = Generate.findEventPathWithNodeName(e, 'BCM-LINKED');
+    const isLinked = Generate.findEventPathWithNodeName(e, "BCM-LINKED");
     if (!isTarget && !isSelf && !isLinked) {
       this.hide();
       this.bcmOpen.emit(this.isOpen);
@@ -142,7 +142,7 @@ export class BcmLinked {
     if (this.isOpen) {
       isTarget && this.hide(false);
       isSelf && this.checkDataDismiss(e);
-      if (this.el.getAttribute('main-linked') === 'true' && !isTarget && !isSelf && !isLinked) {
+      if (this.el.getAttribute("main-linked") === "true" && !isTarget && !isSelf && !isLinked) {
         this.dismissEvent();
       }
     }
@@ -163,8 +163,8 @@ export class BcmLinked {
     this.bcmOpen.emit(this.isOpen);
   }
   render() {
-    const openStyle = this.isOpen ? { visibility: 'visible', opacity: '1' } : { visibility: 'hidden', opacity: '0' };
-    return (h(Host, { class: "tw-block tw-opacity-0 tw-invisible tw-top-0 tw-left-0  tw-rounded tw-bg-white  tw-z-tooltip tw-transition-opacity tw-duration-100  tw-shadow tw-overscroll-contain tw-scroll-smooth tw-absolute", style: Object.assign(Object.assign({}, openStyle), { overflow: 'auto' }) }, h("slot", null)));
+    const openStyle = this.isOpen ? { visibility: "visible", opacity: "1" } : { visibility: "hidden", opacity: "0" };
+    return (h(Host, { class: "tw-invisible tw-absolute tw-top-0 tw-left-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" }) }, h("slot", null)));
   }
   static get is() { return "bcm-linked"; }
   static get properties() {
@@ -208,7 +208,7 @@ export class BcmLinked {
         },
         "attribute": "placement",
         "reflect": false,
-        "defaultValue": "Bcm.Placement['bottom-start']"
+        "defaultValue": "Bcm.Placement[\"bottom-start\"]"
       },
       "trigger": {
         "type": "string",
@@ -249,7 +249,7 @@ export class BcmLinked {
         },
         "attribute": "target-id",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "height": {
         "type": "string",
@@ -301,7 +301,7 @@ export class BcmLinked {
         },
         "attribute": "min-height",
         "reflect": false,
-        "defaultValue": "'50px'"
+        "defaultValue": "\"50px\""
       },
       "isOpen": {
         "type": "boolean",

package/dist/collection/components/molecules/menu/menu.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/modal/modal.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/popconfirm/popconfirm-box.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/popover/popover.js

@@ -12,19 +12,19 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
         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, Popover } from '@bcm/helpers';
-import { Bcm } from '@bcm/model';
-import { Host, h } from '@stencil/core';
+import { IsLoad } from "@bcm/decorator";
+import { Generate, Popover } from "@bcm/helpers";
+import { Bcm } from "@bcm/model";
+import { Host, h } from "@stencil/core";
 export class BcmPopover {
   constructor() {
     this._id = Generate.UID();
-    this.message = '';
-    this.content = '';
+    this.message = "";
+    this.content = "";
     this.placement = Bcm.Placement.top;
     this.trigger = Bcm.TriggerType.click;
     this.open = false;
-    this.color = 'white';
+    this.color = "white";
     this.popover = new Popover({
       targetId: this._id,
       content: this.content,
@@ -56,7 +56,7 @@ export class BcmPopover {
     this.popover.toggle();
   }
   render() {
-    return (h(Host, { "aria-describedby": "popover", tabindex: "-1", class: "tw-inline-flex tw-w-fit tw-h-fit" }, h("slot", null)));
+    return (h(Host, { "aria-describedby": "popover", tabindex: "-1", class: "tw-inline-flex tw-h-fit tw-w-fit" }, h("slot", null)));
   }
   static get is() { return "bcm-popover"; }
   static get properties() {
@@ -95,7 +95,7 @@ export class BcmPopover {
         },
         "attribute": "message",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "content": {
         "type": "string",
@@ -113,7 +113,7 @@ export class BcmPopover {
         },
         "attribute": "content",
         "reflect": false,
-        "defaultValue": "''"
+        "defaultValue": "\"\""
       },
       "placement": {
         "type": "string",
@@ -195,7 +195,7 @@ export class BcmPopover {
         },
         "attribute": "color",
         "reflect": false,
-        "defaultValue": "'white'"
+        "defaultValue": "\"white\""
       }
     };
   }

package/dist/collection/components/molecules/progress/progress.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/radio/group.css

@@ -124,7 +124,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -427,7 +429,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/radio/radio.css

@@ -125,7 +125,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -428,7 +430,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -776,7 +780,9 @@
   margin: 0;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/range/range.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/search/search.css

@@ -125,7 +125,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -428,7 +430,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -776,7 +780,9 @@
   margin: 0;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;

package/dist/collection/components/molecules/skeleton/skeleton.js

@@ -12,9 +12,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
         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 { h } from '@stencil/core';
-import { IsLoad } from '../../../decorators/is-load-decorator';
-import { Generate } from '../../../helper/generate';
+import { h } from "@stencil/core";
+import { IsLoad } from "../../../decorators/is-load-decorator";
+import { Generate } from "../../../helper/generate";
 export class BcmSkeleton {
   constructor() {
     this._id = Generate.UID();
@@ -24,9 +24,9 @@ export class BcmSkeleton {
     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');
+      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) {
@@ -37,9 +37,9 @@ export class BcmSkeleton {
   }
   render() {
     const SkeletonAnimate = () => {
-      return (h("div", { class: "tw-border tw-border-blue-300 tw-shadow tw-rounded-md tw-p-4 tw-max-w-sm tw-w-full tw-mx-auto" }, h("span", { class: "tw-hidden" }, h("slot", null)), h("div", { class: "tw-animate-pulse tw-flex tw-space-x-4" }, h("div", { class: "tw-rounded-full tw-bg-slate-200 tw-h-10 tw-w-10" }), h("div", { class: "tw-flex-1 tw-space-y-6 tw-py-1" }, h("div", { class: "tw-h-2 tw-bg-slate-200 tw-rounded" }), h("div", { class: "tw-space-y-3" }, h("div", { class: "tw-grid tw-grid-cols-3 tw-gap-4" }, h("div", { class: "tw-h-2 tw-bg-slate-200 tw-rounded tw-col-span-2" }), h("div", { class: "tw-h-2 tw-bg-slate-200 tw-rounded tw-col-span-1" })), h("div", { class: "tw-h-2 tw-bg-slate-200 tw-rounded" }))))));
+      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));
+    return this.loading ? h(SkeletonAnimate, null) : h("slot", null);
   }
   static get is() { return "bcm-skeleton"; }
   static get properties() {

package/dist/collection/components/molecules/stepper/stepper.css

@@ -123,7 +123,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -429,7 +431,8 @@
   border: 2px solid var(--bcm-color-prime-blue-6);
   border-color: transparent;
   position: absolute;
-  z-index: -1;
+  z-index: 0;
+  user-select: none;
   top: -6px;
   left: -6px;
 }

package/dist/collection/components/molecules/switch/switch.css

@@ -125,7 +125,9 @@
   margin-right: 8px;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -428,7 +430,9 @@
   min-height: calc(14px + 8px);
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;
@@ -776,7 +780,9 @@
   margin: 0;
 }
 
-:root {
+:root,
+::after,
+::before {
   --bcm-new-ds-color-inherit: inherit;
   --bcm-new-ds-color-current: currentColor;
   --bcm-new-ds-color-transparent: transparent;