@actabldesign/bellhop-core 0.3.0 → 0.3.1

package/dist/esm/bh-command-bar.entry.js

@@ -0,0 +1,307 @@
+import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-CTHvNfIu.js';
+import { c as createDismissalManager } from './dismissal-manager-DPXWKjyK.js';
+import { m as matchesHotkey } from './hotkeys-CBTS9Vhx.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
+import { B as BellhopI18n, r as resolveI18n } from './i18n-BNVOtH-1.js';
+import './keyboard-helpers-Dg0_t7Yy.js';
+import './keyboard-constants-zdFuIabL.js';
+
+const bhCommandBarCss = () => `:host{display:contents}.command-overlay{position:fixed;inset:0;z-index:var(--bh-z-index-modal-backdrop, 1040);display:flex;align-items:flex-start;justify-content:center;padding-top:15vh;background:var(--color-surface-overlay, rgba(12, 17, 29, 0.6))}.command-panel{display:flex;flex-direction:column;width:var(--bh-command-bar-width, 560px);max-width:calc(100vw - 2 * var(--spacing-xl, 20px));max-height:var(--bh-command-bar-max-height, 60vh);overflow:hidden;background:var(--color-bg-primary, #fff);border-radius:var(--radius-lg, 12px);box-shadow:var(--shadow-xl, 0 20px 24px -4px rgba(16, 24, 40, 0.1))}.search-row{display:flex;align-items:center;gap:var(--spacing-sm, 8px);padding:var(--spacing-lg, 16px);border-bottom:1px solid var(--color-border-secondary, #eaecf0)}.search-icon{font-size:var(--icon-size-md, 20px);color:var(--color-text-tertiary, #667085)}.search-input{flex:1;min-width:0;font-family:var(--font-inter, inherit);font-size:var(--text-md-size, 1rem);color:var(--color-text-primary, #101828);background:transparent;border:none;outline:none}.search-input::placeholder{color:var(--color-text-placeholder, #667085)}.sections{overflow-y:auto}.section{padding:var(--spacing-sm, 8px) 0}.section:not(:last-child){border-bottom:1px solid var(--color-border-secondary, #eaecf0)}.section-heading{padding:var(--spacing-sm, 8px) var(--spacing-lg, 16px);font-family:var(--font-inter, inherit);font-size:var(--text-xs-size, 0.75rem);font-weight:var(--weight-medium, 500);color:var(--color-text-tertiary, #667085)}.section-list{margin:0;padding:0;list-style:none}.item{display:flex;gap:var(--spacing-md, 12px);align-items:center;width:100%;padding:var(--spacing-sm, 8px) var(--spacing-lg, 16px);text-align:left;font-family:var(--font-inter, inherit);background:transparent;border:none;cursor:pointer}.item.active{background:var(--color-bg-secondary, #f9fafb)}:host([size=md]) .item{padding-top:var(--spacing-md, 12px);padding-bottom:var(--spacing-md, 12px)}.item-icon{flex-shrink:0;font-size:var(--icon-size-md, 20px);color:var(--color-text-secondary, #475467)}.item-text{display:flex;flex:1;flex-direction:column;gap:var(--spacing-xxs, 2px);min-width:0}.item-title-row{display:flex;gap:var(--spacing-sm, 8px);align-items:baseline;min-width:0}.item-label{font-size:var(--text-sm-size, 0.875rem);font-weight:var(--weight-medium, 500);color:var(--color-text-primary, #101828);white-space:nowrap}.item-path{overflow:hidden;font-size:var(--text-sm-size, 0.875rem);color:var(--color-text-interactive, #175cd3);text-overflow:ellipsis;white-space:nowrap}.item-description{font-size:var(--text-sm-size, 0.875rem);color:var(--color-text-secondary, #475467)}.item-shortcut{flex-shrink:0;margin-left:auto}.empty{padding:var(--spacing-3xl, 40px) var(--spacing-lg, 16px);font-family:var(--font-inter, inherit);font-size:var(--text-sm-size, 0.875rem);color:var(--color-text-secondary, #475467);text-align:center}.footer{display:flex;gap:var(--spacing-lg, 16px);align-items:center;padding:var(--spacing-sm, 8px) var(--spacing-lg, 16px);border-top:1px solid var(--color-border-secondary, #eaecf0)}.footer-hint{display:inline-flex;gap:var(--spacing-xs, 4px);align-items:center;font-family:var(--font-inter, inherit);font-size:var(--text-xs-size, 0.75rem);color:var(--color-text-secondary, #475467)}.footer-back{padding:0;background:transparent;border:none;cursor:pointer}.footer-settings{margin-left:auto}`;
+
+const initialsOf = (name) => (name ?? "")
+    .split(/\s+/)
+    .filter(Boolean)
+    .slice(0, 2)
+    .map((part) => part[0]?.toUpperCase() ?? "")
+    .join("");
+const BhCommandBar = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.bhOpen = createEvent(this, "bhOpen");
+        this.bhClose = createEvent(this, "bhClose");
+        this.bhChange = createEvent(this, "bhChange");
+        this.bhItemClick = createEvent(this, "bhItemClick");
+        this.bhAction = createEvent(this, "bhAction");
+    }
+    logger = createComponentLogger("bh-command-bar");
+    dismissalManager;
+    i18nUnsubscribe;
+    inputRef;
+    pendingFocus = false;
+    _i18nVersion = 0;
+    get el() { return getElement(this); }
+    /**
+     * Command sections (array or JSON string).
+     */
+    sections = [];
+    /**
+     * Whether the palette is open. Reflects so consumers can read/drive it.
+     */
+    open = false;
+    /**
+     * Global shortcut that toggles the palette (e.g. "cmd+k"). When set, a
+     * document-level listener is registered; "cmd" matches ⌘ on macOS and
+     * Ctrl elsewhere. Omit to control the palette programmatically only.
+     */
+    hotkey;
+    /**
+     * Search input placeholder. Allows i18n.
+     */
+    placeholder = "Type a command or search";
+    /**
+     * Empty-state message. Allows i18n.
+     */
+    emptyMessage = "No results found";
+    /**
+     * List density
+     */
+    size = "md";
+    /**
+     * Footer hint labels. Allow i18n.
+     */
+    navigateLabel = "Navigate";
+    selectLabel = "Select";
+    closeLabel = "Close";
+    backLabel = "Return to parent";
+    /**
+     * Accessible label for the footer settings button. Allows i18n.
+     */
+    settingsAriaLabel = "Command bar settings";
+    query = "";
+    activeIndex = -1;
+    levelStack = [];
+    /**
+     * Emitted when the palette opens.
+     */
+    bhOpen;
+    /**
+     * Emitted when the palette closes.
+     */
+    bhClose;
+    /**
+     * Emitted when the search query changes. Detail carries the query.
+     */
+    bhChange;
+    /**
+     * Emitted when a leaf item is selected. Detail carries the item and its
+     * ancestor chain (outermost first).
+     */
+    bhItemClick;
+    /**
+     * Emitted for auxiliary actions (footer settings gear).
+     */
+    bhAction;
+    handleOpenChange(isOpen) {
+        if (isOpen) {
+            this.dismissalManager?.enable();
+            this.pendingFocus = true;
+        }
+        else {
+            this.dismissalManager?.disable();
+            this.resetNavigation();
+        }
+    }
+    componentWillLoad() {
+        this.i18nUnsubscribe = BellhopI18n.onLocaleChange(() => {
+            this._i18nVersion++;
+        });
+    }
+    componentDidLoad() {
+        this.dismissalManager = createDismissalManager(this.el, {
+            onDismiss: () => this.setOpen(false),
+            escapeKey: true,
+            clickOutside: true,
+            focusLoss: false,
+        });
+        if (this.hotkey) {
+            document.addEventListener("keydown", this.handleGlobalKeyDown);
+        }
+        if (this.open) {
+            this.dismissalManager.enable();
+            this.pendingFocus = true;
+            this.focusPendingInput();
+        }
+    }
+    componentDidRender() {
+        this.focusPendingInput();
+    }
+    disconnectedCallback() {
+        this.dismissalManager?.destroy();
+        document.removeEventListener("keydown", this.handleGlobalKeyDown);
+        this.i18nUnsubscribe?.();
+    }
+    /**
+     * Open the palette.
+     */
+    async show() {
+        this.setOpen(true);
+    }
+    /**
+     * Close the palette.
+     */
+    async hide() {
+        this.setOpen(false);
+    }
+    parseSections() {
+        if (typeof this.sections !== "string") {
+            return this.sections;
+        }
+        if (this.sections.trim() === "") {
+            return [];
+        }
+        try {
+            return JSON.parse(this.sections);
+        }
+        catch (error) {
+            this.logger.error("Invalid sections JSON", error instanceof Error ? error : new Error(String(error)));
+            return [];
+        }
+    }
+    /** Sections for the current drill-down level */
+    currentSections() {
+        const level = this.levelStack.at(-1);
+        if (level) {
+            return [{ id: level.id, items: level.children ?? [] }];
+        }
+        return this.parseSections();
+    }
+    matchesQuery(item) {
+        const query = this.query.trim().toLowerCase();
+        if (!query) {
+            return true;
+        }
+        return [item.label, item.description, item.path]
+            .filter((text) => Boolean(text))
+            .some((text) => text.toLowerCase().includes(query));
+    }
+    visibleSections() {
+        return this.currentSections()
+            .map((section) => ({
+            ...section,
+            items: section.items.filter((item) => this.matchesQuery(item)),
+        }))
+            .filter((section) => section.items.length > 0);
+    }
+    flatItems() {
+        return this.visibleSections().flatMap((section) => section.items.map((item) => ({ item, sectionId: section.id })));
+    }
+    setOpen(isOpen) {
+        if (this.open === isOpen) {
+            return;
+        }
+        this.open = isOpen;
+        if (isOpen) {
+            this.bhOpen.emit();
+        }
+        else {
+            this.bhClose.emit();
+        }
+    }
+    resetNavigation() {
+        this.query = "";
+        this.activeIndex = -1;
+        this.levelStack = [];
+    }
+    focusPendingInput() {
+        if (!(this.pendingFocus && this.inputRef)) {
+            return;
+        }
+        this.pendingFocus = false;
+        this.inputRef.focus();
+    }
+    selectItem(flat) {
+        if (flat.item.children?.length) {
+            this.levelStack = [...this.levelStack, flat.item];
+            this.query = "";
+            this.activeIndex = -1;
+            return;
+        }
+        this.bhItemClick.emit({ item: flat.item, parents: [...this.levelStack] });
+        this.setOpen(false);
+    }
+    popLevel() {
+        if (this.levelStack.length === 0) {
+            return;
+        }
+        this.levelStack = this.levelStack.slice(0, -1);
+        this.query = "";
+        this.activeIndex = -1;
+    }
+    handleGlobalKeyDown = (event) => {
+        if (this.hotkey && matchesHotkey(event, this.hotkey)) {
+            event.preventDefault();
+            this.setOpen(!this.open);
+        }
+    };
+    handleInput = (event) => {
+        this.query = event.target.value;
+        this.activeIndex = -1;
+        this.bhChange.emit({ query: this.query });
+    };
+    handleInputKeyDown = (event) => {
+        const items = this.flatItems();
+        switch (event.key) {
+            case "ArrowDown":
+                event.preventDefault();
+                this.activeIndex = Math.min(this.activeIndex + 1, items.length - 1);
+                break;
+            case "ArrowUp":
+                event.preventDefault();
+                this.activeIndex = Math.max(this.activeIndex - 1, 0);
+                break;
+            case "Enter": {
+                const active = items[this.activeIndex];
+                if (active) {
+                    event.preventDefault();
+                    this.selectItem(active);
+                }
+                break;
+            }
+            case "ArrowLeft":
+                if (this.query === "" && this.levelStack.length > 0) {
+                    event.preventDefault();
+                    this.popLevel();
+                }
+                break;
+        }
+    };
+    t(key, propValue, fallback) {
+        return resolveI18n("bh-command-bar", key, propValue, fallback);
+    }
+    renderLeading(item) {
+        if (item.author || item.avatarSrc) {
+            return (h("bh-avatar", { alt: item.author ?? "Avatar", imageSrc: item.avatarSrc, size: "sm", text: initialsOf(item.author), variant: item.avatarSrc ? "image" : "text" }));
+        }
+        if (item.icon) {
+            return (h("span", { "aria-hidden": "true", class: "material-symbols-outlined item-icon" }, item.icon));
+        }
+        return null;
+    }
+    renderItem(flat, index) {
+        const { item } = flat;
+        const active = index === this.activeIndex;
+        return (h("li", { key: item.id }, h("button", { "aria-selected": active ? "true" : "false", class: { item: true, active, stacked: Boolean(item.description) }, id: `command-item-${item.id}`, onClick: () => this.selectItem(flat), onMouseEnter: () => {
+                this.activeIndex = index;
+            }, role: "option", type: "button" }, this.renderLeading(item), h("span", { class: "item-text" }, h("span", { class: "item-title-row" }, h("span", { class: "item-label" }, item.label), item.path && h("span", { class: "item-path" }, "/ ", item.path)), item.description && (h("span", { class: "item-description" }, item.description))), item.shortcut && (h("bh-kbd", { class: "item-shortcut", keys: item.shortcut, size: "sm" })))));
+    }
+    render() {
+        const sections = this.visibleSections();
+        const flat = this.flatItems();
+        const activeItem = flat[this.activeIndex];
+        let flatIndex = -1;
+        return (h(Host, { key: '54e2f4837c8b0fc4e5b92c52b628f80397ed6445' }, this.open && (h("div", { key: '9a5d11120654521375e73ae75086a65bf890b2df', class: "command-overlay", part: "overlay" }, h("div", { key: '746412fe9951d6559811ecfb2b9e745ac0ff9566', "aria-label": this.t("placeholder", this.placeholder, "Type a command or search"), class: "command-panel", part: "panel", role: "dialog" }, h("div", { key: '4768665e2216175e2584677a6f674d3798abec6a', class: "search-row", part: "search" }, h("span", { key: 'f8f60412e2fb7e99c1feade97c55edf6daa113ac', "aria-hidden": "true", class: "material-symbols-outlined search-icon" }, "search"), h("input", { key: '5fccf974d7e8135fb342220e87c5e3cc46cc2ea8', "aria-activedescendant": activeItem
+                ? `command-item-${activeItem.item.id}`
+                : undefined, "aria-controls": "command-listbox", "aria-expanded": "true", class: "search-input", onInput: this.handleInput, onKeyDown: this.handleInputKeyDown, placeholder: this.t("placeholder", this.placeholder, "Type a command or search"), ref: (el) => (this.inputRef = el), role: "combobox", type: "text", value: this.query }), this.hotkey && (h("bh-kbd", { key: 'a1679a592009701871314b4d72273951561519e2', class: "search-hotkey", keys: this.hotkey, size: "sm" }))), sections.length === 0 ? (h("div", { class: "empty", part: "empty" }, this.t("emptyMessage", this.emptyMessage, "No results found"))) : (h("div", { class: "sections", id: "command-listbox", role: "listbox" }, sections.map((section) => (h("div", { class: "section", key: section.id, part: "section" }, section.heading && (h("div", { class: "section-heading", part: "section-heading" }, section.heading)), h("ul", { class: "section-list" }, section.items.map((item) => {
+            flatIndex++;
+            return this.renderItem({ item, sectionId: section.id }, flatIndex);
+        }))))))), h("div", { key: '19b300a97b04317f08901bca8c68addf28c9f0c0', class: "footer", part: "footer" }, h("span", { key: '54fc5ce933582c61f0b0a443b6a5393a3bb7a611', class: "footer-hint" }, h("bh-kbd", { key: 'a85a3d7da6f07f2804f127fcdc916aef1d3cf11b', keys: "up", size: "sm" }), h("bh-kbd", { key: 'ba853722f0108733feda41950b3ab6c4c0b5f1f9', keys: "down", size: "sm" }), this.t("navigateLabel", this.navigateLabel, "Navigate")), h("span", { key: '029347425d3ef4c4668b1252374eaae406edd523', class: "footer-hint" }, h("bh-kbd", { key: 'bc5cf9b570e063ff784731725a167ea719667e84', keys: "enter", size: "sm" }), this.t("selectLabel", this.selectLabel, "Select")), h("span", { key: '1045763438aaadf482a0b029565576d40b19f0a8', class: "footer-hint" }, h("bh-kbd", { key: 'f28c3cc16183d99a9b8170235ebf4a938444a17c', keys: "esc", size: "sm" }), this.t("closeLabel", this.closeLabel, "Close")), this.levelStack.length > 0 && (h("button", { key: '869eb3df053faf976a2a45162efb0616fe23836b', class: "footer-hint footer-back", onClick: () => this.popLevel(), type: "button" }, h("bh-kbd", { key: '1f6f4458ceef294533a79408a1c00ab4daa050e2', keys: "left", size: "sm" }), this.t("backLabel", this.backLabel, "Return to parent"))), h("span", { key: '963d5c13c0afb675dbad3bac65a6e1f68888eaa7', class: "footer-settings" }, h("bh-button-icon", { key: '82bc87df8a916a8c8ef586bfc2f5f51f684fc16f', ariaLabel: this.t("settingsAriaLabel", this.settingsAriaLabel, "Command bar settings"), hierarchy: "tertiary", iconName: "settings", onClick: () => this.bhAction.emit({ action: "settings" }), size: "sm" }))))))));
+    }
+    static get watchers() { return {
+        "open": [{
+                "handleOpenChange": 0
+            }]
+    }; }
+};
+BhCommandBar.style = bhCommandBarCss();
+
+export { BhCommandBar as bh_command_bar };

