@brandsync/wc 1.22.0 → 1.22.1

package/dist/collection/components/bs-cookie-consent/bs-cookie-consent.stories.js

@@ -34,7 +34,7 @@ const PREFERENCE_CATEGORIES = [
     },
 ];
 const meta = {
-    title: 'Components/bs-cookie-consent',
+    title: 'Components/Feedback/bs-cookie-consent',
     parameters: { docs: { description: { component: componentDescription('bs-cookie-consent') } } },
     decorators: [story => html `<div style="padding: 16px; background: var(--bs-color-neutral-container);">${story()}</div>`],
     render: args => html `

package/dist/collection/components/bs-data-table/bs-data-table.js

@@ -100,11 +100,11 @@ export class BsDataTable {
         }
     }
     render() {
-        return (h("table", { key: 'd24675d99b4bb7070646b7dd8a432d1395737be2', part: "table", class: "bs-data-table" }, h("thead", { key: '6cd20167515acc4b9509a17584b8d6963f73b4d9', part: "head" }, h("tr", { key: 'df8433665b80da7f39c4ee11abe7250827ea0ceb' }, this.selectable && (h("th", { key: 'cfd133dd0044cef743f528ad2b48b7352be4c3d8', class: "bs-data-table__select-col" }, this.rows.length > 0 && (h("input", { key: '930f6e772809bf3250912b78c17364ceda67a9a8', type: "checkbox", "aria-label": this.selectAllLabel, checked: this.selectedIds.size > 0 && this.selectedIds.size === this.rows.length, indeterminate: this.selectedIds.size > 0 && this.selectedIds.size < this.rows.length, onChange: this.onSelectAllChange })))), this.columns.map(column => {
+        return (h("table", { key: '86d56c6fb30816c7ff0035b6d53fafc999bc1266', part: "table", class: "bs-data-table" }, h("thead", { key: '058e68b03dafaad071168a093978664405caf545', part: "head" }, h("tr", { key: '2621d2f1d4bc20bc152d99157b6f3682b7f8c52d' }, this.selectable && (h("th", { key: '3c701733d816861d9f18996fc02e42fe9e5e2a7c', class: "bs-data-table__select-col" }, this.rows.length > 0 && (h("input", { key: '21985f46def70a01a0a1556b0fe0aef0a954ab25', type: "checkbox", "aria-label": this.selectAllLabel, checked: this.selectedIds.size > 0 && this.selectedIds.size === this.rows.length, indeterminate: this.selectedIds.size > 0 && this.selectedIds.size < this.rows.length, onChange: this.onSelectAllChange })))), this.columns.map(column => {
             const isSorted = this.sortColumn === column.key;
             const ariaSort = column.sortable ? (isSorted ? (this.sortDirection === 'asc' ? 'ascending' : 'descending') : 'none') : undefined;
             return (h("th", { part: "header-cell", class: "bs-data-table__header-cell", "aria-sort": ariaSort }, column.sortable ? (h("button", { type: "button", class: "bs-data-table__sort-button", onClick: () => this.onHeaderClick(column) }, column.label, isSorted && h("span", { class: "bs-data-table__sort-indicator" }, this.sortDirection === 'asc' ? ' ▲' : ' ▼'))) : (column.label)));
-        }))), h("tbody", { key: 'efafea945207fc1c29016ae066e0a2fce3ec5f6e', part: "body" }, this.rows.map(row => (h("tr", { part: "row", class: "bs-data-table__row" }, this.selectable && (h("td", { class: "bs-data-table__select-col" }, h("input", { type: "checkbox", "aria-label": this.selectRowLabel, checked: this.selectedIds.has(row.id), onChange: ev => this.onRowCheckboxChange(row, ev) }))), this.columns.map(column => this.cellRenderer ? (
+        }))), h("tbody", { key: 'a80faf9643c27ea641794f117ad9ffcdf7caed7f', part: "body" }, this.rows.map(row => (h("tr", { part: "row", class: "bs-data-table__row" }, this.selectable && (h("td", { class: "bs-data-table__select-col" }, h("input", { type: "checkbox", "aria-label": this.selectRowLabel, checked: this.selectedIds.has(row.id), onChange: ev => this.onRowCheckboxChange(row, ev) }))), this.columns.map(column => this.cellRenderer ? (
         // cellRenderer is a developer-supplied, trusted function (JS-property-only, never
         // derived from untrusted input) -- its HTML output is intentionally not escaped,
         // same trust model as React's dangerouslySetInnerHTML.

package/dist/collection/components/bs-data-table/bs-data-table.stories.js

@@ -1,6 +1,6 @@
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-data-table',
+    title: 'Components/Data display/bs-data-table',
     parameters: { docs: { description: { component: componentDescription('bs-data-table') } } },
 };
 export default meta;

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

@@ -340,7 +340,7 @@ export class BsDatepicker {
             : this.defaultTabbable(days);
         const isInRange = (iso) => !!selectedStart && !!previewEnd && iso > selectedStart && iso < previewEnd;
         const weekdays = this.weekdays();
-        return (h("bs-card", { key: '5dfa1f91fce2714fbaa120c0c159858dd1f22f77', part: "container", class: "bs-datepicker", surface: "raised" }, h("div", { key: 'd5683ce23acd1f07a9c382254d0e39cb7caf0d9a', class: "bs-datepicker__body" }, this.renderHeader(), h("div", { key: 'da658aaa5410916b223708890e3f0d012c297d08', part: "nav", class: "bs-datepicker__nav" }, h("button", { key: '99df9c289bb4a6e5901aabc9ad294122297ecd05', part: "prev", type: "button", class: "bs-datepicker__nav-button", "aria-label": this.previousLabel, onClick: () => this.moveView(-1) }, h("svg", { key: 'db686789ae2ca6a9600bd6477e9b56a50adf722e', viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: '99d27b25366ee163c9dda8caeed0630f1c6c6157', d: "M15 18L9 12L15 6", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("div", { key: '297710ca625a8163abca541ca11b858e61431ee0', part: "title", class: "bs-datepicker__title", "aria-live": "polite" }, this.titleText()), h("button", { key: '26e5b15959adcea0a842f59e85b5bca6bb7ec6a7', part: "next", type: "button", class: "bs-datepicker__nav-button", "aria-label": this.nextLabel, onClick: () => this.moveView(1) }, h("svg", { key: 'bef119a10f7e01e8c58e8fd3690417442528d071', viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: 'd6566754ab7cf16f2e82127c594675c906ce6397', d: "M9 18L15 12L9 6", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: 'c9f559c3ba6c929160801ece12d7ed61cb3cbe4b', part: "grid", class: "bs-datepicker__grid", role: "grid", "aria-label": this.titleText() }, h("div", { key: '214302e6ea6693ba9e4a2e908fa982f0df0d926a', class: "bs-datepicker__row", role: "row" }, weekdays.map(w => (h("div", { part: "weekday", class: "bs-datepicker__weekday", role: "columnheader" }, w)))), Array.from({ length: 6 }, (_, r) => {
+        return (h("bs-card", { key: 'deee020382c8f61b97601d7e5504fb8c0f174616', part: "container", class: "bs-datepicker", surface: "raised" }, h("div", { key: '041f26feb5c2d0d20a3257ff8b5589fd09c8133b', class: "bs-datepicker__body" }, this.renderHeader(), h("div", { key: '5122a1de7c9f3914d740a909b3b7b099919817ae', part: "nav", class: "bs-datepicker__nav" }, h("button", { key: 'dd9edd71723f2bdb4fcd883ba3374604976f146d', part: "prev", type: "button", class: "bs-datepicker__nav-button", "aria-label": this.previousLabel, onClick: () => this.moveView(-1) }, h("svg", { key: 'c897bf4dcfa3b1fad4cdc4febb8d4d4c617f36c0', viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: '17d0119479910876f10a67409a882542fec28d76', d: "M15 18L9 12L15 6", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("div", { key: '3052745c0ff62588aab848e0327ab423f4f4469d', part: "title", class: "bs-datepicker__title", "aria-live": "polite" }, this.titleText()), h("button", { key: '83da87b4463d4501b9fc0ab755d6f743962093da', part: "next", type: "button", class: "bs-datepicker__nav-button", "aria-label": this.nextLabel, onClick: () => this.moveView(1) }, h("svg", { key: '5065a4344e6477e895810d42863104c91c7b290f', viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: 'ad4523bb1b76235c4a89a3781f671f2f48ef1490', d: "M9 18L15 12L9 6", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: 'c0653817a489424cf1177eb90edf1a3f5498e13c', part: "grid", class: "bs-datepicker__grid", role: "grid", "aria-label": this.titleText() }, h("div", { key: '13d86c20c7f3ec07f2e06f6aaa7dea3d9a68c1c5', class: "bs-datepicker__row", role: "row" }, weekdays.map(w => (h("div", { part: "weekday", class: "bs-datepicker__weekday", role: "columnheader" }, w)))), Array.from({ length: 6 }, (_, r) => {
             const row = days.slice(r * 7, r * 7 + 7);
             return (h("div", { class: "bs-datepicker__row", role: "row" }, row.map((d, c) => {
                 const iso = toIso(d);

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

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { ifDefined } from "lit/directives/if-defined.js";
 import { componentDescription, propDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-datepicker',
+    title: 'Components/Forms/bs-datepicker',
     parameters: { docs: { description: { component: componentDescription('bs-datepicker') } } },
     render: args => html `
     <bs-datepicker

package/dist/collection/components/bs-description-item/bs-description-item.js

@@ -32,7 +32,7 @@ export class BsDescriptionItem {
     /** Set by the parent `bs-description-list`: `stacked` (term above detail) or `horizontal` (side by side). */
     layout = 'stacked';
     render() {
-        return (h("dl", { key: '40c0899a000b225ecb5332902e9a9f74f54a8caf', part: "container", class: "bs-description-item" }, h("div", { key: '524e64c9808a3aa172854c96466f23719637723e', class: "bs-description-item__group" }, h("dt", { key: '1f7b417f6422fe49b537ce57881a094092e177da', part: "term", class: "bs-description-item__term" }, h("slot", { key: '6f7893e2ca851a7d55aa82cc4f19593db16e9110', name: "term" }, this.term)), h("dd", { key: '861794158a281145f885c5f3990db4506257a4fe', part: "description", class: "bs-description-item__description" }, h("slot", { key: 'ab3ead012e9cd01c5377af5ab05fbf932ffdb0c9' }, this.description)))));
+        return (h("dl", { key: 'aec70759575194366c0b4c4a55ceba043b5dddd1', part: "container", class: "bs-description-item" }, h("div", { key: '9e58afccdcaad5c33403fb01261c81251b801a1d', class: "bs-description-item__group" }, h("dt", { key: 'c2ab08452ff2996050d3a87b62fef543d9f68c65', part: "term", class: "bs-description-item__term" }, h("slot", { key: '3e8a9fb9a9a3fa6ae183a2b9c934f73b1abf7d54', name: "term" }, this.term)), h("dd", { key: '130bdfa0996d78c4aedaf8f11080edf40773dea1', part: "description", class: "bs-description-item__description" }, h("slot", { key: '51a5f57b2a198ff07f4a913cb576849cef5f98e1' }, this.description)))));
     }
     static get is() { return "bs-description-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-description-list/bs-description-list.js

@@ -39,7 +39,7 @@ export class BsDescriptionList {
             .forEach(i => (i.layout = this.layout));
     }
     render() {
-        return (h("div", { key: '05c9e878bf5d7c044f0952194ab139504e18bc37', part: "list", class: "bs-description-list", role: "group", "aria-label": this.ariaLabel ?? undefined }, h("slot", { key: 'e4d5086670583c29bbd5b6d93d49507bd2292aa5', onSlotchange: () => this.sync() })));
+        return (h("div", { key: '77af76f001bc7d507dc5a0b6a79e406e0081346c', part: "list", class: "bs-description-list", role: "group", "aria-label": this.ariaLabel ?? undefined }, h("slot", { key: '15e49c33a811c43599523838852394a5a6dbd5a2', onSlotchange: () => this.sync() })));
     }
     static get is() { return "bs-description-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-description-list/bs-description-list.stories.js

@@ -1,7 +1,7 @@
 import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-description-list',
+    title: 'Components/Data display/bs-description-list',
     parameters: { docs: { description: { component: componentDescription('bs-description-list') } } },
     argTypes: {
         layout: { control: 'select', options: ['stacked', 'horizontal'] },

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

@@ -1,6 +1,6 @@
 import { componentDescription, propDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-dialog',
+    title: 'Components/Menus and overlays/bs-dialog',
     parameters: {
         docs: {
             description: { component: componentDescription('bs-dialog') },

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

@@ -28,7 +28,7 @@ export class BsDivider {
         const a11y = this.decorative
             ? { role: 'none', 'aria-hidden': 'true' }
             : { role: 'separator', 'aria-orientation': orientation };
-        return (h(Host, { key: 'a4b1c9d1ae6166b883923cc4f403e16b6bb77d1e', ...a11y }, h("div", { key: '7a3d216c6cd74f0dc511c27e9c8decdabbffb8a8', class: "line", part: "line" })));
+        return (h(Host, { key: 'c17bc1539b81bcfd278936591d38a343bce89df3', ...a11y }, h("div", { key: '412a79f1f95808a3ab9624c68c70082c842dae65', class: "line", part: "line" })));
     }
     static get is() { return "bs-divider"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-divider',
+    title: 'Components/Layout/bs-divider',
     parameters: { docs: { description: { component: componentDescription('bs-divider') } } },
     render: args => html `
     <div style="display: flex; flex-direction: ${args.orientation === 'vertical' ? 'row' : 'column'}; gap: var(--bs-spacing-200); height: 80px; width: 320px">

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

@@ -96,7 +96,7 @@ export class BsDropdown {
         this.open = ev.detail;
     };
     render() {
-        return (h("bs-popover", { key: '02bce3b47bd8a7d96b22c9b60b3517802e9b05aa', part: "popover", open: this.open, placement: this.placement, onBsOpenChange: this.onPopoverOpenChange }, h("slot", { key: 'd15d4801ef7d8c15cd22772a83d2658d562ce9e4', name: "trigger", slot: "trigger", onSlotchange: this.syncTrigger, ref: el => (this.triggerSlot = el) }), h("slot", { key: 'b098ecec20a9a3a129f7420634dba01816dc61de' })));
+        return (h("bs-popover", { key: '5fdcaae63de66b9c00e9970029eebde4678df1b2', part: "popover", open: this.open, placement: this.placement, onBsOpenChange: this.onPopoverOpenChange }, h("slot", { key: 'a995087e58089577fd6cecbde3d523f970474915', name: "trigger", slot: "trigger", onSlotchange: this.syncTrigger, ref: el => (this.triggerSlot = el) }), h("slot", { key: 'a4f86e6af89b10a92c523db2ae5543d57ea36b2e' })));
     }
     static get is() { return "bs-dropdown"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-dropdown',
+    title: 'Components/Menus and overlays/bs-dropdown',
     parameters: { docs: { description: { component: componentDescription('bs-dropdown') } } },
     render: args => html `
     <div style="padding: 24px 160px 160px;">

package/dist/collection/components/bs-empty-state/bs-empty-state.js

@@ -68,7 +68,7 @@ export class BsEmptyState {
     render() {
         const level = Math.min(6, Math.max(2, Math.round(Number(this.headingLevel)) || 3));
         const Heading = `h${level}`;
-        return (h("div", { key: 'ffdf706be4116dc017712d0e8224ae0ac19fdd86', part: "container", class: "bs-empty-state" }, this.hasIllustration ? (h("div", { part: "illustration", class: "bs-empty-state__illustration" }, h("slot", { name: "illustration" }))) : (h("bs-icon-tile", { part: "icon", size: "lg", intent: this.intent }, this.hasIcon && h("slot", { name: "icon" }))), this.heading && (h(Heading, { key: '5b0787b3afdc2792aaf198eda2c22c2d918f7743', part: "heading", class: "bs-empty-state__heading" }, this.heading)), (this.description || this.hasDescriptionSlot) && (h("p", { key: 'b8f23d2049e1c451c6ebf058479776d7620b30c6', part: "description", class: "bs-empty-state__description" }, this.hasDescriptionSlot ? h("slot", null) : this.description)), this.hasAction && (h("div", { key: '0d90b309f70235864cddb9051457a023fb035cff', part: "action", class: "bs-empty-state__action" }, h("slot", { key: 'bf4df45020fe85c49b5eeb22f83c37759fd6cbbe', name: "action" })))));
+        return (h("div", { key: 'c428179001f47749afe31700b517ca1cd122d14d', part: "container", class: "bs-empty-state" }, this.hasIllustration ? (h("div", { part: "illustration", class: "bs-empty-state__illustration" }, h("slot", { name: "illustration" }))) : (h("bs-icon-tile", { part: "icon", size: "lg", intent: this.intent }, this.hasIcon && h("slot", { name: "icon" }))), this.heading && (h(Heading, { key: 'c2182d743973786df9efb6fe19c7e5d4093ead7f', part: "heading", class: "bs-empty-state__heading" }, this.heading)), (this.description || this.hasDescriptionSlot) && (h("p", { key: '9e76a034b08e884856729920d7828340ea68ca6b', part: "description", class: "bs-empty-state__description" }, this.hasDescriptionSlot ? h("slot", null) : this.description)), this.hasAction && (h("div", { key: '190a141493fb58257c6b7dcb6b9175139eb080b3', part: "action", class: "bs-empty-state__action" }, h("slot", { key: '991d9fa6926c83b4806b6fb0824dbc9b1dfa1a4f', name: "action" })))));
     }
     static get is() { return "bs-empty-state"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-empty-state/bs-empty-state.stories.js

@@ -3,7 +3,7 @@ import { componentDescription } from "../../stories-utils";
 const SEARCH_ICON = html `<svg slot="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="7" /><path d="m20 20-3.5-3.5" /></svg>`;
 const WARNING_ICON = html `<svg slot="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9" /><path d="M12 7.5v5M12 16.2v.1" /></svg>`;
 const meta = {
-    title: 'Components/bs-empty-state',
+    title: 'Components/Feedback/bs-empty-state',
     parameters: { docs: { description: { component: componentDescription('bs-empty-state') } } },
     argTypes: {
         heading: { control: 'text' },

package/dist/collection/components/bs-error-page/bs-error-page.js

@@ -65,7 +65,7 @@ export class BsErrorPage {
         const primary = this.primaryLabel ?? d.primary;
         const secondary = this.secondaryLabel ?? d.secondary;
         const level = Math.min(6, Math.max(1, Math.trunc(Number(this.headingLevel)) || 1));
-        return (h("bs-card", { key: '8aff9c8d96ef4b11da092a77ebf5825d15927352', part: "container", class: "bs-error-page", surface: "base" }, h("div", { key: '19257d7f087c9e129a100a233f2b347f91bf94e3', class: "bs-error-page__body" }, h("div", { key: '626069ac9658d54560ff3b7fe1ee33d4e61d2120', class: "bs-error-page__art-group" }, h("bs-icon-tile", { key: '906074042657ea36412905e28db696beb48fca20', part: "art", class: `bs-error-page__art ${d.info ? 'bs-error-page__art--info' : ''}`, intent: d.intent, size: "lg" }, h("slot", { key: '08e00c6308418f3de6cee8574bf59b59c7749853', name: "icon" }, d.glyph())), code && (h("span", { key: '927bc4a8cb649c62dae21c512d444b6bc5c5bae8', part: "code", class: "bs-error-page__code" }, code))), h(`h${level}`, { part: 'heading', class: { 'bs-error-page__heading': true } }, heading), description && (h("p", { key: '213c0da80e469597d3964b8b91d643dbcc11caf3', part: "description", class: "bs-error-page__description" }, description)), (primary || secondary) && (h("div", { key: '85c062187fab0d14c29a826649fe84b515caf791', part: "actions", class: "bs-error-page__actions" }, primary && (h("bs-button", { key: 'c884d4cb3a054b1be6b53cdefba6219ad47a577b', part: "primary", variant: "primary", onClick: () => this.bsPrimary.emit() }, primary)), secondary && (h("bs-button", { key: '3e36ee75d488483d9d9a5385cf6ff6d632e8fee3', part: "secondary", variant: "outlined", onClick: () => this.bsSecondary.emit() }, secondary)))), this.reference && (h("p", { key: '7bf4f351eda32d20c2529e166b02b1da66851c64', part: "reference", class: "bs-error-page__reference" }, this.reference)))));
+        return (h("bs-card", { key: '959ae769b28e34f8b2e7809d9995e62104137d35', part: "container", class: "bs-error-page", surface: "base" }, h("div", { key: '2c9e26e9a09f8fa5deb4b90087f21b11a147ba22', class: "bs-error-page__body" }, h("div", { key: 'b78be284e49c08a2ff3b42c7b21cb4ae082a88af', class: "bs-error-page__art-group" }, h("bs-icon-tile", { key: '39fdd05129fa456456a2a5d3ff5e45141c88b58b', part: "art", class: `bs-error-page__art ${d.info ? 'bs-error-page__art--info' : ''}`, intent: d.intent, size: "lg" }, h("slot", { key: 'b770488128fb8229b2e47966e0c63ee0e8a11499', name: "icon" }, d.glyph())), code && (h("span", { key: '0892446d1291ae8ac8c6954a6f667a6690793a5c', part: "code", class: "bs-error-page__code" }, code))), h(`h${level}`, { part: 'heading', class: { 'bs-error-page__heading': true } }, heading), description && (h("p", { key: 'ed69d26275e6233d5ab63aa9c3d5ae4559fa2c60', part: "description", class: "bs-error-page__description" }, description)), (primary || secondary) && (h("div", { key: '60efdbce69379afadb78c9447fd5fb25d251cae0', part: "actions", class: "bs-error-page__actions" }, primary && (h("bs-button", { key: '08ab35c6149a1c89b8a174395bc1634be79d535a', part: "primary", variant: "primary", onClick: () => this.bsPrimary.emit() }, primary)), secondary && (h("bs-button", { key: 'a4883e2c8fe7f1e19a868c2210d35bf39d03e08a', part: "secondary", variant: "outlined", onClick: () => this.bsSecondary.emit() }, secondary)))), this.reference && (h("p", { key: 'b99d0b503bbc103851829f41cc70c71d87b76fd5', part: "reference", class: "bs-error-page__reference" }, this.reference)))));
     }
     static get is() { return "bs-error-page"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-error-page/bs-error-page.stories.js

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { ifDefined } from "lit/directives/if-defined.js";
 import { componentDescription, propDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-error-page',
+    title: 'Components/Feedback/bs-error-page',
     parameters: { docs: { description: { component: componentDescription('bs-error-page') } } },
     render: args => html `
     <bs-error-page

package/dist/collection/components/bs-file-upload/bs-file-upload.js

@@ -112,7 +112,7 @@ export class BsFileUpload {
             this.handleFiles(files);
     };
     render() {
-        return (h("div", { key: 'a36d673f20523d6384240fa4cabac8389b57b29f', part: "dropzone", class: `bs-file-upload bs-file-upload--${this.direction} ${this.dragging ? 'bs-file-upload--dragging' : ''} ${this.disabled ? 'bs-file-upload--disabled' : ''}`, onDragEnter: this.onDragOver, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onDrop: this.onDrop }, h("div", { key: 'c769eb48169ccdea3d9b2ec461fc131be8deec6e', part: "icon", class: "bs-file-upload__icon" }, h("slot", { key: 'e09c8fe53baaf4a42171799ce3c26595fc214321', name: "icon" }, h(UploadIcon, { key: 'e7687bf38d08a9d650c424efecf4ab1cee2fdbbd' }))), h("div", { key: 'c437654a93b2d8bca60b1bf5e9d883cba66b9514', class: "bs-file-upload__content" }, h("div", { key: '36c4fa07235bdaf27401d23d064b53910505bb3b', class: "bs-file-upload__text" }, this.heading && (h("span", { key: '232df19561f275bd62c9829ebe70c1e6155a8ce0', part: "heading", class: "bs-file-upload__heading" }, this.heading)), this.description && (h("span", { key: '493bb2708692a92b669d75d1f0ab075e9fb41355', part: "description", id: "description", class: "bs-file-upload__description" }, this.description))), h("bs-button", { key: '7f2955d2054a30efeec35252f776028b06a390df', part: "browse", variant: "neutral", size: "sm", disabled: this.disabled, onClick: this.onBrowse }, this.buttonLabel)), h("input", { key: '367b7d2fbbbf7ddfe0ebc063d0cef22c8510e713', ref: el => (this.inputEl = el), class: "bs-file-upload__input", type: "file", hidden: true, tabindex: -1, accept: this.accept, multiple: this.multiple, disabled: this.disabled, "aria-describedby": this.description ? 'description' : undefined, onChange: this.onInputChange })));
+        return (h("div", { key: 'd54357deba77860925d31e4afc6fa461c5cda79f', part: "dropzone", class: `bs-file-upload bs-file-upload--${this.direction} ${this.dragging ? 'bs-file-upload--dragging' : ''} ${this.disabled ? 'bs-file-upload--disabled' : ''}`, onDragEnter: this.onDragOver, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onDrop: this.onDrop }, h("div", { key: '31a01730260ee7fc808d78f38d7b5b3a013d5f55', part: "icon", class: "bs-file-upload__icon" }, h("slot", { key: '8808f036a93739ee60394c4a7c7d3aaf59b0b154', name: "icon" }, h(UploadIcon, { key: 'c40b6bc26a59b9d15ffcc41df9a9deecca91e027' }))), h("div", { key: '728bac5a8c8270c33e6469664c40e2a521153710', class: "bs-file-upload__content" }, h("div", { key: '0d95caaeb98bbda8519614ee02161ea8fa13f089', class: "bs-file-upload__text" }, this.heading && (h("span", { key: 'cf383bfa3622108a08fc9382b8b36d911f9a35e8', part: "heading", class: "bs-file-upload__heading" }, this.heading)), this.description && (h("span", { key: 'bedcf6d80b3246fe8864151c649e4eb6e1f831d2', part: "description", id: "description", class: "bs-file-upload__description" }, this.description))), h("bs-button", { key: '3072c4dcd99973839e3aab145f27295e61ca227b', part: "browse", variant: "neutral", size: "sm", disabled: this.disabled, onClick: this.onBrowse }, this.buttonLabel)), h("input", { key: 'c41931e65ef8aecdc3f49dd7141f4f9aeae25dc0', ref: el => (this.inputEl = el), class: "bs-file-upload__input", type: "file", hidden: true, tabindex: -1, accept: this.accept, multiple: this.multiple, disabled: this.disabled, "aria-describedby": this.description ? 'description' : undefined, onChange: this.onInputChange })));
     }
     static get is() { return "bs-file-upload"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-file-upload/bs-file-upload.stories.js

@@ -2,7 +2,7 @@ import { html, render } from "lit";
 import { componentDescription, propDescription } from "../../stories-utils";
 const directions = ['horizontal', 'vertical'];
 const meta = {
-    title: 'Components/bs-file-upload',
+    title: 'Components/Forms/bs-file-upload',
     parameters: { docs: { description: { component: componentDescription('bs-file-upload') } } },
     render: args => html `
     <bs-file-upload

package/dist/collection/components/bs-file-upload-item/bs-file-upload-item.js

@@ -86,7 +86,7 @@ export class BsFileUploadItem {
     }
     render() {
         const removing = this.state === 'success';
-        return (h("div", { key: 'b3dfe347e900ba5f452e6d653f17b66956eba4b7', part: "item", class: `bs-file-upload-item bs-file-upload-item--${this.state}` }, h("div", { key: '619821ac9b479d7dc78d98fb0344942c1b205d53', part: "thumbnail", class: "bs-file-upload-item__thumbnail" }, h("slot", { key: '879934c913d92097e079faa64b05322720e28467', name: "thumbnail" }, this.thumbnailSrc ? (h("img", { class: "bs-file-upload-item__image", src: this.thumbnailSrc, alt: this.thumbnailAlt })) : (h(ImageIcon, null)))), h("div", { key: '54e8b1582cb66122a5a7d7a0125e2bd99df28f8f', class: "bs-file-upload-item__content" }, h("div", { key: '3d79114f91830c4f22586da37bfb4f3e71f8ee04', class: "bs-file-upload-item__meta" }, h("span", { key: '450b9ac9b96506884fdf8ebc50adb57055f5d4bd', part: "name", class: "bs-file-upload-item__name" }, this.fileName), this.fileSize && (h("span", { key: '0ee574ac068a6f4dbc2c59a9c9bac31ab9087001', part: "size", class: "bs-file-upload-item__size" }, this.fileSize))), this.renderStatus()), h("bs-icon-button", { key: 'bbb36dc36d633a7a3d9150df5d1992b1b3e356ce', part: "action", variant: "subtle", size: "lg", ariaLabel: removing ? this.removeLabel : this.cancelLabel, onClick: this.onAction }, removing ? h(TrashIcon, null) : h(CloseIcon, null))));
+        return (h("div", { key: '76c6eec0456ffea46333327b2758f4e90b4df15d', part: "item", class: `bs-file-upload-item bs-file-upload-item--${this.state}` }, h("div", { key: '1b79696442c06b562c3a5e004d85f52b11890704', part: "thumbnail", class: "bs-file-upload-item__thumbnail" }, h("slot", { key: '7c7436f2afaab8a6a642e7ead5b3568c88ac11d9', name: "thumbnail" }, this.thumbnailSrc ? (h("img", { class: "bs-file-upload-item__image", src: this.thumbnailSrc, alt: this.thumbnailAlt })) : (h(ImageIcon, null)))), h("div", { key: '112da43807c703eeba751a26e946196a4f014e91', class: "bs-file-upload-item__content" }, h("div", { key: 'ae7cb642892239fe199e62c08058bd9858f32641', class: "bs-file-upload-item__meta" }, h("span", { key: 'e0c3eea1f905470f471c76a53d28152b20d33fed', part: "name", class: "bs-file-upload-item__name" }, this.fileName), this.fileSize && (h("span", { key: '0836c13dc7e37379f42c700cb452fc5814d54e5a', part: "size", class: "bs-file-upload-item__size" }, this.fileSize))), this.renderStatus()), h("bs-icon-button", { key: '29f1eb7e8f057cc6bf3ed026ff0b7c5626ebf951', part: "action", variant: "subtle", size: "lg", ariaLabel: removing ? this.removeLabel : this.cancelLabel, onClick: this.onAction }, removing ? h(TrashIcon, null) : h(CloseIcon, null))));
     }
     static get is() { return "bs-file-upload-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-file-upload-item/bs-file-upload-item.stories.js

@@ -10,7 +10,7 @@ const hideOnAction = (ev) => {
     ev.currentTarget.style.display = 'none';
 };
 const meta = {
-    title: 'Components/bs-file-upload-item',
+    title: 'Components/Forms/bs-file-upload-item',
     parameters: { docs: { description: { component: componentDescription('bs-file-upload-item') } } },
     render: args => html `
     <bs-file-upload-item

package/dist/collection/components/bs-global-search/bs-global-search.js

@@ -342,10 +342,10 @@ export class BsGlobalSearch {
         const listId = `${this.id}-listbox`;
         const isList = this.status === 'default' || this.status === 'results';
         const showFooter = this.showFooter && isList;
-        return (h("div", { key: 'badb002b67175179a79d0bc9c1366632d4a0645e', class: "bs-global-search" }, h("div", { key: '1902883e1e2a341bb78d57b0c2efc0695e2d50cc', part: "field", class: "bs-global-search__field", role: "combobox", "aria-label": this.label || this.placeholder, "aria-expanded": String(this.open && showList), "aria-haspopup": "listbox", "aria-controls": this.open && showList ? listId : undefined, "aria-activedescendant": this.open && this.activeId ? this.activeId : undefined, onKeyDown: this.onKeyDown, onFocusin: () => this.setOpen(true), onClick: () => this.setOpen(true) }, h("bs-input", { key: 'b8f8c00f00eef0051252ea8bc5b9e7bc299dc04e', ref: el => (this.inputEl = el), type: "search", value: this.value, placeholder: this.placeholder, disabled: this.disabled, onBsInput: this.onInput })), this.open && (h("div", { key: '08102c3daa1c44ed47c141c7aa010fbe68d322f8', part: "panel", class: "bs-global-search__panel", onMouseDown: (ev) => ev.preventDefault(), onMouseOver: this.onPanelMouseOver }, isList && showList && (h("div", { key: 'b14315ba3ced12ea89f961b889fcd514720b331d', id: listId, class: "bs-global-search__list", role: "listbox", "aria-label": this.listLabel }, sections.map(s => {
+        return (h("div", { key: 'de908b4834fb2768314aece670e6f92dc0b8b516', class: "bs-global-search" }, h("div", { key: '6263cdf890dca0e36b263d29909e07d79b365f1c', part: "field", class: "bs-global-search__field", role: "combobox", "aria-label": this.label || this.placeholder, "aria-expanded": String(this.open && showList), "aria-haspopup": "listbox", "aria-controls": this.open && showList ? listId : undefined, "aria-activedescendant": this.open && this.activeId ? this.activeId : undefined, onKeyDown: this.onKeyDown, onFocusin: () => this.setOpen(true), onClick: () => this.setOpen(true) }, h("bs-input", { key: '8a60460c8df0a45edb262f6d7f077cc15d8705ff', ref: el => (this.inputEl = el), type: "search", value: this.value, placeholder: this.placeholder, disabled: this.disabled, onBsInput: this.onInput })), this.open && (h("div", { key: '52b1a17c333182757023c92fc97b8af30c5878e6', part: "panel", class: "bs-global-search__panel", onMouseDown: (ev) => ev.preventDefault(), onMouseOver: this.onPanelMouseOver }, isList && showList && (h("div", { key: 'e9bf01e0294183cfb518327fce070de74d8c6bee', id: listId, class: "bs-global-search__list", role: "listbox", "aria-label": this.listLabel }, sections.map(s => {
             const hid = `${this.id}-h-${s}`;
             return (h("div", { part: "section", class: "bs-global-search__section", role: "group", "aria-labelledby": hid }, h("div", { part: "section-header", id: hid, class: "bs-global-search__section-header" }, this.sectionLabel(s)), h("slot", { name: s })));
-        }))), this.status === 'empty' && this.renderStateBlock('empty'), this.status === 'error' && this.renderStateBlock('error'), showFooter && this.renderFooter())), h("span", { key: 'c5acca23be3dab4b04a2590f079973fef8ac28c1', class: "bs-global-search__live", "aria-live": "polite" }, this.announcement())));
+        }))), this.status === 'empty' && this.renderStateBlock('empty'), this.status === 'error' && this.renderStateBlock('error'), showFooter && this.renderFooter())), h("span", { key: 'b71973514a9676083122a92c3534ec7ddfcbc1ae', class: "bs-global-search__live", "aria-live": "polite" }, this.announcement())));
     }
     static get is() { return "bs-global-search"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-global-search/bs-global-search.stories.js

@@ -47,7 +47,7 @@ const searchInItems = () => SEARCH_IN.map(s => html `<bs-search-item slot="searc
 const meta = {
     // The shared story data constants are exported for the tests; keep them out of the sidebar.
     excludeStories: /^[A-Z0-9_]+$/,
-    title: 'Components/bs-global-search',
+    title: 'Components/Navigation/bs-global-search',
     parameters: { layout: 'padded', docs: { description: { component: componentDescription('bs-global-search') } } },
     argTypes: {
         value: { control: 'text' },

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

@@ -59,12 +59,12 @@ export class BsGrid {
         const row = this.rowGap ? this.token(this.rowGap) : gapValue;
         const col = this.columnGap ? this.token(this.columnGap) : gapValue;
         const align = ALIGNS.includes(this.align) ? this.align : 'stretch';
-        return (h("div", { key: '9507109de1fe2a61cb12fdf10249eea822aca4fd', class: "bs-grid", part: "container", style: {
+        return (h("div", { key: '6eb1a4c6cc206966b652daf26406d3b55c2dae23', class: "bs-grid", part: "container", style: {
                 gridTemplateColumns: this.template(),
                 rowGap: `var(--bs-grid-row-gap, ${row})`,
                 columnGap: `var(--bs-grid-column-gap, ${col})`,
                 alignItems: align,
-            } }, h("slot", { key: '71f053d7d6be8bc917c44bec3a0c2f220836322c' })));
+            } }, h("slot", { key: '202c36abcef55d2982f4a2b35563a7fe43308e64' })));
     }
     static get is() { return "bs-grid"; }
     static get encapsulation() { return "shadow"; }

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

@@ -5,7 +5,7 @@ const cell = (n, h = 64) => html `
   <div style="background: var(--bs-surface-container); padding: var(--bs-spacing-200); height: ${h}px">Item ${n}</div>
 `;
 const meta = {
-    title: 'Components/bs-grid',
+    title: 'Components/Layout/bs-grid',
     parameters: { docs: { description: { component: componentDescription('bs-grid') } } },
     render: args => html `
     <bs-grid

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

@@ -31,7 +31,7 @@ export class BsHeading {
         const level = Math.min(6, Math.max(1, Number(this.level) || 2));
         const Tag = (this.as ?? `h${level}`);
         const size = this.size ?? String(level);
-        return (h(Tag, { key: 'd30a0c74c61d89c6acaba89ef5133bdb4c9598aa', part: "heading", class: `bs-heading bs-heading--${size}` }, h("slot", { key: 'c9ec8694882323cc5dd98e771c70c296902d29e8' })));
+        return (h(Tag, { key: 'ad994ea3888c1d9c1a51677ac350f81590ad1a75', part: "heading", class: `bs-heading bs-heading--${size}` }, h("slot", { key: 'f9a5595d9b9d5ace4c9bbef398d94fb1164081d1' })));
     }
     static get is() { return "bs-heading"; }
     static get encapsulation() { return "shadow"; }

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

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { ifDefined } from "lit/directives/if-defined.js";
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-heading',
+    title: 'Components/Typography and media/bs-heading',
     parameters: { docs: { description: { component: componentDescription('bs-heading') } } },
     render: args => html `<bs-heading level=${args.level} size=${ifDefined(args.size || undefined)} tone=${args.tone}>${args.text}</bs-heading>`,
     argTypes: {

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

@@ -40,7 +40,7 @@ export class BsIcon {
         const filled = typeof markup === 'object';
         const inner = typeof markup === 'string' ? markup : markup?.body;
         const labelled = !!this.label;
-        return (h("span", { key: '92c14176ca0b3ae936d5a34103c7e8fb5fb797fa', part: "icon", class: "bs-icon", role: labelled ? 'img' : undefined, "aria-label": labelled ? this.label : undefined, "aria-hidden": labelled ? undefined : 'true' }, markup ? (h("svg", { viewBox: filled ? markup.viewBox : '0 0 24 24', fill: filled ? 'currentColor' : 'none', stroke: filled ? undefined : 'currentColor', "stroke-width": filled ? undefined : '2', "stroke-linecap": filled ? undefined : 'round', "stroke-linejoin": filled ? undefined : 'round', "aria-hidden": "true", focusable: "false", ref: (svg) => {
+        return (h("span", { key: '8c4cccfecdf14d66fff16ae8222dea030615e64b', part: "icon", class: "bs-icon", role: labelled ? 'img' : undefined, "aria-label": labelled ? this.label : undefined, "aria-hidden": labelled ? undefined : 'true' }, markup ? (h("svg", { viewBox: filled ? markup.viewBox : '0 0 24 24', fill: filled ? 'currentColor' : 'none', stroke: filled ? undefined : 'currentColor', "stroke-width": filled ? undefined : '2', "stroke-linecap": filled ? undefined : 'round', "stroke-linejoin": filled ? undefined : 'round', "aria-hidden": "true", focusable: "false", ref: (svg) => {
                 if (svg && svg.innerHTML !== inner)
                     svg.innerHTML = inner;
             } })) : (h("slot", null))));

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

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const NAMES = ['menu', 'arrow-right', 'arrow-left', 'check', 'close', 'chevron-down', 'external-link', 'copy', 'search'];
 const meta = {
-    title: 'Components/bs-icon',
+    title: 'Components/Typography and media/bs-icon',
     parameters: { docs: { description: { component: componentDescription('bs-icon') } } },
     render: args => html `<bs-icon name=${args.name} size=${args.size} tone=${args.tone} label=${args.label || ''}></bs-icon>`,
     argTypes: {

package/dist/collection/components/bs-icon-tile/bs-icon-tile.js

@@ -46,8 +46,8 @@ export class BsIconTile {
     render() {
         const labelled = !!this.label;
         return [
-            h("div", { key: 'bf6404159383eea8bc502471fe9050b3b756b44b', part: "container", class: "bs-icon-tile", role: labelled ? 'img' : undefined, "aria-label": labelled ? this.label : undefined, "aria-hidden": labelled ? undefined : 'true' }, h("span", { key: '68388ac2d1736c4f988aa4891ba98ed782e8e73e', part: "icon", class: "bs-icon-tile__icon" }, h("slot", { key: '63912e42c3858d1c893cd648772f014c1a9e0a0c', onSlotchange: (ev) => (this.hasCustomIcon = hasContent(ev.target)) }), !this.hasCustomIcon && (GLYPHS[this.intent] ?? GLYPHS.default))),
-            h("span", { key: '5e33734bd960efbd3432ad827261bed80fa60e76', part: "text", class: { 'bs-icon-tile__text': true, 'bs-icon-tile__text--visible': this.hasText } }, h("slot", { key: '09f2d6c09e4592f6796187fd320ddbc6058f255e', name: "text", onSlotchange: (ev) => (this.hasText = ev.target.assignedNodes().length > 0) })),
+            h("div", { key: 'a9269d578576879e678be7f9b446b48433b7fd67', part: "container", class: "bs-icon-tile", role: labelled ? 'img' : undefined, "aria-label": labelled ? this.label : undefined, "aria-hidden": labelled ? undefined : 'true' }, h("span", { key: '299f4298a3fd52db71f49ed4a2f85367049dc91a', part: "icon", class: "bs-icon-tile__icon" }, h("slot", { key: '169432812651904452a6829bbfaf887d6d5524d3', onSlotchange: (ev) => (this.hasCustomIcon = hasContent(ev.target)) }), !this.hasCustomIcon && (GLYPHS[this.intent] ?? GLYPHS.default))),
+            h("span", { key: '6275125b69e1273ef26ca56193ce3d9be8349d86', part: "text", class: { 'bs-icon-tile__text': true, 'bs-icon-tile__text--visible': this.hasText } }, h("slot", { key: 'fdc51493b1c2dca36c3fa556d93ec2d5539094a8', name: "text", onSlotchange: (ev) => (this.hasText = ev.target.assignedNodes().length > 0) })),
         ];
     }
     static get is() { return "bs-icon-tile"; }

package/dist/collection/components/bs-icon-tile/bs-icon-tile.stories.js

@@ -4,7 +4,7 @@ import { componentDescription, propDescription } from "../../stories-utils";
 const INTENTS = ['default', 'success', 'warning', 'error', 'brand', 'information'];
 const SIZES = ['sm', 'md', 'lg'];
 const meta = {
-    title: 'Components/bs-icon-tile',
+    title: 'Components/Typography and media/bs-icon-tile',
     parameters: { docs: { description: { component: componentDescription('bs-icon-tile') } } },
     render: args => html `<bs-icon-tile size=${args.size} intent=${args.intent} label=${ifDefined(args.label || undefined)}></bs-icon-tile>`,
     argTypes: {

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

@@ -716,10 +716,10 @@ export class BsInput {
         return (h("div", { part: "field", class: `bs-input__field bs-input__field--pin ${errorClass} ${disabledClass}` }, Array.from({ length: this.length }).map((_, i) => (h("input", { id: i === 0 ? 'control' : undefined, ref: el => (this.pinInputs[i] = el), part: "control", class: "bs-input__pin-cell", type: "text", inputMode: "numeric", maxLength: 1, "aria-label": i === 0 && this.label ? undefined : this.pinCellLabel.replace('{n}', String(i + 1)).replace('{total}', String(this.length)), value: this.value[i] ?? '', disabled: this.disabled, "aria-required": this.required ? 'true' : undefined, onInput: this.onPinInput(i), onKeyDown: this.onPinKeydown(i) })))));
     }
     render() {
-        return (h("div", { key: '2607d492f534549e07c0f03474452e57ee8d1e62', class: `bs-input ${this.error ? 'bs-input--error' : ''}` }, this.label && (
+        return (h("div", { key: '1882c70d76bc2568e556455416dc0c899865b6fe', class: `bs-input ${this.error ? 'bs-input--error' : ''}` }, this.label && (
         // "control" is a fixed id, not a generated one -- safe because Shadow DOM scopes ids
         // to this instance's own shadow root, so it can never collide with another bs-input.
-        h("label", { key: '6c8d72b986a0ca92360778318c66dc66753737b5', part: "label", class: "bs-input__label", htmlFor: "control" }, this.label, this.required && (h("span", { key: '2a37224b19126d5de000592dec29f366a0298630', part: "required", class: "bs-input__required", "aria-hidden": "true" }, "*")))), this.type === 'pin' ? this.renderPinField() : this.type === 'initials' ? this.renderInitialsField() : this.type === 'country' ? this.renderCountryField() : this.renderField(), this.error ? (h("span", { id: "description-or-error", part: "error", class: "bs-input__error" }, h("svg", { part: "error-icon", class: "bs-input__error-icon", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", "stroke-width": "1.2" }), h("path", { d: "M8 5V8.5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round" }), h("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })), this.error)) : this.description ? (h("span", { id: "description-or-error", part: "description", class: "bs-input__description" }, this.description)) : null));
+        h("label", { key: 'b43d44bc4466727e37c338ffdbe03a67d85732f1', part: "label", class: "bs-input__label", htmlFor: "control" }, this.label, this.required && (h("span", { key: '1faee1b28110c38ee1ab58272a4f55403c3eb075', part: "required", class: "bs-input__required", "aria-hidden": "true" }, "*")))), this.type === 'pin' ? this.renderPinField() : this.type === 'initials' ? this.renderInitialsField() : this.type === 'country' ? this.renderCountryField() : this.renderField(), this.error ? (h("span", { id: "description-or-error", part: "error", class: "bs-input__error" }, h("svg", { part: "error-icon", class: "bs-input__error-icon", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", "stroke-width": "1.2" }), h("path", { d: "M8 5V8.5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round" }), h("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })), this.error)) : this.description ? (h("span", { id: "description-or-error", part: "description", class: "bs-input__description" }, this.description)) : null));
     }
     static get is() { return "bs-input"; }
     static get encapsulation() { return "shadow"; }

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

@@ -14,7 +14,7 @@ const chevronIcon = html `
   </svg>
 `;
 const meta = {
-    title: 'Components/bs-input',
+    title: 'Components/Forms/bs-input',
     parameters: { docs: { description: { component: componentDescription('bs-input') } } },
     render: args => html `
     <bs-input

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

@@ -38,7 +38,7 @@ export class BsKey {
         this.hasIcon = ev.target.assignedNodes().length > 0;
     };
     render() {
-        return (h("kbd", { key: '696939056f306280e640f5bfb9a23d3282fd3bdd', part: "container", class: "bs-key" }, !this.hasIcon && (h("span", { key: 'b51ef1e566756374c22ecbd5d744bef23e25efd8', part: "label", class: "bs-key__label" }, h("slot", { key: 'c12e9f373c0da8c981bf13107f464407bb28f5a4' }, this.label))), h("span", { key: 'a0f88845c5a4ebfd6695f23eb204492862620a4d', part: "icon", class: { 'bs-key__icon': true, 'bs-key__icon--hidden': !this.hasIcon } }, h("slot", { key: '5a4209c004c9c30523c7128a61cd7f082a77a06d', name: "icon", onSlotchange: this.onIconSlotChange }))));
+        return (h("kbd", { key: '8f4ca3f50f2464d970208aa23d07c497e25b839f', part: "container", class: "bs-key" }, !this.hasIcon && (h("span", { key: '7c7c3aea3a6baeb84e13cbb2eb50e9769041e927', part: "label", class: "bs-key__label" }, h("slot", { key: 'b86ab0689019b428cdcbd26e629c9ebedc263680' }, this.label))), h("span", { key: 'eca76a851440adff0c72811cf0a1ea3fa34c3ab2', part: "icon", class: { 'bs-key__icon': true, 'bs-key__icon--hidden': !this.hasIcon } }, h("slot", { key: '40bd8bee7efbc18a452b009c26186c8bb1e9277b', name: "icon", onSlotchange: this.onIconSlotChange }))));
     }
     static get is() { return "bs-key"; }
     static get encapsulation() { return "shadow"; }

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

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const RETURN_ICON = html `<svg slot="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 14 4 9l5-5" /><path d="M4 9h10.5a5.5 5.5 0 0 1 0 11H11" /></svg>`;
 const meta = {
-    title: 'Components/bs-key',
+    title: 'Components/Data display/bs-key',
     parameters: { docs: { description: { component: componentDescription('bs-key') } } },
     render: args => html `<bs-key label=${args.label}></bs-key>`,
     argTypes: { label: { control: 'text' } },

package/dist/collection/components/bs-key-caps/bs-key-caps.js

@@ -41,7 +41,7 @@ export class BsKeyCaps {
     render() {
         const keys = this.keyList();
         const name = this.label ?? (keys.length ? keys.join(' plus ') : undefined);
-        return (h("span", { key: '46f3da326c7901ced8a486f32d552a28ac394c77', part: "container", class: "bs-key-caps", role: "group", "aria-label": name, "aria-disabled": this.disabled ? 'true' : undefined }, keys.map(k => (h("bs-key", { label: k }))), h("slot", { key: '072587ad1177338f6477d589431a7bb9d961963a' })));
+        return (h("span", { key: '55a40d29ca5e3de2c3b54c00ec7e06bc5da19b27', part: "container", class: "bs-key-caps", role: "group", "aria-label": name, "aria-disabled": this.disabled ? 'true' : undefined }, keys.map(k => (h("bs-key", { label: k }))), h("slot", { key: 'def7a994773d31c5686deb7bbc3e26b67975e7c7' })));
     }
     static get is() { return "bs-key-caps"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-key-caps/bs-key-caps.stories.js

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const RETURN_ICON = html `<svg slot="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 14 4 9l5-5" /><path d="M4 9h10.5a5.5 5.5 0 0 1 0 11H11" /></svg>`;
 const meta = {
-    title: 'Components/bs-key-caps',
+    title: 'Components/Data display/bs-key-caps',
     parameters: { docs: { description: { component: componentDescription('bs-key-caps') } } },
     render: args => html `<bs-key-caps keys=${args.keys} ?disabled=${args.disabled}></bs-key-caps>`,
     argTypes: { keys: { control: 'text' }, disabled: { control: 'boolean' } },

package/dist/collection/components/bs-keyboard-shortcuts/bs-keyboard-shortcuts.js

@@ -129,10 +129,10 @@ export class BsKeyboardShortcuts {
         const headId = `${this.id}-heading`;
         const noResults = count === 0 && (this.query ?? '').trim() !== '';
         let gi = 0;
-        return (h("bs-card", { key: 'a5053480ccd41dd6d915a47cb7745b3932ba9931', part: "container", class: "bs-keyboard-shortcuts", surface: "base", role: "region", "aria-labelledby": headId, onKeyDown: this.onKeyDown }, h("div", { key: '8b6e9c7bf16a6cb0e2d81243ae60106cb52c49a4', class: "bs-keyboard-shortcuts__body" }, h("div", { key: 'fbdb6317e9c0e8a270bc5f9fb713654f68796b8f', part: "head", class: "bs-keyboard-shortcuts__head" }, h("svg", { key: '16342385b62757c866386cf0b692ec15cf8dc28c', class: "bs-keyboard-shortcuts__icon", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "1.8", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("rect", { key: '6337f691c61999614a84f501c056aae96c6d5d08', x: "2", y: "5", width: "20", height: "14", rx: "2" }), h("path", { key: 'adfff1e7dbff765e0b14b3676119fa6c4be3b159', d: "M6 9h.01M10 9h.01M14 9h.01M18 9h.01M6 13h.01M18 13h.01M9 15.5h6" })), h("h4", { key: 'f5cb2b86082b0e8c50d19da03f398767889a39ba', part: "heading", id: headId, class: "bs-keyboard-shortcuts__heading" }, h("slot", { key: '3839ba626c94bada3ba752e0cbacf96d8a5f0738', name: "heading" }, this.heading)), h("bs-icon-button", { key: '70a67f9f43899e59fff392968335fec6d1cf4b2d', part: "close", variant: "subtle", size: "md", "aria-label": this.closeLabel, onClick: () => this.bsClose.emit() }, h("svg", { key: '186d78eca1df5cac3c80a8dcfbf66d2301f3165b', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "aria-hidden": "true" }, h("path", { key: '8099ce12121ea5340cb578f1f2e338af2f909087', d: "M6 6l12 12M18 6 6 18" })))), h("bs-input", { key: 'dd0a5e9f35849c13499e18d458ddeb1153a9bb2a', part: "search", type: "search", placeholder: this.searchPlaceholder, value: this.query, onBsInput: this.onInput }), this.showSingleKeySwitch && (h("div", { key: '88584be755995426dfa0c33a81f8c68dc4f0b65d', part: "switch", class: "bs-keyboard-shortcuts__switch" }, h("div", { key: '7a530f7760d6593a5ab031636b6ed93bfdf3e9bf', class: "bs-keyboard-shortcuts__switch-text" }, h("span", { key: '992e5d015f9195d7577e38f18ffeaf169b626d7d', class: "bs-keyboard-shortcuts__switch-title" }, this.singleKeyLabel), h("span", { key: 'f6f29ec213290f68aaa5a09f7b1e4f00eb77b3b4', class: "bs-keyboard-shortcuts__switch-caption" }, this.singleKeyDescription)), h("bs-switch", { key: '9e9531d7bebf08f84c8d5d238ab90072683a9172', ariaLabel: this.singleKeyLabel, checked: this.singleKeyEnabled, onBsChange: this.onSwitch }))), h("span", { key: '4c9bbb0b4f6fadec2c63c5b8b4ec1ad7dea9f000', class: "bs-keyboard-shortcuts__live", "aria-live": "polite" }, `${count} shortcut${count === 1 ? '' : 's'}`), noResults ? (h("p", { part: "empty", class: "bs-keyboard-shortcuts__empty", role: "status" }, this.noResultsText)) : (h("div", { part: "groups", class: "bs-keyboard-shortcuts__groups" }, cols.map(col => (h("div", { class: "bs-keyboard-shortcuts__column" }, col.map(g => {
+        return (h("bs-card", { key: '2bdb50736e8d45ed9ac40d03748507b76eb9a1be', part: "container", class: "bs-keyboard-shortcuts", surface: "base", role: "region", "aria-labelledby": headId, onKeyDown: this.onKeyDown }, h("div", { key: '9c1950b3cb4b6f07c6cd9070083238156e1e5a50', class: "bs-keyboard-shortcuts__body" }, h("div", { key: 'be8c893559445a69879471afff074384ede621bf', part: "head", class: "bs-keyboard-shortcuts__head" }, h("svg", { key: '9a59710d9e82ffc5fa665c6c30858a36016a6914', class: "bs-keyboard-shortcuts__icon", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "1.8", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("rect", { key: 'c26c4799875d84bcd59f1853674d435b59fc0536', x: "2", y: "5", width: "20", height: "14", rx: "2" }), h("path", { key: '67a1d8d57655b48a8f75785dfee79bf27fb13628', d: "M6 9h.01M10 9h.01M14 9h.01M18 9h.01M6 13h.01M18 13h.01M9 15.5h6" })), h("h4", { key: '6c2a6e3f4dfb71811339d41b189818f6fbeecbe3', part: "heading", id: headId, class: "bs-keyboard-shortcuts__heading" }, h("slot", { key: '181683ab9371e00d282c29a3606332ca5c85dce8', name: "heading" }, this.heading)), h("bs-icon-button", { key: '12401e81656f71df56968def81fe91cc33268c5a', part: "close", variant: "subtle", size: "md", "aria-label": this.closeLabel, onClick: () => this.bsClose.emit() }, h("svg", { key: '09934da82b18e37fa119d1ea9004833a02be13aa', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "aria-hidden": "true" }, h("path", { key: '1fdef5b3a757435a08b4f6aec174c90fcfc53ca8', d: "M6 6l12 12M18 6 6 18" })))), h("bs-input", { key: '818ca74e0cacfcfcd6a02db120efd9b2eee7ce9d', part: "search", type: "search", placeholder: this.searchPlaceholder, value: this.query, onBsInput: this.onInput }), this.showSingleKeySwitch && (h("div", { key: '5af576415bdaa91eca070fda99565a05e00e1d71', part: "switch", class: "bs-keyboard-shortcuts__switch" }, h("div", { key: '52f138164d5f25c9fb284fa8033d386ca06a1df5', class: "bs-keyboard-shortcuts__switch-text" }, h("span", { key: '40a0abcb9539a13341232fe09bde09ff697d88e1', class: "bs-keyboard-shortcuts__switch-title" }, this.singleKeyLabel), h("span", { key: '9e244b16c92625a150c2dbaa396ba90ae310b2b5', class: "bs-keyboard-shortcuts__switch-caption" }, this.singleKeyDescription)), h("bs-switch", { key: '44bd3294e8927d9dfdf68d37e2c978a826410d0d', ariaLabel: this.singleKeyLabel, checked: this.singleKeyEnabled, onBsChange: this.onSwitch }))), h("span", { key: '8d387e7ba82d68ad2cec939d67f939be9c2234ce', class: "bs-keyboard-shortcuts__live", "aria-live": "polite" }, `${count} shortcut${count === 1 ? '' : 's'}`), noResults ? (h("p", { part: "empty", class: "bs-keyboard-shortcuts__empty", role: "status" }, this.noResultsText)) : (h("div", { part: "groups", class: "bs-keyboard-shortcuts__groups" }, cols.map(col => (h("div", { class: "bs-keyboard-shortcuts__column" }, col.map(g => {
             const tid = `${this.id}-g${gi++}`;
             return (h("div", { part: "group", class: "bs-keyboard-shortcuts__group", role: "group", "aria-labelledby": tid }, h("div", { part: "group-title", id: tid, class: "bs-keyboard-shortcuts__group-title" }, g.title), h("div", { class: "bs-keyboard-shortcuts__rows", role: "list" }, g.shortcuts.map(s => (h("bs-shortcut-row", { part: "row", action: s.action, keys: s.keys, selectionRole: "listitem", disabled: !!s.disabled || (!this.singleKeyEnabled && isSingleKey(s)) }))))));
-        })))))), this.showFooterHint && (h("div", { key: '021ae63bd1633851bc032eb5f22eecfa468a5c68', part: "footer", class: "bs-keyboard-shortcuts__footer" }, h("slot", { key: 'cff2d6f675a885c11b47a3d8fa742397f3c20003', name: "footer" }, h("span", { key: '531c8be2c0afddf6b2aa038b79983f0299baaec9' }, this.footerPrefix), h("bs-key", { key: 'e4a4c98c0cebd3c7436e095a86225e7aa31e492c', label: this.footerKey }), h("span", { key: 'bc4cb7dec5d3c24b2a7058b5da2c8ad2c62e056d' }, this.footerText)))))));
+        })))))), this.showFooterHint && (h("div", { key: '0fb23ea10f8220759ce39c6099d35c9ac3495ace', part: "footer", class: "bs-keyboard-shortcuts__footer" }, h("slot", { key: 'a52faff702a65bc62e655d23b63ddca05c906dfd', name: "footer" }, h("span", { key: '36ede16f65363311b87cbe3ac2f5d1455603d70e' }, this.footerPrefix), h("bs-key", { key: '6bf290a60780b2287939c5a3143c788422f445fc', label: this.footerKey }), h("span", { key: '9c27d390eb2f5fae1bfbd8c2816bf0f0050d1cca' }, this.footerText)))))));
     }
     static get is() { return "bs-keyboard-shortcuts"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-keyboard-shortcuts/bs-keyboard-shortcuts.stories.js

@@ -54,7 +54,7 @@ export const FILTERED_GROUPS = [
 const meta = {
     // The shared SHORTCUT_GROUPS data constants are exported for the other stories; keep them out of the sidebar.
     excludeStories: /^[A-Z0-9_]+$/,
-    title: 'Components/bs-keyboard-shortcuts',
+    title: 'Components/Data display/bs-keyboard-shortcuts',
     parameters: { docs: { description: { component: componentDescription('bs-keyboard-shortcuts') } } },
     argTypes: {
         query: { control: 'text' },

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

@@ -54,7 +54,7 @@ export class BsLink {
         const newTab = this.target === '_blank';
         const showIcon = this.external || newTab;
         const rel = this.rel ?? (newTab ? 'noopener noreferrer' : undefined);
-        return (h("a", { key: 'abc72ce657667f084a11086e2ddee9f764979cd7', part: "link", class: `bs-link bs-link--${this.variant}`, href: this.href, target: this.target, rel: rel, "aria-label": this.ariaLabel, "aria-current": this.current ? 'page' : undefined, onClick: this.onClick }, h("span", { key: '1afba0c22b50f07300b1b431434ca3f9b38a7b33', part: "label", class: "bs-link__label" }, h("slot", { key: 'dcfa6947cfd6821b4810624a87c5d5cb3d270282' })), newTab && h("span", { key: '1faaa4ea78634a7bb2d44f160564d87408c3e79b', class: "bs-link__sr" }, this.externalLabel), showIcon && (h("svg", { key: '889b39655b35270de1fd4ef966fca9077a140935', part: "icon", class: "bs-link__icon", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'd5393bd505b27536bc19c86d7d21f674d7a75704', d: "M9 3h4v4M13 3L7.5 8.5M12 9v3a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h3", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
+        return (h("a", { key: 'c67ebccfd8ae853888e01bda7921685ff8343ff7', part: "link", class: `bs-link bs-link--${this.variant}`, href: this.href, target: this.target, rel: rel, "aria-label": this.ariaLabel, "aria-current": this.current ? 'page' : undefined, onClick: this.onClick }, h("span", { key: 'e73117100dd02185da4ce70fbb21d5eaa6aaa6b1', part: "label", class: "bs-link__label" }, h("slot", { key: '2a6c2f7594b522efc53c6377160471ecdb1a1bf1' })), newTab && h("span", { key: 'e0d679623ace072d5d18ec65087cfecad6d30389', class: "bs-link__sr" }, this.externalLabel), showIcon && (h("svg", { key: 'ff1f095010f8007d486640583b2617e2a762497b', part: "icon", class: "bs-link__icon", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: '5ae56bdaacf0236928fbe6ad64ae72ac0e1ef5c7', d: "M9 3h4v4M13 3L7.5 8.5M12 9v3a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h3", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }
     static get is() { return "bs-link"; }
     static get encapsulation() { return "shadow"; }

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

@@ -2,7 +2,7 @@ import { html } from "lit";
 import { componentDescription, propDescription } from "../../stories-utils";
 const variants = ['inline', 'standalone', 'button'];
 const meta = {
-    title: 'Components/bs-link',
+    title: 'Components/Actions/bs-link',
     parameters: { docs: { description: { component: componentDescription('bs-link') } } },
     render: args => html `
     <bs-link variant=${args.variant} href=${args.href} target=${args.target || undefined} ?external=${args.external} ?current=${args.current}>${args.label}</bs-link>

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

@@ -104,7 +104,7 @@ export class BsList {
         enabled[next].focus();
     }
     render() {
-        return (h("div", { key: 'f117bd6ecbbfc4571684dfa2ebea07ea70723672', part: "list", class: "bs-list", role: this.selectable ? 'listbox' : 'list', "aria-label": this.ariaLabel ?? undefined }, h("slot", { key: 'de9bf097921079f34f97bfbbbb19e2896c340de7', onSlotchange: () => this.sync() })));
+        return (h("div", { key: '4be1ca9577bdab3ee3a270c0cf95aa3e77debf4e', part: "list", class: "bs-list", role: this.selectable ? 'listbox' : 'list', "aria-label": this.ariaLabel ?? undefined }, h("slot", { key: '0f1fd3408bf906225b66159f3853c3238a872b6c', onSlotchange: () => this.sync() })));
     }
     static get is() { return "bs-list"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { html } from "lit";
 import { componentDescription } from "../../stories-utils";
 const meta = {
-    title: 'Components/bs-list',
+    title: 'Components/Data display/bs-list',
     parameters: { docs: { description: { component: componentDescription('bs-list') } } },
     argTypes: {
         selectable: { control: 'boolean' },