@brandsync/wc 0.0.7 → 0.0.9

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

@@ -0,0 +1,59 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type BsAttachmentType = 'image' | 'pdf' | 'document';
+/**
+ * A single file attachment preview for `bs-composer` -- an image thumbnail, or a filename card
+ * with a colored file-type badge (PDF/Document), with an optional upload-in-progress spinner and
+ * a hover/focus-revealed remove button.
+ *
+ * ## When to use
+ * - Rendered by the consuming app for each file a user has attached to a Genie AI chat message,
+ *   typically alongside or inside `bs-composer`.
+ *
+ * ## When not to use
+ * - A generic file-upload control -- this is a preview-only presentational component. The
+ *   consuming app owns the actual file picker/upload logic and drives `loading` from that state.
+ *
+ * @part thumbnail - The image thumbnail wrapper (type="image" only).
+ * @part card - The filename card (type="pdf" / type="document" only).
+ * @part filename - The truncated filename text inside the card.
+ * @part badge - The colored file-type badge inside the card.
+ * @part remove - The remove button.
+ * @prop --bs-attachment-size - Width/height of the image thumbnail and of the card. Defaults to 112px.
+ * @prop --bs-attachment-radius - Corner radius of the thumbnail/card. Aliased to
+ *   `--bs-border-radius-100`.
+ * @prop --bs-attachment-border-color - Border color of the card / loading image wrap. Aliased to
+ *   `--bs-border-default`.
+ * @prop --bs-attachment-card-bg - Card background. Aliased to `--bs-surface-base`.
+ * @prop --bs-attachment-filename-color - Filename text color. Aliased to `--bs-text-default`.
+ * @prop --bs-attachment-badge-bg-pdf - PDF badge background. Aliased to `--bs-badge-bg-error`.
+ * @prop --bs-attachment-badge-bg-document - Document badge background. Aliased to
+ *   `--bs-badge-bg-info`.
+ * @prop --bs-attachment-remove-bg - Remove button (neutral icon button) default background.
+ *   Aliased to `--bs-button-neutral-container`.
+ * @prop --bs-attachment-remove-hover - Remove button hover background. Aliased to
+ *   `--bs-button-neutral-hover`.
+ * @prop --bs-attachment-remove-pressed - Remove button active/pressed background. Aliased to
+ *   `--bs-button-neutral-pressed`.
+ * @prop --bs-attachment-remove-focus - Remove button focus outline color. Aliased to
+ *   `--bs-border-neutral-focus`.
+ */
+export declare class BsAttachment {
+    /** Which kind of attachment preview to render. */
+    type: BsAttachmentType;
+    /** The filename shown on the card. Only used when `type` is "pdf" or "document". */
+    fileName: string;
+    /** The thumbnail image URL. Only used when `type` is "image". */
+    imageSrc?: string;
+    /** Accessible alt text for the image thumbnail. Only used when `type` is "image". */
+    imageAlt: string;
+    /** Shows an upload-in-progress spinner (blurred + overlaid for images, in the badge for files). */
+    loading: boolean;
+    /** Whether the hover/focus-revealed remove button is rendered at all. */
+    removable: boolean;
+    /** Fires when the remove button is clicked. */
+    bsRemove: EventEmitter<void>;
+    private onRemoveClick;
+    render(): any;
+    private renderImage;
+    private renderCard;
+}

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

@@ -0,0 +1,17 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsAttachmentArgs {
+    type: 'image' | 'pdf' | 'document';
+    fileName: string;
+    imageSrc: string;
+    loading: boolean;
+    removable: boolean;
+}
+declare const meta: Meta<BsAttachmentArgs>;
+export default meta;
+type Story = StoryObj<BsAttachmentArgs>;
+export declare const Default: Story;
+export declare const Pdf: Story;
+export declare const Document: Story;
+export declare const ImageLoading: Story;
+export declare const PdfLoading: Story;
+export declare const Gallery: Story;

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

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

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

