@brandsync/wc 1.17.0 → 1.19.0

package/dist/esm/bs-app-switcher.entry.js

@@ -0,0 +1,206 @@
+import { r as registerInstance, c as createEvent, a as getElement, h } from './index-D3SkQJpw.js';
+
+const bsAppSwitcherCss = () => `:host{display:block;box-sizing:border-box;width:var(--bs-app-switcher-width);max-width:100%;--bs-app-switcher-width:360px;--bs-app-switcher-radius:var(--bs-border-radius-150);--bs-app-switcher-bg:var(--bs-surface-base);--bs-app-switcher-border-color:var(--bs-border-default);--bs-app-switcher-shadow:var(--bs-shadow-position-0) var(--bs-shadow-position-100) var(--bs-shadow-blur-200) var(--bs-elevation-higher);--bs-app-switcher-padding:var(--bs-spacing-150);--bs-app-switcher-text-color:var(--bs-text-default);--bs-app-switcher-header-color:var(--bs-text-secondary);--bs-app-switcher-link-color:var(--bs-text-action);--bs-app-switcher-focus-ring:var(--bs-border-neutral-focus)}.bs-app-switcher{display:block;position:relative;--bs-card-bg:var(--bs-app-switcher-bg);--bs-card-radius:var(--bs-app-switcher-radius);--bs-card-padding:0px;--bs-card-border-width:1px;--bs-card-border-color:var(--bs-app-switcher-border-color);--bs-card-shadow:var(--bs-app-switcher-shadow)}.bs-app-switcher__header,.bs-app-switcher__footer{display:flex;align-items:center;justify-content:space-between;padding:var(--bs-spacing-150) var(--bs-spacing-200)}.bs-app-switcher__heading{margin:0;color:var(--bs-app-switcher-text-color);font-family:var(--bs-typography-font-family-heading, Roboto), sans-serif;font-size:var(--bs-fontsize-heading-h6);font-weight:var(--bs-font-weight-bold);line-height:calc(var(--bs-line-height-heading-h6) * 1px)}.bs-app-switcher__manage,.bs-app-switcher__browse{display:inline-flex;align-items:center;gap:var(--bs-spacing-50);margin:0;padding:0;border:0;border-radius:var(--bs-border-radius-50);background:none;font-family:var(--bs-typography-font-family-body, Roboto), sans-serif;cursor:pointer}.bs-app-switcher__manage{color:var(--bs-app-switcher-text-color);font-size:var(--bs-fontsize-body-sm);font-weight:var(--bs-font-weight-medium);line-height:calc(var(--bs-line-height-body-sm) * 1px);text-decoration:none}.bs-app-switcher__browse{color:var(--bs-app-switcher-link-color);font-size:var(--bs-fontsize-caption-sm);line-height:calc(var(--bs-line-height-caption-sm) * 1px);text-decoration:underline}.bs-app-switcher__manage:hover,.bs-app-switcher__browse:hover{color:var(--bs-text-action-hover)}.bs-app-switcher__manage:focus-visible,.bs-app-switcher__browse:focus-visible{outline:var(--bs-spacing-25) solid var(--bs-app-switcher-focus-ring);outline-offset:var(--bs-spacing-25)}.bs-app-switcher__external{width:var(--bs-spacing-150);height:var(--bs-spacing-150);flex:none}.bs-app-switcher__search{padding:var(--bs-spacing-150) var(--bs-app-switcher-padding) var(--bs-spacing-50)}.bs-app-switcher__search bs-input{width:100%}.bs-app-switcher__body{padding:var(--bs-spacing-50) var(--bs-app-switcher-padding) var(--bs-spacing-150)}.bs-app-switcher__group-header{padding:var(--bs-spacing-100) var(--bs-spacing-100) var(--bs-spacing-50);color:var(--bs-app-switcher-header-color);font-family:var(--bs-typography-font-family-body, Roboto), sans-serif;font-size:var(--bs-fontsize-caption-sm);font-weight:var(--bs-font-weight-semibold);line-height:calc(var(--bs-line-height-caption-sm) * 1px);letter-spacing:var(--bs-letter-spacing-wide);text-transform:uppercase}.bs-app-switcher__grid,.bs-app-switcher__list{display:grid;margin:0;padding:0;list-style:none}.bs-app-switcher__grid--grid{grid-template-columns:repeat(3, minmax(0, 1fr));gap:var(--bs-spacing-150)}.bs-app-switcher__grid--compact{grid-template-columns:repeat(4, minmax(0, 1fr));gap:var(--bs-spacing-100)}.bs-app-switcher__section-divider{display:block;width:calc(100% + var(--bs-app-switcher-padding) * 2);margin:0 calc(var(--bs-app-switcher-padding) * -1)}.bs-app-switcher__empty{--bs-empty-state-padding-y:var(--bs-spacing-300)}.bs-app-switcher__skeleton-header{--bs-skeleton-width:var(--bs-sizing-1000);display:block;padding:var(--bs-spacing-100)}.bs-app-switcher__skeleton-tile{display:flex;flex-direction:column;align-items:center;gap:var(--bs-spacing-150);padding:var(--bs-spacing-150)}.bs-app-switcher__skeleton-icon{--bs-skeleton-width:calc(var(--bs-sizing-500) + var(--bs-spacing-50));--bs-skeleton-rect-height:calc(var(--bs-sizing-500) + var(--bs-spacing-50))}.bs-app-switcher__skeleton-label{--bs-skeleton-width:var(--bs-sizing-800)}.bs-app-switcher__live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}`;
+
+let uid = 0;
+const svgProps = {
+    viewBox: '0 0 24 24',
+    fill: 'none',
+    stroke: 'currentColor',
+    'stroke-width': '1.8',
+    'stroke-linecap': 'round',
+    'stroke-linejoin': 'round',
+    'aria-hidden': 'true',
+};
+const SKELETON_TILES = [0, 1, 2, 3, 4, 5, 6, 7, 8];
+const BsAppSwitcher = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.bsAppSelect = createEvent(this, "bsAppSelect");
+        this.bsManage = createEvent(this, "bsManage");
+        this.bsBrowseAll = createEvent(this, "bsBrowseAll");
+        this.bsClearSearch = createEvent(this, "bsClearSearch");
+        this.bsRetry = createEvent(this, "bsRetry");
+        this.bsRequestAccess = createEvent(this, "bsRequestAccess");
+        this.bsQueryChange = createEvent(this, "bsQueryChange");
+    }
+    get el() { return getElement(this); }
+    id = `bs-as-${++uid}`;
+    inputEl;
+    /** The apps the user can open. JS property only (an array cannot be an attribute). */
+    apps = [];
+    /** Recently opened apps, most recent first. When there are any, the panel shows Recent and All apps. JS property only. */
+    recent = [];
+    /** `id` of the app you are in: selected background and `aria-current`. */
+    currentId;
+    /** The search text. Mutable: typing, Escape and "Clear search" update it. */
+    query = '';
+    /** `loading` shows skeleton tiles, `error` the failure state. */
+    status = 'ready';
+    /** URL of the Manage link. Without it Manage is a button that only fires `bsManage`. */
+    manageHref;
+    /** URL of the Browse all link. Without it it is a button that only fires `bsBrowseAll`. */
+    browseHref;
+    /** Panel heading. */
+    heading = 'EG apps';
+    /** Text of the Manage link. */
+    manageLabel = 'Manage';
+    /** Placeholder (and accessible name) of the search field. */
+    searchPlaceholder = 'Find an app';
+    /** Header of the default group when there are no recent apps. */
+    yourAppsLabel = 'Your apps';
+    /** Header of the recent group. */
+    recentLabel = 'Recent';
+    /** Header of the all apps group. */
+    allAppsLabel = 'All apps';
+    /** Search header with several results ("2 results"). */
+    resultsLabel = 'results';
+    /** Search header with one result ("1 result"). */
+    resultLabel = 'result';
+    /** Text of the footer link. */
+    browseLabel = 'Browse all EG products';
+    /** No-results heading. `{query}` is replaced by the query. */
+    noResultsHeading = 'No apps match “{query}”';
+    /** No-results description. */
+    noResultsDescription = 'Check the spelling, or browse all EG products to find more apps.';
+    /** Text of the Clear search button. */
+    clearLabel = 'Clear search';
+    /** Error heading. */
+    errorHeading = 'Couldn’t load your apps';
+    /** Error description. */
+    errorDescription = 'Check your connection and try again. Your work in the current app is not affected.';
+    /** Text of the Try again button. */
+    retryLabel = 'Try again';
+    /** Empty heading (no apps assigned). */
+    emptyHeading = 'No apps assigned yet';
+    /** Empty description. */
+    emptyDescription = 'Ask your administrator for access, or browse all EG products to see what’s available.';
+    /** Text of the Request access button. */
+    requestAccessLabel = 'Request access';
+    /** Announced while loading. */
+    loadingLabel = 'Loading apps…';
+    /** Fires when an app is chosen (click or Enter), with the app. Cancelable: `preventDefault()` cancels the originating click. */
+    bsAppSelect;
+    /** Fires when Manage is pressed. */
+    bsManage;
+    /** Fires when Browse all is pressed. */
+    bsBrowseAll;
+    /** Fires when the search is cleared with the Clear search button or Escape. */
+    bsClearSearch;
+    /** Fires when Try again is pressed. */
+    bsRetry;
+    /** Fires when Request access is pressed. */
+    bsRequestAccess;
+    /** Fires when the search text changes through user interaction, with the new text. */
+    bsQueryChange;
+    get q() {
+        return this.query.trim().toLowerCase();
+    }
+    matches() {
+        const q = this.q;
+        return this.apps.filter(a => a.name.toLowerCase().includes(q) || (a.description ?? '').toLowerCase().includes(q));
+    }
+    recentApps() {
+        return this.recent
+            .map(r => ({ app: this.apps.find(a => a.id === r.appId), recent: r }))
+            .filter((x) => !!x.app);
+    }
+    setQuery(next) {
+        this.query = next;
+        this.bsQueryChange.emit(next);
+    }
+    clear() {
+        if (!this.query)
+            return;
+        this.setQuery('');
+        this.bsClearSearch.emit();
+        this.inputEl?.focus();
+    }
+    onInput = (ev) => {
+        ev.stopPropagation();
+        this.setQuery(ev.detail);
+    };
+    onSearchKeyDown = (ev) => {
+        if (ev.key === 'Escape' && this.query) {
+            // Clear first; a second Escape (empty field) is left alone so a wrapping popover can close.
+            ev.preventDefault();
+            ev.stopPropagation();
+            this.clear();
+        }
+    };
+    select(app, ev) {
+        if (app.disabled)
+            return;
+        const e = this.bsAppSelect.emit(app);
+        if (e.defaultPrevented)
+            ev.preventDefault();
+    }
+    desc(r) {
+        return [r.openedLabel, r.companyName].filter(Boolean).join(' · ');
+    }
+    renderLink(part, cls, href, label, onPress, trailing) {
+        const inner = [label, trailing];
+        return href ? (h("a", { part: part, class: cls, href: href, onClick: onPress }, inner)) : (h("button", { part: part, class: cls, type: "button", onClick: onPress }, inner));
+    }
+    renderTile(app, size) {
+        return (h("li", null, h("bs-app-tile", { part: "tile", size: size, name: app.name, icon: app.icon, disabled: !!app.disabled, current: app.id === this.currentId, onClick: (ev) => this.select(app, ev) })));
+    }
+    renderRow(app, description) {
+        return (h("li", null, h("bs-app-recent-item", { part: "row", name: app.name, description: description, icon: app.icon, disabled: !!app.disabled, current: app.id === this.currentId, onClick: (ev) => this.select(app, ev) })));
+    }
+    renderGroup(key, header, list, kind, size) {
+        const hid = `${this.id}-h-${key}`;
+        return (h("div", { part: "group", class: "bs-app-switcher__group", role: "group", "aria-labelledby": hid }, h("div", { part: "group-header", id: hid, class: "bs-app-switcher__group-header" }, header), h("ul", { part: kind, role: "list", class: { 'bs-app-switcher__grid': kind === 'grid', [`bs-app-switcher__grid--${size}`]: !!size, 'bs-app-switcher__list': kind === 'list' } }, list)));
+    }
+    renderState(heading, description, intent, icon, action) {
+        return (h("bs-empty-state", { part: "empty", class: "bs-app-switcher__empty", heading: heading, description: description, intent: intent }, icon, action));
+    }
+    renderBody() {
+        if (this.status === 'loading') {
+            return (h("div", { class: "bs-app-switcher__body", "aria-busy": "true" }, h("bs-skeleton", { class: "bs-app-switcher__skeleton-header" }), h("ul", { role: "list", class: "bs-app-switcher__grid bs-app-switcher__grid--grid" }, SKELETON_TILES.map(() => (h("li", { class: "bs-app-switcher__skeleton-tile" }, h("bs-skeleton", { variant: "rect", class: "bs-app-switcher__skeleton-icon" }), h("bs-skeleton", { class: "bs-app-switcher__skeleton-label" })))))));
+        }
+        if (this.status === 'error') {
+            return (h("div", { class: "bs-app-switcher__body", role: "alert" }, this.renderState(this.errorHeading, this.errorDescription, 'error', h("svg", { slot: "icon", ...svgProps }, h("circle", { cx: "12", cy: "12", r: "9" }), h("path", { d: "M12 7.5v5.5M12 16.2v.1" })), h("bs-button", { slot: "action", variant: "outlined", size: "sm", onClick: () => this.bsRetry.emit() }, this.retryLabel))));
+        }
+        if (this.apps.length === 0) {
+            return (h("div", { class: "bs-app-switcher__body" }, this.renderState(this.emptyHeading, this.emptyDescription, 'default', h("svg", { slot: "icon", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true" }, [6, 12, 18].flatMap(x => [6, 12, 18].map(y => h("circle", { cx: x, cy: y, r: "1.5" })))), h("bs-button", { slot: "action", variant: "outlined", size: "sm", onClick: () => this.bsRequestAccess.emit() }, this.requestAccessLabel))));
+        }
+        return [this.renderSearch(), h("div", { class: "bs-app-switcher__body" }, this.renderApps())];
+    }
+    renderSearch() {
+        return (h("div", { part: "search", class: "bs-app-switcher__search", onKeyDown: this.onSearchKeyDown }, h("bs-input", { ref: el => (this.inputEl = el), type: "search", value: this.query, placeholder: this.searchPlaceholder, onBsInput: this.onInput })));
+    }
+    renderApps() {
+        if (this.q) {
+            const found = this.matches();
+            if (!found.length) {
+                return this.renderState(this.noResultsHeading.replace('{query}', this.query.trim()), this.noResultsDescription, 'default', h("svg", { slot: "icon", ...svgProps }, h("circle", { cx: "11", cy: "11", r: "7" }), h("path", { d: "m20 20-3.5-3.5" })), h("bs-button", { slot: "action", variant: "outlined", size: "sm", onClick: () => this.clear() }, this.clearLabel));
+            }
+            return this.renderGroup('results', `${found.length} ${found.length === 1 ? this.resultLabel : this.resultsLabel}`, found.map(a => this.renderRow(a, a.description)), 'list');
+        }
+        const recent = this.recentApps();
+        if (recent.length) {
+            return [
+                this.renderGroup('recent', this.recentLabel, recent.map(({ app, recent: r }) => this.renderRow(app, this.desc(r))), 'list'),
+                h("bs-divider", { decorative: true, class: "bs-app-switcher__section-divider" }),
+                this.renderGroup('all', this.allAppsLabel, this.apps.map(a => this.renderTile(a, 'compact')), 'grid', 'compact'),
+            ];
+        }
+        return this.renderGroup('yours', this.yourAppsLabel, this.apps.map(a => this.renderTile(a, 'grid')), 'grid', 'grid');
+    }
+    liveText() {
+        if (this.status === 'loading')
+            return this.loadingLabel;
+        if (this.status !== 'ready' || !this.apps.length || !this.q)
+            return '';
+        const n = this.matches().length;
+        return n ? `${n} ${n === 1 ? this.resultLabel : this.resultsLabel}` : this.noResultsHeading.replace('{query}', this.query.trim());
+    }
+    render() {
+        const headingId = `${this.id}-heading`;
+        return (h("bs-card", { key: '8257b65b618a40aa48c5e4e6ea464cd0e730b822', part: "panel", class: "bs-app-switcher", surface: "base", role: "region", "aria-labelledby": headingId }, h("div", { key: '99756a738b6954a8f6d6b4dae25115d9ba132be2', part: "header", class: "bs-app-switcher__header" }, h("h2", { key: '61ac20db2636acdf82c495e4aa1afaad047e5241', part: "heading", id: headingId, class: "bs-app-switcher__heading" }, this.heading), this.renderLink('manage', 'bs-app-switcher__manage', this.manageHref, this.manageLabel, () => this.bsManage.emit())), h("bs-divider", { key: 'f68ea80899a97f097dd26a4d4ff311a0c958c7a9', decorative: true }), this.renderBody(), h("bs-divider", { key: '05db5ca0047deb646a0b0bf68afec0663e7b132f', decorative: true }), h("div", { key: 'b32e86a8ba520756bce064384502f4ce71ada4ba', part: "footer", class: "bs-app-switcher__footer" }, this.renderLink('browse', 'bs-app-switcher__browse', this.browseHref, this.browseLabel, () => this.bsBrowseAll.emit(), h("svg", { class: "bs-app-switcher__external", ...svgProps }, h("path", { d: "M7 17 17 7M8 7h9v9" })))), h("span", { key: '1de45b23ef4e79e1b7af1f438304260f264e0489', class: "bs-app-switcher__live", role: "status" }, this.liveText())));
+    }
+};
+BsAppSwitcher.style = bsAppSwitcherCss();
+
+export { BsAppSwitcher as bs_app_switcher };

package/dist/esm/bs-attachment-list.entry.js

@@ -37,7 +37,7 @@ const BsAttachmentList = class {
         this.canScrollRight = row.scrollWidth - row.clientWidth - row.scrollLeft > 1;
     };
     render() {
-        return (h("div", { key: '5da3ba40df155851bc126032e1f3b618d5f01c2d', class: "bs-attachment-list" }, h("div", { key: 'f335a3ca13ee519190b6ba42e016a6ee42ac7dd9', part: "row", class: "bs-attachment-list__row", ref: el => (this.row = el), onScroll: this.onScroll, role: "group", "aria-label": this.ariaLabel, tabIndex: 0 }, h("slot", { key: '29076c83e54c19cb98fb0747b1ad8ac6b2a5d0da', onSlotchange: this.onSlotchange })), this.canScrollRight && h("div", { key: '025b21c62387ecf3656dd7a8492a45fe3376a3ea', part: "fade", class: "bs-attachment-list__fade", "aria-hidden": "true" })));
+        return (h("div", { key: 'c01982051a8914fcaede14e787f362a4f82a317d', class: "bs-attachment-list" }, h("div", { key: '9475c8aa5dec12ed9356f72326bdc4ab215576d5', part: "row", class: "bs-attachment-list__row", ref: el => (this.row = el), onScroll: this.onScroll, role: "group", "aria-label": this.ariaLabel, tabIndex: 0 }, h("slot", { key: '85db80cf4422334d291377e5cc7390f69e014676', onSlotchange: this.onSlotchange })), this.canScrollRight && h("div", { key: 'a8659966ec3fd0a128a9e4b5d40ff7121b919172', part: "fade", class: "bs-attachment-list__fade", "aria-hidden": "true" })));
     }
 };
 BsAttachmentList.style = bsAttachmentListCss();

package/dist/esm/bs-attachment.entry.js

@@ -30,7 +30,7 @@ const BsAttachment = class {
     };
     render() {
         const isImage = this.type === 'image';
-        return (h("div", { key: '6919ab09c1a5acb3eb1fd6b7d617683d848a593f', class: { 'bs-attachment': true, 'bs-attachment--loading': this.loading }, "aria-busy": this.loading ? 'true' : 'false' }, isImage ? this.renderImage() : this.renderCard(), this.removable && (h("bs-icon-button", { key: '270cdce81d9b3d7646ad4e24258791615a848c88', part: "remove", class: "bs-attachment__remove", size: "xs", variant: "neutral", ariaLabel: `${this.removeLabel}: ${this.fileName}`, onClick: this.onRemoveClick }, h(CloseIcon, { key: '6d2cd9288f9dfe717bb95ac24ccb0752d0923404' })))));
+        return (h("div", { key: '397e7570d4765a1e4dfb410666c0fb0b78c06686', class: { 'bs-attachment': true, 'bs-attachment--loading': this.loading }, "aria-busy": this.loading ? 'true' : 'false' }, isImage ? this.renderImage() : this.renderCard(), this.removable && (h("bs-icon-button", { key: '738b5e3dbf1e2b0856bb20dc5eb3027d1cd87ef5', part: "remove", class: "bs-attachment__remove", size: "xs", variant: "neutral", ariaLabel: `${this.removeLabel}: ${this.fileName}`, onClick: this.onRemoveClick }, h(CloseIcon, { key: 'd21c9d3832f170c5af2d01e2d76b83be3acd3da7' })))));
     }
     renderImage() {
         return (h("div", { part: "thumbnail", class: "bs-attachment__thumbnail" }, h("img", { class: "bs-attachment__image", src: this.imageSrc, alt: this.imageAlt }), this.loading && h(Spinner, { class: "bs-attachment__spinner bs-attachment__spinner--overlay", size: 16, label: this.uploadingLabel })));

package/dist/esm/bs-avatar.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h } from './index-D3SkQJpw.js';
 
-const bsAvatarCss = () => `:host{display:inline-flex;vertical-align:middle;--bs-avatar-size-xs:24px;--bs-avatar-size-sm:32px;--bs-avatar-size-md:44px;--bs-avatar-size-lg:64px;--bs-avatar-size-xl:96px;--bs-avatar-size-xxl:128px;--bs-avatar-radius:var(--bs-border-radius-full);--bs-avatar-border-width:var(--bs-border-width-thin);--bs-avatar-border-width-xxl:1.333px}.bs-avatar{box-sizing:border-box;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--bs-avatar-radius);border:var(--bs-avatar-border-width) solid var(--bs-avatar-border-primary);background:var(--bs-avatar-bg-dafault);flex-shrink:0;user-select:none;-webkit-user-select:none}.bs-avatar--xs{width:var(--bs-avatar-size-xs);height:var(--bs-avatar-size-xs)}.bs-avatar--sm{width:var(--bs-avatar-size-sm);height:var(--bs-avatar-size-sm)}.bs-avatar--md{width:var(--bs-avatar-size-md);height:var(--bs-avatar-size-md)}.bs-avatar--lg{width:var(--bs-avatar-size-lg);height:var(--bs-avatar-size-lg)}.bs-avatar--xl{width:var(--bs-avatar-size-xl);height:var(--bs-avatar-size-xl)}.bs-avatar--xxl{width:var(--bs-avatar-size-xxl);height:var(--bs-avatar-size-xxl);border-width:var(--bs-avatar-border-width-xxl)}.bs-avatar__image{display:block;width:100%;height:100%;object-fit:cover}.bs-avatar__icon{width:60%;height:60%;color:var(--bs-avatar-icon-primary)}.bs-avatar__initials{color:var(--bs-avatar-text-default);font-family:var(--bs-typography-font-family-body);font-weight:var(--bs-font-weight-medium);text-align:center;white-space:nowrap}.bs-avatar--xs .bs-avatar__initials,.bs-avatar--sm .bs-avatar__initials{font-size:var(--bs-fontsize-caption-sm);line-height:calc(var(--bs-line-height-caption-sm) * 1px)}.bs-avatar--md .bs-avatar__initials{font-family:var(--bs-typography-font-family-heading);font-weight:var(--bs-font-weight-bold);font-size:var(--bs-fontsize-heading-h6);line-height:calc(var(--bs-line-height-heading-h6) * 1px)}.bs-avatar--lg .bs-avatar__initials{font-size:var(--bs-fontsize-body-md);line-height:calc(var(--bs-line-height-body-md) * 1px)}.bs-avatar--xl .bs-avatar__initials,.bs-avatar--xxl .bs-avatar__initials{font-family:var(--bs-typography-font-family-heading);font-weight:var(--bs-font-weight-bold);font-size:var(--bs-fontsize-heading-h4);line-height:calc(var(--bs-line-height-heading-h4) * 1px)}:host(:hover:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-hover);border-color:var(--bs-avatar-border-hover)}:host(:active:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-pressed);border-color:var(--bs-avatar-border-pressed)}:host(:focus-visible:not([disabled])){outline:none}:host(:focus-visible:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-focused);border-color:var(--bs-avatar-border-focused);box-shadow:0 0 0 3px var(--bs-avatar-border-focus)}:host([disabled]){opacity:0.5}`;
+const bsAvatarCss = () => `:host{display:inline-flex;vertical-align:middle;--bs-avatar-size-xs:24px;--bs-avatar-size-sm:32px;--bs-avatar-size-md:44px;--bs-avatar-size-lg:64px;--bs-avatar-size-xl:96px;--bs-avatar-size-xxl:128px;--bs-avatar-radius:var(--bs-border-radius-full);--bs-avatar-border-width:var(--bs-border-width-thin);--bs-avatar-border-width-xxl:1.333px}.bs-avatar{box-sizing:border-box;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--bs-avatar-radius);border:var(--bs-avatar-border-width) solid var(--bs-avatar-border-primary);background:var(--bs-avatar-bg-dafault);flex-shrink:0;user-select:none;-webkit-user-select:none}.bs-avatar--xs{width:var(--bs-avatar-size-xs);height:var(--bs-avatar-size-xs)}.bs-avatar--sm{width:var(--bs-avatar-size-sm);height:var(--bs-avatar-size-sm)}.bs-avatar--md{width:var(--bs-avatar-size-md);height:var(--bs-avatar-size-md)}.bs-avatar--lg{width:var(--bs-avatar-size-lg);height:var(--bs-avatar-size-lg)}.bs-avatar--xl{width:var(--bs-avatar-size-xl);height:var(--bs-avatar-size-xl)}.bs-avatar--xxl{width:var(--bs-avatar-size-xxl);height:var(--bs-avatar-size-xxl);border-width:var(--bs-avatar-border-width-xxl)}.bs-avatar__image{display:block;width:100%;height:100%;object-fit:cover}.bs-avatar__icon{width:60%;height:60%;color:var(--bs-avatar-icon-primary)}.bs-avatar__initials{color:var(--bs-avatar-text-default);font-family:var(--bs-typography-font-family-body, Roboto), sans-serif;font-weight:var(--bs-font-weight-medium);text-align:center;white-space:nowrap}.bs-avatar--xs .bs-avatar__initials,.bs-avatar--sm .bs-avatar__initials{font-size:var(--bs-fontsize-caption-sm);line-height:calc(var(--bs-line-height-caption-sm) * 1px)}.bs-avatar--md .bs-avatar__initials{font-family:var(--bs-typography-font-family-heading, Roboto), sans-serif;font-weight:var(--bs-font-weight-bold);font-size:var(--bs-fontsize-heading-h6);line-height:calc(var(--bs-line-height-heading-h6) * 1px)}.bs-avatar--lg .bs-avatar__initials{font-size:var(--bs-fontsize-body-md);line-height:calc(var(--bs-line-height-body-md) * 1px)}.bs-avatar--xl .bs-avatar__initials,.bs-avatar--xxl .bs-avatar__initials{font-family:var(--bs-typography-font-family-heading, Roboto), sans-serif;font-weight:var(--bs-font-weight-bold);font-size:var(--bs-fontsize-heading-h4);line-height:calc(var(--bs-line-height-heading-h4) * 1px)}:host(:hover:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-hover);border-color:var(--bs-avatar-border-hover)}:host(:active:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-pressed);border-color:var(--bs-avatar-border-pressed)}:host(:focus-visible:not([disabled])){outline:none}:host(:focus-visible:not([disabled])) .bs-avatar{background:var(--bs-avatar-bg-focused);border-color:var(--bs-avatar-border-focused);box-shadow:0 0 0 3px var(--bs-avatar-border-focus)}:host([disabled]){opacity:0.5}`;
 
 const BsAvatar = class {
     constructor(hostRef) {

package/dist/esm/bs-badge.entry.js

@@ -9,7 +9,7 @@ const BsBadge = class {
     /** Maps directly to the brandsync-tokens `--bs-badge-bg-*` / `--bs-badge-text-*` sets. */
     variant = 'default';
     render() {
-        return (h("span", { key: '91c12085eda1d9599e50542a273bab640e7f348f', part: "container", class: `bs-badge bs-badge--${this.variant}` }, h("slot", { key: '21f0edd06967e4f608cc16f27c52d3eec0794eb0' })));
+        return (h("span", { key: 'e81df8a115da1e47eec003565f06f7d8f2bce24a', part: "container", class: `bs-badge bs-badge--${this.variant}` }, h("slot", { key: '112b68af29d688640aace037db5f9d786956d264' })));
     }
 };
 BsBadge.style = bsBadgeCss();

package/dist/esm/bs-breadcrumb-overflow.entry.js

@@ -56,7 +56,7 @@ const BsBreadcrumbOverflow = class {
         }
     }
     render() {
-        return (h(Host, { key: '4dd958f3f99f42072bb314654fc5a0856d8e41c4', role: "listitem" }, h("span", { key: 'ab7d01467e99b810b62e71d7ed289316470529f5', part: "separator", class: "bs-breadcrumb-overflow__separator", "aria-hidden": "true" }, h(CaretRightIcon, { key: '6590de37057e39c4c914fde3dc3490e17566ad66' })), h("span", { key: '63081f592180f605716221c80dbb877acf926d48', class: "bs-breadcrumb-overflow__wrapper" }, h("button", { key: '0ec87f47561dc329269b1fefef0ccb76dae4cdb4', type: "button", part: "ellipsis", class: "bs-breadcrumb-overflow__ellipsis", "aria-haspopup": "menu", "aria-expanded": String(this.open), "aria-label": this.overflowLabel, onClick: this.onEllipsisToggle }, h(DotsThreeIcon, { key: '6da3c5bee9f532264e2e58227dccc4dfc3786782' })), this.open && this.items.length > 0 && (h("bs-menu", { key: '66f772f0f53090e960d2a9b08e1283989dfc02f8', part: "menu", class: "bs-breadcrumb-overflow__menu" }, this.items.map(item => item.href ? (h("a", { part: "link", class: "bs-breadcrumb-overflow__link", href: item.href, onClick: this.onItemClick(item.href) }, item.label)) : (h("span", { part: "link", class: "bs-breadcrumb-overflow__link" }, item.label))))))));
+        return (h(Host, { key: '8b47ed9e6346d813bf2db5a510151027d6f2a523', role: "listitem" }, h("span", { key: '7eb3b681a555c1bf07b16c34c8e7364384ecb3d2', part: "separator", class: "bs-breadcrumb-overflow__separator", "aria-hidden": "true" }, h(CaretRightIcon, { key: '4bd4ced37d1a24b37f507b53b7b6c0fe8f577de7' })), h("span", { key: '03f6ff9300d53bcbddf6d8fb57ed08a85fe9e67b', class: "bs-breadcrumb-overflow__wrapper" }, h("button", { key: '9b0fb0cfc28ccffbfe54dffc8a5612d1c83b27f5', type: "button", part: "ellipsis", class: "bs-breadcrumb-overflow__ellipsis", "aria-haspopup": "menu", "aria-expanded": String(this.open), "aria-label": this.overflowLabel, onClick: this.onEllipsisToggle }, h(DotsThreeIcon, { key: '932b86a682c495b1acc47cd703294c5b2dbf3c03' })), this.open && this.items.length > 0 && (h("bs-menu", { key: '809bbfe99843c3e531ee2e620a5adca4c66360d9', part: "menu", class: "bs-breadcrumb-overflow__menu" }, this.items.map(item => item.href ? (h("a", { part: "link", class: "bs-breadcrumb-overflow__link", href: item.href, onClick: this.onItemClick(item.href) }, item.label)) : (h("span", { part: "link", class: "bs-breadcrumb-overflow__link" }, item.label))))))));
     }
 };
 const CaretRightIcon = () => (h("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true" }, h("path", { d: "M6 3L11 8L6 13", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })));

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

@@ -39,7 +39,7 @@ const BsBreadcrumb = class {
             ev.preventDefault();
     };
     render() {
-        return (h(Host, { key: 'a9ccd034d839eb8c2b3e3dfb7536737cd0189b75', role: "listitem" }, h("span", { key: '5b10b00b1b2ac1a5246f8d658edb2f2a1110df56', part: "separator", class: "bs-breadcrumb__separator", "aria-hidden": "true" }, h(CaretRightIcon, { key: 'c3d867d49f00e09a333116f9f87aeb6c9478379b' })), this.current ? (h("span", { part: "current", class: "bs-breadcrumb__current", "aria-current": "page" }, h("slot", null))) : this.href ? (h("a", { part: "link", class: "bs-breadcrumb__link", href: this.href, onClick: this.onLinkClick }, h("slot", null))) : (h("span", { part: "link", class: "bs-breadcrumb__link" }, h("slot", null)))));
+        return (h(Host, { key: 'b6d483d8dd99cda45b49bfc488aeec3514e3b234', role: "listitem" }, h("span", { key: '2dd5b9265590a43403f22830d34c1c7c4815927e', part: "separator", class: "bs-breadcrumb__separator", "aria-hidden": "true" }, h(CaretRightIcon, { key: '7178d1170e8fbdde1281514ac6916bf1e7561e7b' })), this.current ? (h("span", { part: "current", class: "bs-breadcrumb__current", "aria-current": "page" }, h("slot", null))) : this.href ? (h("a", { part: "link", class: "bs-breadcrumb__link", href: this.href, onClick: this.onLinkClick }, h("slot", null))) : (h("span", { part: "link", class: "bs-breadcrumb__link" }, h("slot", null)))));
     }
 };
 const CaretRightIcon = () => (h("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true" }, h("path", { d: "M6 3L11 8L6 13", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })));