package/dist/esm/bh-container-footer.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CTHvNfIu.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 
 const bhContainerFooterCss = () => `@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}@layer bh-tokens,bh-base,bh-variants,bh-states,bh-utilities; @layer bh-tokens{:host{--bh-container-footer-bg:var(--color-bg-primary);--bh-container-footer-border-color:var(--color-border-secondary);--bh-container-footer-border-radius:var(--radius-xl);--bh-container-footer-content-padding:var(--spacing-md) var(--spacing-2xl);--bh-container-footer-minimal-padding:var(--spacing-sm) var(--spacing-2xl)}}@layer bh-base{.container-footer{background:var(--bh-container-footer-bg);border:1px solid var(--bh-container-footer-border-color);border-top:1px solid var(--bh-container-footer-border-color);border-radius:0 0 var(--bh-container-footer-border-radius) var(--bh-container-footer-border-radius);box-sizing:border-box;width:100%}.container-footer-content{display:flex;justify-content:flex-end;align-items:center;padding:var(--bh-container-footer-content-padding)}}@layer bh-variants{.container-footer-minimal .container-footer-content{padding:var(--bh-container-footer-minimal-padding)}}`;
 
@@ -41,7 +42,7 @@ const BhContainerFooter = class {
             "container-footer": true,
             [`container-footer-${this.density}`]: true,
         };
