@brandsync/wc 1.1.0 → 1.3.0

package/dist/collection/components/bs-progress-linear/bs-progress-linear.js

@@ -0,0 +1,192 @@
+import { h } from "@stencil/core";
+/**
+ * A linear (horizontal) progress indicator -- either a static bar showing a percentage fill
+ * (`type="determinate"`) or a continuously sliding bar signaling in-progress work with no known
+ * completion percentage (`type="indeterminate"`).
+ *
+ * ## When to use
+ * - Showing the progress of a task with a known, quantifiable completion percentage (`determinate`),
+ *   e.g. a file upload.
+ * - Signaling that work is happening in the background with no meaningful percentage to report
+ *   (`indeterminate`), e.g. while waiting on a network response.
+ *
+ * ## When not to use
+ * - For a compact, ring-shaped progress indicator -- use `bs-progress` (circular) instead.
+ * - For a percentage that's better expressed as plain text, without the reserved space and visual
+ *   weight of a bar.
+ *
+ * @slot - Free-form label content rendered below the bar (e.g. "Uploading..."), gated by
+ *   `showLabel`. Unlike `bs-progress`'s label, this is not a computed `${value}%` string -- it's
+ *   consumer-supplied content, per the Figma spec's free-text "Label" placeholder.
+ * @part container - The outer wrapper (bar + optional label).
+ * @part track - The background track bar.
+ * @part fill - The colored progress/sliding fill bar.
+ * @part label - The label wrapper (only rendered when `showLabel` is true and slotted content exists).
+ */
+export class BsProgressLinear {
+    el;
+    /** Whether the default slot currently has any real (non-whitespace) content -- the label
+     * wrapper is only rendered when `showLabel` is true AND slotted content exists, so an empty
+     * label never reserves visual space/line-height for nothing. Recomputed on `slotchange`. */
+    hasLabelContent = false;
+    /** `determinate` renders a static fill reflecting `value`; `indeterminate` renders a
+     * continuously sliding gradient bar and ignores `value`. */
+    type = 'determinate';
+    /** Bar height: `small` (4px) or `large` (8px). */
+    size = 'large';
+    /** Progress percentage, `0`-`100`. Only meaningful for `type="determinate"` -- ignored (and
+     * never rendered) for `type="indeterminate"`. Out-of-range values are clamped defensively. */
+    value = 0;
+    /** Shows the slotted label below the bar. When `false`, or when no content is slotted, the
+     * label wrapper isn't rendered at all. Defaults to `true`. */
+    showLabel = true;
+    get clampedValue() {
+        return Math.min(100, Math.max(0, this.value));
+    }
+    render() {
+        const isDeterminate = this.type === 'determinate';
+        const value = this.clampedValue;
+        return (h("div", { key: '5c8e982bad03ed994700f3021a2304f4b51b3f4a', part: "container", class: "bs-progress-linear" }, h("div", { key: 'e2327781cdfbec66cee4a09a0d518cd71f9a8fb7', part: "track", class: `bs-progress-linear__track bs-progress-linear__track--${this.size}`, role: "progressbar", "aria-valuemin": isDeterminate ? '0' : undefined, "aria-valuemax": isDeterminate ? '100' : undefined, "aria-valuenow": isDeterminate ? String(value) : undefined, "aria-busy": isDeterminate ? undefined : 'true' }, isDeterminate ? (h("div", { part: "fill", class: "bs-progress-linear__fill", style: { width: `${value}%` } })) : (
+        // Figma's indeterminate bar is a soft "comet" gradient segment (transparent -> blue ->
+        // transparent) sliding left-to-right across the track's full width in a loop -- the
+        // same fade concept as bs-progress's indeterminate ring's conic-gradient comet tail,
+        // but along a straight line via a linear-gradient + `transform: translateX(...)`
+        // keyframe animation instead of a rotating conic-gradient.
+        h("div", { part: "fill", class: "bs-progress-linear__fill bs-progress-linear__fill--indeterminate" }))), this.showLabel && this.hasLabelContent && (h("span", { key: 'adbb34071dedfe8e164f1cf208e95c7f1f241399', part: "label", class: "bs-progress-linear__label" }, h("slot", { key: '74020827d39b5d7d38feee377058c434f7e78f11' })))));
+    }
+    // The default slot's assigned content lives in the host's light DOM regardless of whether a
+    // <slot> is currently rendered in the shadow tree, so this can be computed directly from the
+    // host's childNodes -- no need to render an always-present hidden <slot> just to observe it.
+    componentWillLoad() {
+        this.updateLabelVisibility();
+        this.mutationObserver = new MutationObserver(() => this.updateLabelVisibility());
+        this.mutationObserver.observe(this.el, { childList: true, characterData: true, subtree: true });
+    }
+    disconnectedCallback() {
+        this.mutationObserver?.disconnect();
+    }
+    mutationObserver;
+    updateLabelVisibility() {
+        this.hasLabelContent = Array.from(this.el.childNodes).some(node => {
+            if (node.nodeType === Node.TEXT_NODE)
+                return (node.textContent ?? '').trim().length > 0;
+            if (node.nodeType === Node.ELEMENT_NODE)
+                return true;
+            return false;
+        });
+    }
+    static get is() { return "bs-progress-linear"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["bs-progress-linear.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["bs-progress-linear.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "BsProgressLinearType",
+                    "resolved": "\"determinate\" | \"indeterminate\"",
+                    "references": {
+                        "BsProgressLinearType": {
+                            "location": "local",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-progress-linear/bs-progress-linear.tsx",
+                            "id": "src/components/bs-progress-linear/bs-progress-linear.tsx::BsProgressLinearType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "`determinate` renders a static fill reflecting `value`; `indeterminate` renders a\ncontinuously sliding gradient bar and ignores `value`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type",
+                "defaultValue": "'determinate'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "BsProgressLinearSize",
+                    "resolved": "\"large\" | \"small\"",
+                    "references": {
+                        "BsProgressLinearSize": {
+                            "location": "local",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-progress-linear/bs-progress-linear.tsx",
+                            "id": "src/components/bs-progress-linear/bs-progress-linear.tsx::BsProgressLinearSize"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Bar height: `small` (4px) or `large` (8px)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'large'"
+            },
+            "value": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Progress percentage, `0`-`100`. Only meaningful for `type=\"determinate\"` -- ignored (and\nnever rendered) for `type=\"indeterminate\"`. Out-of-range values are clamped defensively."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value",
+                "defaultValue": "0"
+            },
+            "showLabel": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Shows the slotted label below the bar. When `false`, or when no content is slotted, the\nlabel wrapper isn't rendered at all. Defaults to `true`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-label",
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "hasLabelContent": {}
+        };
+    }
+    static get elementRef() { return "el"; }
+}

package/dist/collection/components/bs-progress-linear/bs-progress-linear.stories.js

@@ -0,0 +1,66 @@
+import { html } from "lit";
+import { componentDescription, propDescription } from "../../stories-utils";
+const types = ['determinate', 'indeterminate'];
+const sizes = ['small', 'large'];
+const meta = {
+    title: 'Components/bs-progress/Linear',
+    parameters: { docs: { description: { component: componentDescription('bs-progress-linear') } } },
+    render: args => html `
+    <bs-progress-linear type=${args.type} size=${args.size} value=${args.value} show-label=${args.showLabel}>
+      ${args.label}
+    </bs-progress-linear>
+  `,
+    argTypes: {
+        type: { control: { type: 'select' }, options: types, description: propDescription('bs-progress-linear', 'type') },
+        size: { control: { type: 'select' }, options: sizes, description: propDescription('bs-progress-linear', 'size') },
+        value: { control: { type: 'range', min: 0, max: 100 }, description: propDescription('bs-progress-linear', 'value') },
+        showLabel: { control: 'boolean', description: propDescription('bs-progress-linear', 'show-label') },
+        label: { control: 'text', description: 'Slotted label content (default slot).' },
+    },
+    args: {
+        type: 'determinate',
+        size: 'large',
+        value: 40,
+        showLabel: true,
+        label: 'Label',
+    },
+};
+export default meta;
+export const Default = {};
+// One instance per size, stacked, at a fixed mid-range value.
+export const Sizes = {
+    name: 'Sizes',
+    render: () => html `
+    <div style="display: flex; flex-direction: column; gap: 24px; width: 320px;">
+      ${sizes.map(size => html `<bs-progress-linear size=${size} value="40">Label</bs-progress-linear>`)}
+    </div>
+  `,
+};
+// A few sample values across the range, illustrating the fill from empty to full.
+export const Values = {
+    name: 'Values',
+    render: () => html `
+    <div style="display: flex; flex-direction: column; gap: 24px; width: 320px;">
+      ${[0, 25, 50, 75, 100].map(value => html `<bs-progress-linear value=${value}>${value}%</bs-progress-linear>`)}
+    </div>
+  `,
+};
+export const WithoutLabel = {
+    name: 'Without label',
+    args: { showLabel: false },
+    render: args => html `
+    <div style="width: 320px;">
+      <bs-progress-linear type=${args.type} size=${args.size} value=${args.value} show-label=${args.showLabel}>
+        ${args.label}
+      </bs-progress-linear>
+    </div>
+  `,
+};
+export const Indeterminate = {
+    args: { type: 'indeterminate' },
+    render: args => html `
+    <div style="width: 320px;">
+      <bs-progress-linear type=${args.type} size=${args.size} show-label=${args.showLabel}> ${args.label} </bs-progress-linear>
+    </div>
+  `,
+};

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

@@ -51,7 +51,7 @@ export class BsRadio {
         }
     };
     render() {
-        return (h("label", { key: '349589d9d20270aedcbd67d528057b9b0c41c486', class: `bs-radio ${this.disabled ? 'bs-radio--disabled' : ''}` }, h("input", { key: '36da81bb4a82a78cd1e49ca2d27b4837e6077bd9', class: "bs-radio__input", type: "radio", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("span", { key: '1f5e0d0a2c49875b63b70bf1618f1c374d7f5dae', class: "bs-radio__hit-area" }, h("span", { key: '63f4e1e619aa3faca1cda08ad878f23b83836d0c', class: "bs-radio__state-layer" }, h("span", { key: '5487d7782497766e8d3c1261c035214055b4ecf3', part: "circle", class: `bs-radio__circle ${this.checked ? 'bs-radio__circle--selected' : ''}` }, this.checked && h("span", { key: '6a8cd123cf6588c8e18c5841176556bf8f22b1bb', part: "dot", class: "bs-radio__dot" })))), h("span", { key: 'b21075cb92382cbdcb3d11404b5db27ac5823308', part: "label", class: "bs-radio__label" }, h("slot", { key: '8ca2bb29e32c2f0d52832b42643c0efd7cc89e9a' }))));
+        return (h("label", { key: '161bfbd0b2275f33cb8fbc5b3e4851ec30edbbce', class: `bs-radio ${this.disabled ? 'bs-radio--disabled' : ''}` }, h("input", { key: '264d57cbd6c4f0052d8db28fb0fb11e274448b9b', class: "bs-radio__input", type: "radio", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("span", { key: 'c7caedd6dfad0b5808a6e1bea575c4f958d2ea0b', class: "bs-radio__hit-area" }, h("span", { key: '1192afc8c59dce5fdf5c226dd560e4885175a73c', class: "bs-radio__state-layer" }, h("span", { key: '7869c22cde3a99465500cc7cb52b281189db6f94', part: "circle", class: `bs-radio__circle ${this.checked ? 'bs-radio__circle--selected' : ''}` }, this.checked && h("span", { key: '8f9cce005680970137aa380f64792a877a28fee6', part: "dot", class: "bs-radio__dot" })))), h("span", { key: 'a1539f067d44caf5988a1a86755bf47d9738fe08', part: "label", class: "bs-radio__label" }, h("slot", { key: 'be0394e88cc984e2d558881be9305753fec90ddc' }))));
     }
     static get is() { return "bs-radio"; }
     static get encapsulation() { return "shadow"; }

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

@@ -199,7 +199,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: 'e4647158959bb507711a1d9872e68f64d5f7bd34', class: rootClasses }, this.showLabel && (h("div", { key: 'eb5d67b8717cc627b63a17f85471e757d35cec85', class: "bs-slider__header" }, h("span", { key: '48f6184206774111a5beb1869857020d7008f013', 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: '1ee4796e51f2d29b1b5bad812d81f037d1d2d29f', class: "bs-slider__row" }, this.showLabel && (h("span", { key: '4bfdfd86f9c5ae5c2f8ca08c0758be9fce483056', part: "bound", class: "bs-slider__bound" }, this.min)), isRange ? this.renderRangeThumbs() : this.renderSingleThumb(), this.showLabel && (h("span", { key: '06ee3063570c858bcdf49960b9021a301e56288e', part: "bound", class: "bs-slider__bound" }, this.max)))));
+        return (h("div", { key: '1cbd5e53dd0d8fb327d8584428dd21332661b5e2', class: rootClasses }, this.showLabel && (h("div", { key: '3634d341e67ebc1bfba90b86b104fa5553d67d1d', class: "bs-slider__header" }, h("span", { key: '3ebf6d66bd5c8e51fe9d9b42844cbfc1c45ae696', 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: '874e62bf31a4fdba314c9999d15abfbf211fb5bc', class: "bs-slider__row" }, this.showLabel && (h("span", { key: 'eb26f532ddac948279faa4bc6c60d263b0538ee6', part: "bound", class: "bs-slider__bound" }, this.min)), isRange ? this.renderRangeThumbs() : this.renderSingleThumb(), this.showLabel && (h("span", { key: '01bab87bfab37495ce857bbfd16d8417aea61a61', part: "bound", class: "bs-slider__bound" }, this.max)))));
     }
     static get is() { return "bs-slider"; }
     static get encapsulation() { return "shadow"; }
@@ -225,7 +225,7 @@ export class BsSlider {
                     "references": {
                         "BsSliderType": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-slider/bs-slider.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-slider/bs-slider.tsx",
                             "id": "src/components/bs-slider/bs-slider.tsx::BsSliderType"
                         }
                     }

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

@@ -51,7 +51,7 @@ export class BsSnackbar {
         this.bsDismiss.emit();
     };
     render() {
-        return (h("div", { key: '3dc0997bd057ef72d7322d28ad5c561fb5e24730', part: "container", class: `bs-snackbar bs-snackbar--${this.variant}`, role: "status", "aria-live": this.variant === 'error' ? 'assertive' : 'polite' }, h("div", { key: '3b77e4ac957cd73368883afbb7b47fb5cc46966b', class: "bs-snackbar__content" }, h("span", { key: '45a8c01714b0a3bec9ffcc470a83959a1d9f0539', part: "icon", class: "bs-snackbar__icon", "aria-hidden": "true" }, this.loading ? h("span", { class: "bs-snackbar__spinner" }) : h(CheckCircleIcon, null)), h("span", { key: '6738316060e8da63c45ceda8ec2a2fce0dbcbc24', part: "message", class: "bs-snackbar__message" }, h("slot", { key: 'f88fe59ad8c970a222b2349a86df8c9ccb2836ab' }))), h("div", { key: '171fa694e2faccca014bb75234958cd458b17fe7', class: "bs-snackbar__actions" }, this.actionLabel && (h("button", { key: '2f529c556bbc9b6d01fddb23b434a6e381f38529', part: "action", type: "button", class: "bs-snackbar__action", onClick: this.onAction }, this.actionLabel)), h("button", { key: '1f45a977afdd80ee603e122fe8ac36b8161d6ee3', part: "close", type: "button", class: "bs-snackbar__close", "aria-label": "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: 'f16229c70fdbd0329e4a91fe7fbbf58e43e7870f' })))));
+        return (h("div", { key: '3251935ac23aa9157004eefdb6e324234eb6bfcb', part: "container", class: `bs-snackbar bs-snackbar--${this.variant}`, role: "status", "aria-live": this.variant === 'error' ? 'assertive' : 'polite' }, h("div", { key: 'c45e3cbe89cf2b956e46c71db87eb9644d3ef4df', class: "bs-snackbar__content" }, h("span", { key: '840a2ab80a6ff4691eb341157f8285f70310ec33', part: "icon", class: "bs-snackbar__icon", "aria-hidden": "true" }, this.loading ? h("span", { class: "bs-snackbar__spinner" }) : h(CheckCircleIcon, null)), h("span", { key: '6f947d2327529ae23c4de691ea509b39ce5e2490', part: "message", class: "bs-snackbar__message" }, h("slot", { key: '4cde5846deeb26cfb4fa134e789b641c9674618d' }))), h("div", { key: 'f5c1cc73c36ddfd5feef19fbcc24668c407cbd3d', class: "bs-snackbar__actions" }, this.actionLabel && (h("button", { key: 'ae7b54aee03e21f0d770b6440a5ef0138f835be8', part: "action", type: "button", class: "bs-snackbar__action", onClick: this.onAction }, this.actionLabel)), h("button", { key: 'f689a78a40fbd268760e9624ed0f02ba3ac71b07', part: "close", type: "button", class: "bs-snackbar__close", "aria-label": "Dismiss", onClick: this.onDismiss }, h(CloseIcon, { key: 'e731694f295179bb1cf85111116e2bf8f5e83cb7' })))));
     }
     static get is() { return "bs-snackbar"; }
     static get encapsulation() { return "shadow"; }
@@ -76,7 +76,7 @@ export class BsSnackbar {
                     "references": {
                         "BsSnackbarVariant": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-snackbar/bs-snackbar.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-snackbar/bs-snackbar.tsx",
                             "id": "src/components/bs-snackbar/bs-snackbar.tsx::BsSnackbarVariant"
                         }
                     }

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

@@ -51,8 +51,8 @@ export class BsSourceLink {
     };
     render() {
         const inner = [
-            h("span", { key: 'f439433f45bc81b4c515903661311431d99637cd', class: "bs-source-link__left" }, h("span", { key: '4ede9ae3793da7453679723866a519e73ee963aa', class: "bs-source-link__filename-row" }, h("span", { key: '6b4b95fde466988248d34d27705df76acce5927a', part: "icon", class: "bs-source-link__icon" }, h("slot", { key: '24cf2dcc3d04fb2d6e543d1e8bae0e96d0df2d14', name: "icon" }, h(FileTextIcon, { key: 'f04e008075912dfac619c1a2e676346bc7d226d5' }))), h("p", { key: '16b2120d5391930dfc239cb5dd18c40de0cb7aa0', part: "filename", class: "bs-source-link__filename" }, this.fileName)), h("span", { key: 'ec10ed741f33eba57624e0840253f96851f1481a', class: "bs-source-link__meta" }, this.sourceName && (h("span", { key: '56d4a784e30ceff1568bb393d4c3b368f81a0f3e', part: "source", class: "bs-source-link__source" }, this.sourceName)), this.sourceName && this.version && h("span", { key: '95db8a3be1c61741e7d30229c642fea7d321b6b0', class: "bs-source-link__dot", "aria-hidden": "true" }), this.version && (h("span", { key: '4f8caac5193d8671811f9972654ab049f23bac49', part: "version", class: "bs-source-link__version" }, this.version)))),
-            h("span", { key: '6009485aa7f7d802a82195c50374693f66782737', part: "arrow", class: "bs-source-link__arrow", "aria-hidden": "true" }, h(ArrowUpRightIcon, { key: '1032169a5bfb02f9fbf1d7a5d5d255f313e1da29' })),
+            h("span", { key: '6e0bde7df2c893933c6490a995e418a43de6454f', class: "bs-source-link__left" }, h("span", { key: '9724f21e43696b3a07daabd05a348eaee96cd082', class: "bs-source-link__filename-row" }, h("span", { key: '901c8a90c0707197d0ae5f5c053f2e197683c973', part: "icon", class: "bs-source-link__icon" }, h("slot", { key: 'ca4ecd68ec7149bfe61830b3bd75a45e7086c165', name: "icon" }, h(FileTextIcon, { key: '656b72e726370c03b271e83397666be76544eb65' }))), h("p", { key: 'c20b0bc181548a81c57364b707afba77d535d62a', part: "filename", class: "bs-source-link__filename" }, this.fileName)), h("span", { key: '3178845a3c16d2ffd5fc1942806851370d966290', class: "bs-source-link__meta" }, this.sourceName && (h("span", { key: '6967d7fa214067d5e0d14123d287c4ce6cf40496', part: "source", class: "bs-source-link__source" }, this.sourceName)), this.sourceName && this.version && h("span", { key: 'a58b3e8d2d8ef4a23c8d6155454ab5825fd737b5', class: "bs-source-link__dot", "aria-hidden": "true" }), this.version && (h("span", { key: '1701393a524375eee95905308a9b8be1b9647bc8', part: "version", class: "bs-source-link__version" }, this.version)))),
+            h("span", { key: 'a291c8de9d56e8b269660441930b4bf95977883f', part: "arrow", class: "bs-source-link__arrow", "aria-hidden": "true" }, h(ArrowUpRightIcon, { key: '90a1a20ee9f84e5e339fa2a11c59691f6f45759f' })),
         ];
         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

@@ -61,7 +61,7 @@ export class BsStepper {
         });
     }
     render() {
-        return h("slot", { key: '1c5d7d0c6a9fef9c06dfd08bd529a1582fe18478', onSlotchange: this.onSlotChange });
+        return h("slot", { key: 'ce510c14afc31408f1a8b04a6ab6a6bc8480dd97', 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: '23bdc6334a36d9b2dd28719b9b23fbc17ad8f29b', role: "listitem", class: `bs-stepper-step--${this.direction}` }, h("div", { key: '388e17882bb5215c33e0665107acbcff5c7b4c9c', class: "bs-stepper-step__top" }, h("span", { key: '6cf79ab50a94f9578e76f14ca23cdfa984ef394b', part: "icon", class: `bs-stepper-step__icon bs-stepper-step__icon--${state}` }, state === 'current' && h("span", { key: '8081181e8865a29f703c74d5a20183513bdf2b66', class: "bs-stepper-step__icon-dot" }), state === 'done' && h(CheckIcon, { key: '92755c827c9c09b1bae504daabd2067fc498b355' }), state === 'error' && h(ExclamationIcon, { key: '62ac0a0826b8f8b507fcd0a7c47bff3c39f804b4' })), h("span", { key: 'a1c15ede35ab01d876a0289552dffc37c75626d1', part: "connector", class: "bs-stepper-step__connector", "aria-hidden": "true" }, h("span", { key: '5029f8f629af1091bcb8fa2a47ebe12a7bd6628e', class: "bs-stepper-step__connector-line" }))), h("span", { key: '3835e986646f619751043ab0eeb1b5d977f22a58', part: "label", class: `bs-stepper-step__label bs-stepper-step__label--${state}` }, h("span", { key: '5da4053ea5ecf588853b5d9678737a67b7aadbe1', part: "name", class: "bs-stepper-step__name" }, this.name), this.showDescription && this.description && (h("span", { key: 'd5544b97eefe9311ac13f0cbcd4bf6d87bc24ca5', part: "description", class: "bs-stepper-step__description" }, this.description)))));
+        return (h(Host, { key: '0885597069b454df03e0797e6fc3ec4bba3357b1', role: "listitem", class: `bs-stepper-step--${this.direction}` }, h("div", { key: 'e5bf87615b06b2ffd35b18329a925171c45cbf4e', class: "bs-stepper-step__top" }, h("span", { key: 'e82c4b4d88769d9301a258f9f8ba10e75aac381d', part: "icon", class: `bs-stepper-step__icon bs-stepper-step__icon--${state}` }, state === 'current' && h("span", { key: '61b0982711c74851add824ccb561f26711ed1162', class: "bs-stepper-step__icon-dot" }), state === 'done' && h(CheckIcon, { key: 'f53ba1c507f79cac0ee4cde326c2a95580b95ea2' }), state === 'error' && h(ExclamationIcon, { key: '9671c46079a379711410c878cb520d915ff419b3' })), h("span", { key: 'af6ba4667e1237ff2ade9947a19ccea455aa1cb1', part: "connector", class: "bs-stepper-step__connector", "aria-hidden": "true" }, h("span", { key: '337b424d21fa9ad1c1289a314d1e4aee1d868e08', class: "bs-stepper-step__connector-line" }))), h("span", { key: '265d260e904153b4875fecd899affb5e16482e52', part: "label", class: `bs-stepper-step__label bs-stepper-step__label--${state}` }, h("span", { key: '2402a6d04e7467ea9b14b86569093226253ce934', part: "name", class: "bs-stepper-step__name" }, this.name), this.showDescription && this.description && (h("span", { key: 'ed6b927749fb9b174bf481e862fc4109ca557e1a', part: "description", class: "bs-stepper-step__description" }, this.description)))));
     }
     static get is() { return "bs-stepper-step"; }
     static get encapsulation() { return "shadow"; }
@@ -161,7 +161,7 @@ export class BsStepperStep {
                     "references": {
                         "BsStepperStepComputedState": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx",
                             "id": "src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx::BsStepperStepComputedState"
                         }
                     }
@@ -187,7 +187,7 @@ export class BsStepperStep {
                     "references": {
                         "BsStepperDirection": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx",
                             "id": "src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx::BsStepperDirection"
                         }
                     }

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

@@ -58,7 +58,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: '72a1a031e9ed8763a2b60f3c23de18973cc7409d', class: `bs-switch ${this.disabled ? 'bs-switch--disabled' : ''}` }, h("input", { key: '90427f6930abcb294526caa912331a568f6eaaeb', 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: 'be4eb4528f413527e67f38201c20ca86eeef37c1', part: "track", class: trackClasses }, h("span", { key: '030a60024a77bfae2f78a40128dd62a8581f5fd1', part: "knob", class: knobClasses })), h("span", { key: '5792002eed1c0489a1456e362f0fd3c290522834', part: "label", class: "bs-switch__label" }, h("slot", { key: '9dadf202bcde1760dcda56ca84155ecdb117b746' }))));
+        return (h("label", { key: '8cc77a7334a032869209299197e49619d3ac6291', class: `bs-switch ${this.disabled ? 'bs-switch--disabled' : ''}` }, h("input", { key: '2d052950431ecd2ea7dfdfef8252ef2ec5bd2dc4', 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: 'f3a7f7260a0f915e22eb32408495c4e114a9bcff', part: "track", class: trackClasses }, h("span", { key: '4c59c865cca27b3d7f068a2798a5901a43b1ef40', part: "knob", class: knobClasses })), h("span", { key: '807b245462b4b44f224beb892312f914625065e6', part: "label", class: "bs-switch__label" }, h("slot", { key: '056f758a35f0a9f5392561a6a47a3f8a65c9ffc7' }))));
     }
     static get is() { return "bs-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -84,7 +84,7 @@ export class BsSwitch {
                     "references": {
                         "BsSwitchSize": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-switch/bs-switch.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-switch/bs-switch.tsx",
                             "id": "src/components/bs-switch/bs-switch.tsx::BsSwitchSize"
                         }
                     }

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

@@ -86,7 +86,7 @@ export class BsInlineTab {
     };
     render() {
         const iconOnly = this.hasIcon && !this.hasLabel;
-        return (h("button", { key: '6313c5d454cd53665dee3180dcf17d37548fa5c5', 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, onClick: this.onClick }, h("span", { key: '14255949e0df5e3d7c763841844964b2d507bc86', part: "icon", class: `bs-inline-tab__icon ${this.hasIcon ? 'bs-inline-tab__icon--has-content' : ''}` }, h("slot", { key: 'f81037da9dbff2c105f0eacad4acd8a7eef84cbe', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '176c52323b9df0ca53aae20cc80dfc8d5625aa97', part: "label", class: `bs-inline-tab__label ${this.hasLabel ? 'bs-inline-tab__label--has-content' : ''}` }, h("slot", { key: 'b8db261b88931be4e822b2849bd50530d9acc196', onSlotchange: this.onLabelSlotchange }))));
+        return (h("button", { key: '7a3fe9444808cf379acdef7f06b0e6b07fb52ff0', 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, onClick: this.onClick }, h("span", { key: '39dbd2c9f65157efaa7a94b119d90c9251a3a4b7', part: "icon", class: `bs-inline-tab__icon ${this.hasIcon ? 'bs-inline-tab__icon--has-content' : ''}` }, h("slot", { key: 'a3f8079e25a29834beb3a477e5b9c29f9d474429', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: 'edf1472b4ac667300d24b2fb8c8fea9f51705492', part: "label", class: `bs-inline-tab__label ${this.hasLabel ? 'bs-inline-tab__label--has-content' : ''}` }, h("slot", { key: 'a3500324e792e92c3f68a4144644a9a8916e1fb4', 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

@@ -99,7 +99,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: '108e2a145203f9686056af4ef0afaccb9d2db30a', 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, onClick: this.onClick }, h("span", { key: '16ac002486b78656a93cdb79ec2c496784fc97bd', part: "icon", class: `bs-tab__icon ${this.hasIcon ? 'bs-tab__icon--has-content' : ''}` }, h("slot", { key: '18eb1f6346db1658af06d4fd0fe3b9e647459abe', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: 'f97b7760370940a57d240635aa5680ffab053be8', part: "label", class: `bs-tab__label ${this.hasLabel ? 'bs-tab__label--has-content' : ''}` }, h("slot", { key: '2ba740311a892af6d6db0d84ad0f126ca35c48de', onSlotchange: this.onLabelSlotchange })), h("span", { key: 'f1090ed9db4149673c29d1e62ec62db024c50868', part: "badge", class: `bs-tab__badge ${showBadge ? 'bs-tab__badge--has-content' : ''}` }, h("slot", { key: 'a594d11d28f47d5e2665d3f1378892f8fb68c4aa', name: "badge", onSlotchange: this.onBadgeSlotchange })), h("span", { key: '1fd376b6321eeeec0e0a67000bd0c9d5166f9a40', part: "indicator", class: "bs-tab__indicator" })));
+        return (h("button", { key: '582c9b12915fa85e4b05114e4c1d5a15ec9253d1', 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, onClick: this.onClick }, h("span", { key: 'd2e55d29b23478056bb3f24a00ec1237fa9e0a9d', part: "icon", class: `bs-tab__icon ${this.hasIcon ? 'bs-tab__icon--has-content' : ''}` }, h("slot", { key: '767704d1770a124686fa503c0ca19b651412c07f', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '8d4f45d058cbbd5bc64a03862048faaaa1effdf3', part: "label", class: `bs-tab__label ${this.hasLabel ? 'bs-tab__label--has-content' : ''}` }, h("slot", { key: '45805bbb18a4a8a39b01e1bc81a37a2b09449d3c', onSlotchange: this.onLabelSlotchange })), h("span", { key: '27a3379b320a5ac2f2a437c8ca980989cf5ed239', part: "badge", class: `bs-tab__badge ${showBadge ? 'bs-tab__badge--has-content' : ''}` }, h("slot", { key: '2bbd98cc2c68472a9399b3c5ff67ddbeae441949', name: "badge", onSlotchange: this.onBadgeSlotchange })), h("span", { key: '3f75545064c2114483382e1ee65e23f5aad33ccd', part: "indicator", class: "bs-tab__indicator" })));
     }
     static get is() { return "bs-tab"; }
     static get encapsulation() { return "shadow"; }
@@ -164,7 +164,7 @@ export class BsTab {
                     "references": {
                         "BsTabIconPosition": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-tab/bs-tab/bs-tab.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-tab/bs-tab/bs-tab.tsx",
                             "id": "src/components/bs-tab/bs-tab/bs-tab.tsx::BsTabIconPosition"
                         }
                     }

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

@@ -50,7 +50,7 @@ export class BsTabs {
     }
     render() {
         const vertical = this.orientation === 'vertical';
-        return (h("div", { key: '625a82decaddca7fc41585696f15a8fdd19c3127', part: "tablist", role: "tablist", "aria-orientation": this.orientation, class: `bs-tabs bs-tabs--${this.type} ${vertical ? 'bs-tabs--vertical' : ''}` }, h("slot", { key: '059943f777aaf60a2de4026bcb25f561f66a5020' })));
+        return (h("div", { key: 'a2e67e62af5aec684a0b79e06905e1d2dbc1d469', part: "tablist", role: "tablist", "aria-orientation": this.orientation, class: `bs-tabs bs-tabs--${this.type} ${vertical ? 'bs-tabs--vertical' : ''}` }, h("slot", { key: '6b3b19d55ff342c65ef321e6556cf56701dc18a0' })));
     }
     static get is() { return "bs-tabs"; }
     static get encapsulation() { return "shadow"; }
@@ -75,7 +75,7 @@ export class BsTabs {
                     "references": {
                         "BsTabsType": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-tab/bs-tabs/bs-tabs.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-tab/bs-tabs/bs-tabs.tsx",
                             "id": "src/components/bs-tab/bs-tabs/bs-tabs.tsx::BsTabsType"
                         }
                     }
@@ -101,7 +101,7 @@ export class BsTabs {
                     "references": {
                         "BsTabsOrientation": {
                             "location": "local",
-                            "path": "/home/runner/work/Brandsync-web-components/Brandsync-web-components/packages/wc/src/components/bs-tab/bs-tabs/bs-tabs.tsx",
+                            "path": "/home/runner/work/Brandsync-webcomponents/Brandsync-webcomponents/packages/wc/src/components/bs-tab/bs-tabs/bs-tabs.tsx",
                             "id": "src/components/bs-tab/bs-tabs/bs-tabs.tsx::BsTabsOrientation"
                         }
                     }

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

@@ -0,0 +1,59 @@
+import { render, h, describe, it, expect } from "@stencil/vitest";
+describe('bs-toast', () => {
+    it('defaults to the "info" state', async () => {
+        const { root } = await render(h("bs-toast", null, "Files uploaded successfully."));
+        const container = root.shadowRoot.querySelector('[part="container"]');
+        expect(container).toHaveClass('bs-toast--info');
+    });
+    ['info', 'success', 'warning', 'error'].forEach(state => {
+        it(`applies the "${state}" state class`, async () => {
+            const { root } = await render(h("bs-toast", { state: state }, "Message"));
+            const container = root.shadowRoot.querySelector('[part="container"]');
+            expect(container).toHaveClass(`bs-toast--${state}`);
+        });
+    });
+    it('renders the slotted message', async () => {
+        const { root } = await render(h("bs-toast", null, "Files uploaded successfully."));
+        expect(root).toHaveTextContent('Files uploaded successfully.');
+    });
+    describe('icon per state', () => {
+        it('renders an icon for the info state', async () => {
+            const { root } = await render(h("bs-toast", { state: "info" }, "Message"));
+            const icon = root.shadowRoot.querySelector('[part="icon"]');
+            expect(icon.querySelector('svg')).not.toBeNull();
+        });
+        it('renders a different icon markup per state', async () => {
+            const renders = await Promise.all(['info', 'success', 'warning', 'error'].map(async (state) => {
+                const { root } = await render(h("bs-toast", { state: state }, "Message"));
+                return root.shadowRoot.querySelector('[part="icon"]').innerHTML;
+            }));
+            expect(new Set(renders).size).toBe(renders.length);
+        });
+    });
+    describe('close button', () => {
+        it('always renders a close button with an accessible name', async () => {
+            const { root } = await render(h("bs-toast", null, "Message"));
+            const close = root.shadowRoot.querySelector('[part="close"]');
+            expect(close).not.toBeNull();
+            expect(close).toEqualAttribute('aria-label', 'Dismiss');
+        });
+        it('emits bsDismiss when the close button is clicked', async () => {
+            const { root, spyOnEvent } = await render(h("bs-toast", null, "Message"));
+            const dismissSpy = spyOnEvent('bsDismiss');
+            root.shadowRoot.querySelector('[part="close"]').click();
+            expect(dismissSpy).toHaveReceivedEventTimes(1);
+        });
+    });
+    describe('aria-live', () => {
+        it('uses aria-live="polite" for non-error states', async () => {
+            const { root } = await render(h("bs-toast", { state: "success" }, "Message"));
+            const container = root.shadowRoot.querySelector('[part="container"]');
+            expect(container).toEqualAttribute('aria-live', 'polite');
+        });
+        it('uses aria-live="assertive" for the error state', async () => {
+            const { root } = await render(h("bs-toast", { state: "error" }, "Message"));
+            const container = root.shadowRoot.querySelector('[part="container"]');
+            expect(container).toEqualAttribute('aria-live', 'assertive');
+        });
+    });
+});