package/dist/esm/bs-breadcrumbs.entry.js

@@ -34,7 +34,7 @@ const BsBreadcrumbs = class {
         });
     }
     render() {
-        return (h("nav", { key: '598006bc4c7ef1bfba83ec4770b6e52c4dac8fe7', "aria-label": this.label }, h("ol", { key: '450ddcd3f5739d074bead021f32c91aaa8149559', part: "list", class: "bs-breadcrumbs__list" }, h("slot", { key: '772821437007761a6367a1d4d7dacf7a34739f9a', onSlotchange: this.onSlotChange }))));
+        return (h("nav", { key: '6df966694de1f681033e8705c536c983faa1155c', "aria-label": this.label }, h("ol", { key: '61d5e7cf39bbee670f49bbc8340df75057919431', part: "list", class: "bs-breadcrumbs__list" }, h("slot", { key: '12ac9fccdb05ecf029e8eeaaa98065272945341b', onSlotchange: this.onSlotChange }))));
     }
     static get watchers() { return {
         "size": [{

package/dist/esm/bs-button-skeleton.entry.js

@@ -11,7 +11,7 @@ const BsButtonSkeleton = class {
     /** Accessible name announced for the loading placeholder. */
     loadingLabel = 'Loading';
     render() {
-        return h("span", { key: '248ee140711040c1a4a35cd8539431d79d5f5c7c', part: "container", class: `bs-button-skeleton bs-button-skeleton--${this.size}`, role: "status", "aria-label": this.loadingLabel });
+        return h("span", { key: 'c29256165abc3f5de50cf1f087f0ad161e33bb76', part: "container", class: `bs-button-skeleton bs-button-skeleton--${this.size}`, role: "status", "aria-label": this.loadingLabel });
     }
 };
 BsButtonSkeleton.style = bsButtonSkeletonCss();

package/dist/esm/bs-button_2.entry.js

@@ -0,0 +1,195 @@
+import { r as registerInstance, a as getElement, h, H as Host } from './index-D3SkQJpw.js';
+
+const bsButtonCss = () => `:host{display:inline-block;width:var(--bs-button-width);--bs-button-width:auto;--bs-button-subtle-color:var(--bs-color-neutral-default);--bs-button-height-sm:var(--bs-spacing-500);--bs-button-height-md:var(--bs-spacing-600);--bs-button-height-lg:var(--bs-spacing-700);--bs-button-radius:var(--bs-border-radius-100);--bs-button-padding-x-sm:var(--bs-spacing-300);--bs-button-padding-x-icon-side:var(--bs-spacing-150);--bs-button-padding-x-label-side:var(--bs-spacing-250);--bs-button-error-default:var(--bs-color-error-default);--bs-button-error-hover:var(--bs-color-error-hover);--bs-button-error-focus:var(--bs-border-error-focus);--bs-button-error-pressed:var(--bs-color-error-pressed);--bs-button-error-disabled:var(--bs-surface-action-disabled);--bs-button-success-default:var(--bs-color-success-default);--bs-button-success-hover:var(--bs-color-success-hover);--bs-button-success-focus:var(--bs-border-success-focus);--bs-button-success-pressed:var(--bs-color-success-pressed);--bs-button-success-disabled:var(--bs-surface-action-disabled);--bs-button-warning-default:var(--bs-color-warning-default);--bs-button-warning-hover:var(--bs-color-warning-hover);--bs-button-warning-focus:var(--bs-border-warning-focus);--bs-button-warning-pressed:var(--bs-color-warning-pressed);--bs-button-warning-disabled:var(--bs-surface-action-disabled);--bs-button-info-default:var(--bs-color-info-default);--bs-button-info-hover:var(--bs-color-info-hover);--bs-button-info-focus:var(--bs-border-info-focus);--bs-button-info-pressed:var(--bs-color-info-pressed);--bs-button-info-disabled:var(--bs-surface-action-disabled);--bs-button-subtle-hover:var(--bs-color-neutral-container);--bs-button-subtle-pressed:var(--bs-color-neutral-container-pressed);--bs-button-subtle-focus:var(--bs-border-primary-focus);--bs-button-neutral-border:var(--bs-border-neutral-container);--bs-button-neutral-border-hover:var(--bs-border-neutral-container-hover);--bs-button-neutral-border-pressed:var(--bs-border-neutral-container-pressed);--bs-button-neutral-hover:var(--bs-color-neutral-container-hover);--bs-button-neutral-pressed:var(--bs-color-neutral-container-pressed);--bs-button-outlined-border:var(--bs-color-primary-default);--bs-button-outlined-border-hover:var(--bs-color-primary-hover);--bs-button-outlined-border-pressed:var(--bs-color-primary-pressed);--bs-button-outlined-text-hover:var(--bs-text-action-hover);--bs-button-outlined-focus:var(--bs-border-primary-focus);--bs-button-outlined-container:var(--bs-color-primary-container)}.bs-button{width:100%;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:none;border-radius:var(--bs-button-radius);font-family:inherit;font-weight:var(--bs-font-weight-regular);cursor:pointer;position:relative;transition:background-color var(--bs-duration-fast, 120ms) var(--bs-easing-standard, ease)}.bs-button:focus-visible{outline:2px solid var(--bs-border-neutral-focus);outline-offset:2px}.bs-button:disabled{cursor:not-allowed}.bs-button--sm{height:var(--bs-button-height-sm);padding:0 var(--bs-button-padding-x-sm);font-size:var(--bs-font-size-sm)}.bs-button--md{height:var(--bs-button-height-md);padding:0 var(--bs-spacing-200);font-size:var(--bs-font-size-md)}.bs-button--lg{height:var(--bs-button-height-lg);padding:0 var(--bs-spacing-500);font-size:var(--bs-font-size-lg)}.bs-button--primary{background:var(--bs-button-primary-default);color:var(--bs-text-on-action)}.bs-button--primary:hover:not(:disabled){background:var(--bs-button-primary-hover)}.bs-button--primary:active:not(:disabled){background:var(--bs-button-primary-pressed)}.bs-button--primary:disabled{background:var(--bs-button-primary-disabled);color:var(--bs-text-on-disabled)}.bs-button--neutral{background:var(--bs-button-neutral-container);color:var(--bs-text-default);border:1px solid var(--bs-button-neutral-border)}.bs-button--neutral:hover:not(:disabled){background:var(--bs-button-neutral-hover);border-color:var(--bs-button-neutral-border-hover)}.bs-button--neutral:active:not(:disabled){background:var(--bs-button-neutral-pressed);border-color:var(--bs-button-neutral-border-pressed)}.bs-button--neutral:disabled{background:var(--bs-button-neutral-disabled);color:var(--bs-text-on-disabled);border-color:var(--bs-button-neutral-border)}.bs-button--error{background:var(--bs-button-error-default);color:var(--bs-text-on-action)}.bs-button--error:hover:not(:disabled){background:var(--bs-button-error-hover)}.bs-button--error:active:not(:disabled){background:var(--bs-button-error-pressed)}.bs-button--error:disabled{background:var(--bs-button-error-disabled);color:var(--bs-text-on-disabled)}.bs-button--error:focus-visible{outline-color:var(--bs-button-error-focus)}.bs-button--success{background:var(--bs-button-success-default);color:var(--bs-text-on-action)}.bs-button--success:hover:not(:disabled){background:var(--bs-button-success-hover)}.bs-button--success:active:not(:disabled){background:var(--bs-button-success-pressed)}.bs-button--success:disabled{background:var(--bs-button-success-disabled);color:var(--bs-text-on-disabled)}.bs-button--success:focus-visible{outline-color:var(--bs-button-success-focus)}.bs-button--warning{background:var(--bs-button-warning-default);color:var(--bs-text-on-action)}.bs-button--warning:hover:not(:disabled){background:var(--bs-button-warning-hover)}.bs-button--warning:active:not(:disabled){background:var(--bs-button-warning-pressed)}.bs-button--warning:disabled{background:var(--bs-button-warning-disabled);color:var(--bs-text-on-disabled)}.bs-button--warning:focus-visible{outline-color:var(--bs-button-warning-focus)}.bs-button--info{background:var(--bs-button-info-default);color:var(--bs-text-on-action)}.bs-button--info:hover:not(:disabled){background:var(--bs-button-info-hover)}.bs-button--info:active:not(:disabled){background:var(--bs-button-info-pressed)}.bs-button--info:disabled{background:var(--bs-button-info-disabled);color:var(--bs-text-on-disabled)}.bs-button--info:focus-visible{outline-color:var(--bs-button-info-focus)}.bs-button--subtle{background:transparent;color:var(--bs-button-subtle-color)}.bs-button--subtle:hover:not(:disabled){background:var(--bs-button-subtle-hover)}.bs-button--subtle:active:not(:disabled){background:var(--bs-button-subtle-pressed)}.bs-button--subtle:disabled{background:transparent;color:var(--bs-text-on-disabled)}.bs-button--subtle:focus-visible{outline-color:var(--bs-button-subtle-focus);background:var(--bs-button-subtle-hover)}.bs-button--outlined{background:transparent;color:var(--bs-color-primary-default);border:1px solid var(--bs-button-outlined-border)}.bs-button--outlined:hover:not(:disabled){background:var(--bs-button-outlined-container);border-color:var(--bs-button-outlined-border-hover);color:var(--bs-button-outlined-text-hover)}.bs-button--outlined:active:not(:disabled){background:var(--bs-button-outlined-container);color:var(--bs-button-outlined-text-hover);border-color:var(--bs-button-outlined-border-pressed)}.bs-button--outlined:disabled{opacity:var(--bs-opacity-disabled);cursor:not-allowed}.bs-button--outlined:focus-visible{outline-color:var(--bs-button-outlined-focus)}.bs-button__icon--visible{margin-inline-end:var(--bs-spacing-50)}.bs-button__end-icon--visible{margin-inline-start:var(--bs-spacing-50)}.bs-button__icon ::slotted(*),.bs-button__end-icon ::slotted(*){display:block;width:1em;height:1em}.bs-button--icon-only{padding:0;aspect-ratio:1 / 1}.bs-button--icon-only .bs-button__icon--visible{margin-inline-end:0}.bs-button--icon-only .bs-button__end-icon--visible{margin-inline-start:0}.bs-button--has-icon:not(.bs-button--has-end-icon){padding-inline-start:var(--bs-button-padding-x-icon-side);padding-inline-end:var(--bs-button-padding-x-label-side)}.bs-button--has-end-icon:not(.bs-button--has-icon){padding-inline-start:var(--bs-button-padding-x-label-side);padding-inline-end:var(--bs-button-padding-x-icon-side)}.bs-button--has-icon.bs-button--has-end-icon{padding-inline-start:var(--bs-button-padding-x-icon-side);padding-inline-end:var(--bs-button-padding-x-icon-side)}@media (forced-colors: active){.bs-button{border:1px solid ButtonText}.bs-button:disabled{border-color:GrayText;color:GrayText}.bs-button:focus-visible{outline:2px solid Highlight;outline-offset:2px}}`;
+
+const BsButton = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.internals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.internals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.internals;
+        }
+    }
+    get el() { return getElement(this); }
+    internals;
+    /**
+     * Visual style. Maps directly to the brandsync-tokens `--bs-button-*` semantic set.
+     * `error` is for destructive/irreversible actions per BrandSync guidance, not a stronger
+     * emphasis alternative to `primary`.
+     */
+    variant = 'primary';
+    /** Sizing scale. */
+    size = 'md';
+    /** Disables the button and applies the disabled token set. */
+    disabled = false;
+    /** Button type. `submit` submits the surrounding `<form>` (via `requestSubmit()`, so validation
+     * runs); `reset` resets it; `button` (default) does nothing on its own. */
+    type = 'button';
+    /**
+     * Accessible name for the button. Required for icon-only usage (no visible label text via the
+     * default slot) so screen readers still announce what the button does. Stencil reflects this
+     * camelCase prop to the `aria-label` HTML attribute automatically.
+     */
+    ariaLabel = null;
+    /** Tracks whether the `icon` slot has assigned content, so the icon/label gap only
+     * applies when there's actually an icon. */
+    hasIcon = false;
+    /** Tracks whether the `end-icon` slot has assigned content, so the icon/label gap only
+     * applies when there's actually a trailing icon. */
+    hasEndIcon = false;
+    /**
+     * Tracks whether the default (label) slot has assigned content, so an icon-only button can be
+     * styled/sized differently (see `bs-button--icon-only`).
+     *
+     * Known edge case (not fixed, same simplification `hasIcon`/similar flags elsewhere in this
+     * codebase already make): a default slot containing only whitespace (e.g. a lone space text
+     * node) still counts as `hasLabel = true`, since checking for assigned nodes doesn't
+     * distinguish whitespace-only text nodes from real content.
+     */
+    hasLabel = false;
+    /**
+     * Computes the initial `hasIcon`/`hasEndIcon`/`hasLabel` state directly from the host's light
+     * DOM children, before first render.
+     *
+     * This can't be left to the `slotchange` handlers below alone: `slotchange` only fires when a
+     * slot's *assigned nodes* change, and a slot that starts out with zero assigned nodes and stays
+     * that way never fires it (nothing changed). Relying on `slotchange` alone left an icon-only
+     * button (default slot empty from the start) permanently stuck on its initial `hasLabel`
+     * default, so `bs-button--icon-only` never applied.
+     */
+    componentWillLoad() {
+        this.hasIcon = this.hasSlottedContent('icon');
+        this.hasEndIcon = this.hasSlottedContent('end-icon');
+        this.hasLabel = this.hasSlottedContent(null);
+    }
+    hasSlottedContent(slotName) {
+        return Array.from(this.el.childNodes).some(node => {
+            if (node.nodeType === Node.ELEMENT_NODE) {
+                return node.getAttribute('slot') === slotName;
+            }
+            // Only elements can carry a `slot` attribute -- any other node type (text, comments) can
+            // only ever be assigned to the default slot.
+            return slotName === null;
+        });
+    }
+    onIconSlotchange = (ev) => {
+        this.hasIcon = ev.target.assignedNodes().length > 0;
+    };
+    onEndIconSlotchange = (ev) => {
+        this.hasEndIcon = ev.target.assignedNodes().length > 0;
+    };
+    onLabelSlotchange = (ev) => {
+        this.hasLabel = ev.target.assignedNodes().length > 0;
+    };
+    onClick = () => {
+        const form = this.internals?.form;
+        if (!form || this.disabled)
+            return;
+        if (this.type === 'submit')
+            form.requestSubmit();
+        else if (this.type === 'reset')
+            form.reset();
+    };
+    render() {
+        const iconOnly = (this.hasIcon || this.hasEndIcon) && !this.hasLabel;
+        return (h("button", { key: '498371cb1db28a17e668275a5e3dab6a093ce932', class: `bs-button bs-button--${this.variant} bs-button--${this.size} ${iconOnly ? 'bs-button--icon-only' : ''} ${this.hasIcon && !iconOnly ? 'bs-button--has-icon' : ''} ${this.hasEndIcon && !iconOnly ? 'bs-button--has-end-icon' : ''}`, type: this.type, disabled: this.disabled, "aria-label": this.ariaLabel, onClick: this.onClick }, h("bs-ripple", { key: '1d985ad61540f85cc47332f876eda6efcef5b87a', part: "ripple", centered: iconOnly, disabled: this.disabled }), h("span", { key: 'fbf28591ab62369e0a1a7b32da670cd350aee122', part: "icon", class: `bs-button__icon ${this.hasIcon ? 'bs-button__icon--visible' : ''}` }, h("slot", { key: '294540047c366c6f8576c8123f64f55c712d6335', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '8536c25dab900331235dba703350ff57fd7c8ff6', part: "label", class: "bs-button__label" }, h("slot", { key: '59cdb689925c55ec90c34a016e586f5be95f38e4', onSlotchange: this.onLabelSlotchange })), h("span", { key: '0976f3628408ccccec017b8e09b5a41016f0b516', part: "end-icon", class: `bs-button__end-icon ${this.hasEndIcon ? 'bs-button__end-icon--visible' : ''}` }, h("slot", { key: '40a1f6d3faf5f4ae39e9da0aa0027207afe3e7a1', name: "end-icon", onSlotchange: this.onEndIconSlotchange }))));
+    }
+    static get delegatesFocus() { return true; }
+    static get formAssociated() { return true; }
+};
+BsButton.style = bsButtonCss();
+
+const bsRippleCss = () => `:host{position:absolute;inset:0;display:block;border-radius:inherit;overflow:hidden;pointer-events:none;--bs-ripple-color:currentColor;--bs-ripple-opacity:0.24;--bs-ripple-duration:var(--bs-duration-slower);--bs-ripple-easing:var(--bs-easing-decelerate)}.bs-ripple{position:absolute;inset:0;overflow:hidden;border-radius:inherit}.bs-ripple__circle{position:absolute;border-radius:50%;background:var(--bs-ripple-color);opacity:0;transform:scale(0);pointer-events:none}`;
+
+const BsRipple = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    /** Always start the ripple from the centre instead of the press point. Use it for round or icon-only controls. */
+    centered = false;
+    /** Turns the ripple off. A disabled parent (`<button disabled>`) also stops it. */
+    disabled = false;
+    /**
+     * CSS selector of the element to listen on, found with `closest()` from the ripple (so it stays inside
+     * the same shadow tree). By default the ripple listens on its parent. Use it when the pressable element
+     * is bigger than the ripple's own parent, e.g. a switch whose ripple sits on the knob but whose whole
+     * `<label>` is the press target.
+     */
+    triggerSelector;
+    onTriggerChange() {
+        this.bind();
+    }
+    surface;
+    target;
+    connectedCallback() {
+        this.bind();
+    }
+    componentDidLoad() {
+        // Props are set by now, so a `triggerSelector` is resolved against the final DOM.
+        this.bind();
+    }
+    disconnectedCallback() {
+        this.unbind();
+    }
+    bind() {
+        this.unbind();
+        const target = (this.triggerSelector && this.el.closest(this.triggerSelector)) || this.el.parentElement || this.el.getRootNode().host;
+        this.target = target;
+        this.target?.addEventListener('pointerdown', this.onPointerDown);
+    }
+    unbind() {
+        this.target?.removeEventListener('pointerdown', this.onPointerDown);
+        this.target = undefined;
+    }
+    onPointerDown = (ev) => {
+        if (this.disabled || ev.button !== 0 || this.target?.disabled)
+            return;
+        const surface = this.surface;
+        if (!surface)
+            return;
+        const style = getComputedStyle(this.el);
+        const duration = this.toMs(style.getPropertyValue('--bs-ripple-duration'));
+        if (duration === 0)
+            return;
+        const rect = this.el.getBoundingClientRect();
+        const x = this.centered ? rect.width / 2 : ev.clientX - rect.left;
+        const y = this.centered ? rect.height / 2 : ev.clientY - rect.top;
+        // Radius that reaches the farthest corner, so the ripple always covers the whole surface.
+        const radius = Math.hypot(Math.max(x, rect.width - x), Math.max(y, rect.height - y));
+        const circle = document.createElement('span');
+        circle.className = 'bs-ripple__circle';
+        circle.style.left = `${x - radius}px`;
+        circle.style.top = `${y - radius}px`;
+        circle.style.width = circle.style.height = `${radius * 2}px`;
+        surface.appendChild(circle);
+        const opacity = style.getPropertyValue('--bs-ripple-opacity').trim() || '0.24';
+        const animation = circle.animate([
+            { transform: 'scale(0)', opacity },
+            { transform: 'scale(1)', opacity: 0 },
+        ], { duration, easing: style.getPropertyValue('--bs-ripple-easing').trim() || 'ease-out' });
+        animation.onfinish = animation.oncancel = () => circle.remove();
+    };
+    toMs(value) {
+        const v = value.trim();
+        if (v.endsWith('ms'))
+            return parseFloat(v);
+        if (v.endsWith('s'))
+            return parseFloat(v) * 1000;
+        return 0;
+    }
+    render() {
+        return (h(Host, { key: '4bb0dd71635f57ed90deeeabc39a7abee9e66103', "aria-hidden": "true" }, h("div", { key: '29c6a7f4eefcb14598ee0aa2bc3980be2e04ebbc', part: "surface", class: "bs-ripple", ref: el => (this.surface = el) })));
+    }
+    static get watchers() { return {
+        "triggerSelector": [{
+                "onTriggerChange": 0
+            }]
+    }; }
+};
+BsRipple.style = bsRippleCss();
+
+export { BsButton as bs_button, BsRipple as bs_ripple };

package/dist/esm/bs-card.entry.js

@@ -17,7 +17,7 @@ const BsCard = class {
         this.hasImage = ev.target.assignedNodes().length > 0;
     };
     render() {
-        return (h("div", { key: '288db1e39f66129bf5d6598f53fb49d5481d0f02', part: "container", class: `bs-card bs-card--${this.surface}` }, h("div", { key: '9f25abc5cdfdf40d7bdefab7f1154545cc634f9d', part: "image", class: `bs-card__image ${this.hasImage ? 'bs-card__image--visible' : ''}` }, h("slot", { key: '8eff4a23e8ecf977056206bc8c223b4ad97b7656', name: "image", onSlotchange: this.onImageSlotchange })), h("div", { key: 'b0a1580657943f30c9a5dba3361dcf00dd36e90f', class: "bs-card__content" }, h("div", { key: 'f151de3b9d5975d2953131aea92a2353ac665bbc', part: "header", class: "bs-card__header" }, h("slot", { key: '6d015146a6ff72788ad3843caa37f2c304728b8b', name: "header" })), h("div", { key: 'd678f0d33dba58725b397502d9aced9983466bf6', part: "body", class: "bs-card__body" }, h("slot", { key: '51b7cdca4af0e43ba7de04c14bca32f59baa2f58' })), h("div", { key: '6b6fe027565678561d7f7beb79f6ceb05397ff50', part: "footer", class: "bs-card__footer" }, h("slot", { key: '6d704d0e7b6644e3f0e6b4ce7ae12e515c84339d', name: "footer" })))));
+        return (h("div", { key: '5badbcc0d29f07bf53520091e1e8fe8d8187dd18', part: "container", class: `bs-card bs-card--${this.surface}` }, h("div", { key: '2c69c0795db112c2dc52289a47b76d60662ef693', part: "image", class: `bs-card__image ${this.hasImage ? 'bs-card__image--visible' : ''}` }, h("slot", { key: '3aa0debc45e28c88b05103a494ee52f047305d9d', name: "image", onSlotchange: this.onImageSlotchange })), h("div", { key: '6fbe78e872b7aa7e166907a4173edd813f8fd73b', class: "bs-card__content" }, h("div", { key: '19df2524b50471bbb56e95b445643a4bfddd0c12', part: "header", class: "bs-card__header" }, h("slot", { key: 'bd4c9b53ccc07b7a95f6aee28b2a95a0ab8b137e', name: "header" })), h("div", { key: 'c5351e535d77c007806554ae3580b1b0b0bafd9d', part: "body", class: "bs-card__body" }, h("slot", { key: '323ac4df7355ce44383137ad754c650ff515ef28' })), h("div", { key: 'ac3e228d13303ffcaab2a4879a202db28e2c3a6a', part: "footer", class: "bs-card__footer" }, h("slot", { key: 'a2afbae842ef598422853a0628bb9f14dee34c6a', name: "footer" })))));
     }
 };
 BsCard.style = bsCardCss();