@brandsync/wc 1.9.0 → 1.11.0

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

@@ -0,0 +1,511 @@
+import { h } from "@stencil/core";
+/**
+ * An inline time picker: hour and minute spinners (up/down carets, or the arrow keys on the value),
+ * an AM/PM dropdown in 12-hour mode, a 24h switch, and Cancel/Confirm buttons. Matches the Figma
+ * "Time picker" component's two formats (12h with AM/PM, and 24h).
+ *
+ * The picker works on a draft: nothing is committed until the user presses Confirm, which updates
+ * `value` and fires `bsChange`. Cancel discards the draft and fires `bsCancel`.
+ *
+ * `value` is always 24-hour `HH:mm` (e.g. `"14:30"`), regardless of the displayed `format`.
+ *
+ * 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.
+ *
+ * ## When not to use
+ * - A time the user can type faster than step to -- a plain `bs-input` is quicker.
+ *
+ * ## Keyboard
+ * Tab to the hour or minute value, then ArrowUp/ArrowDown step it (wrapping), Home/End jump to the
+ * first/last value, and typing digits sets it directly.
+ *
+ * @part container - The outer card.
+ * @part header - The title row.
+ * @part title - The heading text.
+ * @part format-toggle - The 24h switch.
+ * @part selector - The row of spinners.
+ * @part spinner - Each hour/minute column.
+ * @part step - Each up/down caret button.
+ * @part value - Each hour/minute value (a `spinbutton`).
+ * @part separator - The colon between hours and minutes.
+ * @part period - The AM/PM dropdown (12h only).
+ * @part footer - The Cancel/Confirm row.
+ * @part cancel - The Cancel button.
+ * @part confirm - The Confirm button.
+ */
+export class BsTimepicker {
+    el;
+    internals;
+    initialValue = '';
+    typed = '';
+    /** The `name` the confirmed value is submitted under in a surrounding `<form>`. */
+    name;
+    /** The confirmed time, 24-hour `HH:mm`. Empty means no time chosen yet (the picker opens on
+     * 00:00). Mutable so Confirm updates it directly; `bsChange` still fires. */
+    value = '';
+    /** Display format: `12h` (with an AM/PM dropdown) or `24h`. The user can switch it with the
+     * 24h switch. Does not change `value`, which is always 24-hour. */
+    format = '12h';
+    /** Step, in minutes, of the minute spinner's carets and arrow keys. Typing is not constrained. */
+    minuteStep = 1;
+    /** Heading text. */
+    heading = 'Select Time';
+    /** Label of the 24h switch. */
+    formatLabel = '24h';
+    /** Label of the Confirm button. */
+    confirmLabel = 'Confirm';
+    /** Label of the Cancel button. */
+    cancelLabel = 'Cancel';
+    /** Accessible name of the hour spinner. */
+    hourLabel = 'Hour';
+    /** Accessible name of the minute spinner. */
+    minuteLabel = 'Minute';
+    /** Accessible name of the AM/PM dropdown. */
+    periodLabel = 'AM/PM';
+    /** Fires when the user presses Confirm: `{ value }` as 24-hour `HH:mm`. Not fired when `value` is
+     * set programmatically. */
+    bsChange;
+    /** Fires when the user presses Cancel. The draft is reset to `value`. */
+    bsCancel;
+    /** Draft hour, 0-23. */
+    hour = 0;
+    /** Draft minute, 0-59. */
+    minute = 0;
+    componentWillLoad() {
+        this.initialValue = this.value;
+        this.resetDraft();
+        this.syncFormValue();
+    }
+    onValueChange() {
+        this.resetDraft();
+        this.syncFormValue();
+    }
+    onNameChange() {
+        this.syncFormValue();
+    }
+    /** Called by the browser when the surrounding `<form>` is reset. */
+    formResetCallback() {
+        this.value = this.initialValue;
+    }
+    resetDraft() {
+        const t = parseTime(this.value);
+        this.hour = t ? t.hour : 0;
+        this.minute = t ? t.minute : 0;
+    }
+    syncFormValue() {
+        if (!this.internals?.setFormValue)
+            return;
+        this.internals.setFormValue(this.value ?? '');
+    }
+    get step() {
+        const n = Math.trunc(Number(this.minuteStep));
+        return Number.isFinite(n) && n >= 1 && n <= 59 ? n : 1;
+    }
+    get is12h() {
+        return this.format !== '24h';
+    }
+    get isPm() {
+        return this.hour >= 12;
+    }
+    // --- stepping ----------------------------------------------------------------------------
+    /** The number shown in a column. In 12h mode the hour reads 1-12. */
+    shown(col) {
+        if (col === 'minute')
+            return this.minute;
+        return this.is12h ? this.hour % 12 || 12 : this.hour;
+    }
+    bounds(col) {
+        if (col === 'minute')
+            return [0, 59];
+        return this.is12h ? [1, 12] : [0, 23];
+    }
+    setShown(col, n) {
+        if (col === 'minute') {
+            this.minute = n;
+        }
+        else {
+            // 12h keeps the current AM/PM; 12 AM is hour 0 and 12 PM is hour 12.
+            this.hour = this.is12h ? (n % 12) + (this.isPm ? 12 : 0) : n;
+        }
+    }
+    stepBy(col, dir) {
+        const [min, max] = this.bounds(col);
+        const size = max - min + 1;
+        const by = col === 'minute' ? this.step : 1;
+        let next = this.shown(col) + dir * by;
+        if (col === 'minute') {
+            // Snap onto the step grid when leaving an off-grid value (e.g. typed 07 with step 15).
+            const cur = this.shown(col);
+            next = dir === 1 ? Math.floor(cur / by) * by + by : Math.ceil(cur / by) * by - by;
+        }
+        this.setShown(col, ((((next - min) % size) + size) % size) + min);
+    }
+    onKeyDown = (col) => (ev) => {
+        const [min, max] = this.bounds(col);
+        if (ev.key === 'ArrowUp')
+            this.stepBy(col, 1);
+        else if (ev.key === 'ArrowDown')
+            this.stepBy(col, -1);
+        else if (ev.key === 'Home')
+            this.setShown(col, min);
+        else if (ev.key === 'End')
+            this.setShown(col, max);
+        else if (/^\d$/.test(ev.key)) {
+            // Two digits make a value; a lone digit that can't start a valid two-digit value commits
+            // immediately.
+            const candidate = Number((this.typed + ev.key).slice(-2));
+            this.typed = (this.typed + ev.key).slice(-2);
+            if (candidate >= min && candidate <= max)
+                this.setShown(col, candidate);
+            else {
+                this.typed = ev.key;
+                const single = Number(ev.key);
+                if (single >= min && single <= max)
+                    this.setShown(col, single);
+            }
+            if (this.typed.length === 2)
+                this.typed = '';
+            ev.preventDefault();
+            return;
+        }
+        else
+            return;
+        this.typed = '';
+        ev.preventDefault();
+    };
+    // --- actions -----------------------------------------------------------------------------
+    confirm = () => {
+        const value = `${pad(this.hour)}:${pad(this.minute)}`;
+        this.value = value;
+        this.bsChange.emit({ value });
+    };
+    cancel = () => {
+        this.resetDraft();
+        this.bsCancel.emit();
+    };
+    // --- rendering ---------------------------------------------------------------------------
+    renderColumn(col, label) {
+        const [min, max] = this.bounds(col);
+        const n = this.shown(col);
+        const stepLabel = (dir) => `${dir} ${label.toLowerCase()}`;
+        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("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: '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"; }
+    static get formAssociated() { return true; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["bs-timepicker.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["bs-timepicker.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "name": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The `name` the confirmed value is submitted under in a surrounding `<form>`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "name"
+            },
+            "value": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The confirmed time, 24-hour `HH:mm`. Empty means no time chosen yet (the picker opens on\n00:00). Mutable so Confirm updates it directly; `bsChange` still fires."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "value",
+                "defaultValue": "''"
+            },
+            "format": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "'12h' | '24h'",
+                    "resolved": "\"12h\" | \"24h\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Display format: `12h` (with an AM/PM dropdown) or `24h`. The user can switch it with the\n24h switch. Does not change `value`, which is always 24-hour."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "format",
+                "defaultValue": "'12h'"
+            },
+            "minuteStep": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Step, in minutes, of the minute spinner's carets and arrow keys. Typing is not constrained."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "minute-step",
+                "defaultValue": "1"
+            },
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Heading text."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading",
+                "defaultValue": "'Select Time'"
+            },
+            "formatLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Label of the 24h switch."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "format-label",
+                "defaultValue": "'24h'"
+            },
+            "confirmLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Label of the Confirm button."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "confirm-label",
+                "defaultValue": "'Confirm'"
+            },
+            "cancelLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Label of the Cancel button."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "cancel-label",
+                "defaultValue": "'Cancel'"
+            },
+            "hourLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible name of the hour spinner."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "hour-label",
+                "defaultValue": "'Hour'"
+            },
+            "minuteLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible name of the minute spinner."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "minute-label",
+                "defaultValue": "'Minute'"
+            },
+            "periodLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Accessible name of the AM/PM dropdown."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "period-label",
+                "defaultValue": "'AM/PM'"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "hour": {},
+            "minute": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "bsChange",
+                "name": "bsChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fires when the user presses Confirm: `{ value }` as 24-hour `HH:mm`. Not fired when `value` is\nset programmatically."
+                },
+                "complexType": {
+                    "original": "BsTimepickerChange",
+                    "resolved": "BsTimepickerChange",
+                    "references": {
+                        "BsTimepickerChange": {
+                            "location": "local",
+                            "path": "/home/runner/work/eg-brandsync-storybook/eg-brandsync-storybook/packages/wc/src/components/bs-timepicker/bs-timepicker.tsx",
+                            "id": "src/components/bs-timepicker/bs-timepicker.tsx::BsTimepickerChange"
+                        }
+                    }
+                }
+            }, {
+                "method": "bsCancel",
+                "name": "bsCancel",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fires when the user presses Cancel. The draft is reset to `value`."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "value",
+                "methodName": "onValueChange"
+            }, {
+                "propName": "name",
+                "methodName": "onNameChange"
+            }];
+    }
+    static get attachInternalsMemberName() { return "internals"; }
+}
+function pad(n) {
+    return String(n).padStart(2, '0');
+}
+function parseTime(s) {
+    const m = /^(\d{1,2}):(\d{2})$/.exec((s ?? '').trim());
+    if (!m)
+        return undefined;
+    const hour = Number(m[1]);
+    const minute = Number(m[2]);
+    return hour <= 23 && minute <= 59 ? { hour, minute } : undefined;
+}

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