-        return (h(Host, { key: '8fd182223909b6d4b609c7cd933e50d1cc8270de' }, h("div", { key: 'de087dffdb49b74c084e0920fd3bd23dfea3db5c', class: footerClasses, part: "footer" }, h("div", { key: 'eae0f2da8751f3be3be96ae7af32dd96138a543c', class: "container-footer-content", part: "content" }, h("bh-button", { key: 'f6ebdb3f70333584fab4865a07457ab519d570fb', hierarchy: "tertiary", label: this.buttonLabel, onClick: this.handleButtonClick, size: "sm" })))));
+        return (h(Host, { key: 'd062601c785a02084cb8e03dcce5c3b9ecfdeb0f' }, h("div", { key: '731f23f4d07725c26020a868140839f4f651a9e8', class: footerClasses, part: "footer" }, h("div", { key: '5c9fe20324619f047970622de67ada22d8ff40c2', class: "container-footer-content", part: "content" }, h("bh-button", { key: '5ce58d0fda6bea0b1d8f2693aca5b0d54503c3cb', hierarchy: "tertiary", label: this.buttonLabel, onClick: this.handleButtonClick, size: "sm" })))));
     }
 };
 BhContainerFooter.style = bhContainerFooterCss();

package/dist/esm/bh-container.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, h, H as Host } from './index-CTHvNfIu.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 
 const bhContainerCss = () => `@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}@layer bh-tokens,bh-base,bh-variants,bh-states,bh-utilities; @layer bh-tokens{:host{display:block;--bh-container-bg:var(--color-bg-primary);--bh-container-border-color:var(--color-border-secondary);--bh-container-border-radius:var(--radius-xl);--bh-container-padding:var(--spacing-2xl);--bh-container-gap:var(--spacing-2xl)}}@layer bh-base{.container{display:flex;flex-direction:column;gap:var(--bh-container-gap);padding:var(--bh-container-padding);background:var(--bh-container-bg);border:1px solid var(--bh-container-border-color);border-radius:var(--bh-container-border-radius);width:fit-content;font-family:var(--font-inter)}}@layer bh-variants{.container-with-footer{border-bottom:none;border-radius:var(--bh-container-border-radius) var(--bh-container-border-radius) 0 0}}`;
 
@@ -29,7 +30,7 @@ const BhContainer = class {
             container: true,
             "container-with-footer": this.withFooter,
         };