@@ -0,0 +1,42 @@
+/**
+ * A horizontally-scrolling row wrapper for one or more `bs-attachment` previews, for slotting into
+ * `bs-composer`'s `attachments` slot when a Genie AI chat message has file attachments.
+ *
+ * ## When to use
+ * - Wrapping any number of `bs-attachment` elements the user has attached to a message, so they
+ *   lay out in a single row and scroll horizontally instead of wrapping/overflowing once there
+ *   are more than fit the available width.
+ *
+ * ## When not to use
+ * - A single attachment on its own — just render `bs-attachment` directly, this wrapper's
+ *   scroll/fade affordance only matters once there's more content than fits.
+ *
+ * @slot - One or more `bs-attachment` elements.
+ * @part row - The scrollable flex row containing the slotted attachments.
+ * @part fade - The right-edge fade-out overlay shown only while the row has more content to
+ *   scroll to.
+ * @prop --bs-attachment-list-gap - Gap between attachments. Matches the 10px Figma spec (not tied
+ *   to the `--bs-spacing-*` scale, which only has 8px/12px neighbors).
+ * @prop --bs-attachment-list-padding - Padding around the row. Aliased to `--bs-spacing-150`.
+ * @prop --bs-attachment-list-fade-color - Color the right-edge fade blends into. Aliased to
+ *   `--bs-static-white`.
+ * @prop --bs-attachment-list-fade-width - Width of the right-edge fade overlay. Aliased to
+ *   `--bs-spacing-800`.
+ * @prop --bs-attachment-list-scrollbar-thumb - Color of the scrollbar thumb that appears on
+ *   hover/focus once the row is scrollable. Aliased to `--bs-neutral-300`.
+ */
+export declare class BsAttachmentList {
+    el: HTMLElement;
+    /** Accessible name for the scrollable region. */
+    ariaLabel: string | null;
+    /** Whether the row currently has more content than fits (drives the fade + scrollbar-on-hover). */
+    canScrollRight: boolean;
+    private row?;
+    private resizeObserver?;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private onSlotchange;
+    private onScroll;
+    private updateScrollState;
+    render(): any;
+}

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

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsAttachmentListArgs {
+    ariaLabel: string;
+}
+declare const meta: Meta<BsAttachmentListArgs>;
+export default meta;
+type Story = StoryObj<BsAttachmentListArgs>;
+export declare const OneAttachment: Story;
+export declare const ThreeAttachments: Story;
+export declare const ManyAttachments: Story;

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

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

package/dist/types/components/bs-chatbot-feedback/bs-chatbot-feedback.d.ts

