@brandsync/wc 1.9.0 → 1.11.0

package/dist/types/components/bs-cookie-consent/bs-cookie-consent.d.ts

@@ -0,0 +1,136 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type BsCookieConsentType = 'banner' | 'card' | 'preferences' | 'saved';
+export interface BsCookieCategory {
+    /** Identifier, used as the key in `choices`. */
+    id: string;
+    label: string;
+    description?: string;
+    /** Always on and can't be switched off (strictly necessary cookies). Shows an "Always on" badge instead of a switch. */
+    required?: boolean;
+    /** Initial state of the switch. Ignored for `required` categories (always on). */
+    enabled?: boolean;
+    /** The cookies in this category, shown under a "See N cookies" disclosure. */
+    cookies?: string[];
+}
+export type BsCookieChoices = Record<string, boolean>;
+/**
+ * A cookie consent prompt in four forms, matching the Figma "Cookie consent" component:
+ *
+ * - `banner` -- a wide bar: icon, heading, text, policy link, and Customise / Reject optional / Accept
+ *   all. Stacks into a column on narrow containers (its own width, not the viewport's).
+ * - `card` -- the compact version of the same question, in a card.
+ * - `preferences` -- the detailed dialog: one row per cookie category with a switch (strictly
+ *   necessary is "Always on"), an expandable list of the cookies in each, and Reject optional /
+ *   Accept all / Save choices.
+ * - `saved` -- a dark confirmation bar ("Cookie choices saved") with a Change action.
+ *
+ * The component only collects the choice. It doesn't set, read or delete cookies, remember that the
+ * user answered, or decide when to show itself: your app does that from the events, and swaps `type`
+ * (e.g. `banner` -> `preferences` on `bsCustomise`, `preferences` -> `saved` on `bsSave`).
+ *
+ * **Built from:** `bs-card` (the surface), `bs-icon-tile` (the icon), `bs-button` (the actions),
+ * `bs-switch` (the category switches), `bs-chip-informative` (the "Always on" badge), `bs-icon-button`
+ * (the close button), `bs-snackbar` (the saved confirmation).
+ *
+ * ## When to use
+ * - Asking for consent to optional cookies or similar tracking, as the law of your market requires.
+ *
+ * ## When not to use
+ * - Telling people about necessary cookies only -- that needs no consent prompt.
+ *
+ * ## Fair choice
+ * "Reject optional" has the same prominence as "Accept all" (same size, both always visible). Keep it
+ * that way: a prompt that makes refusing harder than accepting isn't valid consent in most places.
+ *
+ * @slot icon - Replaces the cookie glyph in the icon tile. Draw it with `currentColor`.
+ * @part container - The card (or the snackbar, for `saved`).
+ * @part art - The icon tile.
+ * @part heading - The heading.
+ * @part description - The paragraph under it.
+ * @part policy - The cookie policy link.
+ * @part actions - The row of consent buttons.
+ * @part customise - The Customise button.
+ * @part reject - The Reject optional button.
+ * @part accept - The Accept all button.
+ * @part save - The Save choices button (`preferences`).
+ * @part close - The close button (`preferences`).
+ * @part category - Each cookie category (`preferences`).
+ * @part switch - Each category's switch (`preferences`).
+ */
+export declare class BsCookieConsent {
+    /** Which form: `banner`, `card`, `preferences` or `saved`. */
+    type: BsCookieConsentType;
+    /** Heading. Defaults per `type`. */
+    heading?: string;
+    /** HTML heading level, 1-6. */
+    headingLevel: number;
+    /** Paragraph under the heading (the message, for `saved`). Defaults per `type`. */
+    description?: string;
+    /** URL of your cookie policy. The "Read the cookie policy" link is only shown when this is set. */
+    policyUrl?: string;
+    /** Text of the policy link. */
+    policyLabel: string;
+    /** Label of the Customise button. */
+    customiseLabel: string;
+    /** Label of the Reject optional button. */
+    rejectLabel: string;
+    /** Label of the Accept all button. */
+    acceptLabel: string;
+    /** Label of the Save choices button (`preferences`). */
+    saveLabel: string;
+    /** Label of the action on the confirmation (`saved`). */
+    changeLabel: string;
+    /** Text of the badge on required categories (`preferences`). */
+    alwaysOnLabel: string;
+    /** Label of a category's disclosure; `{count}` is replaced by the number of cookies. */
+    seeCookiesLabel: string;
+    /** Accessible name of the close button (`preferences`). */
+    closeLabel: string;
+    /** The categories in the preferences dialog (`preferences`): `[{ id, label, description?, required?,
+     * enabled?, cookies? }]`. Defaults to Strictly necessary, Preferences, Analytics and Marketing. Must
+     * be set as a JS property, not an HTML attribute -- see CONVENTIONS.md's non-string props rule. */
+    categories: BsCookieCategory[];
+    /** Fires when Accept all is pressed. `{ choices }` has every category on. */
+    bsAccept: EventEmitter<{
+        choices: BsCookieChoices;
+    }>;
+    /** Fires when Reject optional is pressed. `{ choices }` has only the required categories on. */
+    bsReject: EventEmitter<{
+        choices: BsCookieChoices;
+    }>;
+    /** Fires when Customise is pressed -- show the `preferences` form. */
+    bsCustomise: EventEmitter<void>;
+    /** Fires when Save choices is pressed (`preferences`), with the current switches. */
+    bsSave: EventEmitter<{
+        choices: BsCookieChoices;
+    }>;
+    /** Fires when a category switch is toggled (`preferences`). */
+    bsChoice: EventEmitter<{
+        id: string;
+        enabled: boolean;
+    }>;
+    /** Fires when the close button is pressed (`preferences`). */
+    bsClose: EventEmitter<void>;
+    /** Fires when the action on the confirmation is pressed (`saved`) -- reopen the preferences. */
+    bsManage: EventEmitter<void>;
+    /** Current switch state per category id. */
+    choices: BsCookieChoices;
+    /** Which category disclosures are open. */
+    open: Record<string, boolean>;
+    componentWillLoad(): void;
+    onCategoriesChange(): void;
+    private resetChoices;
+    private all;
+    private get defaults();
+    private heading_;
+    private policy;
+    private customise;
+    private reject;
+    private accept;
+    private renderBanner;
+    private renderCard;
+    private renderCategory;
+    private renderPreferences;
+    private renderSaved;
+    render(): any;
+}