@@ -0,0 +1,44 @@
+import { html } from "lit";
+import { componentDescription, propDescription } from "../../stories-utils";
+const meta = {
+    title: 'Components/bs-timepicker',
+    parameters: { docs: { description: { component: componentDescription('bs-timepicker') } } },
+    render: args => html `
+    <bs-timepicker
+      value=${args.value}
+      format=${args.format}
+      minute-step=${args.minuteStep}
+      heading=${args.heading}
+      @bsChange=${(ev) => console.log('bsChange', ev.detail)}
+      @bsCancel=${() => console.log('bsCancel')}
+    ></bs-timepicker>
+  `,
+    argTypes: {
+        value: { control: 'text', description: propDescription('bs-timepicker', 'value') },
+        format: { control: 'inline-radio', options: ['12h', '24h'], description: propDescription('bs-timepicker', 'format') },
+        minuteStep: { control: { type: 'number', min: 1, max: 59 }, description: propDescription('bs-timepicker', 'minuteStep') },
+        heading: { control: 'text', description: propDescription('bs-timepicker', 'heading') },
+    },
+    args: {
+        value: '',
+        format: '12h',
+        minuteStep: 1,
+        heading: 'Select Time',
+    },
+};
+export default meta;
+// Figma "12h" format: hour and minute spinners plus an AM/PM dropdown.
+export const Default = {};
+// Figma "24h" format: the 24h switch on, no AM/PM.
+export const TwentyFourHour = {
+    name: '24h',
+    args: { format: '24h' },
+};
+export const WithValue = {
+    name: 'With a value',
+    args: { value: '14:30' },
+};
+export const FifteenMinuteStep = {
+    name: '15-minute step',
+    args: { value: '09:00', minuteStep: 15 },
+};

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