@@ -0,0 +1,90 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * A star-rating feedback card shown at the end of a Genie AI chat: a heading/subtitle, a 5-star
+ * rating, an optional comment, and either "Submit feedback" + "Start new chat" (before
+ * submitting) or just "Start new chat" (after).
+ *
+ * ## When to use
+ * - Prompting for feedback on a Genie response or chat session, typically after the user ends or
+ *   restarts a conversation.
+ *
+ * ## When not to use
+ * - A generic star-rating input elsewhere in the product -- this component's copy and layout are
+ *   purpose-built for the Genie feedback flow, not a reusable rating control.
+ *
+ * The heading and subtitle are not freeform props: before submitting, they're always the fixed
+ * "How was your experience..." copy; after submitting, they're determined entirely by `rating`
+ * (1-2 stars reads apologetic, 3 neutral, 4-5 positive), matching the Figma source exactly. Use
+ * `heading`/`subtitle` only if a consuming app genuinely needs to override that copy.
+ *
+ * @part close - The close button.
+ * @part heading - The heading text.
+ * @part subtitle - The subtitle text.
+ * @part star - A single star button (`::part(star)` matches all five).
+ * @part label - The "Tell us what you think" label (only rendered before submitting).
+ * @part textarea - The comment textarea (only rendered before submitting).
+ * @part comment - The submitted comment, read-only (only rendered after submitting, if a comment was given).
+ * @part submit - The "Submit feedback" button (only rendered before submitting).
+ * @part new-chat - The "Start new chat" button.
+ * @prop --bs-chatbot-feedback-bg - Card background. Aliased to `--bs-surface-raised`.
+ * @prop --bs-chatbot-feedback-border - Card border color. Aliased to `--bs-border-default`.
+ * @prop --bs-chatbot-feedback-radius - Card corner radius. Aliased to `--bs-border-radius-200`.
+ * @prop --bs-chatbot-feedback-padding-x - Card horizontal padding. Aliased to `--bs-spacing-250`.
+ * @prop --bs-chatbot-feedback-padding-y - Card vertical padding. Aliased to `--bs-spacing-550`.
+ * @prop --bs-chatbot-feedback-max-width - Max width of the card. Matches Figma's 762px.
+ * @prop --bs-chatbot-feedback-gap - Gap between the top content block and the button(s). Aliased
+ *   to `--bs-spacing-300`.
+ * @prop --bs-chatbot-feedback-top-gap - Gap between heading/subtitle, stars, and the
+ *   textarea/comment within the top block. Aliased to `--bs-spacing-250`.
+ * @prop --bs-chatbot-feedback-heading-color - Aliased to `--bs-text-default`.
+ * @prop --bs-chatbot-feedback-subtitle-color - Aliased to `--bs-text-secondary`.
+ * @prop --bs-chatbot-feedback-star-filled - Filled star color. Aliased to `--bs-color-primary-default`.
+ * @prop --bs-chatbot-feedback-star-empty - Empty star color. Aliased to `--bs-border-neutral-container`.
+ * @prop --bs-chatbot-feedback-comment-color - Submitted comment text color. Aliased to `--bs-text-default`.
+ * @prop --bs-chatbot-feedback-close-hover - Close button hover background. Aliased to `--bs-surface-hover`.
+ * @prop --bs-chatbot-feedback-primary-bg - "Submit feedback" / post-submit "Start new chat"
+ *   background. Aliased to `--bs-button-primary-default`.
+ * @prop --bs-chatbot-feedback-primary-bg-hover - Aliased to `--bs-button-primary-hover`.
+ * @prop --bs-chatbot-feedback-primary-bg-disabled - Aliased to `--bs-button-primary-disabled`.
+ * @prop --bs-chatbot-feedback-outlined-border - Pre-submit "Start new chat" border. Aliased to
+ *   `--bs-border-primary`.
+ * @prop --bs-chatbot-feedback-outlined-hover - Pre-submit "Start new chat" hover background.
+ *   Aliased to `--bs-color-primary-container-hover`.
+ * @prop --bs-chatbot-feedback-outlined-text - Pre-submit "Start new chat" text/icon color.
+ *   Aliased to `--bs-text-action`.
+ */
+export declare class BsChatbotFeedback {
+    /** Current star rating, 0-5. 0 means no rating has been given yet. */
+    rating: number;
+    /** Whether feedback has been submitted. Switches the card from the editable form to the
+     * read-only "thanks" view. */
+    submitted: boolean;
+    /** The comment text. */
+    comment: string;
+    /** Overrides the computed heading (see the class doc for why this is computed by default). */
+    heading?: string;
+    /** Overrides the computed subtitle. */
+    subtitle?: string;
+    /** Fires when a star is clicked, with the new rating. */
+    bsRatingChange: EventEmitter<number>;
+    /** Fires on every keystroke in the comment textarea, with the current value. */
+    bsCommentInput: EventEmitter<string>;
+    /** Fires when "Submit feedback" is clicked, with the current rating and comment. Also sets
+     * `submitted` to true. */
+    bsSubmit: EventEmitter<{
+        rating: number;
+        comment: string;
+    }>;
+    /** Fires when "Start new chat" is clicked. The consuming app owns actually starting a new chat. */
+    bsNewChat: EventEmitter<void>;
+    /** Fires when the close button is clicked. The consuming app owns actually hiding the card. */
+    bsClose: EventEmitter<void>;
+    private onStarClick;
+    private onCommentInput;
+    private onSubmitClick;
+    private onNewChatClick;
+    private onCloseClick;
+    private computedHeading;
+    private computedSubtitle;
+    render(): any;
+}

package/dist/types/components/bs-chatbot-feedback/bs-chatbot-feedback.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsChatbotFeedbackArgs {
+    rating: number;
+    submitted: boolean;
+    comment: string;
+}
+declare const meta: Meta<BsChatbotFeedbackArgs>;
+export default meta;
+type Story = StoryObj<BsChatbotFeedbackArgs>;
+export declare const Default: Story;
+export declare const OneStarSubmitted: Story;
+export declare const TwoStarsSubmitted: Story;
+export declare const ThreeStarsSubmitted: Story;
+export declare const FourStarsSubmitted: Story;
+export declare const FiveStarsSubmitted: Story;
+export declare const AllStates: Story;

package/dist/types/components/bs-chatbot-sources-drawer/bs-chatbot-sources-drawer.cmp.test.d.ts

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

package/dist/types/components/bs-chatbot-sources-drawer/bs-chatbot-sources-drawer.d.ts