package/dist/types/components/bs-cookie-consent/bs-cookie-consent.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsCookieConsentArgs {
+    type: 'banner' | 'card' | 'preferences' | 'saved';
+    heading: string;
+    description: string;
+    policyUrl: string;
+}
+declare const meta: Meta<BsCookieConsentArgs>;
+export default meta;
+type Story = StoryObj<BsCookieConsentArgs>;
+export declare const Banner: Story;
+export declare const BannerNarrow: Story;
+export declare const CompactCard: Story;
+export declare const PreferencesDialog: Story;
+export declare const SavedConfirmation: Story;
+export declare const Flow: Story;

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

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

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

@@ -0,0 +1,138 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export interface BsDatepickerChange {
+    /** Single mode: the selected date as `YYYY-MM-DD` (empty string when cleared). */
+    value?: string;
+    /** Range mode: the range start as `YYYY-MM-DD`. */
+    start?: string;
+    /** Range mode: the range end as `YYYY-MM-DD`. Empty while only the start has been picked. */
+    end?: string;
+}
+/**
+ * An inline calendar for picking a single date, or a start/end date range. Matches the Figma
+ * "Date picker" component's two types: "Default" (month and year dropdowns above the grid) and
+ * "Range" (start and end date fields above the grid, with the days between highlighted).
+ *
+ * Dates are always `YYYY-MM-DD` strings, interpreted in the user's local time zone -- never full
+ * ISO timestamps -- so a date can't shift by a day across time zones.
+ *
+ * The calendar renders inline at a fixed width; to show it as a popover, put it inside a
+ * `bs-menu` or your own overlay.
+ *
+ * **Built from:** `bs-card` (the surface), `bs-input` (the month/year dropdown triggers and the range date fields), `bs-menu` and `bs-menu-item` (the month/year lists).
+ *
+ * ## When to use
+ * - Picking a date where seeing the surrounding days of the week/month helps (a booking, a
+ *   deadline, a report window).
+ * - Picking a period (`range`) such as a start and end date.
+ *
+ * ## When not to use
+ * - A date the user knows by heart and can type quickly (a birth date) -- `bs-input type="date"`
+ *   is faster there.
+ *
+ * ## Keyboard
+ * Arrow keys move by day/week, Home/End jump to the start/end of the week, PageUp/PageDown move by
+ * month (with Shift, by year), Enter/Space select the focused day.
+ *
+ * @part container - The outer card.
+ * @part header - The row of month/year dropdowns (default) or start/end fields (range).
+ * @part menu - The month/year dropdown list, when open (default mode).
+ * @part nav - The row holding the previous/next buttons and the title.
+ * @part prev - The previous-month button.
+ * @part next - The next-month button.
+ * @part title - The title between the nav buttons.
+ * @part weekday - Each weekday column header.
+ * @part grid - The day grid.
+ * @part day - Each day button.
+ * @part selected - A selected day (the single date, or either end of a range), in addition to `day`.
+ * @part in-range - A day strictly between the range start and end, in addition to `day`.
+ * @part outside - A day from the previous/next month, in addition to `day`.
+ * @part today - Today's day button, in addition to `day`.
+ */
+export declare class BsDatepicker {
+    el: HTMLElement;
+    internals: ElementInternals;
+    private initialValue;
+    private initialStart;
+    private initialEnd;
+    /** The `name` the value is submitted under in a surrounding `<form>`. In `range` mode the dates
+     * are submitted as `<name>-start` and `<name>-end`. */
+    name?: string;
+    /** Select a start/end range instead of a single date. */
+    range: boolean;
+    /** The selected date (`YYYY-MM-DD`) in single mode. Mutable so a click updates it directly;
+     * `bsChange` still fires for the consumer to react. Ignored when `range` is set. */
+    value: string;
+    /** The range start (`YYYY-MM-DD`) in `range` mode. */
+    start: string;
+    /** The range end (`YYYY-MM-DD`) in `range` mode. */
+    end: string;
+    /** Earliest selectable date (`YYYY-MM-DD`). Earlier days render disabled. */
+    min?: string;
+    /** Latest selectable date (`YYYY-MM-DD`). Later days render disabled. */
+    max?: string;
+    /** BCP 47 locale used for month names, weekday names and the title. */
+    locale: string;
+    /** First column of the grid: `0` for Sunday (the Figma spec), `1` for Monday, ... `6`. */
+    firstDayOfWeek: number;
+    /** Label above the start field in `range` mode. */
+    startLabel: string;
+    /** Label above the end field in `range` mode. */
+    endLabel: string;
+    /** Accessible name for the month dropdown (single mode). */
+    monthLabel: string;
+    /** Accessible name for the year dropdown (single mode). */
+    yearLabel: string;
+    /** Accessible name for the previous-month button. */
+    previousLabel: string;
+    /** Accessible name for the next-month button. */
+    nextLabel: string;
+    /** Fires when the user changes the selection. Single mode: `{ value }`. Range mode: `{ start,
+     * end }` -- fired once for the first click (with an empty `end`) and again when the range is
+     * completed. Not fired when the props are set programmatically. */
+    bsChange: EventEmitter<BsDatepickerChange>;
+    /** First day of the month currently displayed. */
+    viewDate: Date;
+    /** The day holding the roving tabindex. */
+    focusedIso: string;
+    /** The day the pointer is over while a range is half-picked, for the live range preview. */
+    hoverIso: string;
+    /** Text the user is typing into a range field, keyed by which field. Cleared on commit. */
+    draft: {
+        start?: string;
+        end?: string;
+    };
+    /** Which header dropdown (single mode) is open. */
+    openMenu: 'month' | 'year' | null;
+    private shouldFocusDay;
+    private menuToScroll;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    onSelectionChange(): void;
+    onSelectionJump(): void;
+    /** Called by the browser when the surrounding `<form>` is reset. */
+    formResetCallback(): void;
+    private showSelection;
+    private syncFormValue;
+    private isDisabled;
+    private selectDay;
+    private commitDraft;
+    private moveView;
+    private onKeyDown;
+    private get safeFirstDay();
+    private get fmt();
+    private formatField;
+    private titleText;
+    private monthOptions;
+    private yearOptions;
+    private weekdays;
+    private gridDays;
+    private renderHeader;
+    /** A `bs-input type="dropdown"` trigger with our own `bs-menu` list below it. bs-input's built-in
+     * menu has no checkmark or scroll limit, so it's used only as the field look: it gets no
+     * `options` (so renders no menu of its own) and its `bsOpen` toggles ours. */
+    private renderDropdown;
+    render(): any;
+    /** The day that should be reachable with Tab when nothing in view has been focused yet: the
+     * selection if it's in the displayed month, else today if it is, else the 1st. */
+    private defaultTabbable;
+}

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

