@brandsync/wc 1.18.0 → 1.20.0

package/dist/types/components/bs-chip/bs-chip-filter/bs-chip-filter.d.ts

@@ -19,6 +19,7 @@ export type BsChipFilterSize = 'md' | 'lg';
  * @part icon - The icon wrapper element.
  * @part label - The text label element.
  * @part caret - The dropdown caret wrapper element, when `dropdown` is set.
+ * @part ripple - The press-ripple layer (a `bs-ripple`). Tune it with `::part(ripple) { --bs-ripple-color: ...; }`.
  */
 export declare class BsChipFilter {
     el: HTMLElement;

package/dist/types/components/bs-chip/bs-chip-input/bs-chip-input.d.ts

@@ -22,6 +22,7 @@ export type BsChipInputSize = 'md' | 'lg';
  * @part icon - The icon wrapper element.
  * @part label - The text label element.
  * @part remove - The trailing remove button.
+ * @part ripple - The press-ripple layer (a `bs-ripple`). Tune it with `::part(ripple) { --bs-ripple-color: ...; }`.
  */
 export declare class BsChipInput {
     el: HTMLElement;

package/dist/types/components/bs-code-block/bs-code-block.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-code-block/bs-code-block.d.ts

@@ -0,0 +1,68 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * A block of code with an optional filename header and a Copy button, or (with `inline`) styled
+ * inline code. Dependency-free: it does no syntax highlighting itself. Pass plain text with `code`,
+ * or slot pre-highlighted markup (e.g. the output of Shiki or Prism: spans coloured with your own
+ * CSS) as the default slot.
+ *
+ * Follows light and dark mode through the surface/text tokens. Long lines scroll horizontally (the
+ * scroll area is keyboard focusable) or, with `wrap`, break onto the next line.
+ *
+ * Copying announces the `copiedLabel` text through a polite live region, and the button label
+ * changes to match for a few seconds.
+ *
+ * Slotted content: keep it flush against the tags (`<bs-code-block><span>..</span></bs-code-block>`),
+ * since whitespace in a `<pre>`-style block is kept. The line count for `lineNumbers` and the text
+ * that is copied are read from the slotted text.
+ *
+ * Composed from: `bs-card` (the surface), `bs-button` and `bs-icon` (the Copy button).
+ *
+ * ## When to use
+ * - Showing a snippet, command or config the reader may want to copy.
+ * - `inline` for a short code term inside a sentence.
+ *
+ * ## When not to use
+ * - Long files that need folding, search or editing: link to the source instead.
+ * - Pre-formatted prose or tables: use ordinary text and table markup.
+ *
+ * @slot - Pre-highlighted code (any markup). Ignored when `code` is set.
+ * @part container - The `bs-card` surface (block mode).
+ * @part header - The header row holding the filename and the Copy button.
+ * @part filename - The filename text.
+ * @part copy-button - The Copy `bs-button`.
+ * @part body - The scrollable code area.
+ * @part line-numbers - The line number gutter (when `lineNumbers` is set).
+ * @part code - The `code` element (block and inline).
+ */
+export declare class BsCodeBlock {
+    el: HTMLElement;
+    /** Plain-text code. When set it is shown (escaped) instead of the default slot, and is what Copy copies. */
+    code?: string;
+    /** Name shown at the left of the header, e.g. `app.config.ts` or `Terminal`. Also names the code region for assistive tech. */
+    filename?: string;
+    /** Show a line number gutter. Line numbers need unwrapped lines, so `wrap` is ignored while this is set. */
+    lineNumbers: boolean;
+    /** Wrap long lines instead of scrolling horizontally. */
+    wrap: boolean;
+    /** Render as inline code (a styled `<code>` inside a sentence): no header, no Copy button, no scrolling. */
+    inline: boolean;
+    /** Remove the Copy button. */
+    hideCopy: boolean;
+    /** Label of the Copy button. */
+    copyLabel: string;
+    /** Label of the Copy button after copying, and the text announced to assistive tech. */
+    copiedLabel: string;
+    /** Accessible name of the code region when there is no `filename`. */
+    regionLabel: string;
+    /** Emitted with the copied text after it was written to the clipboard. */
+    bsCopy: EventEmitter<string>;
+    copied: boolean;
+    slottedText: string;
+    private timer?;
+    componentWillLoad(): void;
+    disconnectedCallback(): void;
+    private text;
+    private onCopy;
+    private onSlotchange;
+    render(): any;
+}

package/dist/types/components/bs-code-block/bs-code-block.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsCodeBlockArgs {
+    code: string;
+    filename: string;
+    lineNumbers: boolean;
+    wrap: boolean;
+    hideCopy: boolean;
+}
+declare const meta: Meta<BsCodeBlockArgs>;
+export default meta;
+type Story = StoryObj<BsCodeBlockArgs>;
+export declare const Default: Story;
+export declare const LineNumbers: Story;
+export declare const NoHeaderName: Story;
+export declare const NoCopy: Story;
+export declare const LongLines: Story;
+export declare const PreHighlighted: Story;
+export declare const Inline: Story;

package/dist/types/components/bs-data-table/bs-data-table.d.ts

@@ -21,6 +21,14 @@ export type BsDataTableRow = Record<string, unknown> & {
  * - A handful of unrelated key/value pairs — a simple list or card is lighter-weight.
  * - Deeply nested/hierarchical data — this component renders one flat row per record.
  *
+ * ## Rich cells
+ * Without a `cellRenderer`, each cell is a named slot, `cell-{row.id}-{column.key}`, whose fallback
+ * content is the plain-text value. Slot an element into it to put app-owned content (a framework
+ * component, a router link, a badge) in the cell, e.g.
+ * `<a slot="cell-7-name" href="/people/7">Ada</a>`. The slotted element lives in the light DOM, so
+ * it keeps your framework, router and CSP; nothing is parsed as HTML.
+ *
+ * @slot cell-{row.id}-{column.key} - Content for one cell (see "Rich cells"). Falls back to the text value.
  * @part table - The `<table>` element.
  * @part head - The `<thead>` element.
  * @part body - The `<tbody>` element.
@@ -39,6 +47,9 @@ export declare class BsDataTable {
     /** Accessible name of the select-all checkbox in the header (when `selectable`). */
     selectAllLabel: string;
     selectable: boolean;
+    /** Alternates the row background (even rows use `--bs-data-table-stripe-bg`) so wide tables are
+     * easier to scan. Follows dark mode through the token. Row hover still wins. */
+    striped: boolean;
     /** Optional custom cell renderer, for rich cells such as a status badge, a link or an actions
      * column. It returns an **HTML string** that is inserted into the cell as real markup
      * (`innerHTML`), so links, buttons, `<img>` and other web components (e.g. `<bs-badge>`) all render.

package/dist/types/components/bs-description-item/bs-description-item.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-description-item/bs-description-item.d.ts

@@ -0,0 +1,34 @@
+/**
+ * One term and its detail inside a `bs-description-list` (a label/value pair such as "Owner: Sam Lee").
+ *
+ * ## When to use
+ * - As a child of `bs-description-list`, one per key/value pair.
+ *
+ * ## When not to use
+ * - Rows of records with media and actions -- use `bs-list-item`.
+ * - Many pairs compared across several records -- use `bs-data-table`.
+ *
+ * Each item renders its own `<dl>` containing one `<div>` group with a real `<dt>` and `<dd>`. (A `dl` cannot
+ * span the shadow boundary between a list and its items, so the grouping lives here.)
+ *
+ * @slot term - Rich content for the term (replaces `term`).
+ * @slot - Rich content for the detail (replaces `description`).
+ * @part container - The `dl`.
+ * @part term - The `dt`.
+ * @part description - The `dd`.
+ * @prop --bs-description-item-gap - Gap between term and detail when stacked. Aliased to `--bs-spacing-25`.
+ * @prop --bs-description-item-term-width - Width of the term column when `layout="horizontal"`. `12rem`.
+ * @prop --bs-description-item-column-gap - Gap between the term and detail columns when horizontal. Aliased to `--bs-spacing-200`.
+ * @prop --bs-description-item-padding-y - Vertical padding. Aliased to `--bs-spacing-100`.
+ * @prop --bs-description-item-term-color - Aliased to `--bs-text-secondary`.
+ * @prop --bs-description-item-description-color - Aliased to `--bs-text-default`.
+ */
+export declare class BsDescriptionItem {
+    /** The term (label). */
+    term?: string;
+    /** The detail (value). The default slot overrides it. */
+    description?: string;
+    /** Set by the parent `bs-description-list`: `stacked` (term above detail) or `horizontal` (side by side). */
+    layout: 'stacked' | 'horizontal';
+    render(): any;
+}

package/dist/types/components/bs-description-list/bs-description-list.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-description-list/bs-description-list.d.ts

@@ -0,0 +1,33 @@
+/**
+ * A key/value list of `bs-description-item` pairs (term and detail), for record summaries, settings read-outs
+ * and metadata panels. Terms and details use real `dt`/`dd` semantics.
+ *
+ * ## When to use
+ * - A read-only summary of one record: "Owner", "Created", "Status" with their values.
+ *
+ * ## When not to use
+ * - A list of records with media and actions -- use `bs-list`.
+ * - Editable fields -- use form components.
+ * - Several records compared across columns -- use `bs-data-table`.
+ *
+ * Built from `bs-description-item` children (light DOM; the list never moves nodes). Each item holds its own
+ * `dl`; the list sets the layout on them and draws dividers.
+ *
+ * @slot - The `bs-description-item` children.
+ * @part list - The list container (`role="group"`).
+ * @prop --bs-description-list-divider-color - Divider colour when `dividers` is set. Aliased to `--bs-border-neutral-container`.
+ * @prop --bs-description-list-gap - Gap between items. `0`.
+ */
+export declare class BsDescriptionList {
+    el: HTMLElement;
+    /** `stacked` puts each term above its detail; `horizontal` puts them side by side in two columns. */
+    layout: 'stacked' | 'horizontal';
+    /** Draws a 1px separator between items. */
+    dividers: boolean;
+    /** Accessible name of the group. */
+    ariaLabel: string | null;
+    onLayout(): void;
+    componentDidLoad(): void;
+    private sync;
+    render(): any;
+}

package/dist/types/components/bs-description-list/bs-description-list.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsDescriptionListArgs {
+    layout: 'stacked' | 'horizontal';
+    dividers: boolean;
+}
+declare const meta: Meta<BsDescriptionListArgs>;
+export default meta;
+type Story = StoryObj<BsDescriptionListArgs>;
+export declare const Default: Story;
+export declare const Stacked: Story;
+export declare const WithRichContent: Story;

package/dist/types/components/bs-dialog/bs-dialog.d.ts

@@ -33,8 +33,13 @@ export type BsDialogSize = 'sm' | 'md' | 'lg';
  * @part close - The close button (inline in the header, or floating -- see the class doc above).
  * @part body - The body content wrapper.
  * @part footer - The footer wrapper (only visible when the footer slot has content).
+ *
+ * Opening fades the backdrop in and lifts the dialog into place; closing plays the same motion in
+ * reverse before the dialog is removed. Length, curve and travel are `--bs-dialog-duration`,
+ * `--bs-dialog-easing` and `--bs-dialog-distance`. Under `prefers-reduced-motion: reduce` it is instant.
  */
 export declare class BsDialog {
+    el: HTMLElement;
     /** Mutable + reflected so the component can close itself (backdrop click, Escape, close button)
      * the same way a native `<dialog>` does, while still emitting `bsClose` for the consumer to react to. */
     open: boolean;
@@ -62,6 +67,15 @@ export declare class BsDialog {
     private onFooterSlotchange;
     private onImageSlotchange;
     private onIconSlotchange;
+    /** True while the exit motion plays after `open` went false, so the dialog stays mounted for it. */
+    closing: boolean;
+    private backdropRef?;
+    private enterPending;
+    private exitPending;
+    private motionRun;
+    onOpenChange(next: boolean): void;
+    private playEnter;
+    private playExit;
     private dialogRef?;
     private previouslyFocused?;
     private previousBodyOverflow?;

package/dist/types/components/bs-dropdown/bs-dropdown.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-dropdown/bs-dropdown.d.ts

@@ -0,0 +1,51 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { BsPopoverPlacement } from '../bs-popover/bs-popover';
+export type BsDropdownPlacement = BsPopoverPlacement;
+/**
+ * A menu trigger: a button (slot `trigger`) that opens a `bs-menu` of `bs-menu-item`s in an anchored,
+ * viewport-aware popup, with the menu keyboard pattern and focus management built in.
+ *
+ * Opens on click, Enter, Space (via the trigger button) and ArrowDown. On open focus moves to the
+ * first enabled menu item; Up/Down/Home/End move between items (handled by `bs-menu`). The dropdown
+ * closes on outside click, Escape (focus returns to the trigger), Tab, and after an item is activated.
+ * The trigger gets `aria-haspopup="menu"` and `aria-expanded` kept in sync.
+ *
+ * Composed from `bs-popover` (anchor positioning, flipping, outside-click and Escape dismissal, open
+ * motion), `bs-menu` and `bs-menu-item` (slotted by you), and a `bs-button` / `bs-icon-button` trigger.
+ *
+ * ## When to use
+ * - A header or toolbar action that reveals a short list of commands ("More", "Account", "Sort by").
+ *
+ * ## When not to use
+ * - Free-form popup content such as forms or arbitrary panels (use `bs-popover`).
+ * - Choosing a value for a form field (use `bs-select`).
+ *
+ * @slot trigger - The control that toggles the menu (a `bs-button` or `bs-icon-button`).
+ * @slot - Default slot: a `bs-menu` containing `bs-menu-item`s.
+ * @part popover - The underlying `bs-popover`; tune the popup with `::part(popover) { --bs-popover-min-width: ...; }`.
+ */
+export declare class BsDropdown {
+    el: HTMLElement;
+    /** Whether the menu is shown. */
+    open: boolean;
+    /** Where the menu sits relative to the trigger; flips to stay in the viewport. */
+    placement: BsDropdownPlacement;
+    /** Emitted after the menu opens. */
+    bsOpen: EventEmitter<void>;
+    /** Emitted after the menu closes (outside click, Escape, Tab, item activation or `open = false`). */
+    bsClose: EventEmitter<void>;
+    private triggerSlot?;
+    private focusRun;
+    onOpenChange(next: boolean): void;
+    componentDidLoad(): void;
+    /** Close after an item is activated; the item still emits its own `bsSelect` for the consumer. */
+    onItemSelect(): void;
+    /** Tab leaves the menu: close it and continue tabbing from the trigger. */
+    onKeyDown(ev: KeyboardEvent): void;
+    private trigger;
+    private syncTrigger;
+    private focusTrigger;
+    private focusFirstItem;
+    private onPopoverOpenChange;
+    render(): any;
+}

package/dist/types/components/bs-dropdown/bs-dropdown.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsDropdownArgs {
+    open: boolean;
+    placement: 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+}
+declare const meta: Meta<BsDropdownArgs>;
+export default meta;
+type Story = StoryObj<BsDropdownArgs>;
+export declare const Default: Story;
+export declare const Open: Story;
+export declare const BottomEnd: Story;
+export declare const FlipsNearViewportEdge: Story;

package/dist/types/components/bs-empty-state/bs-empty-state.d.ts

@@ -15,10 +15,12 @@ import type { BsIconTileIntent } from '../bs-icon-tile/bs-icon-tile';
  * - A full-page error with a status code -- use `bs-error-page`.
  * - A transient message -- use `bs-toast` or `bs-snackbar`.
  *
+ * @slot illustration - A larger illustration or image that replaces the icon tile (use with `size="page"`).
  * @slot icon - The glyph inside the icon tile (24px, `currentColor`). Falls back to the tile's intent glyph.
  * @slot - The description (overrides the `description` prop).
  * @slot action - An optional action, e.g. `<bs-button variant="outlined">`.
  * @part container - The centered column.
+ * @part illustration - The illustration wrapper (only rendered while the `illustration` slot is filled).
  * @part icon - The icon tile (`bs-icon-tile`).
  * @part heading - The heading element.
  * @part description - The description paragraph.
@@ -26,6 +28,7 @@ import type { BsIconTileIntent } from '../bs-icon-tile/bs-icon-tile';
  * @prop --bs-empty-state-padding-y - Vertical padding. Aliased to `--bs-spacing-700` (56px).
  * @prop --bs-empty-state-padding-x - Horizontal padding. Aliased to `--bs-spacing-300` (24px).
  * @prop --bs-empty-state-gap - Gap between tile, heading, description and action. Aliased to `--bs-spacing-150`.
+ * @prop --bs-empty-state-heading-size - Aliased to `--bs-font-size-xl` (`--bs-font-size-3xl` at `size="page"`).
  * @prop --bs-empty-state-heading-color - Aliased to `--bs-text-default`.
  * @prop --bs-empty-state-description-color - Aliased to `--bs-text-secondary`.
  */
@@ -39,7 +42,10 @@ export declare class BsEmptyState {
     intent: BsIconTileIntent;
     /** Heading level, 2 to 6 (renders `h2`..`h6`). Pick the one that fits the page outline. */
     headingLevel: 2 | 3 | 4 | 5 | 6;
+    /** `panel` (default) fits inside a card, table or section. `page` fills a whole view: more padding, a larger heading and a minimum height. */
+    size: 'panel' | 'page';
     hasIcon: boolean;
+    hasIllustration: boolean;
     hasDescriptionSlot: boolean;
     hasAction: boolean;
     private observer?;

package/dist/types/components/bs-empty-state/bs-empty-state.stories.d.ts

@@ -4,6 +4,7 @@ interface BsEmptyStateArgs {
     description: string;
     intent: 'default' | 'success' | 'warning' | 'error' | 'brand' | 'information';
     headingLevel: number;
+    size: 'panel' | 'page';
 }
 declare const meta: Meta<BsEmptyStateArgs>;
 export default meta;
@@ -11,3 +12,5 @@ type Story = StoryObj<BsEmptyStateArgs>;
 export declare const NoResults: Story;
 export declare const Error: Story;
 export declare const WithoutAction: Story;
+export declare const PageSize: Story;
+export declare const WithIllustration: Story;

package/dist/types/components/bs-heading/bs-heading.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-heading/bs-heading.d.ts

@@ -0,0 +1,34 @@
+export type BsHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+export type BsHeadingSize = 'display' | '1' | '2' | '3' | '4' | '5' | '6';
+export type BsHeadingTone = 'default' | 'secondary' | 'muted' | 'action' | 'success' | 'info' | 'warning' | 'error' | 'inverse' | 'inherit';
+export type BsHeadingAs = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'div' | 'span';
+/**
+ * A heading whose rendered element and visual style are chosen separately: `level` (or `as`) picks
+ * the element for the document outline, `size` picks the look. Sizes map to the typography tokens
+ * (`--bs-font-size-*`, `--bs-font-weight-*`, `--bs-line-height-*`, `--bs-typography-font-family-heading`).
+ *
+ * Default sizes by level: 1 = 40px, 2 = 32px, 3 = 24px, 4 = 20px, 5 = 18px, 6 = 16px; `display` is 48px.
+ *
+ * Composed from: nothing (leaf).
+ *
+ * ## When to use
+ * - Any page or section title. Keep levels in order (no jumping from 1 to 4); change `size`, not `level`, to restyle.
+ *
+ * ## When not to use
+ * - Body copy, captions and labels: use `bs-text`.
+ * - To make text big without it being a heading: use `bs-text` with `as="p"`.
+ *
+ * @slot - The heading text.
+ * @part heading - The rendered heading element.
+ */
+export declare class BsHeading {
+    /** Heading level 1-6: chooses the element (`h1`-`h6`) and, unless `size` is set, the visual size. */
+    level: BsHeadingLevel;
+    /** Overrides the rendered element, e.g. `as="p"` for a heading-looking line that is not part of the outline. When set, `level` only drives the default size. */
+    as?: BsHeadingAs;
+    /** Visual size, independent of the element: `display` or `1`-`6` (the default sizes of levels 1-6). Defaults to `level`. */
+    size?: BsHeadingSize;
+    /** Text colour from the text tokens. `inherit` uses the surrounding colour. */
+    tone: BsHeadingTone;
+    render(): any;
+}

package/dist/types/components/bs-heading/bs-heading.stories.d.ts

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsHeadingArgs {
+    level: 1 | 2 | 3 | 4 | 5 | 6;
+    size: string;
+    tone: string;
+    text: string;
+}
+declare const meta: Meta<BsHeadingArgs>;
+export default meta;
+type Story = StoryObj<BsHeadingArgs>;
+export declare const Default: Story;
+export declare const Levels: Story;
+export declare const Display: Story;
+export declare const SizeIndependentOfLevel: Story;
+export declare const Tones: Story;

package/dist/types/components/bs-icon/bs-icon.cmp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/bs-icon/bs-icon.d.ts

@@ -0,0 +1,39 @@
+export type BsIconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type BsIconTone = 'default' | 'muted' | 'action' | 'success' | 'info' | 'warning' | 'error' | 'inverse' | 'inherit';
+/**
+ * A sized, coloured icon. Renders inline SVG from a named registry (`name`), or any SVG you slot in.
+ *
+ * Built-in names: `menu`, `arrow-right`, `arrow-left`, `check`, `close`, `chevron-down`,
+ * `external-link`, `copy`, `search`, plus Phosphor glyphs `user`, `star`, `star-fill`, `x`,
+ * `paper-plane-right`, `note-pencil`, `clock-counter-clockwise`, `arrows-out-simple` (256x256 filled). Add more with `registerIcons({ name: '<path d="..."/>' })`
+ * (exported from the package entry): each value is the inner markup of a 24x24, `currentColor`
+ * stroke icon, or pass `{ viewBox, body }` for a filled glyph on another grid.
+ *
+ * Decorative by default (`aria-hidden`). Set `label` when the icon alone conveys meaning; it is then
+ * exposed as an image with that name. An icon inside a button never needs `label`: name the button.
+ *
+ * Composed from: nothing (leaf). Used by `bs-code-block`.
+ *
+ * ## When to use
+ * - A glyph beside text or inside a button, sized and coloured from tokens.
+ *
+ * ## When not to use
+ * - As a control by itself: wrap it in `bs-icon-button`.
+ * - For a tinted status square: use `bs-icon-tile`.
+ *
+ * @slot - Optional SVG (or `img`) shown when `name` is not set or not registered. Sized to the icon; draw with `currentColor` to follow `tone`.
+ * @part icon - The wrapper around the glyph.
+ */
+export declare class BsIcon {
+    el: HTMLElement;
+    /** Registered icon name (see the component description for the built-in set). */
+    name?: string;
+    /** Size: `xs` 12px, `sm` 16px, `md` 24px, `lg` 32px, `xl` 48px. */
+    size: BsIconSize;
+    /** Colour from the icon tokens. `inherit` uses the surrounding text colour (`currentColor`). */
+    tone: BsIconTone;
+    /** Accessible name. When set the icon is exposed as an image with this name; when empty it is
+     * decorative and hidden from assistive tech. */
+    label?: string;
+    render(): any;
+}

package/dist/types/components/bs-icon/bs-icon.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsIconArgs {
+    name: string;
+    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    tone: 'default' | 'muted' | 'action' | 'success' | 'info' | 'warning' | 'error' | 'inverse' | 'inherit';
+    label: string;
+}
+declare const meta: Meta<BsIconArgs>;
+export default meta;
+type Story = StoryObj<BsIconArgs>;
+export declare const Default: Story;
+export declare const AllNames: Story;
+export declare const Sizes: Story;
+export declare const Tones: Story;
+export declare const Labelled: Story;
+export declare const Slotted: Story;

package/dist/types/components/bs-icon/icon-registry.d.ts

@@ -0,0 +1,16 @@
+/** An icon drawn on its own grid with filled (not stroked) shapes, e.g. Phosphor's 256x256 glyphs. */
+export interface BsIconDefinition {
+    viewBox: string;
+    body: string;
+}
+export type BsIconEntry = string | BsIconDefinition;
+/**
+ * Register (or replace) named icons. Values are inner SVG markup for a 24x24 viewBox using
+ * `currentColor` strokes, or `{ viewBox, body }` for filled glyphs on another grid (rendered with `fill="currentColor"`). Only register markup you trust: it is inserted as-is.
+ * Already-rendered `bs-icon`s pick up new names on their next render.
+ */
+export declare function registerIcons(icons: Record<string, BsIconEntry>): void;
+/** The entry (inner SVG markup string, or `{ viewBox, body }`) registered under `name`, or undefined. */
+export declare function getIcon(name: string | undefined): BsIconEntry | undefined;
+/** All registered icon names. */
+export declare function iconNames(): string[];