@brandsync/wc 1.10.0 → 1.12.0

package/dist/collection/components/bs-session-timeout/bs-session-timeout.stories.js

@@ -0,0 +1,88 @@
+import { html } from "lit";
+import { ifDefined } from "lit/directives/if-defined.js";
+import { componentDescription, propDescription } from "../../stories-utils";
+const meta = {
+    title: 'Components/bs-session-timeout',
+    parameters: { docs: { description: { component: componentDescription('bs-session-timeout') } } },
+    decorators: [story => html `<div style="padding: 24px; background: var(--bs-color-neutral-container);">${story()}</div>`],
+    render: args => html `
+    <bs-session-timeout
+      type=${args.type}
+      seconds-left=${args.secondsLeft}
+      total-seconds=${args.totalSeconds}
+      ?countdown=${args.countdown}
+      saved-message=${ifDefined(args.savedMessage || undefined)}
+      account-name=${ifDefined(args.accountName || undefined)}
+      account-email=${ifDefined(args.accountEmail || undefined)}
+      password-error=${ifDefined(args.passwordError || undefined)}
+      @bsPrimary=${(ev) => console.log('bsPrimary', ev.detail)}
+      @bsSecondary=${() => console.log('bsSecondary')}
+      @bsAlternative=${(ev) => console.log('bsAlternative', ev.detail)}
+      @bsCancel=${() => console.log('bsCancel')}
+      @bsExpire=${() => console.log('bsExpire')}
+    ></bs-session-timeout>
+  `,
+    argTypes: {
+        type: { control: 'inline-radio', options: ['warning', 'signed-out', 'confirm-identity'], description: propDescription('bs-session-timeout', 'type') },
+        secondsLeft: { control: { type: 'number', min: 0 }, description: propDescription('bs-session-timeout', 'secondsLeft') },
+        totalSeconds: { control: { type: 'number', min: 0 }, description: propDescription('bs-session-timeout', 'totalSeconds') },
+        countdown: { control: 'boolean', description: propDescription('bs-session-timeout', 'countdown') },
+        savedMessage: { control: 'text', description: propDescription('bs-session-timeout', 'savedMessage') },
+        accountName: { control: 'text', description: propDescription('bs-session-timeout', 'accountName') },
+        accountEmail: { control: 'text', description: propDescription('bs-session-timeout', 'accountEmail') },
+        passwordError: { control: 'text', description: propDescription('bs-session-timeout', 'passwordError') },
+    },
+    args: {
+        type: 'warning',
+        secondsLeft: 112,
+        totalSeconds: 335,
+        countdown: false,
+        savedMessage: 'Your draft of INV-2041 is saved automatically.',
+        accountName: 'Mette Jensen',
+        accountEmail: 'mette.jensen@nordlys.no',
+        passwordError: '',
+    },
+};
+export default meta;
+export const Warning = {
+    render: args => html `
+    <bs-session-timeout
+      seconds-left=${args.secondsLeft}
+      total-seconds=${args.totalSeconds}
+      ?countdown=${args.countdown}
+      saved-message=${args.savedMessage}
+      description="For your security, we sign you out after 30 minutes without activity."
+    ></bs-session-timeout>
+  `,
+};
+export const LiveCountdown = {
+    name: 'Live countdown',
+    args: { secondsLeft: 20, totalSeconds: 20, countdown: true },
+};
+export const SignedOut = {
+    name: 'Signed out',
+    args: { type: 'signed-out' },
+    render: args => html `
+    <bs-session-timeout
+      type="signed-out"
+      account-name=${args.accountName}
+      account-email=${args.accountEmail}
+      description="You were inactive for 30 minutes. Your draft of INV-2041 was saved and will be there when you sign in."
+    ></bs-session-timeout>
+  `,
+};
+export const ConfirmIdentity = {
+    name: 'Confirm identity',
+    args: { type: 'confirm-identity' },
+    render: args => html `
+    <bs-session-timeout
+      type="confirm-identity"
+      password-error=${ifDefined(args.passwordError || undefined)}
+      description="Changing bank account details needs a fresh sign-in. Signed in as mette.jensen@nordlys.no."
+    ></bs-session-timeout>
+  `,
+};
+export const WrongPassword = {
+    name: 'Wrong password',
+    args: { type: 'confirm-identity', passwordError: 'That password isn’t right. Try again.' },
+};

package/dist/collection/components/bs-slider/bs-slider.js