@@ -0,0 +1,20 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsDatepickerArgs {
+    range: boolean;
+    value: string;
+    start: string;
+    end: string;
+    min: string;
+    max: string;
+    locale: string;
+    firstDayOfWeek: number;
+}
+declare const meta: Meta<BsDatepickerArgs>;
+export default meta;
+type Story = StoryObj<BsDatepickerArgs>;
+export declare const Default: Story;
+export declare const Range: Story;
+export declare const RangeAcrossWeeks: Story;
+export declare const MinMax: Story;
+export declare const MondayFirst: Story;
+export declare const Danish: Story;

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

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

package/dist/types/components/bs-error-page/bs-error-page.d.ts

@@ -0,0 +1,60 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type BsErrorPageType = 'not-found' | 'server-error' | 'no-access' | 'maintenance' | 'offline';
+/**
+ * A full-block page for when the user can't get to what they asked for: page not found (404), a server
+ * error (500), no access (403), planned maintenance, or no internet connection. Matches the Figma
+ * "Error page" component's five states.
+ *
+ * Each `type` brings its own icon, tint, code label ("404", "Maintenance", ...), heading, paragraph and
+ * buttons, all overridable by props. The component doesn't navigate or retry anything: it emits
+ * `bsPrimary` / `bsSecondary` and your app decides what "Go to Overview" or "Try again" does.
+ *
+ * **Built from:** `bs-card` (the surface), `bs-icon-tile` (the icon), `bs-button` (the actions).
+ *
+ * ## When to use
+ * - Replacing the content of a page or panel that can't be shown, with a clear way forward.
+ *
+ * ## When not to use
+ * - A problem with one field or one action -- use inline validation or a `bs-snackbar`.
+ * - A blocking question the user must answer -- use `bs-dialog`.
+ *
+ * @slot icon - Replaces the default glyph in the icon tile. Draw it with `currentColor`.
+ * @part container - The card.
+ * @part art - The icon tile.
+ * @part code - The label under the icon ("404", "Maintenance", ...).
+ * @part heading - The heading.
+ * @part description - The paragraph.
+ * @part actions - The button row.
+ * @part primary - The primary button.
+ * @part secondary - The secondary button.
+ * @part reference - The small reference line (an error id and time).
+ */
+export declare class BsErrorPage {
+    /** Which error: `not-found` (404), `server-error` (500), `no-access` (403), `maintenance` or
+     * `offline`. */
+    type: BsErrorPageType;
+    /** The small label under the icon, e.g. "404". Defaults per `type` ("404", "500", "403",
+     * "Maintenance", "Offline"). Set it to an empty string to hide it. */
+    code?: string;
+    /** Heading. Defaults per `type`. */
+    heading?: string;
+    /** HTML heading level for the heading, 1-6. Use 1 when this replaces the whole page; lower when it
+     * sits inside a section that already has a heading above it. */
+    headingLevel: number;
+    /** Paragraph under the heading. Defaults per `type`. */
+    description?: string;
+    /** Label of the primary button. Defaults per `type`. Set it to an empty string to hide it. */
+    primaryLabel?: string;
+    /** Label of the secondary button. Defaults per `type` (only `not-found`, `server-error` and
+     * `no-access` have one). Set it to an empty string to hide it. */
+    secondaryLabel?: string;
+    /** A small reference line under the buttons, e.g. `"Error ID: 7f3c-21a9 · 30.09.2026 10:42"`, for
+     * support to look up. Nothing is shown when empty. */
+    reference?: string;
+    /** Fires when the primary button is pressed. */
+    bsPrimary: EventEmitter<void>;
+    /** Fires when the secondary button is pressed. */
+    bsSecondary: EventEmitter<void>;
+    private get defaults();
+    render(): any;
+}