@@ -25,7 +25,7 @@ export class BsToast {
         this.bsDismiss.emit();
     };
     render() {
-        return (h("div", { key: '238f177a44aa2bd735432fe8f3fd1d761065d023', part: "container", class: `bs-toast bs-toast--${this.state}`, role: "status", "aria-live": this.state === 'error' ? 'assertive' : 'polite' }, h("div", { key: '717e222c7b271db0ff5aa57db8ce0efa15bfaf50', class: "bs-toast__content" }, h("span", { key: '316106f6efbcc8abe6bb155e77ec21343b93287c', part: "icon", class: "bs-toast__icon", "aria-hidden": "true" }, h(StateIcon, { key: '5973febbe8d7be889fd14cac847c417a22acb111', state: this.state })), h("span", { key: '1d16db1ba5c010ac5af237b4b399e0dda6f6df59', part: "message", class: "bs-toast__message" }, h("slot", { key: '40e97271fec790a850491be58ae87e54b4765a6a' }))), h("div", { key: '16744b9b6ad79d13aec16afa6593ab0de1ec5ee2', class: "bs-toast__actions" }, h("button", { key: '87adace9953b2dca831543132f3fe5590bc4c52f', part: "close", type: "button", class: "bs-toast__close", "aria-label": "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: 'dcf5ffe7a5553ec2792d801c7f62ed367d1454ef' })))));
+        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: 'b7c2ee57db3a4e36cdd106d78f0f8d54c45a04c6', class: "bs-tooltip" }, h("span", { key: '22b738a760e9967233052ce4540c77da4ac9563e', part: "arrow", class: "bs-tooltip__arrow" }), h("div", { key: '69a8b07711478e699be4c8151d9f7dfd2e4e0bf4', part: "bubble", class: "bs-tooltip__bubble" }, h("slot", { key: 'b32c75a06582b8e8f99b973889450e9100b75323' }))));
+        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"; }