-        return (h(Host, { key: 'b9290f06e046dfdbe6b497cab7a9cc7d646eccef' }, h("div", { key: '5229533e5e40ffba67f9e38e6f0b11324d9a47f4', class: containerClasses, part: "container" }, h("slot", { key: '5f0aae1ad1d326ecff6ec6fd47ecd3f91d39f0f0' }))));
+        return (h(Host, { key: 'e2987561f8e89e914497aef104afe72066a56f7c' }, h("div", { key: 'aee865779664a7eb12219091436e6f08707df3f7', class: containerClasses, part: "container" }, h("slot", { key: '9ac3d4cb9d32a20b8b765e1222d26fa12cc239d0' }))));
     }
 };
 BhContainer.style = bhContainerCss();

package/dist/esm/bh-credit-card.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, h, H as Host } from './index-CTHvNfIu.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 
 const bhCreditCardCss = () => `@charset "UTF-8";@layer bh-tokens,bh-base,bh-variants,bh-states,bh-utilities; @layer bh-tokens{:host{display:inline-block;--bh-credit-card-width:307px;--bh-credit-card-height:180px;--bh-credit-card-radius:var(--radius-3xl);--bh-credit-card-shadow:8px 10px 16px 0 var(--border-contrast-light);--bh-credit-card-inset-x:19px;--bh-credit-card-inset-x-inner:15px;--bh-credit-card-inset-y-top:19px;--bh-credit-card-inset-y-bottom:127px;--bh-credit-card-number-top:151px;--bh-credit-card-expiry-right:100px;--bh-credit-card-payment-top:141px;--bh-credit-card-payment-left:254px;--bh-credit-card-contactless-width:20px;--bh-credit-card-contactless-height:24px;--bh-credit-card-payment-icon-width:34px;--bh-credit-card-payment-icon-height:24px;--bh-credit-card-payment-circle-size:14px;--bh-credit-card-payment-circle-overlap:-5px;--bh-credit-card-letter-spacing:0.6px;--bh-credit-card-number-letter-spacing:2.4px;--bh-credit-card-mastercard-red:#eb001b;--bh-credit-card-mastercard-orange:#f79e1b;--bh-credit-card-mastercard-opacity:0.85;--bh-credit-card-glass-start:rgba(255, 255, 255, 0.51);--bh-credit-card-glass-end:rgba(255, 255, 255, 0)}}@layer bh-base{.credit-card{position:relative;width:var(--bh-credit-card-width);height:var(--bh-credit-card-height);border-radius:var(--bh-credit-card-radius);border:1px solid var(--color-white);overflow:hidden;box-shadow:var(--bh-credit-card-shadow);font-family:var(--font-inter);box-sizing:border-box}.card-bg{position:absolute;inset:0;border-radius:var(--bh-credit-card-radius);pointer-events:none}.issuer-name{position:absolute;top:var(--bh-credit-card-inset-y-top);left:var(--bh-credit-card-inset-x);font-weight:var(--weight-semibold);font-size:var(--text-md-size);line-height:normal}.contactless-icon{position:absolute;top:var(--bh-credit-card-inset-y-top);right:var(--bh-credit-card-inset-x);width:var(--bh-credit-card-contactless-width);height:var(--bh-credit-card-contactless-height)}.contactless-icon svg{width:100%;height:100%}.cardholder-name{position:absolute;top:var(--bh-credit-card-inset-y-bottom);left:var(--bh-credit-card-inset-x-inner);font-family:"Manrope", var(--font-inter);font-weight:var(--weight-semibold);font-size:var(--text-xs-size);line-height:normal;letter-spacing:var(--bh-credit-card-letter-spacing);text-transform:uppercase}.expiry-date{position:absolute;top:var(--bh-credit-card-inset-y-bottom);right:var(--bh-credit-card-expiry-right);font-family:"Manrope", var(--font-inter);font-weight:var(--weight-semibold);font-size:var(--text-xs-size);line-height:normal;letter-spacing:var(--bh-credit-card-letter-spacing);text-align:right}.card-number{position:absolute;top:var(--bh-credit-card-number-top);left:var(--bh-credit-card-inset-x-inner);font-family:"Manrope", var(--font-inter);font-weight:var(--weight-semibold);font-size:var(--text-md-size);line-height:normal;letter-spacing:var(--bh-credit-card-number-letter-spacing)}.payment-icon{position:absolute;top:var(--bh-credit-card-payment-top);left:var(--bh-credit-card-payment-left);width:var(--bh-credit-card-payment-icon-width);height:var(--bh-credit-card-payment-icon-height);background:var(--color-white);border:1px solid var(--color-neutral-100);border-radius:var(--radius-xs);display:flex;align-items:center;justify-content:center}.payment-circle{width:var(--bh-credit-card-payment-circle-size);height:var(--bh-credit-card-payment-circle-size);border-radius:var(--radius-full)}.payment-circle-left{background:var(--bh-credit-card-mastercard-red)}.payment-circle-right{background:var(--bh-credit-card-mastercard-orange);margin-left:var(--bh-credit-card-payment-circle-overlap);opacity:var(--bh-credit-card-mastercard-opacity)}.light-text{color:var(--color-white)}.dark-text{color:var(--color-neutral-700)}}@layer bh-variants{.theme-transparent .card-bg{background:linear-gradient(125deg, var(--bh-credit-card-glass-start) 3.5%, var(--bh-credit-card-glass-end) 112%);backdrop-filter:blur(6px)}.theme-transparent-gradient .card-bg{background:linear-gradient(125deg, var(--bh-credit-card-glass-start) 3.5%, var(--bh-credit-card-glass-end) 112%);backdrop-filter:blur(6px)}.theme-transparent-gradient::after{content:"";position:absolute;top:-17px;left:-17px;width:160px;height:160px;background:radial-gradient(circle, var(--color-accent-400) 0%, var(--color-brand-500) 50%, transparent 70%);filter:blur(24px);opacity:0.6;pointer-events:none;z-index:-1}.theme-brand-dark .card-bg{background:linear-gradient(45deg, var(--color-brand-800) 0%, var(--color-brand-700) 100%)}.theme-brand-light .card-bg{background:var(--color-brand-100)}.theme-primary-light-gradient .card-bg{background:var(--color-brand-100)}.theme-primary-light-gradient::after{content:"";position:absolute;top:-17px;left:-17px;width:346px;height:219px;background:radial-gradient(ellipse, var(--color-accent-300) 0%, var(--color-brand-400) 50%, transparent 70%);filter:blur(64px);pointer-events:none;z-index:0}.theme-gray-light .card-bg{background:var(--color-neutral-100)}.theme-brand-light-gradient .card-bg{background:linear-gradient(45deg, var(--color-brand-700) 0%, var(--color-brand-600) 100%)}.theme-gray-light-gradient .card-bg{background:linear-gradient(180deg, var(--color-neutral-100) 0%, var(--color-neutral-300) 100%)}}`;
 
@@ -54,7 +55,7 @@ const BhCreditCard = class {
             "light-text": this.isLightText,
             "dark-text": !this.isLightText,
         };