package/dist/types/components/bs-error-page/bs-error-page.stories.d.ts

@@ -0,0 +1,22 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+type ErrorType = 'not-found' | 'server-error' | 'no-access' | 'maintenance' | 'offline';
+interface BsErrorPageArgs {
+    type: ErrorType;
+    code: string;
+    heading: string;
+    description: string;
+    primaryLabel: string;
+    secondaryLabel: string;
+    reference: string;
+    headingLevel: number;
+}
+declare const meta: Meta<BsErrorPageArgs>;
+export default meta;
+type Story = StoryObj<BsErrorPageArgs>;
+export declare const NotFound: Story;
+export declare const ServerError: Story;
+export declare const NoAccess: Story;
+export declare const Maintenance: Story;
+export declare const Offline: Story;
+export declare const CustomCopy: Story;
+export declare const CustomIcon: Story;

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

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

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

@@ -0,0 +1,40 @@
+export type BsIconTileSize = 'sm' | 'md' | 'lg';
+export type BsIconTileIntent = 'default' | 'success' | 'warning' | 'error' | 'brand' | 'information';
+/**
+ * A small rounded square holding an icon, tinted by intent -- the visual marker next to a status,
+ * a list item or a feature. Matches the Figma "Icon tile" component (3 sizes x 6 intents).
+ *
+ * Each intent shows a default glyph (house, check, warning, cross, grid, info); put your own icon in
+ * the default slot to replace it. A slotted icon is sized to the tile (12/16/24px) and coloured
+ * with the intent's icon colour, as long as it draws with `currentColor`.
+ *
+ * The tile is decorative by default (hidden from assistive tech). Don't rely on the colour or glyph
+ * alone to convey status: slot text into `text` (it sits beside the square, in
+ * `--bs-icon-tile-text-color`), or set `label` to give the tile its own accessible name.
+ *
+ * ## When to use
+ * - Marking a row, card or message with a status or category icon.
+ *
+ * ## When not to use
+ * - As a button -- it isn't interactive. Use `bs-icon-button`.
+ *
+ * @slot - Optional icon replacing the intent's default glyph.
+ * @slot text - Optional text shown beside the square (e.g. "Payment received"), in `--bs-icon-tile-text-color`.
+ * @part container - The tinted square.
+ * @part icon - The wrapper around the glyph (default or slotted).
+ * @part text - The wrapper around the `text` slot (only shown when something is slotted).
+ */
+export declare class BsIconTile {
+    /** Tile size: `sm` 24px, `md` 32px, `lg` 48px. */
+    size: BsIconTileSize;
+    /** Colour and default glyph. `brand` uses the brand colours; `information` the info palette. */
+    intent: BsIconTileIntent;
+    /** Accessible name. When set, the tile is exposed as an image with this name; when empty it is
+     * decorative and hidden from assistive tech. */
+    label?: string;
+    /** True while the default slot holds a real element or non-blank text (a custom icon), not just whitespace. */
+    hasCustomIcon: boolean;
+    /** True while something is assigned to the `text` slot, so the text wrapper (and its gap) only exists then. */
+    hasText: boolean;
+    render(): any[];
+}

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

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsIconTileArgs {
+    size: 'sm' | 'md' | 'lg';
+    intent: 'default' | 'success' | 'warning' | 'error' | 'brand' | 'information';
+    label: string;
+}
+declare const meta: Meta<BsIconTileArgs>;
+export default meta;
+type Story = StoryObj<BsIconTileArgs>;
+export declare const Default: Story;
+export declare const AllSizesAndIntents: Story;
+export declare const CustomIcon: Story;
+export declare const WithText: Story;

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

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

