@brandsync/wc 0.0.4 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +203 -2
- package/dist/brandsync-wc/brandsync-wc.esm.js +1 -1
- package/dist/brandsync-wc/p-1dc6d7f5.entry.js +1 -0
- package/dist/brandsync-wc/{p-ea705742.entry.js → p-4a0da8e9.entry.js} +1 -1
- package/dist/brandsync-wc/p-4d999a8d.entry.js +1 -0
- package/dist/brandsync-wc/p-518b02bf.entry.js +1 -0
- package/dist/brandsync-wc/p-6648d251.entry.js +1 -0
- package/dist/cjs/brandsync-wc.cjs.js +1 -1
- package/dist/cjs/bs-chatbot-response-action.cjs.entry.js +30 -4
- package/dist/cjs/bs-chatbot-suggestion-button.cjs.entry.js +25 -0
- package/dist/cjs/bs-input.cjs.entry.js +2 -2
- package/dist/cjs/bs-menu-item.cjs.entry.js +29 -0
- package/dist/cjs/bs-menu.cjs.entry.js +17 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +4 -1
- package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.cmp.test.js +43 -2
- package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.css +13 -0
- package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.js +70 -6
- package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.stories.js +96 -0
- package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.cmp.test.js +24 -0
- package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.css +57 -0
- package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.js +104 -0
- package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.stories.js +30 -0
- package/dist/collection/components/bs-input/bs-input.js +2 -2
- package/dist/collection/components/bs-menu/bs-menu.cmp.test.js +18 -0
- package/dist/collection/components/bs-menu/bs-menu.css +20 -0
- package/dist/collection/components/bs-menu/bs-menu.js +39 -0
- package/dist/collection/components/bs-menu/bs-menu.stories.js +15 -0
- package/dist/collection/components/bs-menu-item/bs-menu-item.cmp.test.js +33 -0
- package/dist/collection/components/bs-menu-item/bs-menu-item.css +68 -0
- package/dist/collection/components/bs-menu-item/bs-menu-item.js +79 -0
- package/dist/collection/components/bs-menu-item/bs-menu-item.stories.js +37 -0
- package/dist/components/bs-chatbot-response-action.js +1 -1
- package/dist/components/bs-chatbot-suggestion-button.d.ts +11 -0
- package/dist/components/bs-chatbot-suggestion-button.js +1 -0
- package/dist/components/bs-input.js +1 -1
- package/dist/components/bs-menu-item.d.ts +11 -0
- package/dist/components/bs-menu-item.js +1 -0
- package/dist/components/bs-menu.d.ts +11 -0
- package/dist/components/bs-menu.js +1 -0
- package/dist/esm/brandsync-wc.js +1 -1
- package/dist/esm/bs-chatbot-response-action.entry.js +31 -5
- package/dist/esm/bs-chatbot-suggestion-button.entry.js +23 -0
- package/dist/esm/bs-input.entry.js +2 -2
- package/dist/esm/bs-menu-item.entry.js +27 -0
- package/dist/esm/bs-menu.entry.js +15 -0
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/bs-chatbot-response-action/bs-chatbot-response-action.d.ts +16 -2
- package/dist/types/components/bs-chatbot-response-action/bs-chatbot-response-action.stories.d.ts +1 -0
- package/dist/types/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.cmp.test.d.ts +1 -0
- package/dist/types/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.d.ts +46 -0
- package/dist/types/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.stories.d.ts +10 -0
- package/dist/types/components/bs-menu/bs-menu.cmp.test.d.ts +1 -0
- package/dist/types/components/bs-menu/bs-menu.d.ts +24 -0
- package/dist/types/components/bs-menu/bs-menu.stories.d.ts +5 -0
- package/dist/types/components/bs-menu-item/bs-menu-item.cmp.test.d.ts +1 -0
- package/dist/types/components/bs-menu-item/bs-menu-item.d.ts +38 -0
- package/dist/types/components/bs-menu-item/bs-menu-item.stories.d.ts +7 -0
- package/dist/types/components.d.ts +364 -3
- package/package.json +2 -1
- package/dist/brandsync-wc/p-4ce458bf.entry.js +0 -1
|
@@ -180,11 +180,54 @@ export namespace Components {
|
|
|
180
180
|
* @prop --bs-chatbot-response-action-sources-line-height - Aliased to `--bs-line-height-body-sm`.
|
|
181
181
|
*/
|
|
182
182
|
interface BsChatbotResponseAction {
|
|
183
|
+
/**
|
|
184
|
+
* Whether the "more options" popup menu (the `menu` slot) is currently open. Mutable + reflected so the component can track/close itself (kebab click, click outside, Escape) the same way `bs-chatbot-header`'s `expanded` prop tracks its own toggle state, while still emitting `bsMenuOpen` for the consumer to react to.
|
|
185
|
+
* @default false
|
|
186
|
+
*/
|
|
187
|
+
"menuOpen": boolean;
|
|
183
188
|
/**
|
|
184
189
|
* Number of sources backing the response. When set to a positive number, renders the "N sources" button (singular "1 source" / plural "N sources"). When unset or `0`, the button is not rendered at all.
|
|
185
190
|
*/
|
|
186
191
|
"sourcesCount"?: number;
|
|
187
192
|
}
|
|
193
|
+
/**
|
|
194
|
+
* A pill-shaped clickable suggestion chip for a Genie AI chat panel (e.g. "How can I help you?").
|
|
195
|
+
* One instance renders one chip -- to show several suggestion prompts side by side, render
|
|
196
|
+
* multiple `bs-chatbot-suggestion-button` elements inside a plain flex-wrap container; this
|
|
197
|
+
* library doesn't ship a separate list/group component for that since a `<div>` with
|
|
198
|
+
* `flex-wrap: wrap` is sufficient.
|
|
199
|
+
* ## When to use
|
|
200
|
+
* - Quick-reply/starter prompts shown above or alongside `bs-composer` in a Genie AI chat panel.
|
|
201
|
+
* ## When not to use
|
|
202
|
+
* - As a general-purpose button -- use `bs-button` instead, this component's pill shape and
|
|
203
|
+
* tonal color treatment are specific to Genie chat suggestion prompts.
|
|
204
|
+
* @prop --bs-chatbot-suggestion-button-radius - Corner radius. Aliased to `--bs-border-radius-full`.
|
|
205
|
+
* @prop --bs-chatbot-suggestion-button-border-color - Border color. Aliased to `--bs-border-primary`.
|
|
206
|
+
* @prop --bs-chatbot-suggestion-button-bg-default - Background in the default (enabled) state.
|
|
207
|
+
* Aliased to `--bs-color-primary-container`.
|
|
208
|
+
* @prop --bs-chatbot-suggestion-button-bg-hover - Background on hover. Aliased to
|
|
209
|
+
* `--bs-color-primary-container-hover`.
|
|
210
|
+
* @prop --bs-chatbot-suggestion-button-bg-pressed - Background when pressed. Aliased directly to
|
|
211
|
+
* the primitive `--bs-brand-200` -- there's no pre-built semantic "container-pressed" token
|
|
212
|
+
* matching this tonal button's lighter pressed shade progression (50 -> 100 -> 200), so this
|
|
213
|
+
* component aliases one locally (same situation `bs-button.css` documents for its
|
|
214
|
+
* subtle/outlined/success/warning/info variants).
|
|
215
|
+
* @prop --bs-chatbot-suggestion-button-bg-focus - Background when focused. Aliased to
|
|
216
|
+
* `--bs-color-primary-container-hover` (same as hover).
|
|
217
|
+
* @prop --bs-chatbot-suggestion-button-text-default - Text color in the default state. Aliased to
|
|
218
|
+
* `--bs-text-action`.
|
|
219
|
+
* @prop --bs-chatbot-suggestion-button-text-hover - Text color on hover, pressed, and focus.
|
|
220
|
+
* Aliased to `--bs-text-action-hover`.
|
|
221
|
+
* @prop --bs-chatbot-suggestion-button-focus-ring-color - Focus ring color. Aliased to
|
|
222
|
+
* `--bs-border-primary-focus`.
|
|
223
|
+
*/
|
|
224
|
+
interface BsChatbotSuggestionButton {
|
|
225
|
+
/**
|
|
226
|
+
* Disables the button and applies a reduced-opacity treatment.
|
|
227
|
+
* @default false
|
|
228
|
+
*/
|
|
229
|
+
"disabled": boolean;
|
|
230
|
+
}
|
|
188
231
|
/**
|
|
189
232
|
* A chat composer input for Genie AI-style conversational interfaces: a text field
|
|
190
233
|
* plus an attach button, a mic/voice-recording toggle, and a single primary action button whose
|
|
@@ -307,6 +350,44 @@ export namespace Components {
|
|
|
307
350
|
*/
|
|
308
351
|
"value": string;
|
|
309
352
|
}
|
|
353
|
+
/**
|
|
354
|
+
* A generic dropdown/popup menu container: a rounded, elevated list of items (typically
|
|
355
|
+
* `bs-menu-item` elements).
|
|
356
|
+
* ## When to use
|
|
357
|
+
* - A popup list of actions/options triggered by another control (e.g. a "more options" kebab
|
|
358
|
+
* button), such as `bs-chatbot-response-action`'s `menu` slot.
|
|
359
|
+
* ## When not to use
|
|
360
|
+
* - A persistent, always-visible list of options -- this component is purpose-built as a popup
|
|
361
|
+
* surface (rounded corners, elevation shadow), not a plain list.
|
|
362
|
+
* @prop --bs-menu-bg - Background of the menu box. Aliased to `--bs-surface-raised`.
|
|
363
|
+
* @prop --bs-menu-radius - Corner radius of the menu box. Aliased to `--bs-border-radius-100`.
|
|
364
|
+
* @prop --bs-menu-padding-y - Top/bottom padding of the menu box. Aliased to `--bs-spacing-50`.
|
|
365
|
+
* @prop --bs-menu-gap - Gap between slotted items. Aliased to `--bs-spacing-50`.
|
|
366
|
+
* @prop --bs-menu-shadow - Elevation shadow of the menu box. Aliased to `--bs-shadow-sm`.
|
|
367
|
+
*/
|
|
368
|
+
interface BsMenu {
|
|
369
|
+
}
|
|
370
|
+
/**
|
|
371
|
+
* A single selectable row inside a `bs-menu`: an optional icon plus a text label, rendered as a
|
|
372
|
+
* real `<button>` for correct keyboard/click semantics.
|
|
373
|
+
* ## When to use
|
|
374
|
+
* - As a child of `bs-menu`, one per selectable action/option.
|
|
375
|
+
* ## When not to use
|
|
376
|
+
* - Outside of `bs-menu` -- this component's sizing/hover treatment is designed to sit inside the
|
|
377
|
+
* menu's rounded, padded list box.
|
|
378
|
+
* @prop --bs-menu-item-radius - Corner radius of the row. Aliased to `--bs-border-radius-100`.
|
|
379
|
+
* @prop --bs-menu-item-padding-y - Top/bottom padding. Aliased to `--bs-spacing-100`.
|
|
380
|
+
* @prop --bs-menu-item-padding-x - Left/right padding. Aliased to `--bs-spacing-150`.
|
|
381
|
+
* @prop --bs-menu-item-gap - Gap between icon and label. Aliased to `--bs-spacing-100`.
|
|
382
|
+
* @prop --bs-menu-item-hover - Background on hover. Aliased to `--bs-color-neutral-container`.
|
|
383
|
+
* @prop --bs-menu-item-pressed - Background when pressed. Aliased to `--bs-color-neutral-container-pressed`.
|
|
384
|
+
* @prop --bs-menu-item-icon-color - Icon color. Aliased to `--bs-icon-default`.
|
|
385
|
+
* @prop --bs-menu-item-color - Label text color. Aliased to `--bs-text-muted`.
|
|
386
|
+
* @prop --bs-menu-item-font-size - Aliased to `--bs-font-size-md`.
|
|
387
|
+
* @prop --bs-menu-item-line-height - Aliased to `--bs-line-height-body-md`.
|
|
388
|
+
*/
|
|
389
|
+
interface BsMenuItem {
|
|
390
|
+
}
|
|
310
391
|
/**
|
|
311
392
|
* An overlay dialog that interrupts the current flow for a focused task or confirmation.
|
|
312
393
|
* Closes itself on backdrop click, Escape, or its own close button, and emits `bsClose`.
|
|
@@ -339,6 +420,10 @@ export interface BsChatbotResponseActionCustomEvent<T> extends CustomEvent<T> {
|
|
|
339
420
|
detail: T;
|
|
340
421
|
target: HTMLBsChatbotResponseActionElement;
|
|
341
422
|
}
|
|
423
|
+
export interface BsChatbotSuggestionButtonCustomEvent<T> extends CustomEvent<T> {
|
|
424
|
+
detail: T;
|
|
425
|
+
target: HTMLBsChatbotSuggestionButtonElement;
|
|
426
|
+
}
|
|
342
427
|
export interface BsComposerCustomEvent<T> extends CustomEvent<T> {
|
|
343
428
|
detail: T;
|
|
344
429
|
target: HTMLBsComposerElement;
|
|
@@ -351,6 +436,10 @@ export interface BsInputCustomEvent<T> extends CustomEvent<T> {
|
|
|
351
436
|
detail: T;
|
|
352
437
|
target: HTMLBsInputElement;
|
|
353
438
|
}
|
|
439
|
+
export interface BsMenuItemCustomEvent<T> extends CustomEvent<T> {
|
|
440
|
+
detail: T;
|
|
441
|
+
target: HTMLBsMenuItemElement;
|
|
442
|
+
}
|
|
354
443
|
export interface BsModalCustomEvent<T> extends CustomEvent<T> {
|
|
355
444
|
detail: T;
|
|
356
445
|
target: HTMLBsModalElement;
|
|
@@ -480,7 +569,7 @@ declare global {
|
|
|
480
569
|
"bsDislike": void;
|
|
481
570
|
"bsCopy": void;
|
|
482
571
|
"bsRegenerate": void;
|
|
483
|
-
"bsMenuOpen":
|
|
572
|
+
"bsMenuOpen": boolean;
|
|
484
573
|
"bsSourcesClick": void;
|
|
485
574
|
}
|
|
486
575
|
/**
|
|
@@ -521,6 +610,54 @@ declare global {
|
|
|
521
610
|
prototype: HTMLBsChatbotResponseActionElement;
|
|
522
611
|
new (): HTMLBsChatbotResponseActionElement;
|
|
523
612
|
};
|
|
613
|
+
interface HTMLBsChatbotSuggestionButtonElementEventMap {
|
|
614
|
+
"bsSelect": void;
|
|
615
|
+
}
|
|
616
|
+
/**
|
|
617
|
+
* A pill-shaped clickable suggestion chip for a Genie AI chat panel (e.g. "How can I help you?").
|
|
618
|
+
* One instance renders one chip -- to show several suggestion prompts side by side, render
|
|
619
|
+
* multiple `bs-chatbot-suggestion-button` elements inside a plain flex-wrap container; this
|
|
620
|
+
* library doesn't ship a separate list/group component for that since a `<div>` with
|
|
621
|
+
* `flex-wrap: wrap` is sufficient.
|
|
622
|
+
* ## When to use
|
|
623
|
+
* - Quick-reply/starter prompts shown above or alongside `bs-composer` in a Genie AI chat panel.
|
|
624
|
+
* ## When not to use
|
|
625
|
+
* - As a general-purpose button -- use `bs-button` instead, this component's pill shape and
|
|
626
|
+
* tonal color treatment are specific to Genie chat suggestion prompts.
|
|
627
|
+
* @prop --bs-chatbot-suggestion-button-radius - Corner radius. Aliased to `--bs-border-radius-full`.
|
|
628
|
+
* @prop --bs-chatbot-suggestion-button-border-color - Border color. Aliased to `--bs-border-primary`.
|
|
629
|
+
* @prop --bs-chatbot-suggestion-button-bg-default - Background in the default (enabled) state.
|
|
630
|
+
* Aliased to `--bs-color-primary-container`.
|
|
631
|
+
* @prop --bs-chatbot-suggestion-button-bg-hover - Background on hover. Aliased to
|
|
632
|
+
* `--bs-color-primary-container-hover`.
|
|
633
|
+
* @prop --bs-chatbot-suggestion-button-bg-pressed - Background when pressed. Aliased directly to
|
|
634
|
+
* the primitive `--bs-brand-200` -- there's no pre-built semantic "container-pressed" token
|
|
635
|
+
* matching this tonal button's lighter pressed shade progression (50 -> 100 -> 200), so this
|
|
636
|
+
* component aliases one locally (same situation `bs-button.css` documents for its
|
|
637
|
+
* subtle/outlined/success/warning/info variants).
|
|
638
|
+
* @prop --bs-chatbot-suggestion-button-bg-focus - Background when focused. Aliased to
|
|
639
|
+
* `--bs-color-primary-container-hover` (same as hover).
|
|
640
|
+
* @prop --bs-chatbot-suggestion-button-text-default - Text color in the default state. Aliased to
|
|
641
|
+
* `--bs-text-action`.
|
|
642
|
+
* @prop --bs-chatbot-suggestion-button-text-hover - Text color on hover, pressed, and focus.
|
|
643
|
+
* Aliased to `--bs-text-action-hover`.
|
|
644
|
+
* @prop --bs-chatbot-suggestion-button-focus-ring-color - Focus ring color. Aliased to
|
|
645
|
+
* `--bs-border-primary-focus`.
|
|
646
|
+
*/
|
|
647
|
+
interface HTMLBsChatbotSuggestionButtonElement extends Components.BsChatbotSuggestionButton, HTMLStencilElement {
|
|
648
|
+
addEventListener<K extends keyof HTMLBsChatbotSuggestionButtonElementEventMap>(type: K, listener: (this: HTMLBsChatbotSuggestionButtonElement, ev: BsChatbotSuggestionButtonCustomEvent<HTMLBsChatbotSuggestionButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
649
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
650
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
651
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
652
|
+
removeEventListener<K extends keyof HTMLBsChatbotSuggestionButtonElementEventMap>(type: K, listener: (this: HTMLBsChatbotSuggestionButtonElement, ev: BsChatbotSuggestionButtonCustomEvent<HTMLBsChatbotSuggestionButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
653
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
654
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
655
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
656
|
+
}
|
|
657
|
+
var HTMLBsChatbotSuggestionButtonElement: {
|
|
658
|
+
prototype: HTMLBsChatbotSuggestionButtonElement;
|
|
659
|
+
new (): HTMLBsChatbotSuggestionButtonElement;
|
|
660
|
+
};
|
|
524
661
|
interface HTMLBsComposerElementEventMap {
|
|
525
662
|
"bsInput": string;
|
|
526
663
|
"bsSubmit": void;
|
|
@@ -631,6 +768,63 @@ declare global {
|
|
|
631
768
|
prototype: HTMLBsInputElement;
|
|
632
769
|
new (): HTMLBsInputElement;
|
|
633
770
|
};
|
|
771
|
+
/**
|
|
772
|
+
* A generic dropdown/popup menu container: a rounded, elevated list of items (typically
|
|
773
|
+
* `bs-menu-item` elements).
|
|
774
|
+
* ## When to use
|
|
775
|
+
* - A popup list of actions/options triggered by another control (e.g. a "more options" kebab
|
|
776
|
+
* button), such as `bs-chatbot-response-action`'s `menu` slot.
|
|
777
|
+
* ## When not to use
|
|
778
|
+
* - A persistent, always-visible list of options -- this component is purpose-built as a popup
|
|
779
|
+
* surface (rounded corners, elevation shadow), not a plain list.
|
|
780
|
+
* @prop --bs-menu-bg - Background of the menu box. Aliased to `--bs-surface-raised`.
|
|
781
|
+
* @prop --bs-menu-radius - Corner radius of the menu box. Aliased to `--bs-border-radius-100`.
|
|
782
|
+
* @prop --bs-menu-padding-y - Top/bottom padding of the menu box. Aliased to `--bs-spacing-50`.
|
|
783
|
+
* @prop --bs-menu-gap - Gap between slotted items. Aliased to `--bs-spacing-50`.
|
|
784
|
+
* @prop --bs-menu-shadow - Elevation shadow of the menu box. Aliased to `--bs-shadow-sm`.
|
|
785
|
+
*/
|
|
786
|
+
interface HTMLBsMenuElement extends Components.BsMenu, HTMLStencilElement {
|
|
787
|
+
}
|
|
788
|
+
var HTMLBsMenuElement: {
|
|
789
|
+
prototype: HTMLBsMenuElement;
|
|
790
|
+
new (): HTMLBsMenuElement;
|
|
791
|
+
};
|
|
792
|
+
interface HTMLBsMenuItemElementEventMap {
|
|
793
|
+
"bsSelect": void;
|
|
794
|
+
}
|
|
795
|
+
/**
|
|
796
|
+
* A single selectable row inside a `bs-menu`: an optional icon plus a text label, rendered as a
|
|
797
|
+
* real `<button>` for correct keyboard/click semantics.
|
|
798
|
+
* ## When to use
|
|
799
|
+
* - As a child of `bs-menu`, one per selectable action/option.
|
|
800
|
+
* ## When not to use
|
|
801
|
+
* - Outside of `bs-menu` -- this component's sizing/hover treatment is designed to sit inside the
|
|
802
|
+
* menu's rounded, padded list box.
|
|
803
|
+
* @prop --bs-menu-item-radius - Corner radius of the row. Aliased to `--bs-border-radius-100`.
|
|
804
|
+
* @prop --bs-menu-item-padding-y - Top/bottom padding. Aliased to `--bs-spacing-100`.
|
|
805
|
+
* @prop --bs-menu-item-padding-x - Left/right padding. Aliased to `--bs-spacing-150`.
|
|
806
|
+
* @prop --bs-menu-item-gap - Gap between icon and label. Aliased to `--bs-spacing-100`.
|
|
807
|
+
* @prop --bs-menu-item-hover - Background on hover. Aliased to `--bs-color-neutral-container`.
|
|
808
|
+
* @prop --bs-menu-item-pressed - Background when pressed. Aliased to `--bs-color-neutral-container-pressed`.
|
|
809
|
+
* @prop --bs-menu-item-icon-color - Icon color. Aliased to `--bs-icon-default`.
|
|
810
|
+
* @prop --bs-menu-item-color - Label text color. Aliased to `--bs-text-muted`.
|
|
811
|
+
* @prop --bs-menu-item-font-size - Aliased to `--bs-font-size-md`.
|
|
812
|
+
* @prop --bs-menu-item-line-height - Aliased to `--bs-line-height-body-md`.
|
|
813
|
+
*/
|
|
814
|
+
interface HTMLBsMenuItemElement extends Components.BsMenuItem, HTMLStencilElement {
|
|
815
|
+
addEventListener<K extends keyof HTMLBsMenuItemElementEventMap>(type: K, listener: (this: HTMLBsMenuItemElement, ev: BsMenuItemCustomEvent<HTMLBsMenuItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
816
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
817
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
818
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
819
|
+
removeEventListener<K extends keyof HTMLBsMenuItemElementEventMap>(type: K, listener: (this: HTMLBsMenuItemElement, ev: BsMenuItemCustomEvent<HTMLBsMenuItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
820
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
821
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
822
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
823
|
+
}
|
|
824
|
+
var HTMLBsMenuItemElement: {
|
|
825
|
+
prototype: HTMLBsMenuItemElement;
|
|
826
|
+
new (): HTMLBsMenuItemElement;
|
|
827
|
+
};
|
|
634
828
|
interface HTMLBsModalElementEventMap {
|
|
635
829
|
"bsClose": void;
|
|
636
830
|
}
|
|
@@ -666,9 +860,12 @@ declare global {
|
|
|
666
860
|
"bs-card": HTMLBsCardElement;
|
|
667
861
|
"bs-chatbot-header": HTMLBsChatbotHeaderElement;
|
|
668
862
|
"bs-chatbot-response-action": HTMLBsChatbotResponseActionElement;
|
|
863
|
+
"bs-chatbot-suggestion-button": HTMLBsChatbotSuggestionButtonElement;
|
|
669
864
|
"bs-composer": HTMLBsComposerElement;
|
|
670
865
|
"bs-data-table": HTMLBsDataTableElement;
|
|
671
866
|
"bs-input": HTMLBsInputElement;
|
|
867
|
+
"bs-menu": HTMLBsMenuElement;
|
|
868
|
+
"bs-menu-item": HTMLBsMenuItemElement;
|
|
672
869
|
"bs-modal": HTMLBsModalElement;
|
|
673
870
|
}
|
|
674
871
|
}
|
|
@@ -849,6 +1046,11 @@ declare namespace LocalJSX {
|
|
|
849
1046
|
* @prop --bs-chatbot-response-action-sources-line-height - Aliased to `--bs-line-height-body-sm`.
|
|
850
1047
|
*/
|
|
851
1048
|
interface BsChatbotResponseAction {
|
|
1049
|
+
/**
|
|
1050
|
+
* Whether the "more options" popup menu (the `menu` slot) is currently open. Mutable + reflected so the component can track/close itself (kebab click, click outside, Escape) the same way `bs-chatbot-header`'s `expanded` prop tracks its own toggle state, while still emitting `bsMenuOpen` for the consumer to react to.
|
|
1051
|
+
* @default false
|
|
1052
|
+
*/
|
|
1053
|
+
"menuOpen"?: boolean;
|
|
852
1054
|
/**
|
|
853
1055
|
* Fires when the "Copy" button is clicked.
|
|
854
1056
|
*/
|
|
@@ -862,9 +1064,9 @@ declare namespace LocalJSX {
|
|
|
862
1064
|
*/
|
|
863
1065
|
"onBsLike"?: (event: BsChatbotResponseActionCustomEvent<void>) => void;
|
|
864
1066
|
/**
|
|
865
|
-
* Fires when the "More options" button is clicked.
|
|
1067
|
+
* Fires when the "More options" button is clicked or the menu is closed (click outside, Escape), with the new `menuOpen` value.
|
|
866
1068
|
*/
|
|
867
|
-
"onBsMenuOpen"?: (event: BsChatbotResponseActionCustomEvent<
|
|
1069
|
+
"onBsMenuOpen"?: (event: BsChatbotResponseActionCustomEvent<boolean>) => void;
|
|
868
1070
|
/**
|
|
869
1071
|
* Fires when the "Regenerate" button is clicked.
|
|
870
1072
|
*/
|
|
@@ -878,6 +1080,48 @@ declare namespace LocalJSX {
|
|
|
878
1080
|
*/
|
|
879
1081
|
"sourcesCount"?: number;
|
|
880
1082
|
}
|
|
1083
|
+
/**
|
|
1084
|
+
* A pill-shaped clickable suggestion chip for a Genie AI chat panel (e.g. "How can I help you?").
|
|
1085
|
+
* One instance renders one chip -- to show several suggestion prompts side by side, render
|
|
1086
|
+
* multiple `bs-chatbot-suggestion-button` elements inside a plain flex-wrap container; this
|
|
1087
|
+
* library doesn't ship a separate list/group component for that since a `<div>` with
|
|
1088
|
+
* `flex-wrap: wrap` is sufficient.
|
|
1089
|
+
* ## When to use
|
|
1090
|
+
* - Quick-reply/starter prompts shown above or alongside `bs-composer` in a Genie AI chat panel.
|
|
1091
|
+
* ## When not to use
|
|
1092
|
+
* - As a general-purpose button -- use `bs-button` instead, this component's pill shape and
|
|
1093
|
+
* tonal color treatment are specific to Genie chat suggestion prompts.
|
|
1094
|
+
* @prop --bs-chatbot-suggestion-button-radius - Corner radius. Aliased to `--bs-border-radius-full`.
|
|
1095
|
+
* @prop --bs-chatbot-suggestion-button-border-color - Border color. Aliased to `--bs-border-primary`.
|
|
1096
|
+
* @prop --bs-chatbot-suggestion-button-bg-default - Background in the default (enabled) state.
|
|
1097
|
+
* Aliased to `--bs-color-primary-container`.
|
|
1098
|
+
* @prop --bs-chatbot-suggestion-button-bg-hover - Background on hover. Aliased to
|
|
1099
|
+
* `--bs-color-primary-container-hover`.
|
|
1100
|
+
* @prop --bs-chatbot-suggestion-button-bg-pressed - Background when pressed. Aliased directly to
|
|
1101
|
+
* the primitive `--bs-brand-200` -- there's no pre-built semantic "container-pressed" token
|
|
1102
|
+
* matching this tonal button's lighter pressed shade progression (50 -> 100 -> 200), so this
|
|
1103
|
+
* component aliases one locally (same situation `bs-button.css` documents for its
|
|
1104
|
+
* subtle/outlined/success/warning/info variants).
|
|
1105
|
+
* @prop --bs-chatbot-suggestion-button-bg-focus - Background when focused. Aliased to
|
|
1106
|
+
* `--bs-color-primary-container-hover` (same as hover).
|
|
1107
|
+
* @prop --bs-chatbot-suggestion-button-text-default - Text color in the default state. Aliased to
|
|
1108
|
+
* `--bs-text-action`.
|
|
1109
|
+
* @prop --bs-chatbot-suggestion-button-text-hover - Text color on hover, pressed, and focus.
|
|
1110
|
+
* Aliased to `--bs-text-action-hover`.
|
|
1111
|
+
* @prop --bs-chatbot-suggestion-button-focus-ring-color - Focus ring color. Aliased to
|
|
1112
|
+
* `--bs-border-primary-focus`.
|
|
1113
|
+
*/
|
|
1114
|
+
interface BsChatbotSuggestionButton {
|
|
1115
|
+
/**
|
|
1116
|
+
* Disables the button and applies a reduced-opacity treatment.
|
|
1117
|
+
* @default false
|
|
1118
|
+
*/
|
|
1119
|
+
"disabled"?: boolean;
|
|
1120
|
+
/**
|
|
1121
|
+
* Fires when the button is clicked.
|
|
1122
|
+
*/
|
|
1123
|
+
"onBsSelect"?: (event: BsChatbotSuggestionButtonCustomEvent<void>) => void;
|
|
1124
|
+
}
|
|
881
1125
|
/**
|
|
882
1126
|
* A chat composer input for Genie AI-style conversational interfaces: a text field
|
|
883
1127
|
* plus an attach button, a mic/voice-recording toggle, and a single primary action button whose
|
|
@@ -1028,6 +1272,48 @@ declare namespace LocalJSX {
|
|
|
1028
1272
|
*/
|
|
1029
1273
|
"value"?: string;
|
|
1030
1274
|
}
|
|
1275
|
+
/**
|
|
1276
|
+
* A generic dropdown/popup menu container: a rounded, elevated list of items (typically
|
|
1277
|
+
* `bs-menu-item` elements).
|
|
1278
|
+
* ## When to use
|
|
1279
|
+
* - A popup list of actions/options triggered by another control (e.g. a "more options" kebab
|
|
1280
|
+
* button), such as `bs-chatbot-response-action`'s `menu` slot.
|
|
1281
|
+
* ## When not to use
|
|
1282
|
+
* - A persistent, always-visible list of options -- this component is purpose-built as a popup
|
|
1283
|
+
* surface (rounded corners, elevation shadow), not a plain list.
|
|
1284
|
+
* @prop --bs-menu-bg - Background of the menu box. Aliased to `--bs-surface-raised`.
|
|
1285
|
+
* @prop --bs-menu-radius - Corner radius of the menu box. Aliased to `--bs-border-radius-100`.
|
|
1286
|
+
* @prop --bs-menu-padding-y - Top/bottom padding of the menu box. Aliased to `--bs-spacing-50`.
|
|
1287
|
+
* @prop --bs-menu-gap - Gap between slotted items. Aliased to `--bs-spacing-50`.
|
|
1288
|
+
* @prop --bs-menu-shadow - Elevation shadow of the menu box. Aliased to `--bs-shadow-sm`.
|
|
1289
|
+
*/
|
|
1290
|
+
interface BsMenu {
|
|
1291
|
+
}
|
|
1292
|
+
/**
|
|
1293
|
+
* A single selectable row inside a `bs-menu`: an optional icon plus a text label, rendered as a
|
|
1294
|
+
* real `<button>` for correct keyboard/click semantics.
|
|
1295
|
+
* ## When to use
|
|
1296
|
+
* - As a child of `bs-menu`, one per selectable action/option.
|
|
1297
|
+
* ## When not to use
|
|
1298
|
+
* - Outside of `bs-menu` -- this component's sizing/hover treatment is designed to sit inside the
|
|
1299
|
+
* menu's rounded, padded list box.
|
|
1300
|
+
* @prop --bs-menu-item-radius - Corner radius of the row. Aliased to `--bs-border-radius-100`.
|
|
1301
|
+
* @prop --bs-menu-item-padding-y - Top/bottom padding. Aliased to `--bs-spacing-100`.
|
|
1302
|
+
* @prop --bs-menu-item-padding-x - Left/right padding. Aliased to `--bs-spacing-150`.
|
|
1303
|
+
* @prop --bs-menu-item-gap - Gap between icon and label. Aliased to `--bs-spacing-100`.
|
|
1304
|
+
* @prop --bs-menu-item-hover - Background on hover. Aliased to `--bs-color-neutral-container`.
|
|
1305
|
+
* @prop --bs-menu-item-pressed - Background when pressed. Aliased to `--bs-color-neutral-container-pressed`.
|
|
1306
|
+
* @prop --bs-menu-item-icon-color - Icon color. Aliased to `--bs-icon-default`.
|
|
1307
|
+
* @prop --bs-menu-item-color - Label text color. Aliased to `--bs-text-muted`.
|
|
1308
|
+
* @prop --bs-menu-item-font-size - Aliased to `--bs-font-size-md`.
|
|
1309
|
+
* @prop --bs-menu-item-line-height - Aliased to `--bs-line-height-body-md`.
|
|
1310
|
+
*/
|
|
1311
|
+
interface BsMenuItem {
|
|
1312
|
+
/**
|
|
1313
|
+
* Fires when the item is clicked.
|
|
1314
|
+
*/
|
|
1315
|
+
"onBsSelect"?: (event: BsMenuItemCustomEvent<void>) => void;
|
|
1316
|
+
}
|
|
1031
1317
|
/**
|
|
1032
1318
|
* An overlay dialog that interrupts the current flow for a focused task or confirmation.
|
|
1033
1319
|
* Closes itself on backdrop click, Escape, or its own close button, and emits `bsClose`.
|
|
@@ -1075,6 +1361,10 @@ declare namespace LocalJSX {
|
|
|
1075
1361
|
}
|
|
1076
1362
|
interface BsChatbotResponseActionAttributes {
|
|
1077
1363
|
"sourcesCount": number;
|
|
1364
|
+
"menuOpen": boolean;
|
|
1365
|
+
}
|
|
1366
|
+
interface BsChatbotSuggestionButtonAttributes {
|
|
1367
|
+
"disabled": boolean;
|
|
1078
1368
|
}
|
|
1079
1369
|
interface BsComposerAttributes {
|
|
1080
1370
|
"variant": BsComposerVariant;
|
|
@@ -1110,9 +1400,12 @@ declare namespace LocalJSX {
|
|
|
1110
1400
|
"bs-card": Omit<BsCard, keyof BsCardAttributes> & { [K in keyof BsCard & keyof BsCardAttributes]?: BsCard[K] } & { [K in keyof BsCard & keyof BsCardAttributes as `attr:${K}`]?: BsCardAttributes[K] } & { [K in keyof BsCard & keyof BsCardAttributes as `prop:${K}`]?: BsCard[K] };
|
|
1111
1401
|
"bs-chatbot-header": Omit<BsChatbotHeader, keyof BsChatbotHeaderAttributes> & { [K in keyof BsChatbotHeader & keyof BsChatbotHeaderAttributes]?: BsChatbotHeader[K] } & { [K in keyof BsChatbotHeader & keyof BsChatbotHeaderAttributes as `attr:${K}`]?: BsChatbotHeaderAttributes[K] } & { [K in keyof BsChatbotHeader & keyof BsChatbotHeaderAttributes as `prop:${K}`]?: BsChatbotHeader[K] };
|
|
1112
1402
|
"bs-chatbot-response-action": Omit<BsChatbotResponseAction, keyof BsChatbotResponseActionAttributes> & { [K in keyof BsChatbotResponseAction & keyof BsChatbotResponseActionAttributes]?: BsChatbotResponseAction[K] } & { [K in keyof BsChatbotResponseAction & keyof BsChatbotResponseActionAttributes as `attr:${K}`]?: BsChatbotResponseActionAttributes[K] } & { [K in keyof BsChatbotResponseAction & keyof BsChatbotResponseActionAttributes as `prop:${K}`]?: BsChatbotResponseAction[K] };
|
|
1403
|
+
"bs-chatbot-suggestion-button": Omit<BsChatbotSuggestionButton, keyof BsChatbotSuggestionButtonAttributes> & { [K in keyof BsChatbotSuggestionButton & keyof BsChatbotSuggestionButtonAttributes]?: BsChatbotSuggestionButton[K] } & { [K in keyof BsChatbotSuggestionButton & keyof BsChatbotSuggestionButtonAttributes as `attr:${K}`]?: BsChatbotSuggestionButtonAttributes[K] } & { [K in keyof BsChatbotSuggestionButton & keyof BsChatbotSuggestionButtonAttributes as `prop:${K}`]?: BsChatbotSuggestionButton[K] };
|
|
1113
1404
|
"bs-composer": Omit<BsComposer, keyof BsComposerAttributes> & { [K in keyof BsComposer & keyof BsComposerAttributes]?: BsComposer[K] } & { [K in keyof BsComposer & keyof BsComposerAttributes as `attr:${K}`]?: BsComposerAttributes[K] } & { [K in keyof BsComposer & keyof BsComposerAttributes as `prop:${K}`]?: BsComposer[K] };
|
|
1114
1405
|
"bs-data-table": Omit<BsDataTable, keyof BsDataTableAttributes> & { [K in keyof BsDataTable & keyof BsDataTableAttributes]?: BsDataTable[K] } & { [K in keyof BsDataTable & keyof BsDataTableAttributes as `attr:${K}`]?: BsDataTableAttributes[K] } & { [K in keyof BsDataTable & keyof BsDataTableAttributes as `prop:${K}`]?: BsDataTable[K] };
|
|
1115
1406
|
"bs-input": Omit<BsInput, keyof BsInputAttributes> & { [K in keyof BsInput & keyof BsInputAttributes]?: BsInput[K] } & { [K in keyof BsInput & keyof BsInputAttributes as `attr:${K}`]?: BsInputAttributes[K] } & { [K in keyof BsInput & keyof BsInputAttributes as `prop:${K}`]?: BsInput[K] };
|
|
1407
|
+
"bs-menu": BsMenu;
|
|
1408
|
+
"bs-menu-item": BsMenuItem;
|
|
1116
1409
|
"bs-modal": Omit<BsModal, keyof BsModalAttributes> & { [K in keyof BsModal & keyof BsModalAttributes]?: BsModal[K] } & { [K in keyof BsModal & keyof BsModalAttributes as `attr:${K}`]?: BsModalAttributes[K] } & { [K in keyof BsModal & keyof BsModalAttributes as `prop:${K}`]?: BsModal[K] };
|
|
1117
1410
|
}
|
|
1118
1411
|
}
|
|
@@ -1225,6 +1518,38 @@ declare module "@stencil/core" {
|
|
|
1225
1518
|
* @prop --bs-chatbot-response-action-sources-line-height - Aliased to `--bs-line-height-body-sm`.
|
|
1226
1519
|
*/
|
|
1227
1520
|
"bs-chatbot-response-action": LocalJSX.IntrinsicElements["bs-chatbot-response-action"] & JSXBase.HTMLAttributes<HTMLBsChatbotResponseActionElement>;
|
|
1521
|
+
/**
|
|
1522
|
+
* A pill-shaped clickable suggestion chip for a Genie AI chat panel (e.g. "How can I help you?").
|
|
1523
|
+
* One instance renders one chip -- to show several suggestion prompts side by side, render
|
|
1524
|
+
* multiple `bs-chatbot-suggestion-button` elements inside a plain flex-wrap container; this
|
|
1525
|
+
* library doesn't ship a separate list/group component for that since a `<div>` with
|
|
1526
|
+
* `flex-wrap: wrap` is sufficient.
|
|
1527
|
+
* ## When to use
|
|
1528
|
+
* - Quick-reply/starter prompts shown above or alongside `bs-composer` in a Genie AI chat panel.
|
|
1529
|
+
* ## When not to use
|
|
1530
|
+
* - As a general-purpose button -- use `bs-button` instead, this component's pill shape and
|
|
1531
|
+
* tonal color treatment are specific to Genie chat suggestion prompts.
|
|
1532
|
+
* @prop --bs-chatbot-suggestion-button-radius - Corner radius. Aliased to `--bs-border-radius-full`.
|
|
1533
|
+
* @prop --bs-chatbot-suggestion-button-border-color - Border color. Aliased to `--bs-border-primary`.
|
|
1534
|
+
* @prop --bs-chatbot-suggestion-button-bg-default - Background in the default (enabled) state.
|
|
1535
|
+
* Aliased to `--bs-color-primary-container`.
|
|
1536
|
+
* @prop --bs-chatbot-suggestion-button-bg-hover - Background on hover. Aliased to
|
|
1537
|
+
* `--bs-color-primary-container-hover`.
|
|
1538
|
+
* @prop --bs-chatbot-suggestion-button-bg-pressed - Background when pressed. Aliased directly to
|
|
1539
|
+
* the primitive `--bs-brand-200` -- there's no pre-built semantic "container-pressed" token
|
|
1540
|
+
* matching this tonal button's lighter pressed shade progression (50 -> 100 -> 200), so this
|
|
1541
|
+
* component aliases one locally (same situation `bs-button.css` documents for its
|
|
1542
|
+
* subtle/outlined/success/warning/info variants).
|
|
1543
|
+
* @prop --bs-chatbot-suggestion-button-bg-focus - Background when focused. Aliased to
|
|
1544
|
+
* `--bs-color-primary-container-hover` (same as hover).
|
|
1545
|
+
* @prop --bs-chatbot-suggestion-button-text-default - Text color in the default state. Aliased to
|
|
1546
|
+
* `--bs-text-action`.
|
|
1547
|
+
* @prop --bs-chatbot-suggestion-button-text-hover - Text color on hover, pressed, and focus.
|
|
1548
|
+
* Aliased to `--bs-text-action-hover`.
|
|
1549
|
+
* @prop --bs-chatbot-suggestion-button-focus-ring-color - Focus ring color. Aliased to
|
|
1550
|
+
* `--bs-border-primary-focus`.
|
|
1551
|
+
*/
|
|
1552
|
+
"bs-chatbot-suggestion-button": LocalJSX.IntrinsicElements["bs-chatbot-suggestion-button"] & JSXBase.HTMLAttributes<HTMLBsChatbotSuggestionButtonElement>;
|
|
1228
1553
|
/**
|
|
1229
1554
|
* A chat composer input for Genie AI-style conversational interfaces: a text field
|
|
1230
1555
|
* plus an attach button, a mic/voice-recording toggle, and a single primary action button whose
|
|
@@ -1280,6 +1605,42 @@ declare module "@stencil/core" {
|
|
|
1280
1605
|
* - A fixed set of choices — use a select/radio/checkbox component instead of free text.
|
|
1281
1606
|
*/
|
|
1282
1607
|
"bs-input": LocalJSX.IntrinsicElements["bs-input"] & JSXBase.HTMLAttributes<HTMLBsInputElement>;
|
|
1608
|
+
/**
|
|
1609
|
+
* A generic dropdown/popup menu container: a rounded, elevated list of items (typically
|
|
1610
|
+
* `bs-menu-item` elements).
|
|
1611
|
+
* ## When to use
|
|
1612
|
+
* - A popup list of actions/options triggered by another control (e.g. a "more options" kebab
|
|
1613
|
+
* button), such as `bs-chatbot-response-action`'s `menu` slot.
|
|
1614
|
+
* ## When not to use
|
|
1615
|
+
* - A persistent, always-visible list of options -- this component is purpose-built as a popup
|
|
1616
|
+
* surface (rounded corners, elevation shadow), not a plain list.
|
|
1617
|
+
* @prop --bs-menu-bg - Background of the menu box. Aliased to `--bs-surface-raised`.
|
|
1618
|
+
* @prop --bs-menu-radius - Corner radius of the menu box. Aliased to `--bs-border-radius-100`.
|
|
1619
|
+
* @prop --bs-menu-padding-y - Top/bottom padding of the menu box. Aliased to `--bs-spacing-50`.
|
|
1620
|
+
* @prop --bs-menu-gap - Gap between slotted items. Aliased to `--bs-spacing-50`.
|
|
1621
|
+
* @prop --bs-menu-shadow - Elevation shadow of the menu box. Aliased to `--bs-shadow-sm`.
|
|
1622
|
+
*/
|
|
1623
|
+
"bs-menu": LocalJSX.IntrinsicElements["bs-menu"] & JSXBase.HTMLAttributes<HTMLBsMenuElement>;
|
|
1624
|
+
/**
|
|
1625
|
+
* A single selectable row inside a `bs-menu`: an optional icon plus a text label, rendered as a
|
|
1626
|
+
* real `<button>` for correct keyboard/click semantics.
|
|
1627
|
+
* ## When to use
|
|
1628
|
+
* - As a child of `bs-menu`, one per selectable action/option.
|
|
1629
|
+
* ## When not to use
|
|
1630
|
+
* - Outside of `bs-menu` -- this component's sizing/hover treatment is designed to sit inside the
|
|
1631
|
+
* menu's rounded, padded list box.
|
|
1632
|
+
* @prop --bs-menu-item-radius - Corner radius of the row. Aliased to `--bs-border-radius-100`.
|
|
1633
|
+
* @prop --bs-menu-item-padding-y - Top/bottom padding. Aliased to `--bs-spacing-100`.
|
|
1634
|
+
* @prop --bs-menu-item-padding-x - Left/right padding. Aliased to `--bs-spacing-150`.
|
|
1635
|
+
* @prop --bs-menu-item-gap - Gap between icon and label. Aliased to `--bs-spacing-100`.
|
|
1636
|
+
* @prop --bs-menu-item-hover - Background on hover. Aliased to `--bs-color-neutral-container`.
|
|
1637
|
+
* @prop --bs-menu-item-pressed - Background when pressed. Aliased to `--bs-color-neutral-container-pressed`.
|
|
1638
|
+
* @prop --bs-menu-item-icon-color - Icon color. Aliased to `--bs-icon-default`.
|
|
1639
|
+
* @prop --bs-menu-item-color - Label text color. Aliased to `--bs-text-muted`.
|
|
1640
|
+
* @prop --bs-menu-item-font-size - Aliased to `--bs-font-size-md`.
|
|
1641
|
+
* @prop --bs-menu-item-line-height - Aliased to `--bs-line-height-body-md`.
|
|
1642
|
+
*/
|
|
1643
|
+
"bs-menu-item": LocalJSX.IntrinsicElements["bs-menu-item"] & JSXBase.HTMLAttributes<HTMLBsMenuItemElement>;
|
|
1283
1644
|
/**
|
|
1284
1645
|
* An overlay dialog that interrupts the current flow for a focused task or confirmation.
|
|
1285
1646
|
* Closes itself on backdrop click, Escape, or its own close button, and emits `bsClose`.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brandsync/wc",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"@stencil/vitest": "^1.8.3",
|
|
55
55
|
"@storybook/addon-a11y": "^10.5.8",
|
|
56
56
|
"@storybook/addon-docs": "^10.5.8",
|
|
57
|
+
"@storybook/addon-vitest": "^10.5.8",
|
|
57
58
|
"@storybook/web-components-vite": "^10.5.8",
|
|
58
59
|
"@types/node": "^22.13.5",
|
|
59
60
|
"@vitest/browser-playwright": "^4.0.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as o,c as t,h as e}from"./p-nLORuTUY.js";const s=class{constructor(e){o(this,e),this.bsLike=t(this,"bsLike"),this.bsDislike=t(this,"bsDislike"),this.bsCopy=t(this,"bsCopy"),this.bsRegenerate=t(this,"bsRegenerate"),this.bsMenuOpen=t(this,"bsMenuOpen"),this.bsSourcesClick=t(this,"bsSourcesClick")}sourcesCount;bsLike;bsDislike;bsCopy;bsRegenerate;bsMenuOpen;bsSourcesClick;onLikeClick=()=>{this.bsLike.emit()};onDislikeClick=()=>{this.bsDislike.emit()};onCopyClick=()=>{this.bsCopy.emit()};onRegenerateClick=()=>{this.bsRegenerate.emit()};onMenuClick=()=>{this.bsMenuOpen.emit()};onSourcesClick=()=>{this.bsSourcesClick.emit()};render(){const o=!!this.sourcesCount&&this.sourcesCount>0;return e("div",{key:"61a46c51ffba5e1256a94cbab87ce6e06e45941f",class:"bs-chatbot-response-action"},e("button",{key:"33e8e29235191bc2a4128074d5df08cc304dbefb",type:"button",part:"like",class:"bs-chatbot-response-action__button","aria-label":"Like",onClick:this.onLikeClick},e("slot",{key:"2337aa07fec93d12e6706ded394248f0353b91e6",name:"like-icon"},e(r,{key:"9be56ca48cbb7027ba608ea9f8e89c2c14f98eee"}))),e("button",{key:"fcdd8f3d4028a0e91cd5e10525ac97febf2261b6",type:"button",part:"dislike",class:"bs-chatbot-response-action__button","aria-label":"Dislike",onClick:this.onDislikeClick},e("slot",{key:"bc219702b5e935659aa7824596511e8b01d2014f",name:"dislike-icon"},e(n,{key:"5ec9da81d5a89d1d2a35dbfe88682214178204cb"}))),e("button",{key:"59d6b3032d141092537d9e56ced8e3045b40384f",type:"button",part:"copy",class:"bs-chatbot-response-action__button","aria-label":"Copy",onClick:this.onCopyClick},e("slot",{key:"e5bd9fbc4774ae9d67707803819697b56c516984",name:"copy-icon"},e(a,{key:"e7f8f643920bad3f88c597bb183cfc71f8319c46"}))),e("button",{key:"a6bd1be8be7f0f70157a5a5e37bc18d2c94462fc",type:"button",part:"regenerate",class:"bs-chatbot-response-action__button","aria-label":"Regenerate",onClick:this.onRegenerateClick},e("slot",{key:"7d35981706ea38ae1e613047945dde9d67a94c62",name:"regenerate-icon"},e(i,{key:"1d2dacd4bba68fcd120317bb207e7aa25bc0f62f"}))),e("button",{key:"32f3f790f4024cd7b58ba6f291d32b3f5f0dbbc8",type:"button",part:"menu",class:"bs-chatbot-response-action__button","aria-label":"More options",onClick:this.onMenuClick},e("slot",{key:"0aaf67bbc34bdf5d12247f9ab264a75dad63f996",name:"menu-icon"},e(c,{key:"c32d76d1e6f73cd9a82bbf4371a4d047b807b80c"}))),o&&e("button",{key:"240f26ed6ec5faded1efe1f171da10e4a292011e",type:"button",part:"sources",class:"bs-chatbot-response-action__sources",onClick:this.onSourcesClick},e("slot",{key:"e97e26840df27d2ff281882823bae7556d53bdc6",name:"sources-icon"},e(b,{key:"5dd3538a28ee3cf22b2801258024386827b9c774"})),e("span",{key:"acf07f2bba262a08c3f2d9650b9fd09fab51d172",class:"bs-chatbot-response-action__sources-label"},this.sourcesCount," ",1===this.sourcesCount?"source":"sources")))}},r=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M2.5 8.125H6.25V16.25H2.5C2.33424 16.25 2.17527 16.1842 2.05806 16.0669C1.94085 15.9497 1.875 15.7908 1.875 15.625V8.75C1.875 8.58424 1.94085 8.42527 2.05806 8.30806C2.17527 8.19085 2.33424 8.125 2.5 8.125Z",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.25 8.125L9.375 1.875C10.038 1.875 10.6739 2.13839 11.1428 2.60723C11.6116 3.07607 11.875 3.71196 11.875 4.375V6.25H16.875C17.0523 6.25005 17.2276 6.28782 17.3892 6.36081C17.5508 6.4338 17.695 6.54033 17.8123 6.67333C17.9295 6.80634 18.0172 6.96277 18.0693 7.13223C18.1215 7.3017 18.137 7.48033 18.1148 7.65625L17.1773 15.1562C17.1393 15.4583 16.9923 15.736 16.7641 15.9374C16.5358 16.1388 16.2419 16.2499 15.9375 16.25H6.25",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})),n=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M2.5 3.75H6.25V11.875H2.5C2.33424 11.875 2.17527 11.8092 2.05806 11.6919C1.94085 11.5747 1.875 11.4158 1.875 11.25V4.375C1.875 4.20924 1.94085 4.05027 2.05806 3.93306C2.17527 3.81585 2.33424 3.75 2.5 3.75Z",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.25 11.875L9.375 18.125C10.038 18.125 10.6739 17.8616 11.1428 17.3928C11.6116 16.9239 11.875 16.288 11.875 15.625V13.75H16.875C17.0523 13.75 17.2276 13.7122 17.3892 13.6392C17.5508 13.5662 17.695 13.4597 17.8123 13.3267C17.9295 13.1937 18.0172 13.0372 18.0693 12.8678C18.1215 12.6983 18.137 12.5197 18.1148 12.3438L17.1773 4.84375C17.1393 4.54174 16.9923 4.26399 16.7641 4.06262C16.5358 3.86124 16.2419 3.75009 15.9375 3.75H6.25",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})),a=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M13.125 13.125H16.875V3.125H6.875V6.875",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M13.125 6.875H3.125V16.875H13.125V6.875Z",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})),i=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M13.125 7.5H16.875V3.75",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M16.875 7.5L14.6656 5.29063C13.3861 4.01117 11.6538 3.28772 9.84437 3.27719C8.03494 3.26666 6.29431 3.9699 5 5.23438",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.875 12.5H3.125V16.25",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M3.125 12.5L5.33437 14.7094C6.61388 15.9888 8.34621 16.7123 10.1556 16.7228C11.9651 16.7333 13.7057 16.0301 15 14.7656",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"})),c=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M10 9.11426C10.489 9.11426 10.8857 9.511 10.8857 10C10.8857 10.489 10.489 10.8857 10 10.8857C9.511 10.8857 9.11426 10.489 9.11426 10C9.11426 9.511 9.511 9.11426 10 9.11426Z",fill:"currentColor",stroke:"currentColor","stroke-width":"0.104167"}),e("path",{d:"M10 3.80176C10.489 3.80176 10.8857 4.1985 10.8857 4.6875C10.8857 5.1765 10.489 5.57324 10 5.57324C9.511 5.57324 9.11426 5.1765 9.11426 4.6875C9.11426 4.1985 9.511 3.80176 10 3.80176Z",fill:"currentColor",stroke:"currentColor","stroke-width":"0.104167"}),e("path",{d:"M10 16.25C10.5178 16.25 10.9375 15.8303 10.9375 15.3125C10.9375 14.7947 10.5178 14.375 10 14.375C9.48223 14.375 9.0625 14.7947 9.0625 15.3125C9.0625 15.8303 9.48223 16.25 10 16.25Z",fill:"currentColor"})),b=()=>e("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e("path",{d:"M13.125 17.5H4.375C4.20924 17.5 4.05027 17.4342 3.93306 17.3169C3.81585 17.1997 3.75 17.0408 3.75 16.875V5.625C3.75 5.45924 3.81585 5.30027 3.93306 5.18306C4.05027 5.06585 4.20924 5 4.375 5H10.625L13.75 8.125V16.875C13.75 17.0408 13.6842 17.1997 13.5669 17.3169C13.4497 17.4342 13.2908 17.5 13.125 17.5Z",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.25 5V3.125C6.25 2.95924 6.31585 2.80027 6.43306 2.68306C6.55027 2.56585 6.70924 2.5 6.875 2.5H13.125L16.25 5.625V14.375C16.25 14.5408 16.1842 14.6997 16.0669 14.8169C15.9497 14.9342 15.7908 15 15.625 15H13.75",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.875 11.875H10.625",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}),e("path",{d:"M6.875 14.375H10.625",stroke:"currentColor","stroke-width":"1.66667","stroke-linecap":"round","stroke-linejoin":"round"}));s.style=":host{display:block;--bs-chatbot-response-action-gap:var(--bs-spacing-100);--bs-chatbot-response-action-padding-top:var(--bs-spacing-150);--bs-chatbot-response-action-padding-bottom:var(--bs-spacing-50);--bs-chatbot-response-action-button-size:var(--bs-spacing-400);--bs-chatbot-response-action-button-radius:var(--bs-border-radius-100);--bs-chatbot-response-action-button-hover:var(--bs-color-neutral-container);--bs-chatbot-response-action-button-pressed:var(--bs-color-neutral-container-pressed);--bs-chatbot-response-action-icon:var(--bs-icon-neutral-default);--bs-chatbot-response-action-sources-gap:var(--bs-spacing-50);--bs-chatbot-response-action-sources-padding-left:var(--bs-spacing-100);--bs-chatbot-response-action-sources-padding-right:var(--bs-spacing-150);--bs-chatbot-response-action-sources-color:var(--bs-text-neutral-default);--bs-chatbot-response-action-sources-font-size:var(--bs-font-size-sm);--bs-chatbot-response-action-sources-line-height:var(--bs-line-height-body-sm)}.bs-chatbot-response-action{box-sizing:border-box;display:flex;align-items:center;gap:var(--bs-chatbot-response-action-gap);padding-top:var(--bs-chatbot-response-action-padding-top);padding-bottom:var(--bs-chatbot-response-action-padding-bottom);background:transparent;font-family:inherit}.bs-chatbot-response-action__button{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:none;padding:0;cursor:pointer;background:transparent;color:var(--bs-chatbot-response-action-icon);font-family:inherit;border-radius:var(--bs-chatbot-response-action-button-radius);width:var(--bs-chatbot-response-action-button-size);height:var(--bs-chatbot-response-action-button-size);flex-shrink:0;transition:background-color var(--bs-duration-fast) var(--bs-easing-standard)}.bs-chatbot-response-action__button:focus-visible{outline:2px solid var(--bs-border-neutral-focus);outline-offset:2px}.bs-chatbot-response-action__button svg{width:20px;height:20px}.bs-chatbot-response-action__button:hover{background:var(--bs-chatbot-response-action-button-hover)}.bs-chatbot-response-action__button:active{background:var(--bs-chatbot-response-action-button-pressed)}.bs-chatbot-response-action__sources{display:inline-flex;align-items:center;box-sizing:border-box;border:none;cursor:pointer;background:transparent;color:var(--bs-chatbot-response-action-sources-color);font-family:inherit;font-size:var(--bs-chatbot-response-action-sources-font-size);line-height:calc(var(--bs-chatbot-response-action-sources-line-height) * 1px);gap:var(--bs-chatbot-response-action-sources-gap);border-radius:var(--bs-chatbot-response-action-button-radius);height:var(--bs-chatbot-response-action-button-size);padding-left:var(--bs-chatbot-response-action-sources-padding-left);padding-right:var(--bs-chatbot-response-action-sources-padding-right);flex-shrink:0;transition:background-color var(--bs-duration-fast) var(--bs-easing-standard)}.bs-chatbot-response-action__sources:focus-visible{outline:2px solid var(--bs-border-neutral-focus);outline-offset:2px}.bs-chatbot-response-action__sources svg{width:20px;height:20px;flex-shrink:0}.bs-chatbot-response-action__sources:hover{background:var(--bs-chatbot-response-action-button-hover)}.bs-chatbot-response-action__sources:active{background:var(--bs-chatbot-response-action-button-pressed)}.bs-chatbot-response-action__sources-label{white-space:nowrap}";export{s as bs_chatbot_response_action}
|