-        return (h(Host, { key: '80c2fbbbba3126623248bda7896068fa1676c4b9', "aria-label": `Credit card for ${this.cardholderName}`, role: "img" }, h("div", { key: '821843aa4a02fef20ebfc62e56a1795f6e5fb438', class: classes, part: "base" }, h("div", { key: '71f28e9ea0654a4b2b1c5b44c4013004fba4d931', class: "card-bg" }), h("span", { key: '23e93122cf6b07bba88002c3cfc52606510b45c0', class: "issuer-name" }, this.issuerName), h("div", { key: 'd82944cc0665b0c86b1534e8e17c839db3285753', "aria-hidden": "true", class: "contactless-icon" }, h("svg", { key: '120f8d8261cb89c8ae630434547d6060b73113df', fill: "none", viewBox: "0 0 20 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'b2df8aff9e2c32e3dd8774997fb7c82ed255099a', d: "M5.5 18C3.5 16.2 2.5 13.7 2.5 11C2.5 8.3 3.5 5.8 5.5 4", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }), h("path", { key: '353c997156f6fb9ab36ffae7a6330df6232c3b28', d: "M9.5 15C8.3 13.8 7.5 12.5 7.5 11C7.5 9.5 8.3 8.2 9.5 7", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }), h("path", { key: 'b55b4f86719c4df25a58b8db730c3a347854ec95', d: "M13.5 12.5C13 12 12.5 11.5 12.5 11C12.5 10.5 13 10 13.5 9.5", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }))), h("span", { key: 'f574c7018802746ae0ccefb756ea7c0284c2c545', class: "cardholder-name" }, this.cardholderName), h("span", { key: '58561aee04a0afa5b9ccc89cb9142d7832468c0f', class: "expiry-date" }, this.expiryDate), h("span", { key: 'ca1e27d1ed9b00ee9885daac5edb4bccf5ac0ff5', class: "card-number" }, this.cardNumber), h("div", { key: '8c158535d05580af4229385061e205ddac4c685d', "aria-hidden": "true", class: "payment-icon" }, h("div", { key: 'c1a542fdc819f1585748461c24653529d57c1c3a', class: "payment-circle payment-circle-left" }), h("div", { key: 'c4f93ac620d56a77115a7ced7788895759fb982f', class: "payment-circle payment-circle-right" })))));
+        return (h(Host, { key: 'c859c4a3133144fdc01107747d4cee78910210d9', "aria-label": `Credit card for ${this.cardholderName}`, role: "img" }, h("div", { key: '401c124a191e09baa566c15303eadf2a29e2eead', class: classes, part: "base" }, h("div", { key: '0824fcdf11581de778fce2cedf09ca0b68408038', class: "card-bg" }), h("span", { key: '6d15ee33dce280886962b0310bcf666a17233a4c', class: "issuer-name" }, this.issuerName), h("div", { key: '844ad812cb1e8cf04c52b003f431808db0aa1637', "aria-hidden": "true", class: "contactless-icon" }, h("svg", { key: '52c755e7caa424f37fde98f100fb92dc81a70b5a', fill: "none", viewBox: "0 0 20 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'e9ec1e941986cc20b6a132b5c518175d70b113fc', d: "M5.5 18C3.5 16.2 2.5 13.7 2.5 11C2.5 8.3 3.5 5.8 5.5 4", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }), h("path", { key: '311095a6c2b4bac66d41fea088029029422131aa', d: "M9.5 15C8.3 13.8 7.5 12.5 7.5 11C7.5 9.5 8.3 8.2 9.5 7", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }), h("path", { key: '16cf15fb6528e0642150c9bd558d814525013ab6', d: "M13.5 12.5C13 12 12.5 11.5 12.5 11C12.5 10.5 13 10 13.5 9.5", stroke: "currentColor", "stroke-linecap": "round", "stroke-width": "2" }))), h("span", { key: 'efbcbf2453d6aca85a7cbcd3c7fa54d667429658', class: "cardholder-name" }, this.cardholderName), h("span", { key: 'd292727f3765acbee43b8ae29af57446b09830f9', class: "expiry-date" }, this.expiryDate), h("span", { key: 'ae74006e26e01284b92ecc67385085b9b978af24', class: "card-number" }, this.cardNumber), h("div", { key: '4606eb640bdadb7fef4110382f264f51330f6183', "aria-hidden": "true", class: "payment-icon" }, h("div", { key: 'e14ce4b4f67ffd5284ffac4e0dc2f30a630aad9a', class: "payment-circle payment-circle-left" }), h("div", { key: 'dbbf84ec372bf2f658e89198f6058c07b8a0e8f0', class: "payment-circle payment-circle-right" })))));
     }
 };
 BhCreditCard.style = bhCreditCardCss();

package/dist/esm/bh-data-grid-body.entry.js

@@ -1,8 +1,9 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CTHvNfIu.js';
 import { D as DATA_GRID_DEFAULT_LABELS } from './bh-data-grid-labels-DyjAWYh3.js';
 import { i as isColumnPinned, g as getPinnedOffset } from './column-pinning-jpCe1QTg.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import './i18n-BNVOtH-1.js';
 
 const BhDataGridBody = class {

package/dist/esm/bh-data-grid-change-preview.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CTHvNfIu.js';
 import { D as DATA_GRID_DEFAULT_LABELS } from './bh-data-grid-labels-DyjAWYh3.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import './i18n-BNVOtH-1.js';
 
 const BhDataGridChangePreview = class {

package/dist/esm/bh-data-grid-filter-builder.entry.js

@@ -1,8 +1,9 @@
 import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-CTHvNfIu.js';
 import { isFilterCondition, isFilterGroup } from './index.js';
 import { D as DATA_GRID_DEFAULT_LABELS } from './bh-data-grid-labels-DyjAWYh3.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import { i as isEscapeKey } from './keyboard-helpers-Dg0_t7Yy.js';
 import './i18n-BNVOtH-1.js';
 import './keyboard-constants-zdFuIabL.js';

package/dist/esm/bh-data-grid-footer.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CTHvNfIu.js';
 import { D as DATA_GRID_DEFAULT_LABELS } from './bh-data-grid-labels-DyjAWYh3.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import './i18n-BNVOtH-1.js';
 
 const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
@@ -266,7 +267,7 @@ const BhDataGridFooter = class {
         return (h("div", { class: "data-grid-pagination", part: "pagination" }, h("bh-pagination", { onBhPageChange: (e) => this.handlePageChange(e.detail.page), onBhPageSizeChange: (e) => this.handlePageSizeChange(e.detail.pageSize), page: currentPage, pageSize: currentPageSize, pageSizeOptions: safePageSizeOptions, rowsPerPageLabel: "Rows per page:", showingResultsLabel: `${totalRows > 0 ? `${startRow}-${endRow} of ${totalRows}` : "0 rows"}`, totalItems: totalRows })));
     }
     render() {
-        return (h(Host, { key: 'a980e97d8e6a99bc1b328a9cdcedbd08a37c5040' }, this.renderSummaryRow(), this.renderPagination()));
+        return (h(Host, { key: 'd34ded8a49617aa81e334dfdf41bab6fbb563d18' }, this.renderSummaryRow(), this.renderPagination()));
     }
 };
 

package/dist/esm/bh-data-grid-header.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-CTHvNfIu.js';
 import { i as isColumnPinned, g as getPinnedOffset } from './column-pinning-jpCe1QTg.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 
 const BhDataGridHeader = class {
     constructor(hostRef) {

package/dist/esm/bh-data-grid-toolbar.entry.js

@@ -1,8 +1,9 @@
 import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-CTHvNfIu.js';
 import { D as DATA_GRID_DEFAULT_LABELS } from './bh-data-grid-labels-DyjAWYh3.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { c as createDestroySubjectSync, a as completeSubject } from './lifecycle-CS8F5LFw.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import './i18n-BNVOtH-1.js';
 
 const BhDataGridToolbar = class {
@@ -202,7 +203,7 @@ const BhDataGridToolbar = class {
             [`data-grid-toolbar-${this.size}`]: true,
             [this.config?.cssClass ?? ""]: !!this.config?.cssClass,
         };
-        return (h(Host, { key: 'f9a6f3725c191dca8f3e6b2bbab6fc14d30e244b' }, h("div", { key: 'e1027fb17b3187599baf62449a665791923af76d', class: toolbarClasses, part: "toolbar" }, h("div", { key: '844b7b4f05dff77805b0b3d8790ac2886332e97a', class: "data-grid-toolbar-left", part: "toolbar-left" }, h("slot", { key: '9627679104269509980df20eae32a99d9e803c5e', name: "toolbar-left" }, this.renderDefaultItems(leftItems, defaultLeftItems))), h("div", { key: '258d8568e00beb27df742f534d0f2eb6b42033d8', class: "data-grid-toolbar-center", part: "toolbar-center" }, h("slot", { key: '3463374051889eabc2351d25d88ec060ad2ff714', name: "toolbar-center" }, this.renderDefaultItems(centerItems, []))), h("div", { key: '633e92c03280fef90d69b18c756949b18bb7639f', class: "data-grid-toolbar-right", part: "toolbar-right" }, h("slot", { key: '2f88cb9956e5402f7737e0978295c6e71ce23e47', name: "toolbar-right" }, showBatchMode
+        return (h(Host, { key: 'ea02947e5f12b5e36a882b823bfa4188840e4504' }, h("div", { key: '3a9a5cf03f284c8b1e9a50b0e140f5f8662582f7', class: toolbarClasses, part: "toolbar" }, h("div", { key: 'e2dd4c8f2f9d6498dc0a375b82f6c259fab34037', class: "data-grid-toolbar-left", part: "toolbar-left" }, h("slot", { key: '9765ba1f12bc6b85600fd3f3160e9240f75d1e1d', name: "toolbar-left" }, this.renderDefaultItems(leftItems, defaultLeftItems))), h("div", { key: '5179c1e8145b41e81a4afd2dff0f60836e216acd', class: "data-grid-toolbar-center", part: "toolbar-center" }, h("slot", { key: '4d04637154d2bec6f910bb2959da6d9a342ab165', name: "toolbar-center" }, this.renderDefaultItems(centerItems, []))), h("div", { key: '8cbfb4333ca8b2f91b96ea639a4b8227ce7e1cae', class: "data-grid-toolbar-right", part: "toolbar-right" }, h("slot", { key: '16702babaa5d627d9b01fb21d2f908d56f2bc963', name: "toolbar-right" }, showBatchMode
             ? this.renderBatchActions()
             : this.renderDefaultItems(rightItems, [
                 "export",

package/dist/esm/bh-data-grid.entry.js

@@ -2,17 +2,18 @@ import { h, r as registerInstance, c as createEvent, a as getElement, f as force
 import { v as validateJSON } from './validators-R-A72b5e.js';
 import { r as resolveDataGridLabels } from './bh-data-grid-labels-DyjAWYh3.js';
 import { i as isColumnPinned, g as getPinnedOffset } from './column-pinning-jpCe1QTg.js';
-import { c as createComponentErrorHandler } from './component-error-handler-BVWQSuxn.js';
+import { c as createComponentErrorHandler } from './component-error-handler-bgLpf9Pn.js';
 import { b as isEnterKey, i as isEscapeKey, c as isTabKey } from './keyboard-helpers-Dg0_t7Yy.js';
 import { K as KEYBOARD_KEYS } from './keyboard-constants-zdFuIabL.js';
 import { D as DOMPurify } from './browser-UjNYPqeE.js';
 import { c as createDestroySubjectSync, a as completeSubject } from './lifecycle-CS8F5LFw.js';
 import { c as createEventListenerManager } from './event-listener-manager-CijzRD3j.js';
-import { c as createComponentLogger } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { c as createObserverManager } from './observer-manager-CtKihrmj.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
 import { t as timer$Sync } from './timers-Bf0qW3wI.js';
 import './i18n-BNVOtH-1.js';
+import './error-boundary-afpK3NgJ.js';
 
 /**
  * Resilience constants for timeout and error handling

package/dist/esm/bh-date-picker-content.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-CTHvNfIu.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { c as createDestroySubjectSync, a as completeSubject } from './lifecycle-CS8F5LFw.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import { B as BellhopI18n, r as resolveI18n } from './i18n-BNVOtH-1.js';
 import { t as timer$Sync } from './timers-Bf0qW3wI.js';
 import { A as ANIMATION_DURATIONS } from './constants-BoVgy_Ao.js';
@@ -426,9 +427,9 @@ const BhDatePickerContent = class {
     }
     render() {
         const currentMonthYear = `${MONTH_NAMES[this.currentMonth]} ${this.currentYear}`;
-        return (h(Host, { key: 'ad6d4d71610dc94c5f6cf12bfdc88eb0cf8a9f38' }, h("div", { key: 'fcf03444c4d791d96c446b0a99572e295e261bf0', class: "date-picker-content", part: "container" }, h("div", { key: 'cfc80acb83290905318a4b8fd7b7b386167bfb80', class: "month-navigation", part: "navigation" }, h("bh-button-icon", { key: 'd06336137b708b850eb1eb08e31304ff265c7b34', disabled: this.disabled ||
-                (this.currentYear === this.minYear && this.currentMonth === 0), hierarchy: "tertiary", iconName: "chevron_left", onClick: this.handlePreviousMonth, size: "md" }), h("bh-button", { key: '6b388d0431d6fd6d9f358c57c6f3211f61275fd2', hierarchy: "tertiary", icon: "trailing", iconName: "expand_more", label: currentMonthYear, onClick: this.handleMonthDropdownToggle, size: "sm" }), h("bh-button-icon", { key: 'bda7b6cbc3a1d5e1d0116e800f011868299edc9d', disabled: this.disabled ||
-                (this.currentYear === this.maxYear && this.currentMonth === 11), hierarchy: "tertiary", iconName: "chevron_right", onClick: this.handleNextMonth, size: "md" })), this.showDateInput && (h("div", { key: '16525c6ba25074074df5853217bdd667e983f8b3', class: "date-input-display", part: "date-input" }, h("bh-input-text", { key: '20c99b975c9b764f4120bba9ca5f0de86544f336', placeholder: resolveI18n("bh-date-picker-content", "selectDatePlaceholder", this.selectDatePlaceholder, "Select date"), readOnly: true, showHelpIcon: false, showHintText: false, showLabel: false, showTrailingIcon: true, trailingIcon: "calendar_today", value: this.formatSelectedDate() }))), this.showPresetRanges && (h("div", { key: '43bcb62cd86eaad04e18fd6f27ea8956fae7e3ef', class: "preset-ranges", part: "preset-ranges" }, h("bh-button", { key: '7eca278a25141e56c52536e9e6a2902061e58155', hierarchy: "tertiary", label: "Last week", onClick: () => this.bhPresetSelect.emit("last-week"), size: "sm" }), h("bh-button", { key: 'd8e75d0ec012b59f862f0f1812e91acedb0ace14', hierarchy: "tertiary", label: "Last month", onClick: () => this.bhPresetSelect.emit("last-month"), size: "sm" }), h("bh-button", { key: '6594783f01883dbb63f2e23f73c77fbb41b29666', hierarchy: "tertiary", label: "Last year", onClick: () => this.bhPresetSelect.emit("last-year"), size: "sm" }))), !this.isMonthDropdownOpen && (h("div", { key: '2bae46f7d2fe6c470a59665da77f44f3aba7aa43', class: "calendar-grid", part: "calendar" }, h("div", { key: '0a5a7173a21d8817f72bf1ef89d9fa4e693caa22', class: "day-names", part: "day-names" }, DAY_NAMES.map((dayName) => (h("div", { class: "day-name", key: dayName }, dayName)))), h("div", { key: '96f08df64ab81881a38b2ecf7e24013cda5c58af', class: "date-cells", part: "cells" }, this.calendarCells.map((cell, index) => (h("div", { class: this.getCellClass(cell), key: index, onClick: (e) => this.handleCellClick(e, cell) }, h("span", { class: "date-number" }, cell.day === 0 ? "" : cell.day))))))), (this.isMonthDropdownOpen || this.isMonthDropdownClosing) && (h("div", { key: '0aee05cbc01f72e0b71705083bf8bbd6beec23ae', class: `month-picker-inline ${this.isMonthDropdownClosing ? "animate-fade-out" : ""}` }, h("bh-month-picker-content", { key: '176b95d01eb061243905c1d79e5baba2588b1a38', height: "275px", maxYear: this.maxYear, minYear: this.minYear, onBhChange: this.handleMonthYearSelect, scrollable: true, selectedMonth: this.currentMonth, selectedYear: this.currentYear }))))));
+        return (h(Host, { key: '54655d044f0752f7647fb59303249f8fb5c91dd3' }, h("div", { key: 'e394e93731d0c1a5055eb9577775f732fa37cb20', class: "date-picker-content", part: "container" }, h("div", { key: '88a3b58ac3a84510b8e8f76733bd5ea1a1fee4dd', class: "month-navigation", part: "navigation" }, h("bh-button-icon", { key: '346fd0af5d228447ed4b478566d1f4a1edfa1838', disabled: this.disabled ||
+                (this.currentYear === this.minYear && this.currentMonth === 0), hierarchy: "tertiary", iconName: "chevron_left", onClick: this.handlePreviousMonth, size: "md" }), h("bh-button", { key: '213812c523e0e189382e6495f4014520fa6d5add', hierarchy: "tertiary", icon: "trailing", iconName: "expand_more", label: currentMonthYear, onClick: this.handleMonthDropdownToggle, size: "sm" }), h("bh-button-icon", { key: 'f6ad11fe6713733878f5020e4c570b07e73f9921', disabled: this.disabled ||
+                (this.currentYear === this.maxYear && this.currentMonth === 11), hierarchy: "tertiary", iconName: "chevron_right", onClick: this.handleNextMonth, size: "md" })), this.showDateInput && (h("div", { key: 'e27dcf2c52ec2b28c7262d4fac4ecf0d3aeb4752', class: "date-input-display", part: "date-input" }, h("bh-input-text", { key: '734e891a9e4652659c8855cb4cd0565c9c09d566', placeholder: resolveI18n("bh-date-picker-content", "selectDatePlaceholder", this.selectDatePlaceholder, "Select date"), readOnly: true, showHelpIcon: false, showHintText: false, showLabel: false, showTrailingIcon: true, trailingIcon: "calendar_today", value: this.formatSelectedDate() }))), this.showPresetRanges && (h("div", { key: '74bbd7dcc8bd82da65191d535fa374076a55b63b', class: "preset-ranges", part: "preset-ranges" }, h("bh-button", { key: '010a8babf66a0d9b22cfcb4244e6c3316523ca08', hierarchy: "tertiary", label: "Last week", onClick: () => this.bhPresetSelect.emit("last-week"), size: "sm" }), h("bh-button", { key: '2a651298dc6828d36a1115ec4f73d24efc169953', hierarchy: "tertiary", label: "Last month", onClick: () => this.bhPresetSelect.emit("last-month"), size: "sm" }), h("bh-button", { key: 'dee3061094254ea53b339c54186f7dda1cfbf387', hierarchy: "tertiary", label: "Last year", onClick: () => this.bhPresetSelect.emit("last-year"), size: "sm" }))), !this.isMonthDropdownOpen && (h("div", { key: '599841d8e6f490f262eab17329abb688982d63d8', class: "calendar-grid", part: "calendar" }, h("div", { key: 'f0934ecfb1d052011290746b89fe610e975f17bd', class: "day-names", part: "day-names" }, DAY_NAMES.map((dayName) => (h("div", { class: "day-name", key: dayName }, dayName)))), h("div", { key: 'b0b723460e2b9ae997e67658aec8e005680afebb', class: "date-cells", part: "cells" }, this.calendarCells.map((cell, index) => (h("div", { class: this.getCellClass(cell), key: index, onClick: (e) => this.handleCellClick(e, cell) }, h("span", { class: "date-number" }, cell.day === 0 ? "" : cell.day))))))), (this.isMonthDropdownOpen || this.isMonthDropdownClosing) && (h("div", { key: '5ed516dd685be7c20e4c63cf3802a6d8b6693988', class: `month-picker-inline ${this.isMonthDropdownClosing ? "animate-fade-out" : ""}` }, h("bh-month-picker-content", { key: '9c8ada6fcf7bed33fac6b0f80083fb7c622111ad', height: "275px", maxYear: this.maxYear, minYear: this.minYear, onBhChange: this.handleMonthYearSelect, scrollable: true, selectedMonth: this.currentMonth, selectedYear: this.currentYear }))))));
     }
     static get watchers() { return {
         "value": [{

package/dist/esm/bh-date-picker.entry.js

@@ -2,9 +2,10 @@ import { r as registerInstance, c as createEvent, a as getElement, h, H as Host
 import { T as TopLayerAnchor, s as supportsTopLayerPopover } from './top-layer-anchor-_HEoiOQg.js';
 import { P as PickerStateManager } from './picker-state-manager-Sdr_qqWO.js';
 import { c as createDestroySubjectSync, a as completeSubject } from './lifecycle-CS8F5LFw.js';
-import { c as createComponentLogger, r as reportComponentError } from './error-boundary-YLeLKAYJ.js';
+import { c as createComponentLogger } from './logger-CMKOFHIa.js';
 import { c as createFocusStateManager } from './focus-state-manager-YdVz1TeW.js';
 import { m as metrics, M as MetricNames } from './metrics-CSH9RXgl.js';
+import { r as reportComponentError } from './error-boundary-afpK3NgJ.js';
 import { B as BellhopI18n, r as resolveI18n } from './i18n-BNVOtH-1.js';
 import { i as isEscapeKey, a as isActionKey } from './keyboard-helpers-Dg0_t7Yy.js';
 import { t as timer$Sync } from './timers-Bf0qW3wI.js';
@@ -368,14 +369,14 @@ const BhDatePicker = class {
             "date-picker-focused": this.focusState.isFocused,
             "date-picker-hovered": this.focusState.isHovered,
         };
-        return (h(Host, { key: 'bdc89e36e319b09fe8b3e6138689f24a20506ce5' }, h("div", { key: 'b33f847689a5c1f170db7fb73ce1d597402c773d', "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": String(this.isMenuOpen), "aria-haspopup": "dialog", "aria-label": resolveI18n("bh-date-picker", "defaultLabel", this.label, "Select Date"), class: containerClasses, "data-focused": String(this.focusState.isFocused), "data-hovered": String(this.focusState.isHovered), onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, part: "container", role: "combobox", tabindex: this.disabled ? -1 : 0 }, this.variant === "dropdown-outlined" && (h("div", { key: '186e0039f11670234bc642e3d037839a13370e27', class: "date-picker-trigger", onClick: this.handleTriggerClick, part: "trigger" }, h("bh-button", { key: 'ead8b633f7a0650409b320fc52647433e27e6424', disabled: this.disabled, hierarchy: "secondary", icon: "trailing", iconName: "expand_more", label: this.getButtonLabel(), size: "sm" }))), this.variant === "dropdown-ghost" && (h("div", { key: '6b11aebace35b7ce5a1266825016e88c7ae8a63d', class: "date-picker-trigger", onClick: this.handleTriggerClick, part: "trigger" }, h("bh-button", { key: '74ab8d177aa2b519c607385e82efa64196ea5aa6', disabled: this.disabled, hierarchy: "tertiary", icon: "trailing", iconName: "expand_more", label: this.getButtonLabel(), size: "sm" }))), this.variant === "input" && (h("div", { key: '9beb49a326305ee6299024465ed7a9fceef168cb', class: "date-picker-trigger input-field-container", part: "trigger" }, h("bh-input-text", { key: '4bd03000215aeab5c198f1dc810e4511918dd728', disabled: this.disabled, label: resolveI18n("bh-date-picker", "defaultLabel", this.label, "Select Date"), onFocus: this.handleInputFocus, placeholder: resolveI18n("bh-date-picker", "defaultPlaceholder", this.placeholder, "Choose date"), readOnly: true, showHelpIcon: false, showHintText: false, showLabel: this.showLabel, showTrailingIcon: true, trailingIcon: "calendar_today", value: this.getDisplayValue(), width: this.inputWidth }), h("div", { key: '012261804aa24a96a61887920913338fc93fde36', class: "calendar-icon-overlay", onClick: this.handleTriggerClick }))), h("div", { key: 'dc383f16e5c4bee5081148da454e7f6aaab27840', class: {
+        return (h(Host, { key: 'bf6800637be57d8d768455e54e7519c5994e263d' }, h("div", { key: 'e00ca9870ba40f24884ffe2650c5b50d05f5d556', "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": String(this.isMenuOpen), "aria-haspopup": "dialog", "aria-label": resolveI18n("bh-date-picker", "defaultLabel", this.label, "Select Date"), class: containerClasses, "data-focused": String(this.focusState.isFocused), "data-hovered": String(this.focusState.isHovered), onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, part: "container", role: "combobox", tabindex: this.disabled ? -1 : 0 }, this.variant === "dropdown-outlined" && (h("div", { key: 'cf711db0fae3aab3a54db332a6f5a4b9686adad4', class: "date-picker-trigger", onClick: this.handleTriggerClick, part: "trigger" }, h("bh-button", { key: '5464fc3c642a2445490836a167da7b9d15369a65', disabled: this.disabled, hierarchy: "secondary", icon: "trailing", iconName: "expand_more", label: this.getButtonLabel(), size: "sm" }))), this.variant === "dropdown-ghost" && (h("div", { key: '2729ffe68fef8fd465abcc4ee5122e24d7ca38a5', class: "date-picker-trigger", onClick: this.handleTriggerClick, part: "trigger" }, h("bh-button", { key: 'a3359a23887d20a507cabc6a94b30e7de955c211', disabled: this.disabled, hierarchy: "tertiary", icon: "trailing", iconName: "expand_more", label: this.getButtonLabel(), size: "sm" }))), this.variant === "input" && (h("div", { key: '7655c11d161eeaa2ba73682b351ef1a1350a50a4', class: "date-picker-trigger input-field-container", part: "trigger" }, h("bh-input-text", { key: 'd79d3bb225210eeb896be266bd9dd37b5373e35a', disabled: this.disabled, label: resolveI18n("bh-date-picker", "defaultLabel", this.label, "Select Date"), onFocus: this.handleInputFocus, placeholder: resolveI18n("bh-date-picker", "defaultPlaceholder", this.placeholder, "Choose date"), readOnly: true, showHelpIcon: false, showHintText: false, showLabel: this.showLabel, showTrailingIcon: true, trailingIcon: "calendar_today", value: this.getDisplayValue(), width: this.inputWidth }), h("div", { key: '696764ec1a46a39d2e47f5ee2e4873ec831d2809', class: "calendar-icon-overlay", onClick: this.handleTriggerClick }))), h("div", { key: '42689fe957cd9bcded85261f0b3b08ed2cfbb8e7', class: {
                 "date-picker-menu-container": true,
                 "is-open": this.isMenuOpen && !supportsTopLayerPopover,
                 "open-upward": this.openUpward,
                 "open-left": this.openToLeft,
-            }, part: "menu", popover: supportsTopLayerPopover ? "manual" : undefined, ref: (el) => (this.menuContainerEl = el) }, h("bh-picker-menu", { key: '8065433414c804f7f95f8c9257a20d103b0c0b74', disableApply: this.showFooter && this.stateManager?.tempValue === null, onBhAction: this.handleMenuAction, showFooter: this.showFooter, showTodayButton: this.showFooter, visible: this.isMenuOpen }, h("bh-date-picker-content", { key: '50087791b84167d67105062b293368b3e7699347', disabled: this.disabled, disabledDates: this.disabledDates, maxYear: this.safeMaxYear, minYear: this.safeMinYear, onBhChange: this.handleDateSelect, showOtherMonthDays: this.showOtherMonthDays, value: this.stateManager?.tempValue ??
+            }, part: "menu", popover: supportsTopLayerPopover ? "manual" : undefined, ref: (el) => (this.menuContainerEl = el) }, h("bh-picker-menu", { key: 'e7abddb8c80316349b31f734cb53cc636df8d9c5', disableApply: this.showFooter && this.stateManager?.tempValue === null, onBhAction: this.handleMenuAction, showFooter: this.showFooter, showTodayButton: this.showFooter, visible: this.isMenuOpen }, h("bh-date-picker-content", { key: 'd42c94db8ebb27d762d8eba0267a6bc1f6294b87', disabled: this.disabled, disabledDates: this.disabledDates, maxYear: this.safeMaxYear, minYear: this.safeMinYear, onBhChange: this.handleDateSelect, showOtherMonthDays: this.showOtherMonthDays, value: this.stateManager?.tempValue ??
                 this.stateManager?.committedValue ??
-                undefined })))), (this.isMenuOpen || this.isMenuClosing) && (h("div", { key: '571aedbc8f942e4ea9332d97c870689fd26d8c0b', class: "date-picker-backdrop", onClick: this.handleBackdropClick }))));
+                undefined })))), (this.isMenuOpen || this.isMenuClosing) && (h("div", { key: 'a021aa4337b3d5b224dc0a078389d098aa836faa', class: "date-picker-backdrop", onClick: this.handleBackdropClick }))));
     }
     static get watchers() { return {
         "value": [{