@@ -0,0 +1,54 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * The "Sources" panel shown alongside a Genie AI chat response -- a header with a title, a count
+ * badge, and a collapse chevron, above a stack of `bs-source-link` citation rows.
+ *
+ * ## When to use
+ * - Displaying the documents/sources a Genie response cited, typically opened from a "view
+ *   sources" action on a `bs-chatbot-response-action` bar.
+ *
+ * ## When not to use
+ * - A generic list container -- this component's header (title + count + collapse) is
+ *   purpose-built for the sources use case.
+ *
+ * @slot - One or more `bs-source-link` rows.
+ * @slot collapse-icon - Overrides the default collapse chevron icon.
+ * @part heading - The "Sources" title text.
+ * @part count - The count badge next to the title.
+ * @part collapse - The collapse chevron button.
+ * @part list - The scrollable container of slotted `bs-source-link` rows.
+ * @prop --bs-chatbot-sources-drawer-bg - Background of the whole panel. Aliased to `--bs-surface-raised`.
+ * @prop --bs-chatbot-sources-drawer-header-shadow - Drop shadow under the header, separating it
+ *   from the scrolled list. Aliased to `--bs-shadow-xs`.
+ * @prop --bs-chatbot-sources-drawer-header-padding-x - Aliased to `--bs-spacing-200`.
+ * @prop --bs-chatbot-sources-drawer-header-padding-top - Aliased to `--bs-spacing-150`.
+ * @prop --bs-chatbot-sources-drawer-header-padding-bottom - Aliased to `--bs-spacing-100`.
+ * @prop --bs-chatbot-sources-drawer-heading-color - Aliased to `--bs-text-default`.
+ * @prop --bs-chatbot-sources-drawer-count-bg - Count badge background. Aliased to
+ *   `--bs-badge-bg-neutral-container`.
+ * @prop --bs-chatbot-sources-drawer-count-color - Count badge text color. Aliased to
+ *   `--bs-badge-text-neutral`.
+ * @prop --bs-chatbot-sources-drawer-collapse-hover - Collapse button background on hover. Aliased
+ *   to `--bs-surface-hover`.
+ * @prop --bs-chatbot-sources-drawer-section-gap - Gap between the header and the list. Aliased to
+ *   `--bs-spacing-200`.
+ * @prop --bs-chatbot-sources-drawer-list-padding - Horizontal/bottom padding of the list. Aliased
+ *   to `--bs-spacing-200`.
+ * @prop --bs-chatbot-sources-drawer-list-gap - Gap between rows. Aliased to `--bs-spacing-50`.
+ */
+export declare class BsChatbotSourcesDrawer {
+    el: HTMLElement;
+    /** The panel title. */
+    heading: string;
+    /**
+     * Overrides the auto-detected count badge. By default the badge reflects the number of slotted
+     * `bs-source-link` children, so most consumers don't need to set this.
+     */
+    count?: number;
+    /** Fires when the collapse chevron is clicked. The consuming app owns actually hiding the panel. */
+    bsCollapse: EventEmitter<void>;
+    private slottedCount;
+    private onSlotchange;
+    private onCollapseClick;
+    render(): any;
+}

package/dist/types/components/bs-chatbot-sources-drawer/bs-chatbot-sources-drawer.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+interface BsChatbotSourcesDrawerArgs {
+    heading: string;
+}
+declare const meta: Meta<BsChatbotSourcesDrawerArgs>;
+export default meta;
+type Story = StoryObj<BsChatbotSourcesDrawerArgs>;
+export declare const Default: Story;
+export declare const Empty: Story;
+export declare const ManySources: Story;

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

@@ -19,10 +19,14 @@ export type BsComposerState = 'idle' | 'generating' | 'disabled' | 'recording';
  * useful for e.g. focusing the composer after a parent view mounts, without reaching into its
  * shadow root.
  *
+ * @slot attachments - A `bs-attachment-list` (or other content) rendered inside the composer's own
+ *   bordered container, above the text field -- only takes up space/padding when it has assigned
+ *   content, so leaving it empty renders identically to not having the slot at all.
  * @slot actions-end - Extra consumer-supplied controls appended after the primary action button
  *   in the controls row (e.g. a product-specific "Tools" button). Slotted content is placed
  *   inline in the same flex row as attach/mic/action, so a slotted element should size itself to
  *   roughly match `--bs-composer-button-size` to align visually.
+ * @part attachments - The wrapper around the `attachments` slot.
  * @part attach - The "+" attach button.
  * @part input - The native text `<input>`.
  * @part mic - The secondary icon button (microphone, or the stop-recording square while `state="recording"`).