@@ -229,7 +229,7 @@ export class BsSlider {
     render() {
         const isRange = this.type === 'range';
         const rootClasses = ['bs-slider', this.disabled ? 'bs-slider--disabled' : ''].filter(Boolean).join(' ');
-        return (h("div", { key: 'c6648b04d434b95f21b9020ee7eb773c30bad01d', class: rootClasses }, this.showLabel && (h("div", { key: '441e317ad19da525a721da0529aadd959a73c3ad', class: "bs-slider__header" }, h("span", { key: '5ed50642ee23d285a472a701bca67f68a05848fc', id: "bs-slider-label", part: "label", class: "bs-slider__label" }, this.label), isRange ? (h("span", { class: "bs-slider__value-fields" }, this.renderPercentField(this.percent(this.effectiveValueStart), this.onStartPercentFieldChange, this.ariaLabel ?? 'Start value'), h("span", { class: "bs-slider__separator" }, "\u2013"), this.renderPercentField(this.percent(this.effectiveValueEnd), this.onEndPercentFieldChange, this.ariaLabel ? `${this.ariaLabel} end` : 'End value'))) : (this.renderPercentField(this.percent(this.value), this.onPercentFieldChange, this.ariaLabel ? `${this.ariaLabel} value` : 'Value')))), h("div", { key: '2883165b7d7c649f317442a5925300c34b183e63', class: "bs-slider__row" }, this.showLabel && (h("span", { key: '7b9d60275fb8e71371277012b4fb460b357da8c8', part: "bound", class: "bs-slider__bound" }, this.min)), isRange ? this.renderRangeThumbs() : this.renderSingleThumb(), this.showLabel && (h("span", { key: '1b450b15db44433662a916dd52aaf961217e71dd', part: "bound", class: "bs-slider__bound" }, this.max)))));
+        return (h("div", { key: '7fb6a534e41e91efe00bcba839641550398eed13', class: rootClasses }, this.showLabel && (h("div", { key: '5892936540c9e4f74dfadd3ad9088ffd2c04fef5', class: "bs-slider__header" }, h("span", { key: '220c0db8a2cc5f5f29cf99830fa0b4d30ec90d32', id: "bs-slider-label", part: "label", class: "bs-slider__label" }, this.label), isRange ? (h("span", { class: "bs-slider__value-fields" }, this.renderPercentField(this.percent(this.effectiveValueStart), this.onStartPercentFieldChange, this.ariaLabel ?? 'Start value'), h("span", { class: "bs-slider__separator" }, "\u2013"), this.renderPercentField(this.percent(this.effectiveValueEnd), this.onEndPercentFieldChange, this.ariaLabel ? `${this.ariaLabel} end` : 'End value'))) : (this.renderPercentField(this.percent(this.value), this.onPercentFieldChange, this.ariaLabel ? `${this.ariaLabel} value` : 'Value')))), h("div", { key: '67830218b3aa9d927ab87c4c6ca419b3a24ca0af', class: "bs-slider__row" }, this.showLabel && (h("span", { key: 'b2569e64400853a503d1566825500f8d10fe0318', part: "bound", class: "bs-slider__bound" }, this.min)), isRange ? this.renderRangeThumbs() : this.renderSingleThumb(), this.showLabel && (h("span", { key: '2b5ac8ff8dd48f4db7a0d4db3698bb64a4f9277a', part: "bound", class: "bs-slider__bound" }, this.max)))));
     }
     static get is() { return "bs-slider"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-snackbar/bs-snackbar.cmp.test.js

@@ -66,6 +66,26 @@ describe('bs-snackbar', () => {
         });
     });
     describe('aria-live', () => {
+        it('shows the close button by default and hides it with hideClose', async () => {
+            const a = await render(h("bs-snackbar", null, "Saved"));
+            expect(a.root.shadowRoot.querySelector('[part="close"]')).not.toBeNull();
+            const b = await render(h("bs-snackbar", { hideClose: true }, "Saved"));
+            expect(b.root.shadowRoot.querySelector('[part="close"]')).toBeNull();
+        });
+        it('uses the variant-matched action button unless actionVariant is set', async () => {
+            const a = await render(h("bs-snackbar", { actionLabel: "Undo" }, "Saved"));
+            expect(a.root.shadowRoot.querySelector('[part="action"]').variant).toBe('outlined');
+            const b = await render(h("bs-snackbar", { actionLabel: "Undo", actionVariant: "subtle" }, "Saved"));
+            expect(b.root.shadowRoot.querySelector('[part="action"]').variant).toBe('subtle');
+        });
+        it('has a 24px icon by default and takes --bs-snackbar-icon-size', async () => {
+            const a = await render(h("bs-snackbar", null, "Saved"));
+            expect(a.root.shadowRoot.querySelector('[part="icon"]').getBoundingClientRect().width).toBe(24);
+            const b = await render(h("bs-snackbar", { style: { '--bs-snackbar-icon-size': '32px' } }, "Saved"));
+            const icon = b.root.shadowRoot.querySelector('[part="icon"]');
+            expect(icon.getBoundingClientRect().width).toBe(32);
+            expect(icon.querySelector('svg').getBoundingClientRect().width).toBe(32);
+        });
         it('uses aria-live="polite" for non-error variants', async () => {
             const { root } = await render(h("bs-snackbar", { variant: "success" }, "Message"));
             const container = root.shadowRoot.querySelector('[part="container"]');

package/dist/collection/components/bs-snackbar/bs-snackbar.css

@@ -4,6 +4,7 @@
  * @prop --bs-snackbar-gap: Gap between the content area and the actions area. Aliased to --bs-spacing-100.
  * @prop --bs-snackbar-content-padding-y: Top/bottom padding of the content area. Aliased to --bs-spacing-200.
  * @prop --bs-snackbar-content-padding-x: Left padding of the content area (the bar's own left edge). Aliased to --bs-spacing-200.
+ * @prop --bs-snackbar-icon-size: Width/height of the leading icon or spinner. 24px.
  * @prop --bs-snackbar-content-gap: Gap between the icon and the message. Aliased to --bs-spacing-150.
  * @prop --bs-snackbar-font-size: Message font size. Aliased to --bs-font-size-md.
  * @prop --bs-snackbar-line-height: Message line height. Aliased to --bs-line-height-body-md.
@@ -36,6 +37,7 @@
   --bs-snackbar-content-padding-y: var(--bs-spacing-200);
   --bs-snackbar-content-padding-x: var(--bs-spacing-200);
   --bs-snackbar-content-gap: var(--bs-spacing-150);
+  --bs-snackbar-icon-size: 24px;
   --bs-snackbar-font-size: var(--bs-font-size-md);
   --bs-snackbar-line-height: var(--bs-line-height-body-md);
 
@@ -115,15 +117,15 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 24px;
-  height: 24px;
+  width: var(--bs-snackbar-icon-size);
+  height: var(--bs-snackbar-icon-size);
   flex-shrink: 0;
   color: inherit;
 }
 
 .bs-snackbar__icon svg {
-  width: 24px;
-  height: 24px;
+  width: var(--bs-snackbar-icon-size);
+  height: var(--bs-snackbar-icon-size);
 }
 
 /* Same border-spin technique as bs-attachment's own upload spinner -- a light track ring plus one

package/dist/collection/components/bs-snackbar/bs-snackbar.js

@@ -49,6 +49,12 @@ export class BsSnackbar {
     /** Label for the optional action button (e.g. "Undo", "Retry"). Omit this prop entirely to
      * render no action button at all -- its presence, not a boolean flag, is what shows it. */
     actionLabel;
+    /** Variant of the action button. Defaults to the one that matches `variant` (outlined for `default`).
+     * Use `subtle` for a plain text action; colour it with `--bs-button-subtle-color` on `::part(action)`. */
+    actionVariant;
+    /** Hides the close button, for a confirmation that goes away on its own or whose only control is
+     * the action. A snackbar with no way to dismiss it must be removed by the consumer. */
+    hideClose = false;
     /** Fires when the action button is clicked. Ignored/never fires if `actionLabel` isn't set. */
     bsAction;
     /** Fires when the close button is clicked. This component doesn't remove itself from the DOM --
@@ -61,7 +67,7 @@ export class BsSnackbar {
         this.bsDismiss.emit();
     };
     render() {
-        return (h("div", { key: '26d056b4b494847c48b1c60ac0c392334d27d54e', part: "container", class: `bs-snackbar bs-snackbar--${this.variant}`, role: "status", "aria-live": this.variant === 'error' ? 'assertive' : 'polite' }, h("div", { key: '583ad744a0b8c274992bf2e98f5bc06f8937ed4c', class: "bs-snackbar__content" }, h("span", { key: '518b02e526a261be557587bb4d39a93964bcdf24', part: "icon", class: "bs-snackbar__icon", "aria-hidden": "true" }, this.loading ? h("span", { class: "bs-snackbar__spinner" }) : h(CheckCircleIcon, null)), h("span", { key: 'ad8436b86fc5232e74a5e92604adfca129b9c698', part: "message", class: "bs-snackbar__message" }, h("slot", { key: 'b6fa1efe3c4da2e03f3c45fb18f5b899411af791' }))), h("div", { key: '674f7dc064863843406f87cc5c2534e90c7d4b30', class: "bs-snackbar__actions" }, this.actionLabel && (h("bs-button", { key: '56a7051b28197f34a5a11eb3f92087defd3a495a', part: "action", variant: ACTION_VARIANT[this.variant], size: "sm", onClick: this.onAction }, this.actionLabel)), h("bs-icon-button", { key: 'cfb7f10a70ed48f0c0ecfde5212e2ce41aca17f1', part: "close", variant: "subtle", size: "md", ariaLabel: "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: '75fd2a71af3f309a19322304e7937a39729638b9' })))));
+        return (h("div", { key: '291914fd21d4d8634f49aad410f8cda212c7d07c', part: "container", class: `bs-snackbar bs-snackbar--${this.variant}`, role: "status", "aria-live": this.variant === 'error' ? 'assertive' : 'polite' }, h("div", { key: '5d50b75478197ad433c96d66ed9de3fd22360b56', class: "bs-snackbar__content" }, h("span", { key: 'd625eb5d139d7811a28d781b8eb4fffa370debab', part: "icon", class: "bs-snackbar__icon", "aria-hidden": "true" }, this.loading ? h("span", { class: "bs-snackbar__spinner" }) : h(CheckCircleIcon, null)), h("span", { key: '6c7666f8cd8d3bddf44d35a7d8e9d9c645def13f', part: "message", class: "bs-snackbar__message" }, h("slot", { key: '96e8eb40bb7a6c9292d948ac47f6e630dc843bb5' }))), h("div", { key: '60380f06bc10c964155c7cc97eb036a84506a103', class: "bs-snackbar__actions" }, this.actionLabel && (h("bs-button", { key: '843054ee154c565034ddaf7b000419d7ecc4bf63', part: "action", variant: this.actionVariant ?? ACTION_VARIANT[this.variant], size: "sm", onClick: this.onAction }, this.actionLabel)), !this.hideClose && (h("bs-icon-button", { key: '383ea23e7e5f7681651b7a6394cb39b453e5f8cb', part: "close", variant: "subtle", size: "md", ariaLabel: "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: '6ec39615ed1e82f3bb6e45a5917fa6a35166d3f1' }))))));
     }
     static get is() { return "bs-snackbar"; }
     static get encapsulation() { return "shadow"; }
@@ -141,6 +147,52 @@ export class BsSnackbar {
                 "setter": false,
                 "reflect": false,
                 "attribute": "action-label"
+            },
+            "actionVariant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "BsButtonVariant",
+                    "resolved": "\"error\" | \"info\" | \"neutral\" | \"outlined\" | \"primary\" | \"subtle\" | \"success\" | \"warning\"",
+                    "references": {
+                        "BsButtonVariant": {
+                            "location": "import",
+                            "path": "../bs-button/bs-button/bs-button",
+                            "id": "src/components/bs-button/bs-button/bs-button.tsx::BsButtonVariant",
+                            "referenceLocation": "BsButtonVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Variant of the action button. Defaults to the one that matches `variant` (outlined for `default`).\nUse `subtle` for a plain text action; colour it with `--bs-button-subtle-color` on `::part(action)`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "action-variant"
+            },
+            "hideClose": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Hides the close button, for a confirmation that goes away on its own or whose only control is\nthe action. A snackbar with no way to dismiss it must be removed by the consumer."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "hide-close",
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/bs-source-link/bs-source-link.js

@@ -51,8 +51,8 @@ export class BsSourceLink {
     };
     render() {
         const inner = [
-            h("span", { key: '0b24af45da9ac7753eabcfde75547e08e19c2fa5', class: "bs-source-link__left" }, h("span", { key: '305dd947e35832c5dc2cb04585b3289e0c36072e', class: "bs-source-link__filename-row" }, h("span", { key: '09658f61e3806bbd2c4c03c0367ab79ad9a3faa6', part: "icon", class: "bs-source-link__icon" }, h("slot", { key: 'dcbe10c8789f9dbcd95c3d796a555a387a5626ee', name: "icon" }, h(FileTextIcon, { key: 'c56ece8394e6fce4d7a327203c109e72b883ab91' }))), h("p", { key: '293a17d2135821a549b7874338b02c8cec345632', part: "filename", class: "bs-source-link__filename" }, this.fileName)), h("span", { key: 'ac200e11ee885d366f146d7413526661b9d76cfa', class: "bs-source-link__meta" }, this.sourceName && (h("span", { key: 'd076f98b5a70593e575ff764da84cfbecf5ffdef', part: "source", class: "bs-source-link__source" }, this.sourceName)), this.sourceName && this.version && h("span", { key: '50fca70a24f3c4f6c8d8b4a5f1cdb46dba4d7de3', class: "bs-source-link__dot", "aria-hidden": "true" }), this.version && (h("span", { key: 'ccdf4864ed01b0a517118219b55bf8cc7c442548', part: "version", class: "bs-source-link__version" }, this.version)))),
-            h("span", { key: '48ef2cf4c2441fb94d48112860a0ee5982176152', part: "arrow", class: "bs-source-link__arrow", "aria-hidden": "true" }, h(ArrowUpRightIcon, { key: '6942e3329d26b9244d57377498ac2b46966c0c64' })),
+            h("span", { key: '4f7296f4d35b7779c91e791a7e674fff3f963239', class: "bs-source-link__left" }, h("span", { key: 'e8a03fb6ee46d64d8d9b2e86a39d15d36164a23d', class: "bs-source-link__filename-row" }, h("span", { key: '16ed535a5ab56b54edab2a39d02659c9be9cfc69', part: "icon", class: "bs-source-link__icon" }, h("slot", { key: '56661ab02c9628fd407f364c95db3832d9b86fdd', name: "icon" }, h(FileTextIcon, { key: 'c7a6f19c9dfee1c8b1e4ef24334c541fd8c88cbd' }))), h("p", { key: '5dac08dcde183f2a714c04cc0e700c4b2778bf7e', part: "filename", class: "bs-source-link__filename" }, this.fileName)), h("span", { key: 'bc4cd84ea0d990b5c456d7962bce8881cdaaf1b7', class: "bs-source-link__meta" }, this.sourceName && (h("span", { key: '94efb5a9ff386f86546ce56dbe2a8b386a342d16', part: "source", class: "bs-source-link__source" }, this.sourceName)), this.sourceName && this.version && h("span", { key: 'd084d96de4afe4522fc9ef28c6f870fa49ca68bc', class: "bs-source-link__dot", "aria-hidden": "true" }), this.version && (h("span", { key: 'e2b976a66185a53dbd682081399ed946e1bbb318', part: "version", class: "bs-source-link__version" }, this.version)))),
+            h("span", { key: '23f361d9af84c4804e88d7f019623e2223fe7a33', part: "arrow", class: "bs-source-link__arrow", "aria-hidden": "true" }, h(ArrowUpRightIcon, { key: '0316db74234f0c66afc0372d5299b8fd19691163' })),
         ];
         return this.href ? (h("a", { class: "bs-source-link", href: this.href, target: this.target, rel: "noopener noreferrer", onClick: this.onClick }, inner)) : (h("button", { type: "button", class: "bs-source-link", onClick: this.onClick }, inner));
     }

package/dist/collection/components/bs-stepper/bs-stepper/bs-stepper.js

@@ -62,7 +62,7 @@ export class BsStepper {
     }
     render() {
         // role="list" so each bs-stepper-step's role="listitem" has the required parent.
-        return (h(Host, { key: 'db168a586dfd3142f6dc75627f6f13fd6bde56dd', role: "list" }, h("slot", { key: 'fe06e525cb9e790d97be4d153cc07757c3624732', onSlotchange: this.onSlotChange })));
+        return (h(Host, { key: '8a3c0b5ce7ffd6dfc34b0c5ae602ef4bca42e33c', role: "list" }, h("slot", { key: 'fcc69d5e89dfa5f1ae7aa2ae38667a7826fee89d', onSlotchange: this.onSlotChange })));
     }
     static get is() { return "bs-stepper"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-stepper/bs-stepper-step/bs-stepper-step.js

@@ -57,7 +57,7 @@ export class BsStepperStep {
     }
     render() {
         const state = this.state;
-        return (h(Host, { key: '809ebc9656bc8c309b603c1940ea982d02560630', role: "listitem", class: `bs-stepper-step--${this.direction}` }, h("div", { key: '05484ab3c56d0c42dac1b8af99d715109679389b', class: "bs-stepper-step__top" }, h("span", { key: '2076c16d90d907a4b40de84304bd77a7b9ae1bf9', part: "icon", class: `bs-stepper-step__icon bs-stepper-step__icon--${state}` }, state === 'current' && h("span", { key: '6fcbca00f7010e49583522a83f54f2db5ea01441', class: "bs-stepper-step__icon-dot" }), state === 'done' && h(CheckIcon, { key: '17589e79f8806e30aa6f6683fc6f7acd857dc8c9' }), state === 'error' && h(ExclamationIcon, { key: '29fd2fdd31b9d899153396e758bcc8c69cbddaea' })), h("span", { key: 'cbd47c375dc0f287449e2b1ea9f49bc15302389a', part: "connector", class: "bs-stepper-step__connector", "aria-hidden": "true" }, h("span", { key: '6d29361f15e62a945f7f9c8a37b05025b3173214', class: "bs-stepper-step__connector-line" }))), h("span", { key: 'edb0ca51856917b8703ec88655bd4c8c1a1ff5df', part: "label", class: `bs-stepper-step__label bs-stepper-step__label--${state}` }, h("span", { key: 'abe23448bb9bc8a818551dc219aa89f05b9a6721', part: "name", class: "bs-stepper-step__name" }, this.name), this.showDescription && this.description && (h("span", { key: 'e469eb84389527f380c37f7e7724809528d624ae', part: "description", class: "bs-stepper-step__description" }, this.description)))));
+        return (h(Host, { key: '07f068e7e9d54124e72e6f3c395532b1df28bf4d', role: "listitem", class: `bs-stepper-step--${this.direction}` }, h("div", { key: 'aa2c8cf568f8823be576b7cd8453db51dbc28ca3', class: "bs-stepper-step__top" }, h("span", { key: '55053a617f92b0f300987fad2f171d0c5a00cb48', part: "icon", class: `bs-stepper-step__icon bs-stepper-step__icon--${state}` }, state === 'current' && h("span", { key: '83f5206192f6e3363ee37c1819e2c7584d2b4395', class: "bs-stepper-step__icon-dot" }), state === 'done' && h(CheckIcon, { key: '19960813f546d3bed470d486d64cda1f4f9ae05d' }), state === 'error' && h(ExclamationIcon, { key: '5dff15dc5e8183b6ebe75592dddd0710fe6318f3' })), h("span", { key: 'aa91c2544a472e836d79361453eccc6cc3c0ded2', part: "connector", class: "bs-stepper-step__connector", "aria-hidden": "true" }, h("span", { key: 'b4db85cdeed8fcd895ce5fe38fa98aaf9e40401d', class: "bs-stepper-step__connector-line" }))), h("span", { key: 'c4dcd488f9c177eab29d8d9cedee9ff139844049', part: "label", class: `bs-stepper-step__label bs-stepper-step__label--${state}` }, h("span", { key: 'd486ade27072093c9bf90824e89b24ab4ff5b8a5', part: "name", class: "bs-stepper-step__name" }, this.name), this.showDescription && this.description && (h("span", { key: 'eae26f6a683805ebc8eeb780df82060cf3ec699f', part: "description", class: "bs-stepper-step__description" }, this.description)))));
     }
     static get is() { return "bs-stepper-step"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-switch/bs-switch.js

@@ -75,7 +75,7 @@ export class BsSwitch {
         const knobClasses = ['bs-switch__knob', `bs-switch__knob--${this.size}`, this.disabled ? 'bs-switch__knob--disabled' : '']
             .filter(Boolean)
             .join(' ');
-        return (h("label", { key: '29aaef97a7a237cddfdfffb7cdb693c8934a9d4f', class: `bs-switch ${this.disabled ? 'bs-switch--disabled' : ''}` }, h("input", { key: '03a1e41e0b66f823a95b76c85a19c8ca6c418763', class: "bs-switch__input", type: "checkbox", role: "switch", checked: this.checked, disabled: this.disabled, "aria-checked": String(this.checked), "aria-label": this.ariaLabel, onChange: this.onChange }), h("span", { key: '4dc7254d5855d91221048aa2fbddcb0532c4f572', part: "track", class: trackClasses }, h("span", { key: '11dbb2724c94e6a58413d36b8d673015ad44a5e3', part: "knob", class: knobClasses })), h("span", { key: '9954a8d69131ca00bcd177d1d7cfe7ca83bc32a1', part: "label", class: "bs-switch__label" }, h("slot", { key: '98058212aed27b2d6b589eb769fddd5fe3156510' }))));
+        return (h("label", { key: '3c1ef40b924c852077b0e82e6f177c3ef029d578', class: `bs-switch ${this.disabled ? 'bs-switch--disabled' : ''}` }, h("input", { key: '05b9d74d9264d85efad043d3fed9582294245e14', class: "bs-switch__input", type: "checkbox", role: "switch", checked: this.checked, disabled: this.disabled, "aria-checked": String(this.checked), "aria-label": this.ariaLabel, onChange: this.onChange }), h("span", { key: '1df589ae299b9d78841b66964803be1431a902f0', part: "track", class: trackClasses }, h("span", { key: '56f65a6b2c672c13b566eeb94bed37985dd225e1', part: "knob", class: knobClasses })), h("span", { key: '293393bcd0c93a6b67fee20761f2fec6ae350d1f', part: "label", class: "bs-switch__label" }, h("slot", { key: 'a4a89ba0581cb44382b9f81564adb6dd1e3809bc' }))));
     }
     static get is() { return "bs-switch"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-tab/bs-inline-tab/bs-inline-tab.js

@@ -94,7 +94,7 @@ export class BsInlineTab {
     };
     render() {
         const iconOnly = this.hasIcon && !this.hasLabel;
-        return (h("button", { key: '2b53f8013cdcd94dd7297ece3cff679d158a86a8', type: "button", part: "tab", role: "tab", class: `bs-inline-tab ${this.selected ? 'bs-inline-tab--selected' : ''} ${this.disabled ? 'bs-inline-tab--disabled' : ''} ${iconOnly ? 'bs-inline-tab--icon-only' : ''} ${this.hasIcon ? 'bs-inline-tab--has-icon' : ''}`, disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel, tabIndex: this.tabbable === undefined ? undefined : this.tabbable ? 0 : -1, onClick: this.onClick }, h("span", { key: '4e4832cffe54b28cdd68f7c35c9741dfe001b4d5', part: "icon", class: `bs-inline-tab__icon ${this.hasIcon ? 'bs-inline-tab__icon--has-content' : ''}` }, h("slot", { key: 'ccc3225b1a9047a0a346b8fb8bf6f02a63ecc988', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '95c8ac8ba725cf9ed20887dfee0c88d0dd0ce180', part: "label", class: `bs-inline-tab__label ${this.hasLabel ? 'bs-inline-tab__label--has-content' : ''}` }, h("slot", { key: 'f9551ac1fe994a7e66fe48d23b39f2936c6b5a37', onSlotchange: this.onLabelSlotchange }))));
+        return (h("button", { key: '84e1e70ea67dba9c45e55cfcbc9afecb5be41b7e', type: "button", part: "tab", role: "tab", class: `bs-inline-tab ${this.selected ? 'bs-inline-tab--selected' : ''} ${this.disabled ? 'bs-inline-tab--disabled' : ''} ${iconOnly ? 'bs-inline-tab--icon-only' : ''} ${this.hasIcon ? 'bs-inline-tab--has-icon' : ''}`, disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel, tabIndex: this.tabbable === undefined ? undefined : this.tabbable ? 0 : -1, onClick: this.onClick }, h("span", { key: '118ed482a69348bf7ed5b633df36d714c643eea2', part: "icon", class: `bs-inline-tab__icon ${this.hasIcon ? 'bs-inline-tab__icon--has-content' : ''}` }, h("slot", { key: 'bde742484441571b7e907702c90dff00ff12a515', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: 'c1c0df916c0d6bbc3c51f74ffc4a659cc731cb5d', part: "label", class: `bs-inline-tab__label ${this.hasLabel ? 'bs-inline-tab__label--has-content' : ''}` }, h("slot", { key: 'f3ed571ab6a28cd43f08b479eca9a5d70b4851ea', onSlotchange: this.onLabelSlotchange }))));
     }
     static get is() { return "bs-inline-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-tab/bs-tab/bs-tab.js

@@ -107,7 +107,7 @@ export class BsTab {
         const iconOnly = this.hasIcon && !this.hasLabel;
         const vertical = this.hasIcon && this.hasLabel && this.iconPosition === 'top';
         const showBadge = this.hasBadge && !iconOnly && !vertical;
-        return (h("button", { key: '87234360dfed766afe447c3e8f037d8b59868a15', type: "button", part: "tab", role: "tab", class: `bs-tab ${this.selected ? 'bs-tab--selected' : ''} ${this.disabled ? 'bs-tab--disabled' : ''} ${iconOnly ? 'bs-tab--icon-only' : ''} ${vertical ? 'bs-tab--vertical' : ''}`, disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel, tabIndex: this.tabbable === undefined ? undefined : this.tabbable ? 0 : -1, onClick: this.onClick }, h("span", { key: 'cecdf03d52896828f098956a25342209c0244f39', part: "icon", class: `bs-tab__icon ${this.hasIcon ? 'bs-tab__icon--has-content' : ''}` }, h("slot", { key: 'f4bbc1ac9ee7df0db6cb393c69b43227add0db3e', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: 'c14726bc5b6f47d0a96fdf5807a2dd7b2466a27f', part: "label", class: `bs-tab__label ${this.hasLabel ? 'bs-tab__label--has-content' : ''}` }, h("slot", { key: '88936beb454b7fa0b9d1c67d39e812f86e89ae56', onSlotchange: this.onLabelSlotchange })), h("span", { key: 'a32984bfa7879e702748171fc51a4679b58d0b8b', part: "badge", class: `bs-tab__badge ${showBadge ? 'bs-tab__badge--has-content' : ''}` }, h("slot", { key: 'ad516087badafb57ff4df818d0b9a100373f205e', name: "badge", onSlotchange: this.onBadgeSlotchange })), h("span", { key: '30e25441bd650875ce8b6dd97befc1053c40ca47', part: "indicator", class: "bs-tab__indicator" })));
+        return (h("button", { key: '6cb94a173877a8e339585dd41bfca7cdb5152277', type: "button", part: "tab", role: "tab", class: `bs-tab ${this.selected ? 'bs-tab--selected' : ''} ${this.disabled ? 'bs-tab--disabled' : ''} ${iconOnly ? 'bs-tab--icon-only' : ''} ${vertical ? 'bs-tab--vertical' : ''}`, disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel, tabIndex: this.tabbable === undefined ? undefined : this.tabbable ? 0 : -1, onClick: this.onClick }, h("span", { key: '87fc3d0b1e958295bb3ff41c3a4f6a76803c4b31', part: "icon", class: `bs-tab__icon ${this.hasIcon ? 'bs-tab__icon--has-content' : ''}` }, h("slot", { key: '5fb74ca62c8f60b50d7f53cd5b77b02cfb547365', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '4774748fa4d8d5f441914aaca0cc8729c3d85857', part: "label", class: `bs-tab__label ${this.hasLabel ? 'bs-tab__label--has-content' : ''}` }, h("slot", { key: '87d793b4e8088f51ff64dd388f3769aebd5c507d', onSlotchange: this.onLabelSlotchange })), h("span", { key: 'ddfc8532be46adab986a6f4a6b0e46d2c8fcc8f4', part: "badge", class: `bs-tab__badge ${showBadge ? 'bs-tab__badge--has-content' : ''}` }, h("slot", { key: '729a03df8dbca1814725d06ceb23d1d1c694cc63', name: "badge", onSlotchange: this.onBadgeSlotchange })), h("span", { key: 'd873545b4148383e3df42fe1ff76aab027d4a0f8', part: "indicator", class: "bs-tab__indicator" })));
     }
     static get is() { return "bs-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-tab/bs-tabs/bs-tabs.js

@@ -135,7 +135,7 @@ export class BsTabs {
     }
     render() {
         const vertical = this.orientation === 'vertical';
-        return (h("div", { key: 'b47d3502305490c9098b825f1eb8c60f45dad5d8', part: "tablist", role: "tablist", "aria-orientation": this.orientation, class: `bs-tabs bs-tabs--${this.type} ${vertical ? 'bs-tabs--vertical' : ''}` }, h("slot", { key: '133cf0b2ea93354a664bb304579fa59d85e53edf', onSlotchange: () => this.syncRovingTabindex() })));
+        return (h("div", { key: 'e7f42dc2b8504a99f03c35fa3617155ac430def0', part: "tablist", role: "tablist", "aria-orientation": this.orientation, class: `bs-tabs bs-tabs--${this.type} ${vertical ? 'bs-tabs--vertical' : ''}` }, h("slot", { key: 'a9a96d3fca150110a8490b42d516db9609677903', onSlotchange: () => this.syncRovingTabindex() })));
     }
     static get is() { return "bs-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-timepicker/bs-timepicker.css

@@ -1,6 +1,6 @@
 /**
  * @prop --bs-timepicker-width: Width of the card. 294px, exact match to Figma.
- * @prop --bs-timepicker-bg: Card background. Aliased to --bs-surface-raised.
+ * @prop --bs-timepicker-bg: Card background. Aliased to --bs-paper-bg-raised (the `bs-card` raised surface).
  * @prop --bs-timepicker-radius: Card corner radius. Aliased to --bs-border-radius-100.
  * @prop --bs-timepicker-padding-y: Vertical padding of the card. Aliased to --bs-spacing-200.
  * @prop --bs-timepicker-padding-x: Horizontal padding of each section. Aliased to --bs-spacing-200.
@@ -22,7 +22,7 @@
   display: inline-block;
 
   --bs-timepicker-width: 294px;
-  --bs-timepicker-bg: var(--bs-surface-raised);
+  --bs-timepicker-bg: var(--bs-paper-bg-raised);
   --bs-timepicker-radius: var(--bs-border-radius-100);
   --bs-timepicker-padding-y: var(--bs-spacing-200);
   --bs-timepicker-padding-x: var(--bs-spacing-200);
@@ -44,19 +44,23 @@
 }
 
 .bs-timepicker {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  gap: var(--bs-timepicker-gap);
   width: var(--bs-timepicker-width);
   max-width: 100%;
-  padding: var(--bs-timepicker-padding-y) 0;
-  border-radius: var(--bs-timepicker-radius);
-  background: var(--bs-timepicker-bg);
-  box-shadow: var(--bs-timepicker-shadow);
   color: var(--bs-timepicker-color);
-  font-family: inherit;
   font-size: var(--bs-font-size-md);
+  /* bs-card supplies the surface. Only vertical padding: each row pads itself so the dividers can
+     run edge to edge. `visible` so the AM/PM list can hang over the edge. */
+  --bs-card-bg: var(--bs-timepicker-bg);
+  --bs-card-radius: var(--bs-timepicker-radius);
+  --bs-card-padding: var(--bs-timepicker-padding-y) 0;
+  --bs-card-shadow: var(--bs-timepicker-shadow);
+  --bs-card-overflow: visible;
+}
+
+.bs-timepicker__body {
+  display: flex;
+  flex-direction: column;
+  gap: var(--bs-timepicker-gap);
 }
 
 .bs-timepicker__header {

package/dist/collection/components/bs-timepicker/bs-timepicker.js

@@ -12,6 +12,8 @@ import { h } from "@stencil/core";
  * The picker renders inline at a fixed width; to show it as a popover, put it in your own overlay
  * and close that overlay from `bsChange`/`bsCancel`.
  *
+ * **Built from:** `bs-card` (the surface), `bs-switch` (the 24h toggle), `bs-input` (the AM/PM dropdown), `bs-button` (Cancel/Confirm).
+ *
  * ## When to use
  * - Picking a time of day where the user steps through hours and minutes.
  *
@@ -194,14 +196,14 @@ export class BsTimepicker {
         return (h("div", { part: "spinner", class: "bs-timepicker__spinner" }, h("button", { part: "step", type: "button", class: "bs-timepicker__step", "aria-label": stepLabel('Increase'), tabindex: -1, onClick: () => this.stepBy(col, 1) }, h("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { d: "M18 15L12 9L6 15", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("div", { part: "value", class: "bs-timepicker__value", role: "spinbutton", tabindex: 0, "aria-label": label, "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": n, "aria-valuetext": pad(n), onKeyDown: this.onKeyDown(col), onBlur: () => (this.typed = '') }, pad(n)), h("button", { part: "step", type: "button", class: "bs-timepicker__step", "aria-label": stepLabel('Decrease'), tabindex: -1, onClick: () => this.stepBy(col, -1) }, h("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { d: "M6 9L12 15L18 9", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }
     render() {
-        return (h("div", { key: 'a2e5fe098763d32468ffc0bdd3c2df153385dfd7', part: "container", class: "bs-timepicker" }, h("div", { key: 'd7a3bcdb9585480d2f58b27d8499f6ef9c8d21e0', part: "header", class: "bs-timepicker__header" }, h("div", { key: '6183e6243df377936ddc2d5a92238720efc7a671', part: "title", class: "bs-timepicker__title" }, this.heading), h("label", { key: '4e95425e9f67d6575ef9572a9c385b9a5c887359', class: "bs-timepicker__format" }, h("span", { key: '29771986229fd68af07078e3528a12d75f4a5794' }, this.formatLabel), h("bs-switch", { key: '946ea660ff659d71ca2c3e024bff8eb05afdcfe8', part: "format-toggle", size: "md", ariaLabel: this.formatLabel, checked: !this.is12h, onBsChange: (ev) => (this.format = ev.detail ? '24h' : '12h') }))), h("div", { key: 'e6367ea101ae0981224129bc6c70c7bf5d2b6db9', class: "bs-timepicker__divider" }), h("div", { key: '20ab9cfd9702dae8bf097de642e61439489f6fb5', part: "selector", class: "bs-timepicker__selector" }, this.renderColumn('hour', this.hourLabel), h("div", { key: '5780f3fb2eb6f5b2e6d29ed4cd1585190051e3fd', part: "separator", class: "bs-timepicker__separator", "aria-hidden": "true" }, h("svg", { key: 'd35956df0f6f18f1472cc720f4ab876bbc41e515', viewBox: "0 0 4 32", fill: "currentColor" }, h("circle", { key: '4e6083df833bc3bf6390c80d7911219e61a51d37', cx: "2", cy: "10", r: "2" }), h("circle", { key: 'e3dea9bb879e7b4b09b9d37a0becbfd54f803169', cx: "2", cy: "22", r: "2" }))), this.renderColumn('minute', this.minuteLabel), this.is12h && (h("bs-input", { key: 'a9fb9ef6ff16d5c3f4aa4e067e3795a7ddc7d1e7', part: "period", class: "bs-timepicker__period", type: "dropdown", label: this.periodLabel, value: this.isPm ? 'PM' : 'AM', options: [
+        return (h("bs-card", { key: 'e0545d99e052005bcad5509f81505f628adb5dc4', part: "container", class: "bs-timepicker", surface: "raised" }, h("div", { key: '664c7184dcefe5c63f03afad3953787cbc3064cc', class: "bs-timepicker__body" }, h("div", { key: '602d4f0ca6975b22daa7c7a37a6d53a259c39768', part: "header", class: "bs-timepicker__header" }, h("div", { key: '1650464c84e066f14f6343f18f779e35932535c3', part: "title", class: "bs-timepicker__title" }, this.heading), h("label", { key: 'debc6155ccf39b90f281d49240203d642fb5039d', class: "bs-timepicker__format" }, h("span", { key: '147a6d85b4f0922b5c7d96ebef88b3c70d1fbe05' }, this.formatLabel), h("bs-switch", { key: 'ddb0be1751ce8246acbfd6c187e66fb6bc878cd5', part: "format-toggle", size: "md", ariaLabel: this.formatLabel, checked: !this.is12h, onBsChange: (ev) => (this.format = ev.detail ? '24h' : '12h') }))), h("div", { key: '35f13bd74133f2c1109df96aafdc456178e4a32f', class: "bs-timepicker__divider" }), h("div", { key: '9c979a8d3300a8f5dba7d8df784dc8ef691a40a6', part: "selector", class: "bs-timepicker__selector" }, this.renderColumn('hour', this.hourLabel), h("div", { key: '5b4af0371fd816067b92854da2b35e5a7de8e4ea', part: "separator", class: "bs-timepicker__separator", "aria-hidden": "true" }, h("svg", { key: 'a70450b5068add559c48e795ce6aca204b30d02d', viewBox: "0 0 4 32", fill: "currentColor" }, h("circle", { key: '26a760f4d4712eca3df48b97bde276ce241511d5', cx: "2", cy: "10", r: "2" }), h("circle", { key: '3c6eb56e2736353dc5e5bc4a1d6ef64242f6a367', cx: "2", cy: "22", r: "2" }))), this.renderColumn('minute', this.minuteLabel), this.is12h && (h("bs-input", { key: '948e724c331008bbd00fd84c516d02e919e622e1', part: "period", class: "bs-timepicker__period", type: "dropdown", label: this.periodLabel, value: this.isPm ? 'PM' : 'AM', options: [
                 { label: 'AM', value: 'AM' },
                 { label: 'PM', value: 'PM' },
             ], onBsChange: (ev) => {
                 const pm = ev.detail === 'PM';
                 if (pm !== this.isPm)
                     this.hour = (this.hour + 12) % 24;
-            } }))), h("div", { key: 'e4256dede407bec46c5da8e967001472ccd0f49b', class: "bs-timepicker__divider" }), h("div", { key: '9be6cade11a25c92c77f4313827f49ee8d89dfb4', part: "footer", class: "bs-timepicker__footer" }, h("bs-button", { key: '6ded59a284b389b5e4a259b1a238296ec83d6c27', part: "cancel", variant: "subtle", onClick: this.cancel }, this.cancelLabel), h("bs-button", { key: 'e1f566c9c34b3371783206910d91a9d49f8cdc41', part: "confirm", variant: "primary", onClick: this.confirm }, this.confirmLabel))));
+            } }))), h("div", { key: '08b57e8c0b895e272d98386fe5b2ac2e55a87de0', class: "bs-timepicker__divider" }), h("div", { key: '5b1af1da10c4333ef6b826eaafd75fa12ef2e785', part: "footer", class: "bs-timepicker__footer" }, h("bs-button", { key: 'ad24615dbe6ae46e00ca558f71cee030504573a5', part: "cancel", variant: "subtle", onClick: this.cancel }, this.cancelLabel), h("bs-button", { key: 'f76cd192e1e7e0bb524080cf54a655c5b4508a3c', part: "confirm", variant: "primary", onClick: this.confirm }, this.confirmLabel)))));
     }
     static get is() { return "bs-timepicker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-toast/bs-toast.js

@@ -25,7 +25,7 @@ export class BsToast {
         this.bsDismiss.emit();
     };
     render() {
-        return (h("div", { key: 'e8da15f45d0491a0eb8568a8fc31e2b802cf30c3', part: "container", class: `bs-toast bs-toast--${this.state}`, role: "status", "aria-live": this.state === 'error' ? 'assertive' : 'polite' }, h("div", { key: '703099dfc85c56997a2cf6e5e86bd559d1a9d971', class: "bs-toast__content" }, h("span", { key: 'dacb887b5e7bdae27100399a80f9c2cc7a9970d6', part: "icon", class: "bs-toast__icon", "aria-hidden": "true" }, h(StateIcon, { key: '5d71c6abf0c68673c20de54162557a224cffd66b', state: this.state })), h("span", { key: '6587834edfbdf0188a8780ee0c5b93a572956da4', part: "message", class: "bs-toast__message" }, h("slot", { key: '559c2a397c140532185da397a7cab18f484fad19' }))), h("div", { key: '87f868f1b541432798de1f511f92091434c41e0f', class: "bs-toast__actions" }, h("button", { key: '6267c6dcc3114af0d9fecd250097416f80f661b1', part: "close", type: "button", class: "bs-toast__close", "aria-label": "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: '8b6a5b9e2ce36d5cbbec7801df81fd125c7d0f27' })))));
+        return (h("div", { key: 'fcf10204b781318554bd1d1b65b3b003759f47ca', part: "container", class: `bs-toast bs-toast--${this.state}`, role: "status", "aria-live": this.state === 'error' ? 'assertive' : 'polite' }, h("div", { key: '77a9fc881d530b43aa93cd71ab00d79a402ac5df', class: "bs-toast__content" }, h("span", { key: '18b4ffee843c2f9f235477e729a7a5bca1044595', part: "icon", class: "bs-toast__icon", "aria-hidden": "true" }, h(StateIcon, { key: '62a78820785f12ccfa503d7690ae99d2b3b47aa2', state: this.state })), h("span", { key: 'b17882e4d5f4afe5bcfa5704b515c145df94799b', part: "message", class: "bs-toast__message" }, h("slot", { key: '678d2256cc21e6e07b099d417837b5891e7d6021' }))), h("div", { key: 'aba935f0a62a599b9eacfed9d13598f70a941283', class: "bs-toast__actions" }, h("button", { key: 'a9ee43cf75eca8e737d5e59507408de7f8bffaf1', part: "close", type: "button", class: "bs-toast__close", "aria-label": "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: '4e4c5a25e6b25da2362385f1be5c4b86f02bbeb0' })))));
     }
     static get is() { return "bs-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-tooltip/bs-tooltip.js

@@ -42,7 +42,7 @@ export class BsTooltip {
      */
     placement = 'top';
     render() {
-        return (h("div", { key: '6fdabb24080aa3e58a1054aa63f43878da2d0787', class: "bs-tooltip" }, h("span", { key: 'ec139068fd7714642215b47ffbd91318062cbb84', part: "arrow", class: "bs-tooltip__arrow" }), h("div", { key: 'c1e18985eeb5263b6faf9c14c1f6c93cfe6c1062', part: "bubble", class: "bs-tooltip__bubble" }, h("slot", { key: 'f521333b359cb1b30457753ee28379a064aeeae2' }))));
+        return (h("div", { key: '8fdc149cce564aa5531956eda52b81bedd9db1bb', class: "bs-tooltip" }, h("span", { key: '34234ea02b510a5a728bb97d259cfbd2c8f7f7b2', part: "arrow", class: "bs-tooltip__arrow" }), h("div", { key: '04d825a91dc6753a90b7daaf370e575c9ddee6d1', part: "bubble", class: "bs-tooltip__bubble" }, h("slot", { key: '81b8681507245e597177d169c1925dfb65aaeeab' }))));
     }
     static get is() { return "bs-tooltip"; }
     static get encapsulation() { return "shadow"; }