bromcom-ui-next 0.1.29 → 0.1.30

package/dist/components/{p-CQF7wlXf.js → p-CaemikSK.js}

@@ -4,9 +4,11 @@ import { t as tv } from './p-CEcVC0yX.js';
 const badgeCss = ".relative{position:relative}:host{--bcm-badge-bg:var(--bcm-ui-color-background-default-default);--bcm-badge-text:var(--bcm-ui-color-text-default);--bcm-badge-radius:9999px;display:inline-block;position:relative}::slotted([slot=badge]){color:var(--bcm-badge-text);font-weight:500}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.inline-flex{display:inline-flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.absolute{position:absolute}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.z-10{z-index:10}.size-1{height:.25rem;width:.25rem}.size-1\\.5{height:.375rem;width:.375rem}.size-2{height:.5rem;width:.5rem}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.rounded-\\[--bcm-badge-radius\\]{border-radius:var(--bcm-badge-radius)}.bg-\\[--bcm-badge-bg\\]{background-color:var(--bcm-badge-bg)}.p-0{padding:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[0px\\]{font-size:0}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.leading-none{line-height:1}.text-\\[--bcm-badge-text\\]{color:var(--bcm-badge-text)}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:h-full:after{content:var(--tw-content);height:100%}.after\\:w-full:after{content:var(--tw-content);width:100%}@keyframes ping{75%,to{content:var(--tw-content);opacity:0;transform:scale(2)}}.after\\:animate-blink:after{animation:ping 2s infinite;content:var(--tw-content)}.after\\:rounded-full:after{border-radius:var(--bcm-ui-border-radius-full,9999px);content:var(--tw-content)}.after\\:bg-\\[--bcm-badge-bg\\]:after{background-color:var(--bcm-badge-bg);content:var(--tw-content)}.after\\:content-\\[\\\"\\\"\\]:after{--tw-content:\"\";content:var(--tw-content)}";
 
 const Badge = /*@__PURE__*/ proxyCustomElement(class Badge extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         /**
          * Determines the size of the badge.
@@ -105,12 +107,12 @@ const Badge = /*@__PURE__*/ proxyCustomElement(class Badge extends H {
         };
     }
     render() {
-        return (h("div", { key: '74e45ce818da173ddd7222ec5d69c74dafa32efd', class: "relative inline-flex" }, h("slot", { key: '440ab1febafad8cdb6a16413f95449c23be51dd6' }), h("div", { key: 'd8ca98c7b8918fba57f3594b0e42850d47fbf639', role: "status", "aria-live": "polite", "aria-label": this.status ? `Status: ${this.status}` : undefined, class: this.classes({
+        return (h("div", { key: 'f71c36dfb12c4e4d3231dc032a56d4359804c4ca', class: "relative inline-flex" }, h("slot", { key: '95198d29516b302467cce4ac236b064ac54285f1' }), h("div", { key: 'a4e95fe921c0d4051fc4568aae5ae7bc9e81aaa1', role: "status", "aria-live": "polite", "aria-label": this.status ? `Status: ${this.status}` : undefined, class: this.classes({
                 size: this.size,
                 variant: this.variant,
                 position: this.position,
                 blink: this.blink,
-            }), style: Object.assign(Object.assign({}, this.badgeStyle), this.offsetStyle) }, this.variant == 'text' && h("slot", { key: '8226b21ba3e24218e15f5eda598ccde83973edb2', name: "badge" }, this.text))));
+            }), style: Object.assign(Object.assign({}, this.badgeStyle), this.offsetStyle) }, this.variant == 'text' && h("slot", { key: '51e219f0a9dfe85cd0f6287336ed0052c295309f', name: "badge" }, this.text))));
     }
     static get style() { return badgeCss; }
 }, [257, "bcm-badge", {
@@ -140,6 +142,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { Badge as B, defineCustomElement as d };
-//# sourceMappingURL=p-CQF7wlXf.js.map
+//# sourceMappingURL=p-CaemikSK.js.map
 
-//# sourceMappingURL=p-CQF7wlXf.js.map
+//# sourceMappingURL=p-CaemikSK.js.map

package/dist/components/p-CaemikSK.js.map

@@ -0,0 +1 @@
+{"file":"p-CaemikSK.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/badge/badge.css?tag=bcm-badge&encapsulation=shadow","src/components/badge/badge.component.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --bcm-badge-bg: var(--bcm-ui-color-background-default-default);\n  --bcm-badge-text: var(--bcm-ui-color-text-default);\n  --bcm-badge-radius: 9999px;\n}\n\n::slotted([slot='badge']) {\n  color: var(--bcm-badge-text);\n  font-weight: 500;\n}\n","import { Component, ComponentInterface, Prop, h } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmBadge\n * @description A versatile badge component that can be positioned around its container.\n * Supports different sizes, variants (dot/text), colors, and positioning options.\n * Can display status indicators with optional blinking animation.\n *\n * @example Basic usage\n * <bcm-badge color=\"primary\" position=\"top-right\">\n *   <div>Container Content</div>\n *   <span slot=\"badge\">New</span>\n * </bcm-badge>\n *\n * @example Status indicator with blink\n * <bcm-badge variant=\"dot\" color=\"success\" blink={true} status=\"Online\">\n *   <div>User Profile</div>\n * </bcm-badge>\n */\n@Component({\n  tag: 'bcm-badge',\n  styleUrl: 'badge.css',\n  shadow: true,\n})\nexport class Badge implements ComponentInterface {\n  /**\n   * Determines the size of the badge.\n   * @type {'small' | 'medium' | 'large'}\n   * @default 'medium'\n   */\n  @Prop()\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Sets the visual variant of the badge.\n   * 'dot': Appears as a small dot indicator\n   * 'text': Displays content as text\n   * @type {'dot' | 'text'}\n   * @default 'text'\n   */\n  @Prop()\n  variant: 'dot' | 'text' = 'text';\n\n  /**\n   * Defines the color of the badge.\n   * Uses system color variables (e.g., 'primary', 'success', 'warning', etc.)\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  color?: string;\n\n  /**\n   * Enables soft color mode for the badge.\n   * When true, uses lighter tones and pastel colors.\n   * @type {boolean}\n   * @default false\n   */\n  @Prop()\n  soft: boolean = false;\n\n  /**\n   * Enables blinking animation for the badge.\n   * Useful for drawing attention or indicating active status.\n   * @type {boolean}\n   * @default false\n   */\n  @Prop()\n  blink: boolean = false;\n\n  /**\n   * Status message for accessibility purposes.\n   * Will be read by screen readers.\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  status?: string;\n\n  /**\n   * Sets the position of the badge relative to its container.\n   * @type {'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'}\n   * @default 'top-right'\n   */\n  @Prop()\n  position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' = 'top-right';\n\n  /**\n   * Fine-tune the badge position with custom offset.\n   * Format: \"x,y\" in pixels (e.g., \"10,-5\")\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  offset: string;\n\n  /**\n   * Text to be displayed inside the badge.\n   * Used when variant is set to 'text'.\n   * Can be overridden using the \"badge\" slot.\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  text?: string;\n\n  private classes = tv({\n    base: 'badge bcm-ui-element absolute font-medium inline-flex items-center justify-center bg-[--bcm-badge-bg] text-[--bcm-badge-text] rounded-[--bcm-badge-radius] z-10',\n    variants: {\n      size: {\n        small: 'gap-1 px-1 text-size-3',\n        medium: 'gap-1 py-0.5 px-1.5 text-size-4',\n        large: 'gap-2 py-1 px-2 text-size-5',\n      },\n      variant: {\n        dot: 'gap-0 p-0 text-[0px] leading-none',\n        text: '',\n      },\n      position: {\n        'top-right': '-top-1 -right-1',\n        'top-left': '-top-1 -left-1',\n        'bottom-right': '-bottom-1 -right-1',\n        'bottom-left': '-bottom-1 -left-1',\n      },\n      blink: {\n        true: 'after:content-[\"\"] after:absolute  after:rounded-full after:bg-[--bcm-badge-bg] after:animate-blink after:w-full after:h-full',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'dot',\n        size: 'small',\n        class: 'size-1',\n      },\n      {\n        variant: 'dot',\n        size: 'medium',\n        class: 'size-1.5',\n      },\n      {\n        variant: 'dot',\n        size: 'large',\n        class: 'size-2',\n      },\n    ],\n    defaultVariants: {\n      variant: 'text',\n      size: 'medium',\n      position: 'top-right',\n      blink: false,\n    },\n  });\n\n  private get offsetStyle() {\n    if (!this.offset) return {};\n    const [x = 0, y = 0] = this.offset.split(',').map(val => val.trim());\n    return { transform: `translate(${x}px, ${y}px)` };\n  }\n\n  private get badgeStyle() {\n    if (!this.color) return {};\n    const variantType = this.soft ? 'soft' : 'vivid';\n\n    return {\n      '--bcm-badge-bg': `var(--bcm-ui-color-background-${variantType}-${this.color}-default)`,\n      '--bcm-badge-text': this.soft ? `var(--bcm-ui-color-text-palette-${this.color})` : 'var(--bcm-ui-color-text-base)',\n    };\n  }\n\n  render() {\n    return (\n      <div class=\"relative inline-flex\">\n        <slot></slot>\n        <div\n          role=\"status\"\n          aria-live=\"polite\"\n          aria-label={this.status ? `Status: ${this.status}` : undefined}\n          class={this.classes({\n            size: this.size,\n            variant: this.variant,\n            position: this.position,\n            blink: this.blink,\n          })}\n          style={{\n            ...this.badgeStyle,\n            ...this.offsetStyle,\n          }}\n        >\n          {this.variant == 'text' && <slot name=\"badge\">{this.text}</slot>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-DHONP_n4.js → p-CsIBm0J5.js}

@@ -143,12 +143,14 @@ const variantOptions = {
     },
 };
 
-const buttonCss = ".relative{position:relative}:host{display:inline-flex;height:-moz-fit-content;height:fit-content;position:relative;width:-moz-fit-content;width:fit-content}:host([full-width]){width:100%}:host([position=first]) .bcm-button{border-bottom-right-radius:0;border-top-right-radius:0}:host([position=middle]) .bcm-button{border-radius:0}:host([position=last]) .bcm-button{border-bottom-left-radius:0;border-top-left-radius:0}:host([position=first].orientation-vertical) .bcm-button{border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--bcm-ui-border-radius,4px);border-top-right-radius:var(--bcm-ui-border-radius,4px)}:host([position=middle].orientation-vertical) .bcm-button{border-radius:0}:host([position=last].orientation-vertical) .bcm-button{border-bottom-left-radius:var(--bcm-ui-border-radius,4px);border-bottom-right-radius:var(--bcm-ui-border-radius,4px);border-top-left-radius:0;border-top-right-radius:0}.static{position:static}.inline-flex{display:inline-flex}.min-h-10{min-height:2.5rem}.min-h-6{min-height:1.5rem}.min-h-8{min-height:2rem}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.appearance-none{appearance:none}.items-center{align-items:center}.justify-center{justify-content:center}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-final-border-color\\]{border-color:var(--bcm-final-border-color)}.border-color-disabled{border-color:var(--bcm-ui-color-border-disabled)}.bg-\\[--bcm-final-bg-color\\]{background-color:var(--bcm-final-bg-color)}.bg-\\[--bcm-ui-color-background-disabled-default\\]{background-color:var(--bcm-ui-color-background-disabled-default)}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-px{padding-bottom:1px;padding-top:1px}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.leading-none{line-height:1}.text-\\[--bcm-final-text-color\\]{color:var(--bcm-final-text-color)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-final-hover-bg-color\\]:hover{background-color:var(--bcm-final-hover-bg-color)}.focus-visible\\:ring:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.active\\:bg-\\[--bcm-final-active-bg-color\\]:active{background-color:var(--bcm-final-active-bg-color)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.absolute{position:absolute}.z-\\[9999\\]{z-index:9999}.mx-auto{margin-left:auto;margin-right:auto}.flex{display:flex}.hidden{display:none}.size-6{height:1.5rem;width:1.5rem}.h-2{height:.5rem}.w-4{width:1rem}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-\\[--popover-radius\\]{border-radius:var(--popover-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.font-sans{font-family:Inter,sans-serif}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.text-size-inherit{font-size:inherit;line-height:inherit}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[--text-color\\]{color:var(--text-color)}.shadow,.shadow-2{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2{--tw-shadow:var(--bcm-ui-box-shadow-2);--tw-shadow-colored:var(--bcm-ui-box-shadow-2)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}.max-h-64{max-height:16rem}.min-w-10{min-width:2.5rem}.overflow-y-auto{overflow-y:auto}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-color-basic-panel{background-color:var(--bcm-ui-color-background-basic-panel)}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.shadow,.shadow-3{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-3{--tw-shadow:var(--bcm-ui-box-shadow-3);--tw-shadow-colored:var(--bcm-ui-box-shadow-3)}";
+const buttonCss = ".relative{position:relative}:host{display:inline-flex;height:-moz-fit-content;height:fit-content;position:relative;width:-moz-fit-content;width:fit-content}:host([full-width]){width:100%}:host([position=first]) .bcm-button{border-bottom-right-radius:0;border-top-right-radius:0}:host([position=middle]) .bcm-button{border-radius:0}:host([position=last]) .bcm-button{border-bottom-left-radius:0;border-top-left-radius:0}:host([position=first].orientation-vertical) .bcm-button{border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:var(--bcm-ui-border-radius,4px);border-top-right-radius:var(--bcm-ui-border-radius,4px)}:host([position=middle].orientation-vertical) .bcm-button{border-radius:0}:host([position=last].orientation-vertical) .bcm-button{border-bottom-left-radius:var(--bcm-ui-border-radius,4px);border-bottom-right-radius:var(--bcm-ui-border-radius,4px);border-top-left-radius:0;border-top-right-radius:0}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.right-3{right:.75rem}.right-4{right:1rem}.right-6{right:1.5rem}.top-3{top:.75rem}.top-4{top:1rem}.top-6{top:1.5rem}.z-\\[9999\\]{z-index:9999}.m-0{margin:0}.inline-block{display:inline-block}.flex{display:flex}.size-6{height:1.5rem;width:1.5rem}.h-3{height:.75rem}.w-3{width:.75rem}.max-w-64{max-width:16rem}.max-w-80{max-width:20rem}.max-w-96{max-width:24rem}.flex-1{flex:1 1 0%}.rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.text-pretty{text-wrap:pretty}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.rounded-lg{border-radius:var(--bcm-ui-border-radius-lg,8px)}.bg-\\[--popover-bg\\]{background-color:var(--popover-bg)}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.pr-8{padding-right:2rem}.font-sans{font-family:Inter,sans-serif}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-semibold{font-weight:600}.\\!text-color-header{color:var(--bcm-ui-color-text-header)!important}.text-\\[var\\(--bcm-ui-color-text-error\\)\\]{color:var(--bcm-ui-color-text-error)}.text-\\[var\\(--bcm-ui-color-text-info\\)\\]{color:var(--bcm-ui-color-text-info)}.text-\\[var\\(--bcm-ui-color-text-success\\)\\]{color:var(--bcm-ui-color-text-success)}.text-\\[var\\(--bcm-ui-color-text-warning\\)\\]{color:var(--bcm-ui-color-text-warning)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default)}.shadow,.shadow-3{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-3{--tw-shadow:var(--bcm-ui-box-shadow-3);--tw-shadow-colored:var(--bcm-ui-box-shadow-3)}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hover\\:bg-gray-100:hover{background-color:oklch(.967 .003 264.542)}.inline-flex{display:inline-flex}.min-h-10{min-height:2.5rem}.min-h-6{min-height:1.5rem}.min-h-8{min-height:2rem}.w-full{width:100%}.cursor-not-allowed{cursor:not-allowed}.appearance-none{appearance:none}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-final-border-color\\]{border-color:var(--bcm-final-border-color)}.border-color-disabled{border-color:var(--bcm-ui-color-border-disabled)}.bg-\\[--bcm-final-bg-color\\]{background-color:var(--bcm-final-bg-color)}.bg-\\[--bcm-ui-color-background-disabled-default\\]{background-color:var(--bcm-ui-color-background-disabled-default)}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-px{padding-bottom:1px;padding-top:1px}.leading-none{line-height:1}.text-\\[--bcm-final-text-color\\]{color:var(--bcm-final-text-color)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.outline-0{outline-width:0}.hover\\:bg-\\[--bcm-final-hover-bg-color\\]:hover{background-color:var(--bcm-final-hover-bg-color)}.focus-visible\\:ring:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.active\\:bg-\\[--bcm-final-active-bg-color\\]:active{background-color:var(--bcm-final-active-bg-color)}.max-h-64{max-height:16rem}.min-w-10{min-width:2.5rem}.overflow-y-auto{overflow-y:auto}.bg-color-basic-panel{background-color:var(--bcm-ui-color-background-basic-panel)}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}";
 
 const BcmButton = /*@__PURE__*/ proxyCustomElement(class BcmButton extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.bcmClick = createEvent(this, "bcmClick", 1);
         this.bcmFocus = createEvent(this, "bcmFocus", 1);
@@ -299,14 +301,14 @@ const BcmButton = /*@__PURE__*/ proxyCustomElement(class BcmButton extends H {
     }
     render() {
         const { icon, position } = this.buttonIcon;
-        return (h(Host, { key: 'a9d5f590bcc4175aa663c999f5a84bee10c3c7f2' }, h("button", { key: 'c18c414edad304b4f9cd0155e683f1f9783b6fde', type: this.type, disabled: this.disabled || this.loading, "aria-label": this.label, "aria-expanded": this.expanded, "aria-controls": this.controls, "aria-disabled": this.disabled, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, style: this.buttonStyles, class: this.buttonClass({
+        return (h(Host, { key: 'a11591319f31f3ecfe6d1db5f5137f537b7cf71b' }, h("button", { key: 'e7e7876b08b2d2b82fedc97ee6d1135e886044cb', type: this.type, disabled: this.disabled || this.loading, "aria-label": this.label, "aria-expanded": this.expanded, "aria-controls": this.controls, "aria-disabled": this.disabled, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, style: this.buttonStyles, class: this.buttonClass({
                 size: this.size,
                 kind: this.kind,
                 fullWidth: this.fullWidth,
                 disabled: this.disabled,
                 loading: this.loading,
                 position: this.position,
-            }) }, this.loading && h("slot", { key: '682e48b9d4a5e4ab6fb66bf44781448fad55f720', name: "loading" }), h("span", { key: 'b201ef2563f68e42416efa2816b890b2d41867ad' }, h("slot", { key: '4b30c9c05551671c45757a7afbccaabe4dea1d9a', name: "prefix" }, position === 'prefix' && icon && h("i", { key: '618a7e811aa190f60621095dbece3d29ee133f9e', class: ' leading-none ' + icon }))), h("slot", { key: 'b3a3a7257767f3e49895c8e7963899a701cdab43' }, this.buttonText), h("span", { key: '81b97078b064ce82516cea7564c64c8a89332759' }, h("slot", { key: '4e4d3bfb4814f207f27f6efc2327575e65f69180', name: "suffix" }, position === 'suffix' && icon && h("i", { key: '75373a66baeae2a66b219626b2f3694ac7cb4179', class: ' leading-none ' + icon }))))));
+            }) }, this.loading && h("slot", { key: 'c8b923e0fcb64f9c299602ab8a6ea1e25aaf5c8d', name: "loading" }), h("span", { key: '838f85afd0355eec4c7dea0e1ae02ffa98e8e260' }, h("slot", { key: '5f65cf6f40096595d6affcb4c30cde9eef0d7614', name: "prefix" }, position === 'prefix' && icon && h("i", { key: '96425b8dd1396ef268e30c6f209b495bf7f5f6d6', class: ' leading-none ' + icon }))), h("slot", { key: 'a34f07f25c2d06aa7a60673ac0e1329063a6887a' }, this.buttonText), h("span", { key: 'a375ba2ac1411a82850b60074fdc561272bdeda6' }, h("slot", { key: '8fc1cfcdcee4c9339b4894900c5a1e03e75820b0', name: "suffix" }, position === 'suffix' && icon && h("i", { key: 'd8f5b40843d278ad2cfc0260b0a071f42d5f73a5', class: ' leading-none ' + icon }))))));
     }
     static get style() { return buttonCss; }
 }, [257, "bcm-button", {
@@ -347,6 +349,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { BcmButton as B, defineCustomElement as d };
-//# sourceMappingURL=p-DHONP_n4.js.map
+//# sourceMappingURL=p-CsIBm0J5.js.map
 
-//# sourceMappingURL=p-DHONP_n4.js.map
+//# sourceMappingURL=p-CsIBm0J5.js.map

package/dist/components/p-CsIBm0J5.js.map

@@ -0,0 +1 @@
+{"file":"p-CsIBm0J5.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/button/types.ts","src/components/button/button.css?tag=bcm-button&encapsulation=shadow","src/components/button/button.component.tsx"],"sourcesContent":["export type ButtonKind = 'primary' | 'ghost' | 'text' | 'outline';\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'reset' | 'submit';\nexport type ButtonStatus = 'default' | 'success' | 'error' | 'warning' | 'info';\nexport type IconPosition = 'prefix' | 'suffix';\n\n// Button group position\nexport type ButtonPosition = 'first' | 'middle' | 'last' | null;\n\nexport interface VariantOption {\n  text: string;\n  icon?: string;\n  iconPosition?: IconPosition;\n  status?: ButtonStatus;\n  kind?: ButtonKind;\n}\n\nexport const variantOptions: Record<string, VariantOption> = {\n  save: {\n    text: 'Save',\n    status: 'success',\n    icon: 'far fa-save',\n    iconPosition: 'prefix',\n    kind: 'primary',\n  },\n  ok: {\n    text: 'Ok',\n    status: 'success',\n    icon: 'far fa-check',\n    iconPosition: 'prefix',\n  },\n  new: {\n    text: 'New',\n    status: 'success',\n    icon: 'far fa-plus',\n    iconPosition: 'prefix',\n  },\n  add: {\n    text: 'Add',\n    status: 'success',\n    icon: 'far fa-plus',\n    iconPosition: 'prefix',\n  },\n  create: {\n    text: 'Create',\n    status: 'success',\n    icon: 'far fa-plus',\n    iconPosition: 'prefix',\n  },\n  prev: {\n    text: 'Prev',\n    status: 'default',\n    icon: 'far fa-arrow-left',\n    iconPosition: 'prefix',\n  },\n  next: {\n    text: 'Next',\n    status: 'default',\n    icon: 'far fa-arrow-right',\n    iconPosition: 'suffix',\n  },\n  apply: {\n    text: 'Apply',\n    status: 'default',\n    icon: 'far fa-check-circle',\n    iconPosition: 'prefix',\n  },\n  submit: {\n    text: 'Submit',\n    status: 'default',\n    icon: 'far fa-save',\n    iconPosition: 'prefix',\n  },\n  send: {\n    text: 'Send',\n    status: 'success',\n    icon: 'far fa-paper-plane',\n    iconPosition: 'prefix',\n  },\n  delete: {\n    text: 'Delete',\n    status: 'error',\n    icon: 'far fa-trash',\n    iconPosition: 'prefix',\n  },\n  cancel: {\n    text: 'Cancel',\n    status: 'error',\n    icon: 'far fa-times',\n    iconPosition: 'prefix',\n  },\n  decline: {\n    text: 'Decline',\n    status: 'error',\n    icon: 'far fa-ban',\n    iconPosition: 'prefix',\n  },\n  close: {\n    text: 'Close',\n    status: 'error',\n    icon: 'far fa-times-circle',\n    iconPosition: 'prefix',\n  },\n  archive: {\n    text: 'Archive',\n    status: 'error',\n    icon: 'far fa-folder-open',\n    iconPosition: 'prefix',\n  },\n  remove: {\n    text: 'Remove',\n    status: 'error',\n    icon: 'far fa-minus-circle',\n    iconPosition: 'prefix',\n  },\n  edit: {\n    text: 'Edit',\n    status: 'default',\n    icon: 'far fa-edit',\n    iconPosition: 'prefix',\n  },\n  export: {\n    text: 'Export',\n    status: 'default',\n    icon: 'far fa-sign-out',\n    iconPosition: 'prefix',\n  },\n  import: {\n    text: 'Import',\n    status: 'default',\n    icon: 'far fa-sign-in',\n    iconPosition: 'prefix',\n  },\n  filter: {\n    text: 'Filter',\n    status: 'default',\n    icon: 'far fa-filter',\n    iconPosition: 'prefix',\n  },\n  update: {\n    text: 'Update',\n    status: 'default',\n    icon: 'far fa-sync',\n    iconPosition: 'prefix',\n  },\n  reset: {\n    text: 'Reset',\n    status: 'default',\n    icon: 'far fa-sync',\n    iconPosition: 'prefix',\n  },\n  download: {\n    text: 'Download',\n    status: 'default',\n    icon: 'far fa-download',\n    iconPosition: 'prefix',\n  },\n};\n\nexport type ButtonVariant = keyof typeof variantOptions;\n",":host {\n  display: inline-flex;\n  position: relative;\n  height: fit-content;\n  width: fit-content;\n}\n\n:host([full-width]) {\n  width: 100%;\n}\n\n:host([position='first']) .bcm-button {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n\n:host([position='middle']) .bcm-button {\n  border-radius: 0;\n}\n\n:host([position='last']) .bcm-button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n:host([position='first'].orientation-vertical) .bcm-button {\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  border-top-right-radius: var(--bcm-ui-border-radius, 4px);\n  border-top-left-radius: var(--bcm-ui-border-radius, 4px);\n}\n\n:host([position='middle'].orientation-vertical) .bcm-button {\n  border-radius: 0;\n}\n\n:host([position='last'].orientation-vertical) .bcm-button {\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: var(--bcm-ui-border-radius, 4px);\n  border-bottom-left-radius: var(--bcm-ui-border-radius, 4px);\n}\n","import { Component, Prop, h, Event, EventEmitter, Host } from '@stencil/core';\nimport { ButtonKind, ButtonSize, ButtonType, ButtonStatus, ButtonVariant, IconPosition, ButtonPosition, variantOptions } from './types';\nimport { tv } from '@utils/tv';\n\n@Component({\n  tag: 'bcm-button',\n  styleUrl: 'button.css',\n  shadow: true,\n})\nexport class BcmButton {\n  /** Defines the main visual style of the button */\n  @Prop()\n  kind: ButtonKind = 'primary';\n\n  /** Controls the button size */\n  @Prop()\n  size: ButtonSize = 'medium';\n\n  /** Defines the button's status/state color */\n  @Prop()\n  status: ButtonStatus = 'default';\n\n  /** Predefined button variants */\n  @Prop()\n  variant?: ButtonVariant;\n\n  /** Button position in button group (first, middle, last) */\n  @Prop({ reflect: true })\n  position?: ButtonPosition;\n\n  /** Icon class name */\n  @Prop()\n  icon?: string;\n\n  /** Icon placement (prefix/suffix) */\n  @Prop()\n  iconPosition: IconPosition = 'prefix';\n\n  /** Icon-only button mode */\n  @Prop()\n  iconOnly = false;\n\n  /** Full width button */\n  @Prop({ attribute: 'full-width', reflect: true })\n  fullWidth = false;\n\n  /** HTML button type */\n  @Prop()\n  type: ButtonType = 'button';\n\n  /** Loading state */\n  @Prop()\n  loading = false;\n\n  /** Disabled state */\n  @Prop()\n  disabled = false;\n\n  /** Button text content */\n  @Prop()\n  text?: string;\n\n  /** Active state */\n  @Prop()\n  active = false;\n\n  /** Form association */\n  @Prop()\n  form: string;\n\n  @Prop()\n  value: string;\n\n  @Prop()\n  name: string;\n\n  /** Screen reader label */\n  @Prop()\n  label: string;\n\n  /** Expanded state for expandable content */\n  @Prop()\n  expanded?: string;\n\n  /** ID of controlled element */\n  @Prop()\n  controls: string;\n\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmClick: EventEmitter<MouseEvent>;\n\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmFocus: EventEmitter<FocusEvent>;\n\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n  })\n  bcmBlur: EventEmitter<FocusEvent>;\n\n  private handleClick = (event: MouseEvent) => {\n    if (!this.disabled && !this.loading) {\n      this.bcmClick.emit(event);\n    }\n  };\n\n  private handleFocus = (event: FocusEvent) => {\n    this.bcmFocus.emit(event);\n  };\n\n  private handleBlur = (event: FocusEvent) => {\n    this.bcmBlur.emit(event);\n  };\n\n  private get buttonText(): string {\n    return this.text || (this.variant && variantOptions[this.variant] ? variantOptions[this.variant].text : '');\n  }\n\n  private get buttonIcon(): { icon?: string; position: IconPosition } {\n    if (this.variant && variantOptions[this.variant]?.icon) {\n      return {\n        icon: variantOptions[this.variant].icon,\n        position: variantOptions[this.variant].iconPosition || 'prefix',\n      };\n    }\n\n    return {\n      icon: this.icon,\n      position: this.iconPosition,\n    };\n  }\n\n  private get buttonStatus(): ButtonStatus {\n    return this.variant && variantOptions[this.variant] ? variantOptions[this.variant].status : this.status;\n  }\n\n  private get buttonStyles() {\n    const status = this.buttonStatus === 'default' ? 'primary' : this.buttonStatus;\n\n    // These are the internal default styles based on component props (kind, status)\n    const kindStyleMap = {\n      primary: {\n        '--bcm-button-bg': `var(--bcm-ui-color-background-${status}-default)`,\n        '--bcm-button-bg-hover': `var(--bcm-ui-color-background-${status}-hover)`,\n        '--bcm-button-bg-active': `var(--bcm-ui-color-background-${status}-active)`,\n        '--bcm-button-border': 'transparent',\n        '--bcm-button-text': 'var(--bcm-ui-color-text-base)',\n      },\n      outline: {\n        '--bcm-button-bg': 'var(--bcm-ui-color-background-default-default)',\n        '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n        '--bcm-button-border': `var(--bcm-ui-color-border-${this.buttonStatus})`,\n        '--bcm-button-text': `var(--bcm-ui-color-text-${this.buttonStatus})`,\n      },\n      ghost: {\n        '--bcm-button-bg': 'transparent',\n        '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n        '--bcm-button-border': 'transparent',\n        '--bcm-button-text': `var(--bcm-ui-color-text-${this.buttonStatus})`,\n      },\n      text: {\n        '--bcm-button-bg': 'transparent',\n        '--bcm-button-bg-hover': 'var(--bcm-ui-color-background-default-hover)',\n        '--bcm-button-bg-active': 'var(--bcm-ui-color-background-default-active)',\n        '--bcm-button-border': 'transparent',\n        '--bcm-button-text': `var(--bcm-ui-color-text-${status})`,\n      },\n    };\n    const internalDefaultStyles = kindStyleMap[this.kind];\n\n    // These are the \"final\" CSS custom properties used by the component's styling.\n    // They use the \"--bcm-button-custom-...\" token if provided by the user,\n    // otherwise, they fall back to the internal \"--bcm-button-...\" style defined above.\n    const finalEffectiveStyles = {\n      '--bcm-final-text-color': `var(--bcm-button-custom-text-color, ${internalDefaultStyles['--bcm-button-text']})`,\n      '--bcm-final-border-color': `var(--bcm-button-custom-border-color, ${internalDefaultStyles['--bcm-button-border']})`,\n      '--bcm-final-bg-color': `var(--bcm-button-custom-bg-color, ${internalDefaultStyles['--bcm-button-bg']})`,\n      '--bcm-final-hover-bg-color': `var(--bcm-button-custom-hover-bg-color, ${internalDefaultStyles['--bcm-button-bg-hover']})`,\n      '--bcm-final-active-bg-color': `var(--bcm-button-custom-active-bg-color, ${internalDefaultStyles['--bcm-button-bg-active']})`,\n    };\n\n    // return kindStyleMap[this.kind];\n\n    return {\n      ...internalDefaultStyles, // Provides the fallback values like --bcm-button-text\n      ...finalEffectiveStyles, // Defines the --bcm-final-xxx tokens that handle the override logic\n    };\n  }\n\n  private buttonClass = tv(\n    {\n      base: 'bcm-button appearance-none inline-flex items-center justify-center border border-solid rounded outline-0',\n      variants: {\n        size: {\n          small: 'text-size-4 py-px px-2 min-h-6',\n          medium: 'text-size-5 py-0.5 px-3 min-h-8',\n          large: 'text-size-6 py-1 px-3 min-h-10',\n        },\n        kind: {\n          primary: 'kind-primary',\n          ghost: 'kind-ghost',\n          text: 'kind-text',\n          outline: 'kind-outline',\n        },\n        fullWidth: {\n          true: 'full-width w-full',\n        },\n        disabled: {\n          true: 'disabled cursor-not-allowed bg-[--bcm-ui-color-background-disabled-default] text-color-disabled border-color-disabled',\n          false: [\n            'cursor-pointer',\n            'bg-[--bcm-final-bg-color] text-[--bcm-final-text-color] border-[--bcm-final-border-color]',\n            'hover:bg-[--bcm-final-hover-bg-color]',\n            'active:bg-[--bcm-final-active-bg-color]',\n            'focus-visible:ring',\n          ],\n        },\n        loading: {\n          true: '',\n        },\n        position: {\n          first: 'position-first',\n          middle: 'position-middle',\n          last: 'position-last',\n        },\n      },\n      defaultVariants: {\n        size: 'medium',\n        kind: 'primary',\n        fullWidth: false,\n        disabled: false,\n        loading: false,\n      },\n    },\n    {\n      twMerge: false,\n    },\n  );\n\n  render() {\n    const { icon, position } = this.buttonIcon;\n\n    return (\n      <Host>\n        <button\n          type={this.type}\n          disabled={this.disabled || this.loading}\n          aria-label={this.label}\n          aria-expanded={this.expanded}\n          aria-controls={this.controls}\n          aria-disabled={this.disabled}\n          onClick={this.handleClick}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n          style={this.buttonStyles}\n          class={this.buttonClass({\n            size: this.size,\n            kind: this.kind,\n            fullWidth: this.fullWidth,\n            disabled: this.disabled,\n            loading: this.loading,\n            position: this.position,\n          })}\n        >\n          {this.loading && <slot name=\"loading\"></slot>}\n          <span>\n            <slot name=\"prefix\">{position === 'prefix' && icon && <i class={' leading-none ' + icon}></i>}</slot>\n          </span>\n          <slot>{this.buttonText}</slot>\n          <span>\n            <slot name=\"suffix\">{position === 'suffix' && icon && <i class={' leading-none ' + icon}></i>}</slot>\n          </span>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CzcTU1ty.js → p-DBDSgIvP.js}

@@ -502,7 +502,7 @@ const flip$1 = function (options) {
           if (!ignoreCrossAxisOverflow ||
           // We leave the current main axis only if every placement on that axis
           // overflows the main axis.
-          overflowsData.every(d => d.overflows[0] > 0 && getSideAxis(d.placement) === initialSideAxis)) {
+          overflowsData.every(d => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
             // Try next placement and re-run the lifecycle.
             return {
               data: {
@@ -774,7 +774,7 @@ function isOverflowElement(element) {
     overflowX,
     overflowY,
     display
-  } = getComputedStyle(element);
+  } = getComputedStyle$1(element);
   return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
 }
 const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
@@ -796,7 +796,7 @@ const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspect
 const containValues = ['paint', 'layout', 'strict', 'content'];
 function isContainingBlock(elementOrCss) {
   const webkit = isWebKit();
-  const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
+  const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   // https://drafts.csswg.org/css-transforms-2/#individual-transforms
@@ -822,7 +822,7 @@ const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#documen
 function isLastTraversableNode(node) {
   return lastTraversableNodeNames.has(getNodeName(node));
 }
-function getComputedStyle(element) {
+function getComputedStyle$1(element) {
   return getWindow(element).getComputedStyle(element);
 }
 function getNodeScroll(element) {
@@ -884,7 +884,7 @@ function getFrameElement(win) {
 }
 
 function getCssDimensions(element) {
-  const css = getComputedStyle(element);
+  const css = getComputedStyle$1(element);
   // In testing environments, the `width` and `height` properties are empty
   // strings for SVG elements, returning NaN. Fallback to `0` in this case.
   let width = parseFloat(css.width) || 0;
@@ -989,7 +989,7 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
     while (currentIFrame && offsetParent && offsetWin !== currentWin) {
       const iframeScale = getScale(currentIFrame);
       const iframeRect = currentIFrame.getBoundingClientRect();
-      const css = getComputedStyle(currentIFrame);
+      const css = getComputedStyle$1(currentIFrame);
       const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
       const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
       x *= iframeScale.x;
@@ -1020,14 +1020,9 @@ function getWindowScrollBarX(element, rect) {
   return rect.left + leftScroll;
 }
 
-function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
-  if (ignoreScrollbarX === void 0) {
-    ignoreScrollbarX = false;
-  }
+function getHTMLOffset(documentElement, scroll) {
   const htmlRect = documentElement.getBoundingClientRect();
-  const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
-  // RTL <body> scrollbar.
-  getWindowScrollBarX(documentElement, htmlRect));
+  const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
   const y = htmlRect.top + scroll.scrollTop;
   return {
     x,
@@ -1066,7 +1061,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
       offsets.y = offsetRect.y + offsetParent.clientTop;
     }
   }
-  const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
+  const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
   return {
     width: rect.width * scale.x,
     height: rect.height * scale.y,
@@ -1089,7 +1084,7 @@ function getDocumentRect(element) {
   const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
   let x = -scroll.scrollLeft + getWindowScrollBarX(element);
   const y = -scroll.scrollTop;
-  if (getComputedStyle(body).direction === 'rtl') {
+  if (getComputedStyle$1(body).direction === 'rtl') {
     x += max(html.clientWidth, body.clientWidth) - width;
   }
   return {
@@ -1100,6 +1095,10 @@ function getDocumentRect(element) {
   };
 }
 
+// Safety check: ensure the scrollbar space is reasonable in case this
+// calculation is affected by unusual styles.
+// Most scrollbars leave 15-18px of space.
+const SCROLLBAR_MAX = 25;
 function getViewportRect(element, strategy) {
   const win = getWindow(element);
   const html = getDocumentElement(element);
@@ -1117,6 +1116,24 @@ function getViewportRect(element, strategy) {
       y = visualViewport.offsetTop;
     }
   }
+  const windowScrollbarX = getWindowScrollBarX(html);
+  // <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
+  // visual width of the <html> but this is not considered in the size
+  // of `html.clientWidth`.
+  if (windowScrollbarX <= 0) {
+    const doc = html.ownerDocument;
+    const body = doc.body;
+    const bodyStyles = getComputedStyle(body);
+    const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
+    const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
+    if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
+      width -= clippingStableScrollbarWidth;
+    }
+  } else if (windowScrollbarX <= SCROLLBAR_MAX) {
+    // If the <body> scrollbar is on the left, the width needs to be extended
+    // by the scrollbar amount so there isn't extra space on the right.
+    width += windowScrollbarX;
+  }
   return {
     width,
     height,
@@ -1167,7 +1184,7 @@ function hasFixedPositionAncestor(element, stopNode) {
   if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
     return false;
   }
-  return getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
+  return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
 }
 
 // A "clipping ancestor" is an `overflow` element with the characteristic of
@@ -1180,12 +1197,12 @@ function getClippingElementAncestors(element, cache) {
   }
   let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
   let currentContainingBlockComputedStyle = null;
-  const elementIsFixed = getComputedStyle(element).position === 'fixed';
+  const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
   let currentNode = elementIsFixed ? getParentNode(element) : element;
 
   // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
   while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
-    const computedStyle = getComputedStyle(currentNode);
+    const computedStyle = getComputedStyle$1(currentNode);
     const currentNodeIsContaining = isContainingBlock(currentNode);
     if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
       currentContainingBlockComputedStyle = null;
@@ -1286,11 +1303,11 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
 }
 
 function isStaticPositioned(element) {
-  return getComputedStyle(element).position === 'static';
+  return getComputedStyle$1(element).position === 'static';
 }
 
 function getTrueOffsetParent(element, polyfill) {
-  if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
+  if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
     return null;
   }
   if (polyfill) {
@@ -1351,7 +1368,7 @@ const getElementRects = async function (data) {
 };
 
 function isRTL(element) {
-  return getComputedStyle(element).direction === 'rtl';
+  return getComputedStyle$1(element).direction === 'rtl';
 }
 
 const platform = {
@@ -1593,6 +1610,6 @@ const computePosition = (reference, floating, options) => {
 };
 
 export { autoUpdate as a, arrow as b, computePosition as c, flip as f, offset as o, shift as s };
-//# sourceMappingURL=p-CzcTU1ty.js.map
+//# sourceMappingURL=p-DBDSgIvP.js.map
 
-//# sourceMappingURL=p-CzcTU1ty.js.map
+//# sourceMappingURL=p-DBDSgIvP.js.map