@@ -46,6 +50,7 @@ export type BsComposerState = 'idle' | 'generating' | 'disabled' | 'recording';
  * @prop --bs-composer-subtle-pressed - Background of the attach/mic buttons when pressed. Aliased to `--bs-color-neutral-container-pressed`.
  */
 export declare class BsComposer {
+    el: HTMLElement;
     /**
      * Which flavor of composer this is: changes the *default* placeholder text (set `placeholder`
      * directly to override it) and, per the Figma design, renders the container border dashed
@@ -70,6 +75,10 @@ export declare class BsComposer {
      * accessible name -- set it in every real usage.
      */
     ariaLabel: string | null;
+    /** Tracks whether the `attachments` slot has assigned content, so the row above the text field
+     * (padding, border) only takes up space when a consumer has actually put something there --
+     * same reasoning/pattern as `hasIcon`/`hasLabel` in `bs-attachment`. */
+    hasAttachments: boolean;
     /** Fires on every keystroke in the text field, with the current value. */
     bsInput: EventEmitter<string>;
     /** Fires when the primary action button is clicked while `state="idle"`. */
@@ -83,6 +92,11 @@ export declare class BsComposer {
     /** Fires when the mic/stop-recording button is clicked. The consumer decides what that means
      * (e.g. start recording when idle/generating, or stop recording when `state="recording"`). */
     bsMicToggle: EventEmitter<void>;
+    /** Computes the initial `hasAttachments` state directly from the host's light DOM children,
+     * before first render -- same reasoning as `bs-attachment`'s `componentWillLoad`: `slotchange`
+     * alone never fires for a slot that starts out empty and stays that way. */
+    componentWillLoad(): void;
+    private onAttachmentsSlotchange;
     private onInput;
     private onAttachClick;
     private onMicClick;

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

@@ -14,4 +14,5 @@ export declare const Human: Story;
 export declare const Generating: Story;
 export declare const Disabled: Story;
 export declare const Recording: Story;
+export declare const WithAttachments: Story;
 export declare const AllStates: Story;

package/dist/types/components/bs-composer-status-banner/bs-composer-status-banner.cmp.test.d.ts

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

package/dist/types/components/bs-composer-status-banner/bs-composer-status-banner.d.ts

@@ -0,0 +1,88 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type BsComposerStatusBannerType = 'error' | 'info' | 'neutral' | 'warning';
+/**
+ * A full-width status banner for use directly above `bs-composer`, surfacing a message about the
+ * composer's current state (e.g. a send failure, an informational notice) with an optional
+ * "Continue"-style action button and an optional close button.
+ *
+ * ## When to use
+ * - A message tied to the composer itself (send failed, rate-limited, draft restored, etc.) that
+ *   needs to sit directly above it, not a general-purpose alert -- see `CONVENTIONS.md` if this
+ *   library gains a generic banner/alert component later, and prefer that instead once it exists.
+ *
+ * ## When not to use
+ * - A toast/snackbar notification unrelated to the composer -- this component is not
+ *   self-dismissing and has no positioning of its own (it's a static block, not an overlay).
+ *
+ * @slot icon - Overrides the default leading icon. Only rendered when `showIcon` is true.
+ * @part icon - The leading icon wrapper.
+ * @part message - The message text.
+ * @part action - The optional "Continue"-style action button.
+ * @part close - The optional close button.
+ * @prop --bs-composer-status-banner-radius - Corner radius of the top-left/top-right corners
+ *   (bottom corners are square, so this sits flush above `bs-composer`). Aliased to
+ *   `--bs-border-radius-150`.
+ * @prop --bs-composer-status-banner-padding-x - Horizontal padding. Aliased to `--bs-spacing-150`.
+ * @prop --bs-composer-status-banner-padding-top - Top padding. Aliased to `--bs-spacing-100`.
+ * @prop --bs-composer-status-banner-padding-bottom - Bottom padding. Aliased to `--bs-spacing-200`.
+ * @prop --bs-composer-status-banner-gap - Gap between the message group and the action/close
+ *   controls. Aliased to `--bs-spacing-100`.
+ * @prop --bs-composer-status-banner-icon-gap - Gap between the icon and the message text.
+ *   Aliased to `--bs-spacing-75`.
+ * @prop --bs-composer-status-banner-error-bg - Background for `type="error"`. Aliased to
+ *   `--bs-color-error-container`.
+ * @prop --bs-composer-status-banner-error-text - Text/icon color for `type="error"`. Aliased to
+ *   `--bs-text-error`.
+ * @prop --bs-composer-status-banner-error-action-bg - Action button background for
+ *   `type="error"`. Aliased to `--bs-color-error-default`.
+ * @prop --bs-composer-status-banner-error-action-bg-hover - Aliased to `--bs-color-error-hover`.
+ * @prop --bs-composer-status-banner-info-bg - Background for `type="info"`. Aliased to
+ *   `--bs-color-info-container`.
+ * @prop --bs-composer-status-banner-info-text - Text/icon color for `type="info"`. Aliased to
+ *   `--bs-text-info`.
+ * @prop --bs-composer-status-banner-info-action-bg - Action button background for `type="info"`.
+ *   Aliased to `--bs-color-info-default`.
+ * @prop --bs-composer-status-banner-info-action-bg-hover - Aliased to `--bs-color-info-hover`.
+ * @prop --bs-composer-status-banner-neutral-bg - Background for `type="neutral"`. Aliased to
+ *   `--bs-color-neutral-container`.
+ * @prop --bs-composer-status-banner-neutral-text - Text/icon color for `type="neutral"`. Aliased
+ *   to `--bs-text-default`.
+ * @prop --bs-composer-status-banner-neutral-action-bg - Action button background for
+ *   `type="neutral"`. Aliased to `--bs-color-neutral-container`.
+ * @prop --bs-composer-status-banner-neutral-action-bg-hover - Aliased to
+ *   `--bs-color-neutral-container-hover`.
+ * @prop --bs-composer-status-banner-neutral-action-border - Action button border for
+ *   `type="neutral"` (the only variant whose action button is outlined). Aliased to
+ *   `--bs-border-neutral-container`.
+ * @prop --bs-composer-status-banner-warning-bg - Background for `type="warning"`. Aliased to
+ *   `--bs-color-warning-container`.
+ * @prop --bs-composer-status-banner-warning-text - Text/icon color for `type="warning"`. Aliased
+ *   to `--bs-text-warning`.
+ * @prop --bs-composer-status-banner-warning-action-bg - Action button background for
+ *   `type="warning"`. Aliased to `--bs-color-warning-default`.
+ * @prop --bs-composer-status-banner-warning-action-bg-hover - Aliased to
+ *   `--bs-color-warning-hover`.
+ * @prop --bs-composer-status-banner-close-hover-bg - Close button hover background (same across
+ *   every `type`). Aliased to `--bs-color-neutral-container-hover`.
+ */
+export declare class BsComposerStatusBanner {
+    /** Which severity/style to render. Drives background, text/icon color, and the action button's color. */
+    type: BsComposerStatusBannerType;
+    /** The message text. */
+    message: string;
+    /** Whether the leading icon (default: clock) is rendered. */
+    showIcon: boolean;
+    /** Whether the "Continue"-style action button is rendered. */
+    showButton: boolean;
+    /** Label for the action button, only rendered when `showButton` is true. */
+    actionLabel: string;
+    /** Whether the close button is rendered. */
+    allowClose: boolean;
+    /** Fires when the action button is clicked. Only relevant when `showButton` is true. */
+    bsAction: EventEmitter<void>;
+    /** Fires when the close button is clicked. Only relevant when `allowClose` is true. */
+    bsClose: EventEmitter<void>;
+    private onActionClick;
+    private onCloseClick;
+    render(): any;
+}

package/dist/types/components/bs-composer-status-banner/bs-composer-status-banner.stories.d.ts

@@ -0,0 +1,20 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+import type { BsComposerStatusBannerType } from './bs-composer-status-banner';
+interface BsComposerStatusBannerArgs {
+    type: BsComposerStatusBannerType;
+    message: string;
+    showIcon: boolean;
+    showButton: boolean;
+    actionLabel: string;
+    allowClose: boolean;
+}
+declare const meta: Meta<BsComposerStatusBannerArgs>;
+export default meta;
+type Story = StoryObj<BsComposerStatusBannerArgs>;
+export declare const Default: Story;
+export declare const Info: Story;
+export declare const Neutral: Story;
+export declare const Warning: Story;
+export declare const WithAction: Story;
+export declare const AllTypes: Story;
+export declare const AboveComposer: Story;