package/dist/types/components/bs-onboarding-checklist/bs-onboarding-checklist.d.ts

@@ -0,0 +1,140 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type BsOnboardingChecklistType = 'panel' | 'dashboard' | 'launcher' | 'completion';
+export type BsOnboardingLauncherLayout = 'icon' | 'ring' | 'inline';
+export interface BsOnboardingStep {
+    /** Identifier echoed back in the step events, and used for the `icon-<id>` slot. */
+    id: string;
+    label: string;
+    /** Longer text shown under the label while this is the current step. */
+    description?: string;
+    /** Marks the step as finished. */
+    done?: boolean;
+    /** Time estimate shown on the current step, e.g. "About 3 min". */
+    estimate?: string;
+    /** Label of the current step's primary button (`panel`), e.g. "Connect bank". */
+    actionLabel?: string;
+    /** Set to `false` to hide "Skip for now" on this step. */
+    skippable?: boolean;
+}
+/**
+ * A "get set up" checklist, in four forms that matching the Figma "Onboarding checklist" component:
+ *
+ * - `panel` -- the full list: heading, progress, every step with a status icon, and the current step
+ *   expanded with its description, time estimate, Skip for now and a primary action.
+ * - `dashboard` -- a wide card for the top of a page: summary and progress on the left, the current step
+ *   and the next ones as small cards on the right, and a "See all steps" link.
+ * - `launcher` -- a small always-visible chip that reopens the checklist; three layouts (`icon`, `ring`,
+ *   `inline`).
+ * - `completion` -- the "You're all set" card once every step is done.
+ *
+ * The component shows progress and reports what the user pressed. It doesn't know what a step means,
+ * run it, or remember anything: your app owns the steps (`steps`, each with `done`), marks them done, and
+ * decides which form to show.
+ *
+ * **Built from:** `bs-card` (every surface), `bs-icon-tile` (the icons), `bs-button` (the actions),
+ * `bs-icon-button` (the close button), `bs-progress-linear` (the progress bar), `bs-progress` (the launcher
+ * ring).
+ *
+ * ## When to use
+ * - Guiding a new account or user through a short list of setup tasks they can do in any order or later.
+ *
+ * ## When not to use
+ * - A strict, linear flow where each step needs the one before -- use `bs-stepper`.
+ * - A tour of the interface itself -- use `bs-product-tour`.
+ *
+ * ## Accessibility
+ * Steps are an ordered list; the current one has `aria-current="step"`, and each step carries a visually
+ * hidden "Done" / "Not done". The progress bar is named with the progress text.
+ *
+ * @slot icon - Replaces the icon in the heading tile (`panel`, `dashboard`, `launcher`).
+ * @slot icon-<step id> - Replaces the icon of that step in the `dashboard` cards, e.g. `slot="icon-bank"`.
+ * @part container - The card (or the launcher button's card).
+ * @part art - The heading icon tile.
+ * @part heading - The heading.
+ * @part description - The paragraph under it.
+ * @part progress - The progress block (label, percentage, bar).
+ * @part steps - The list of steps (`panel`).
+ * @part step - Each step row (`panel`) or card (`dashboard`).
+ * @part current - The current step, in addition to `step`.
+ * @part action - The current step's primary button (`panel`) or Start link (`dashboard`).
+ * @part skip - The current step's Skip for now button (`panel`).
+ * @part close - The close button.
+ * @part see-all - The "See all steps" link (`dashboard`).
+ * @part launcher - The launcher button (`launcher`).
+ * @part primary - The main button (`completion`).
+ * @part secondary - The Hide checklist button (`completion`).
+ */
+export declare class BsOnboardingChecklist {
+    /** Which form: `panel`, `dashboard`, `launcher` or `completion`. */
+    type: BsOnboardingChecklistType;
+    /** Layout of the `launcher`: `icon` (tile, title, progress text), `ring` (circular progress, title,
+     * text) or `inline` (tile, title and text on one line, with a chevron). */
+    launcherLayout: BsOnboardingLauncherLayout;
+    /** The steps: `[{ id, label, description?, done?, estimate?, actionLabel?, skippable? }]`. The first step
+     * that isn't `done` is the current one. Must be set as a JS property, not an HTML attribute -- see
+     * CONVENTIONS.md's non-string props rule. */
+    steps: BsOnboardingStep[];
+    /** Heading. Defaults per `type` ("Get started", "Finish setting up", "Setup", "You're all set"). */
+    heading?: string;
+    /** Paragraph under the heading. Defaults to a summary of the progress for `dashboard`. Nothing for
+     * `launcher`. */
+    description?: string;
+    /** HTML heading level, 1-6. */
+    headingLevel: number;
+    /** Text under the launcher title. Defaults to "N% complete". */
+    progressText?: string;
+    /** Shows a close button (`panel`, `dashboard`). */
+    closable: boolean;
+    /** Template of the progress label; `{done}` and `{total}` are replaced. */
+    progressLabel: string;
+    /** Label of "Skip for now" on the current step (`panel`). */
+    skipLabel: string;
+    /** Label of the Start link on the current step's card (`dashboard`). */
+    startLabel: string;
+    /** Label of the link that opens the whole checklist (`dashboard`). */
+    seeAllLabel: string;
+    /** Caption on the cards of steps that come after the current one (`dashboard`). */
+    afterLabel: string;
+    /** Label of the main button (`completion`). */
+    doneLabel: string;
+    /** Label of the secondary button (`completion`). */
+    hideLabel: string;
+    /** Accessible name of the close button. */
+    closeLabel: string;
+    /** Visually hidden text on a finished step. */
+    statusDoneLabel: string;
+    /** Visually hidden text on an unfinished step. */
+    statusTodoLabel: string;
+    /** Fires when a step's primary action is pressed (`panel` button, `dashboard` Start): `{ id }`. */
+    bsStepAction: EventEmitter<{
+        id: string;
+    }>;
+    /** Fires when "Skip for now" is pressed on the current step (`panel`): `{ id }`. */
+    bsStepSkip: EventEmitter<{
+        id: string;
+    }>;
+    /** Fires when the close button is pressed. */
+    bsClose: EventEmitter<void>;
+    /** Fires when the user asks to open the full checklist: "See all steps" (`dashboard`) or the launcher. */
+    bsOpen: EventEmitter<void>;
+    /** Fires when the main button is pressed (`completion`). */
+    bsDone: EventEmitter<void>;
+    /** Fires when Hide checklist is pressed (`completion`). */
+    bsHide: EventEmitter<void>;
+    private get list();
+    private get doneCount();
+    private get percent();
+    private get currentId();
+    private fill;
+    private renderHeading;
+    private renderClose;
+    private renderProgress;
+    private renderStatus;
+    private renderStepRow;
+    private renderCurrentStep;
+    private renderPanel;
+    private renderDashboard;
+    private renderLauncher;
+    private renderCompletion;
+    render(): any;
+}

package/dist/types/components/bs-onboarding-checklist/bs-onboarding-checklist.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsOnboardingChecklistArgs {
+    type: 'panel' | 'dashboard' | 'launcher' | 'completion';
+    launcherLayout: 'icon' | 'ring' | 'inline';
+    heading: string;
+    description: string;
+    closable: boolean;
+}
+declare const meta: Meta<BsOnboardingChecklistArgs>;
+export default meta;
+type Story = StoryObj<BsOnboardingChecklistArgs>;
+export declare const Panel: Story;
+export declare const Dashboard: Story;
+export declare const LauncherIcon: Story;
+export declare const LauncherRing: Story;
+export declare const LauncherInline: Story;
+export declare const Completion: Story;
+export declare const Interactive: Story;

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

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