@brandsync/wc 1.13.0 → 1.14.0
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/CHANGELOG.md +6 -0
- package/REFERENCE.md +31 -0
- package/custom-elements.json +204 -0
- package/dist/brandsync-wc/brandsync-wc.esm.js +1 -1
- package/dist/brandsync-wc/{p-c3da3080.entry.js → p-056608f0.entry.js} +1 -1
- package/dist/brandsync-wc/{p-cd53bba9.entry.js → p-0e738622.entry.js} +1 -1
- package/dist/brandsync-wc/{p-4ea9b6a1.entry.js → p-16c78ff6.entry.js} +1 -1
- package/dist/brandsync-wc/{p-3f6682f8.entry.js → p-204cc690.entry.js} +1 -1
- package/dist/brandsync-wc/p-221244a9.entry.js +1 -0
- package/dist/brandsync-wc/{p-ed5c2d97.entry.js → p-227a5182.entry.js} +1 -1
- package/dist/brandsync-wc/{p-9b58c0c5.entry.js → p-2967240d.entry.js} +1 -1
- package/dist/brandsync-wc/{p-68f0be29.entry.js → p-2c1efaa1.entry.js} +1 -1
- package/dist/brandsync-wc/{p-cceb8484.entry.js → p-2e68b76e.entry.js} +1 -1
- package/dist/brandsync-wc/{p-23cc532f.entry.js → p-315b510c.entry.js} +1 -1
- package/dist/brandsync-wc/{p-53362609.entry.js → p-31cd66e0.entry.js} +1 -1
- package/dist/brandsync-wc/p-3477539c.entry.js +1 -0
- package/dist/brandsync-wc/{p-0e940ee1.entry.js → p-3dabf202.entry.js} +1 -1
- package/dist/brandsync-wc/{p-d64cae57.entry.js → p-4b40a596.entry.js} +1 -1
- package/dist/brandsync-wc/{p-f134a502.entry.js → p-51f40972.entry.js} +1 -1
- package/dist/brandsync-wc/{p-9cf8274a.entry.js → p-617bd76d.entry.js} +1 -1
- package/dist/brandsync-wc/{p-f8d47004.entry.js → p-686297f1.entry.js} +1 -1
- package/dist/brandsync-wc/{p-86028548.entry.js → p-80700878.entry.js} +1 -1
- package/dist/brandsync-wc/{p-b0b2e525.entry.js → p-833f9dc4.entry.js} +1 -1
- package/dist/brandsync-wc/{p-fb4d0093.entry.js → p-9fa67924.entry.js} +1 -1
- package/dist/brandsync-wc/{p-fa34fe20.entry.js → p-a2e59aca.entry.js} +1 -1
- package/dist/brandsync-wc/{p-95f034fc.entry.js → p-b793a0d6.entry.js} +1 -1
- package/dist/brandsync-wc/{p-ab07c9b5.entry.js → p-c488cc8b.entry.js} +1 -1
- package/dist/brandsync-wc/p-c67bc817.entry.js +1 -0
- package/dist/brandsync-wc/{p-4ea435a6.entry.js → p-cc1055e6.entry.js} +1 -1
- package/dist/brandsync-wc/{p-c679b631.entry.js → p-cc25ee67.entry.js} +1 -1
- package/dist/brandsync-wc/{p-07966676.entry.js → p-d892277f.entry.js} +1 -1
- package/dist/brandsync-wc/{p-e0504a4b.entry.js → p-dd52209a.entry.js} +1 -1
- package/dist/brandsync-wc/{p-694fe468.entry.js → p-df3e7973.entry.js} +1 -1
- package/dist/brandsync-wc/{p-7e24dbd7.entry.js → p-e0927a9a.entry.js} +1 -1
- package/dist/brandsync-wc/{p-4054a944.entry.js → p-e6fc2cd4.entry.js} +1 -1
- package/dist/cjs/brandsync-wc.cjs.js +1 -1
- package/dist/cjs/bs-accordion-group.cjs.entry.js +1 -1
- package/dist/cjs/bs-ai-disclaimer.cjs.entry.js +1 -1
- package/dist/cjs/bs-ai-greeting.cjs.entry.js +1 -1
- package/dist/cjs/bs-ai-thinking.cjs.entry.js +1 -1
- package/dist/cjs/bs-attachment-list.cjs.entry.js +1 -1
- package/dist/cjs/bs-breadcrumbs.cjs.entry.js +1 -1
- package/dist/cjs/bs-button-skeleton.cjs.entry.js +1 -1
- package/dist/cjs/bs-chatbot-feedback.cjs.entry.js +1 -1
- package/dist/cjs/bs-chatbot-header.cjs.entry.js +1 -1
- package/dist/cjs/bs-chatbot-response-action.cjs.entry.js +1 -1
- package/dist/cjs/bs-chatbot-sources-drawer.cjs.entry.js +1 -1
- package/dist/cjs/bs-chatbot-suggestion-button.cjs.entry.js +1 -1
- package/dist/cjs/bs-checkbox-skeleton.cjs.entry.js +1 -1
- package/dist/cjs/bs-citation-preview.cjs.entry.js +1 -1
- package/dist/cjs/bs-inline-tab.cjs.entry.js +1 -1
- package/dist/cjs/bs-input_3.cjs.entry.js +4 -4
- package/dist/cjs/bs-message-list.cjs.entry.js +1 -1
- package/dist/cjs/bs-navigation-drawer-item.cjs.entry.js +1 -1
- package/dist/cjs/bs-navigation-drawer.cjs.entry.js +2 -2
- package/dist/cjs/bs-pagination.cjs.entry.js +1 -1
- package/dist/cjs/bs-radio.cjs.entry.js +1 -1
- package/dist/cjs/bs-source-link.cjs.entry.js +2 -2
- package/dist/cjs/bs-split-pane.cjs.entry.js +193 -0
- package/dist/cjs/bs-stepper-step.cjs.entry.js +1 -1
- package/dist/cjs/bs-stepper.cjs.entry.js +1 -1
- package/dist/cjs/bs-switch.cjs.entry.js +1 -1
- package/dist/cjs/bs-tab_3.cjs.entry.js +3 -3
- package/dist/cjs/bs-timepicker.cjs.entry.js +2 -2
- package/dist/cjs/bs-toast.cjs.entry.js +1 -1
- package/dist/cjs/bs-tooltip-trigger.cjs.entry.js +1 -1
- package/dist/cjs/bs-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/bs-accordion-group/bs-accordion-group.js +1 -1
- package/dist/collection/components/bs-ai-disclaimer/bs-ai-disclaimer.js +1 -1
- package/dist/collection/components/bs-ai-greeting/bs-ai-greeting.js +1 -1
- package/dist/collection/components/bs-ai-thinking/bs-ai-thinking.js +1 -1
- package/dist/collection/components/bs-attachment-list/bs-attachment-list.js +1 -1
- package/dist/collection/components/bs-breadcrumb/bs-breadcrumbs/bs-breadcrumbs.js +1 -1
- package/dist/collection/components/bs-button-skeleton/bs-button-skeleton.js +1 -1
- package/dist/collection/components/bs-chatbot-feedback/bs-chatbot-feedback.js +1 -1
- package/dist/collection/components/bs-chatbot-header/bs-chatbot-header.js +1 -1
- package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.js +1 -1
- package/dist/collection/components/bs-chatbot-sources-drawer/bs-chatbot-sources-drawer.js +1 -1
- package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.js +1 -1
- package/dist/collection/components/bs-checkbox/bs-checkbox-skeleton/bs-checkbox-skeleton.js +1 -1
- package/dist/collection/components/bs-citation-preview/bs-citation-preview.js +1 -1
- package/dist/collection/components/bs-input/bs-input.js +2 -2
- package/dist/collection/components/bs-menu/bs-menu.js +1 -1
- package/dist/collection/components/bs-menu-item/bs-menu-item.js +1 -1
- package/dist/collection/components/bs-message-list/bs-message-list.js +1 -1
- package/dist/collection/components/bs-pagination/bs-pagination.js +1 -1
- package/dist/collection/components/bs-radio/bs-radio.js +1 -1
- package/dist/collection/components/bs-source-link/bs-source-link.js +2 -2
- package/dist/collection/components/bs-split-pane/bs-split-pane.cmp.test.js +107 -0
- package/dist/collection/components/bs-split-pane/bs-split-pane.css +108 -0
- package/dist/collection/components/bs-split-pane/bs-split-pane.js +404 -0
- package/dist/collection/components/bs-split-pane/bs-split-pane.stories.js +47 -0
- package/dist/collection/components/bs-stepper/bs-stepper/bs-stepper.js +1 -1
- package/dist/collection/components/bs-stepper/bs-stepper-step/bs-stepper-step.js +1 -1
- package/dist/collection/components/bs-switch/bs-switch.js +1 -1
- package/dist/collection/components/bs-tab/bs-inline-tab/bs-inline-tab.js +1 -1
- package/dist/collection/components/bs-tab/bs-tab/bs-tab.js +1 -1
- package/dist/collection/components/bs-tab/bs-tabs/bs-tabs.js +1 -1
- package/dist/collection/components/bs-timepicker/bs-timepicker.js +2 -2
- package/dist/collection/components/bs-toast/bs-toast.js +1 -1
- package/dist/collection/components/bs-tooltip/bs-tooltip.js +1 -1
- package/dist/collection/components/bs-tooltip-trigger/bs-tooltip-trigger.js +1 -1
- package/dist/collection/components/bs-whats-new-entry/bs-whats-new-entry.js +1 -1
- package/dist/collection/components/ui-shell/bs-navigation-drawer/bs-navigation-drawer/bs-navigation-drawer.js +2 -2
- package/dist/collection/components/ui-shell/bs-navigation-drawer/bs-navigation-drawer-item/bs-navigation-drawer-item.js +1 -1
- package/dist/components/bs-accordion-group.js +1 -1
- package/dist/components/bs-ai-disclaimer.js +1 -1
- package/dist/components/bs-ai-greeting.js +1 -1
- package/dist/components/bs-ai-thinking.js +1 -1
- package/dist/components/bs-attachment-list.js +1 -1
- package/dist/components/bs-breadcrumb-overflow.js +1 -1
- package/dist/components/bs-breadcrumbs.js +1 -1
- package/dist/components/bs-button-skeleton.js +1 -1
- package/dist/components/bs-carousel.js +1 -1
- package/dist/components/bs-chatbot-feedback.js +1 -1
- package/dist/components/bs-chatbot-header.js +1 -1
- package/dist/components/bs-chatbot-response-action.js +1 -1
- package/dist/components/bs-chatbot-sources-drawer.js +1 -1
- package/dist/components/bs-chatbot-suggestion-button.js +1 -1
- package/dist/components/bs-checkbox-skeleton.js +1 -1
- package/dist/components/bs-citation-preview.js +1 -1
- package/dist/components/bs-cookie-consent.js +1 -1
- package/dist/components/bs-datepicker.js +1 -1
- package/dist/components/bs-inline-tab.js +1 -1
- package/dist/components/bs-input.js +1 -1
- package/dist/components/bs-menu-item.js +1 -1
- package/dist/components/bs-menu.js +1 -1
- package/dist/components/bs-message-list.js +1 -1
- package/dist/components/bs-navigation-drawer-item.js +1 -1
- package/dist/components/bs-navigation-drawer.js +1 -1
- package/dist/components/bs-pagination.js +1 -1
- package/dist/components/bs-radio.js +1 -1
- package/dist/components/bs-session-timeout.js +1 -1
- package/dist/components/bs-source-link.js +1 -1
- package/dist/components/bs-split-pane.d.ts +11 -0
- package/dist/components/bs-split-pane.js +1 -0
- package/dist/components/bs-stepper-step.js +1 -1
- package/dist/components/bs-stepper.js +1 -1
- package/dist/components/bs-switch.js +1 -1
- package/dist/components/bs-tab.js +1 -1
- package/dist/components/bs-tabs.js +1 -1
- package/dist/components/bs-timepicker.js +1 -1
- package/dist/components/bs-toast.js +1 -1
- package/dist/components/bs-tooltip-trigger.js +1 -1
- package/dist/components/bs-tooltip.js +1 -1
- package/dist/components/bs-whats-new-entry.js +1 -1
- package/dist/components/bs-whats-new.js +1 -1
- package/dist/components/{p-Bfq5YVOv.js → p-BESyTlfT.js} +1 -1
- package/dist/components/{p-C9jIMBG3.js → p-BIW9eUic.js} +1 -1
- package/dist/components/{p-owdeCW0M.js → p-BJR8KVFc.js} +1 -1
- package/dist/components/{p-BVhF8cZQ.js → p-CDYw4Eyj.js} +1 -1
- package/dist/components/{p-C2NR1v3p.js → p-CiSEDtbE.js} +1 -1
- package/dist/components/{p-DfzrJKwN.js → p-Dm3TqgV_.js} +1 -1
- package/dist/components/{p-uHvS81XA.js → p-HAmR4gM2.js} +1 -1
- package/dist/components/{p-DqXI9V2A.js → p-HzaOqQ0U.js} +1 -1
- package/dist/components/{p-Dqg8l1y6.js → p-nC2VxRNo.js} +1 -1
- package/dist/components/{p-Cu-aeY9t.js → p-zscW5LNR.js} +1 -1
- package/dist/esm/brandsync-wc.js +1 -1
- package/dist/esm/bs-accordion-group.entry.js +1 -1
- package/dist/esm/bs-ai-disclaimer.entry.js +1 -1
- package/dist/esm/bs-ai-greeting.entry.js +1 -1
- package/dist/esm/bs-ai-thinking.entry.js +1 -1
- package/dist/esm/bs-attachment-list.entry.js +1 -1
- package/dist/esm/bs-breadcrumbs.entry.js +1 -1
- package/dist/esm/bs-button-skeleton.entry.js +1 -1
- package/dist/esm/bs-chatbot-feedback.entry.js +1 -1
- package/dist/esm/bs-chatbot-header.entry.js +1 -1
- package/dist/esm/bs-chatbot-response-action.entry.js +1 -1
- package/dist/esm/bs-chatbot-sources-drawer.entry.js +1 -1
- package/dist/esm/bs-chatbot-suggestion-button.entry.js +1 -1
- package/dist/esm/bs-checkbox-skeleton.entry.js +1 -1
- package/dist/esm/bs-citation-preview.entry.js +1 -1
- package/dist/esm/bs-inline-tab.entry.js +1 -1
- package/dist/esm/bs-input_3.entry.js +4 -4
- package/dist/esm/bs-message-list.entry.js +1 -1
- package/dist/esm/bs-navigation-drawer-item.entry.js +1 -1
- package/dist/esm/bs-navigation-drawer.entry.js +2 -2
- package/dist/esm/bs-pagination.entry.js +1 -1
- package/dist/esm/bs-radio.entry.js +1 -1
- package/dist/esm/bs-source-link.entry.js +2 -2
- package/dist/esm/bs-split-pane.entry.js +191 -0
- package/dist/esm/bs-stepper-step.entry.js +1 -1
- package/dist/esm/bs-stepper.entry.js +1 -1
- package/dist/esm/bs-switch.entry.js +1 -1
- package/dist/esm/bs-tab_3.entry.js +3 -3
- package/dist/esm/bs-timepicker.entry.js +2 -2
- package/dist/esm/bs-toast.entry.js +1 -1
- package/dist/esm/bs-tooltip-trigger.entry.js +1 -1
- package/dist/esm/bs-tooltip.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/bs-split-pane/bs-split-pane.cmp.test.d.ts +1 -0
- package/dist/types/components/bs-split-pane/bs-split-pane.d.ts +85 -0
- package/dist/types/components/bs-split-pane/bs-split-pane.stories.d.ts +15 -0
- package/dist/types/components.d.ts +216 -0
- package/package.json +1 -1
- package/reference.d.ts +3 -0
- package/reference.json +108 -0
- package/dist/brandsync-wc/p-4bbc4809.entry.js +0 -1
- package/dist/brandsync-wc/p-bf8bd386.entry.js +0 -1
|
@@ -29,7 +29,7 @@ export class BsAiThinking {
|
|
|
29
29
|
/** The status text shown next to the icon, e.g. "Retrieving", "Thinking", "Searching". */
|
|
30
30
|
label = 'Thinking';
|
|
31
31
|
render() {
|
|
32
|
-
return (h("div", { key: '
|
|
32
|
+
return (h("div", { key: '368acf47120feff31bebf80bba10251c6b63dc6d', class: "bs-ai-thinking", role: "status", "aria-live": "polite" }, h("img", { key: 'a9c52a26abbb236eb548378f465f95be7731f7fa', part: "icon", class: "bs-ai-thinking__icon", src: GENIE_MARK_ICON, alt: "", "aria-hidden": "true" }), h("span", { key: 'e3d2cc9d7ff4abd2edb59dcb84d50e4cf8fd30a0', part: "label", class: "bs-ai-thinking__label" }, this.label)));
|
|
33
33
|
}
|
|
34
34
|
static get is() { return "bs-ai-thinking"; }
|
|
35
35
|
static get encapsulation() { return "shadow"; }
|
|
@@ -58,7 +58,7 @@ export class BsAttachmentList {
|
|
|
58
58
|
this.canScrollRight = row.scrollWidth - row.clientWidth - row.scrollLeft > 1;
|
|
59
59
|
};
|
|
60
60
|
render() {
|
|
61
|
-
return (h("div", { key: '
|
|
61
|
+
return (h("div", { key: '86886f373a6a28533b3ad79debd2f6e9729d7a43', class: "bs-attachment-list" }, h("div", { key: 'b242f340394d6fab2f0d8ad7c1a4c0d52495c2fe', part: "row", class: "bs-attachment-list__row", ref: el => (this.row = el), onScroll: this.onScroll, role: "group", "aria-label": this.ariaLabel, tabIndex: 0 }, h("slot", { key: 'c086182c394a4339b93eaa7606131518abd4fbf8', onSlotchange: this.onSlotchange })), this.canScrollRight && h("div", { key: '2ec0247d1c8850cb2f03baf06d3b9333ab0850cd', part: "fade", class: "bs-attachment-list__fade", "aria-hidden": "true" })));
|
|
62
62
|
}
|
|
63
63
|
static get is() { return "bs-attachment-list"; }
|
|
64
64
|
static get encapsulation() { return "shadow"; }
|
|
@@ -54,7 +54,7 @@ export class BsBreadcrumbs {
|
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
57
|
-
return (h("nav", { key: '
|
|
57
|
+
return (h("nav", { key: '601a53dcb505cf95cd60b3ec0bc4dba88b79b82c', "aria-label": this.label }, h("ol", { key: 'ed1e51dc3035eb4de7901de736aa3e1de2c3369f', part: "list", class: "bs-breadcrumbs__list" }, h("slot", { key: '8307352b1aa135507f9fe4e6bb442e3f6d227e92', onSlotchange: this.onSlotChange }))));
|
|
58
58
|
}
|
|
59
59
|
static get is() { return "bs-breadcrumbs"; }
|
|
60
60
|
static get encapsulation() { return "shadow"; }
|
|
@@ -27,7 +27,7 @@ export class BsButtonSkeleton {
|
|
|
27
27
|
/** Accessible name announced for the loading placeholder. */
|
|
28
28
|
loadingLabel = 'Loading';
|
|
29
29
|
render() {
|
|
30
|
-
return h("span", { key: '
|
|
30
|
+
return h("span", { key: 'cdcad4b17ffefb2c677c57116450f2efbbd7f7ee', part: "container", class: `bs-button-skeleton bs-button-skeleton--${this.size}`, role: "status", "aria-label": this.loadingLabel });
|
|
31
31
|
}
|
|
32
32
|
static get is() { return "bs-button-skeleton"; }
|
|
33
33
|
static get encapsulation() { return "shadow"; }
|
|
@@ -139,7 +139,7 @@ export class BsChatbotFeedback {
|
|
|
139
139
|
}
|
|
140
140
|
render() {
|
|
141
141
|
const stars = [1, 2, 3, 4, 5];
|
|
142
|
-
return (h("div", { key: '
|
|
142
|
+
return (h("div", { key: 'fb1fcd6d5a4418686d146afabfedc2153c41cc50', class: "bs-chatbot-feedback", role: "region", "aria-label": this.computedHeading() }, h("button", { key: '8b6269cab2d3528db0a950c29afe3c24b2852e0f', type: "button", part: "close", class: "bs-chatbot-feedback__close", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h(CloseIcon, { key: '7597109d6a2a5d1aeec1ac2937fb196b1687fe94' })), h("div", { key: 'd58c1d655802372016c5738150cad2ff0f7ca760', class: "bs-chatbot-feedback__top" }, h("div", { key: '9b6b17d9a7ecf5eebc08dffef2a634cc36598445', class: "bs-chatbot-feedback__text" }, h("p", { key: 'df876305bdc9daf51fa30a34ec50031d682b7659', part: "heading", class: "bs-chatbot-feedback__heading" }, this.computedHeading()), h("p", { key: 'ecb66eeb92b7d8ffcb8c30336d2d7416153b218a', part: "subtitle", class: "bs-chatbot-feedback__subtitle" }, this.computedSubtitle())), h("div", { key: '066246d2be93871901daf8cadc7cedfe33694276', class: "bs-chatbot-feedback__stars", role: "radiogroup", "aria-label": this.ratingLabel }, stars.map(value => (h("button", { type: "button", part: "star", class: "bs-chatbot-feedback__star", role: "radio", "aria-checked": (this.rating >= value).toString(), "aria-label": `${value} ${value > 1 ? this.starsLabel : this.starLabel}`, disabled: this.submitted, onClick: () => this.onStarClick(value) }, h(StarIcon, { filled: this.rating >= value }))))), !this.submitted && (h("div", { key: '4a194ad30e60243a170538b76c32aaddcd81ce4a', class: "bs-chatbot-feedback__field" }, h("label", { key: '2477a8841011d8f361c2c6b9f919b1d1954e58f6', part: "label", class: "bs-chatbot-feedback__label", htmlFor: "bs-chatbot-feedback-comment" }, this.commentLabel), h("textarea", { key: '1fd34c6230f8d0e5807ffdd392b1316a4070f2bf', part: "textarea", id: "bs-chatbot-feedback-comment", class: "bs-chatbot-feedback__textarea", placeholder: this.commentPlaceholder, value: this.comment, onInput: this.onCommentInput }))), this.submitted && this.comment && (h("p", { key: 'be913ac5827f98868ffdd64d883dbede26b88c44', part: "comment", class: "bs-chatbot-feedback__comment" }, this.comment))), h("div", { key: 'cf15d26acd54707c110056d55120119f648ea481', class: "bs-chatbot-feedback__actions" }, !this.submitted && (h("button", { key: 'eea4eb9d2272aa0bdc3d85d075bb93e0a530c8f1', type: "button", part: "submit", class: "bs-chatbot-feedback__submit", disabled: this.rating === 0, onClick: this.onSubmitClick }, h(SendIcon, { key: 'f08cb743220f5b81d0ede08489212c2402db7218' }), this.submitLabel)), h("button", { key: '2398a72e7d84c6114bd4018d83c9bb2776372efa', type: "button", part: "new-chat", class: `bs-chatbot-feedback__new-chat ${this.submitted ? 'bs-chatbot-feedback__new-chat--primary' : 'bs-chatbot-feedback__new-chat--outlined'}`, onClick: this.onNewChatClick }, h(EditIcon, { key: 'b317890dd5338d01e56956aaa25e821306fe5c85' }), this.newChatLabel))));
|
|
143
143
|
}
|
|
144
144
|
static get is() { return "bs-chatbot-feedback"; }
|
|
145
145
|
static get encapsulation() { return "shadow"; }
|
|
@@ -93,7 +93,7 @@ export class BsChatbotHeader {
|
|
|
93
93
|
this.bsClose.emit();
|
|
94
94
|
};
|
|
95
95
|
render() {
|
|
96
|
-
return (h("div", { key: '
|
|
96
|
+
return (h("div", { key: '067f844bdce44a53ba20f8dd8cf0b3b49685b561', class: "bs-chatbot-header", role: "banner", "aria-label": this.heading }, h("div", { key: '47f00dc2c9911f3ac826c0095343c1b5411a05e9', part: "logo", class: "bs-chatbot-header__logo", role: "img", "aria-label": this.heading, innerHTML: GENIE_LOGO_SVG }), h("div", { key: 'b4659173574263a69005e87b5eb32ac7e0a7f8a4', class: "bs-chatbot-header__actions" }, h("slot", { key: '34f1bdfc64a741c177d1bd2cb59dbe7784174326', name: "actions" }), !this.hideNewChat && (h("span", { key: '6016641b3c32578aa8facf5c43bdafd185663286', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '401a7059f3771d652ec1b45a9ddb36acfee4527c', type: "button", part: "new-chat", class: "bs-chatbot-header__button", "aria-label": this.newChatLabel, onClick: this.onNewChatClick }, h("slot", { key: '556a2d99ef5c1610e05a7a5197bc7e00c50e7e67', name: "new-chat-icon" }, h(NewChatIcon, { key: '919eaa87751f9535c178e615af60a5c648f2340d' }))), h("bs-tooltip", { key: '2513109ec089fb11dcbf158e57d7cc99a9419dc3', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.newChatLabel))), !this.hideHistory && (h("span", { key: '5e4464efdbc17c1c256486442e2c82e013b2c2a8', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '5006fe5eebd4c4dc6438c8f5c3a8a3b7a81d2c62', type: "button", part: "history", class: "bs-chatbot-header__button", "aria-label": this.historyLabel, onClick: this.onHistoryClick }, h("slot", { key: '8a85cc6206d120b4d18df7b26812c79133de6aac', name: "history-icon" }, h(HistoryIcon, { key: '2cf98a72b3ae266894939f4966606fbfd5aaa024' }))), h("bs-tooltip", { key: 'bb78255428ab17ab4ed99a0c32c8e4c965bc81a3', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.historyLabel))), !this.hideExpand && (h("span", { key: 'cecbc8377fedccc22b181dc225511c915372c332', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '4b1312a7b0124935fe4c9ac18132edcd4d70dc23', type: "button", part: "expand", class: "bs-chatbot-header__button", "aria-label": this.expanded ? this.collapseLabel : this.expandLabel, "aria-pressed": this.expanded ? 'true' : 'false', onClick: this.onExpandClick }, h("slot", { key: 'a248a25a55155816aeb85cc7aac4f0e7e8e4eb6f', name: "expand-icon" }, h(ExpandIcon, { key: '2f929f0e1417582903ab86b081ebf425c61b04ee' }))), h("bs-tooltip", { key: 'f7597d0c2f10309a6600b743fa72e82d15d31b62', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.expanded ? this.collapseLabel : this.expandLabel))), !this.hideClose && (h("span", { key: '439063f4783010fc160ddb2353693621d53728e9', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: 'cb6a069d004ab472f3f4d78c406c61a95da4b9b0', type: "button", part: "close", class: "bs-chatbot-header__button", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h("slot", { key: '06e232992b67435162d33dab2783f7e8bd9b0f5d', name: "close-icon" }, h(CloseIcon, { key: 'e4d9191b0060305f1890f5a3c24eec65e243db35' }))), h("bs-tooltip", { key: '88f7c355b900614920a8d3f8d1350f4b238092cf', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.closeLabel))))));
|
|
97
97
|
}
|
|
98
98
|
static get is() { return "bs-chatbot-header"; }
|
|
99
99
|
static get encapsulation() { return "shadow"; }
|
|
@@ -127,7 +127,7 @@ export class BsChatbotResponseAction {
|
|
|
127
127
|
};
|
|
128
128
|
render() {
|
|
129
129
|
const hasSources = !!this.sourcesCount && this.sourcesCount > 0;
|
|
130
|
-
return (h("div", { key: '
|
|
130
|
+
return (h("div", { key: '4614a3168dbf9ce1db1584c86c3db10b35df119e', class: "bs-chatbot-response-action" }, h("button", { key: '90fbcf40c8860dd4f22e5c97411f151ef86cb116', type: "button", part: "like", class: "bs-chatbot-response-action__button", "aria-label": this.likeLabel, "aria-pressed": this.liked ? 'true' : 'false', onClick: this.onLikeClick }, h("slot", { key: 'e10152f4d2be972b8aeca87205c43b06ca441939', name: "like-icon" }, h(ThumbsUpIcon, { key: 'e28b734e0d92c44930d0374933a28adc398f9ea2' }))), h("button", { key: '2bf2bd404e013a244dd417680185012b711bffd1', type: "button", part: "dislike", class: "bs-chatbot-response-action__button", "aria-label": this.dislikeLabel, "aria-pressed": this.disliked ? 'true' : 'false', onClick: this.onDislikeClick }, h("slot", { key: 'f9b7ef8348ad7e461bd965307aeca091e737c26f', name: "dislike-icon" }, h(ThumbsDownIcon, { key: 'd6d7512ddc9dee63406afd17e6feda7f5af24606' }))), h("button", { key: '2cff63f4f000274fc559a4d8365230dd5edf1e40', type: "button", part: "copy", class: "bs-chatbot-response-action__button", "aria-label": this.copyLabel, onClick: this.onCopyClick }, h("slot", { key: '97209f7fe43823e7d6a58e6d87d8ea741915add0', name: "copy-icon" }, h(CopyIcon, { key: 'b08778e433e211f4189de8b79e3238041cc6c531' }))), !this.hideRegenerate && (h("button", { key: '0dd5aa376078347cd3fb815fd2a58d631189298c', type: "button", part: "regenerate", class: "bs-chatbot-response-action__button", "aria-label": this.regenerateLabel, onClick: this.onRegenerateClick }, h("slot", { key: '0937709ec50f9f8fa9a26f98c9be05edd16ffc29', name: "regenerate-icon" }, h(RegenerateIcon, { key: '2e8043acad10150471127a43443033d5a554d7a3' })))), h("div", { key: 'dea60a2562bd5dc6cf898908cf7c890e9e77ff50', class: "bs-chatbot-response-action__menu-wrapper" }, h("button", { key: '59ddd22e26d274938bbed3f961ff9877a0b4c996', type: "button", part: "menu", class: "bs-chatbot-response-action__button", "aria-label": this.menuLabel, "aria-haspopup": "menu", "aria-expanded": this.menuOpen ? 'true' : 'false', onClick: this.onMenuClick }, h("slot", { key: 'fcabbee23c6a3c67a5e16751b336baebc2249d64', name: "menu-icon" }, h(MenuIcon, { key: '546a1aaacd0ec3d4eb9b7a1cf2db7dde54b33fc0' }))), this.menuOpen && (h("div", { key: 'f869b271717473e1d32ac7c1d56d76cad1c5ec08', class: "bs-chatbot-response-action__menu-popup" }, h("slot", { key: '83048ee1e615a448281bf72904fcd3763b88449a', name: "menu" })))), hasSources && (h("button", { key: '268057d50ca3b68395c94c41773a426e082a00ba', type: "button", part: "sources", class: "bs-chatbot-response-action__sources", onClick: this.onSourcesClick }, h("slot", { key: '0b291aaa71524f9ee664eac509d42055c82a4560', name: "sources-icon" }, h(SourcesIcon, { key: 'fe935c9fcf5e98f432778a92454678dffbe581eb' })), h("span", { key: '6a75a557e6798cbed50602e149c77c13e3f25611', class: "bs-chatbot-response-action__sources-label" }, this.sourcesCount, " ", this.sourcesCount === 1 ? this.sourceLabel : this.sourcesLabel)))));
|
|
131
131
|
}
|
|
132
132
|
static get is() { return "bs-chatbot-response-action"; }
|
|
133
133
|
static get encapsulation() { return "shadow"; }
|
|
@@ -59,7 +59,7 @@ export class BsChatbotSourcesDrawer {
|
|
|
59
59
|
};
|
|
60
60
|
render() {
|
|
61
61
|
const displayCount = this.count ?? this.slottedCount;
|
|
62
|
-
return (h("div", { key: '
|
|
62
|
+
return (h("div", { key: 'a3e560658dc81c26fb8c4dd0bade5f30ab3e4f2c', class: "bs-chatbot-sources-drawer", role: "region", "aria-label": this.heading }, h("div", { key: '48e21675c96175ba0f71f60da383fc4d4f460849', class: "bs-chatbot-sources-drawer__header" }, h("div", { key: '0ba172eaa3573e503d8084bd046efbae1118781c', class: "bs-chatbot-sources-drawer__title-group" }, h("h2", { key: '557ec12934dba00d0d21fc9da2f761c39d1f2092', part: "heading", class: "bs-chatbot-sources-drawer__heading" }, this.heading), displayCount > 0 && (h("span", { key: '9ee8926ffaccc7f0581046d913a442c33d44b20b', part: "count", class: "bs-chatbot-sources-drawer__count" }, displayCount))), h("button", { key: '884ef26ff326c817082e0043af5530b025c18815', type: "button", part: "collapse", class: "bs-chatbot-sources-drawer__collapse", "aria-label": this.collapseLabel, onClick: this.onCollapseClick }, h("slot", { key: 'b537118af444041aef0964ef05f1f604b4f314d2', name: "collapse-icon" }, h(CaretRightIcon, { key: '413f9632c6963bfdb53520f28a9d1bb08a7c40e4' })))), h("div", { key: '31ef8089cc21b5ce22806fc3e7b2de386a8602ee', part: "list", class: "bs-chatbot-sources-drawer__list" }, h("slot", { key: 'e51ae20a57d1132a176427bd4ded776ce6207c64', onSlotchange: this.onSlotchange }))));
|
|
63
63
|
}
|
|
64
64
|
static get is() { return "bs-chatbot-sources-drawer"; }
|
|
65
65
|
static get encapsulation() { return "shadow"; }
|
package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.js
CHANGED
|
@@ -42,7 +42,7 @@ export class BsChatbotSuggestionButton {
|
|
|
42
42
|
this.bsSelect.emit();
|
|
43
43
|
};
|
|
44
44
|
render() {
|
|
45
|
-
return (h("button", { key: '
|
|
45
|
+
return (h("button", { key: 'd81d8e30c8c4c7b242b93d2b011bf93fee259f9f', type: "button", part: "button", class: "bs-chatbot-suggestion-button", disabled: this.disabled, onClick: this.onClick }, h("slot", { key: 'dc3c9994a193e37284375891671a895d7dd44cd6' })));
|
|
46
46
|
}
|
|
47
47
|
static get is() { return "bs-chatbot-suggestion-button"; }
|
|
48
48
|
static get encapsulation() { return "shadow"; }
|
|
@@ -35,7 +35,7 @@ export class BsCheckboxSkeleton {
|
|
|
35
35
|
/** Accessible name announced for the loading placeholder. */
|
|
36
36
|
loadingLabel = 'Loading';
|
|
37
37
|
render() {
|
|
38
|
-
return (h("span", { key: '
|
|
38
|
+
return (h("span", { key: '4d4c58ea0aadd109e966d29e4d66eade3039467f', part: "container", class: "bs-checkbox-skeleton", role: "status", "aria-label": this.loadingLabel }, h("span", { key: '3ced469a5005e0d0e49e2f6d6872fcc72fb5ac71', part: "box", class: `bs-checkbox-skeleton__box bs-checkbox-skeleton__box--${this.size}` }), h("span", { key: '19698771c87d936c07c7c4f6e300d8e14109e507', part: "label", class: "bs-checkbox-skeleton__label" })));
|
|
39
39
|
}
|
|
40
40
|
static get is() { return "bs-checkbox-skeleton"; }
|
|
41
41
|
static get encapsulation() { return "shadow"; }
|
|
@@ -38,7 +38,7 @@ export class BsCitationPreview {
|
|
|
38
38
|
bsOpen;
|
|
39
39
|
render() {
|
|
40
40
|
const hasPage = this.page !== undefined && this.page !== null && this.page !== '';
|
|
41
|
-
return (h("bs-card", { key: '
|
|
41
|
+
return (h("bs-card", { key: 'e36c3d18f75f3d7a90aa18896889e135903dd646', part: "container", class: "bs-citation-preview", surface: "base" }, h("div", { key: 'f4e41670ebf4db3e335ce67b34d4f074af171be9', class: "bs-citation-preview__body" }, h("bs-source-link", { key: '4ec6c8a5c43eccb5d2f5a5bc725d4a43140e2fa2', part: "header", fileName: this.fileName, sourceName: this.sourceName, href: this.href, onBsOpen: () => this.bsOpen.emit() }), h("div", { key: '187e76af345603c54639211e287fd5d6c9f7c5b0', part: "snippet", class: "bs-citation-preview__snippet" }, h("slot", { key: 'af7cc7f6020888416c4efef5068584337f93e3af' })), h("div", { key: '75e18be6c910a8d1dd9953b8640c2a446c41b6a0', class: "bs-citation-preview__footer" }, h("slot", { key: '109bc862aa76158bddfc0474464a5fbcebbbae62', name: "footer" }, hasPage && (h("span", { key: 'de8bdfd079b158f9a7c9dbfb0c96f72e6e5ed35b', part: "page", class: "bs-citation-preview__page" }, "Page ", this.page)))))));
|
|
42
42
|
}
|
|
43
43
|
static get is() { return "bs-citation-preview"; }
|
|
44
44
|
static get encapsulation() { return "shadow"; }
|
|
@@ -397,10 +397,10 @@ export class BsInput {
|
|
|
397
397
|
return (h("div", { part: "field", class: `bs-input__field bs-input__field--pin ${errorClass} ${disabledClass}` }, Array.from({ length: this.length }).map((_, i) => (h("input", { id: i === 0 ? 'control' : undefined, ref: el => (this.pinInputs[i] = el), part: "control", class: "bs-input__pin-cell", type: "text", inputMode: "numeric", maxLength: 1, value: this.value[i] ?? '', disabled: this.disabled, "aria-required": this.required ? 'true' : undefined, onInput: this.onPinInput(i), onKeyDown: this.onPinKeydown(i) })))));
|
|
398
398
|
}
|
|
399
399
|
render() {
|
|
400
|
-
return (h("div", { key: '
|
|
400
|
+
return (h("div", { key: 'eb166070c898f3bf1e0d994265e5ad3adc1d7172', class: `bs-input ${this.error ? 'bs-input--error' : ''}` }, this.label && (
|
|
401
401
|
// "control" is a fixed id, not a generated one -- safe because Shadow DOM scopes ids
|
|
402
402
|
// to this instance's own shadow root, so it can never collide with another bs-input.
|
|
403
|
-
h("label", { key: '
|
|
403
|
+
h("label", { key: '1d02b7a6901c87c68ff6b91c03bc8099cfb823e6', part: "label", class: "bs-input__label", htmlFor: "control" }, this.label, this.required && (h("span", { key: '8ef20b2be514160fbdf37d046b59b0009b07ece2', part: "required", class: "bs-input__required", "aria-hidden": "true" }, "*")))), this.type === 'pin' ? this.renderPinField() : this.type === 'initials' ? this.renderInitialsField() : this.renderField(), this.error ? (h("span", { id: "description-or-error", part: "error", class: "bs-input__error" }, h("svg", { part: "error-icon", class: "bs-input__error-icon", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", "stroke-width": "1.2" }), h("path", { d: "M8 5V8.5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round" }), h("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })), this.error)) : this.description ? (h("span", { id: "description-or-error", part: "description", class: "bs-input__description" }, this.description)) : null));
|
|
404
404
|
}
|
|
405
405
|
static get is() { return "bs-input"; }
|
|
406
406
|
static get encapsulation() { return "shadow"; }
|
|
@@ -44,7 +44,7 @@ export class BsMenu {
|
|
|
44
44
|
items[next].shadowRoot?.querySelector('button')?.focus();
|
|
45
45
|
}
|
|
46
46
|
render() {
|
|
47
|
-
return (h("div", { key: '
|
|
47
|
+
return (h("div", { key: '931d856111c209026ceecfc7292336e3ffc95348', part: "list", class: "bs-menu", role: "menu" }, h("slot", { key: '773aeb60e85fd3c802da4dc9e78126f4a4543965' })));
|
|
48
48
|
}
|
|
49
49
|
static get is() { return "bs-menu"; }
|
|
50
50
|
static get encapsulation() { return "shadow"; }
|
|
@@ -47,7 +47,7 @@ export class BsMenuItem {
|
|
|
47
47
|
this.bsSelect.emit();
|
|
48
48
|
};
|
|
49
49
|
render() {
|
|
50
|
-
return (h("button", { key: '
|
|
50
|
+
return (h("button", { key: '1e0f7b552625b10087b75d9354e9e158cda10732', type: "button", part: "item", role: "menuitem", class: `bs-menu-item ${this.disabled ? 'bs-menu-item--disabled' : ''}`, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.onClick }, h("span", { key: '8ec17400e5157f4d34a9f67cb298912f430e4524', part: "icon", class: `bs-menu-item__icon ${this.hasIcon ? 'bs-menu-item__icon--has-content' : ''}` }, h("slot", { key: '3641aa2735310ada27c68c90a42f18489e77f0e9', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '9c60cb506418e1432b594b0f2ce8f9c4cbf925f6', part: "label", class: "bs-menu-item__label" }, h("slot", { key: '6369f08ae8797a21d498e89b701df3858e4ce575' }))));
|
|
51
51
|
}
|
|
52
52
|
static get is() { return "bs-menu-item"; }
|
|
53
53
|
static get encapsulation() { return "shadow"; }
|
|
@@ -75,7 +75,7 @@ export class BsMessageList {
|
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
77
|
render() {
|
|
78
|
-
return (h("div", { key: '
|
|
78
|
+
return (h("div", { key: '188f548bf2663418ebd3dcda57fbd286b10c7eeb', class: "bs-message-list" }, h("div", { key: 'f6bd80892f1b9d08215027239d6de8736b468340', part: "viewport", class: "bs-message-list__viewport", role: "log", "aria-live": "polite", tabindex: "0", ref: el => (this.viewport = el), onScroll: this.onScroll }, h("slot", { key: '8b7670ce5566d4eb946693e67cc57ae9ad6243b4' })), this.showScrollButton && (h("bs-icon-button", { key: '597edb7c5f81db986839e403961d9b4a274b34c3', part: "scroll-to-latest", class: "bs-message-list__scroll", variant: "neutral", ariaLabel: this.scrollToLatestLabel, onClick: () => this.scrollToLatest() }, h("svg", { key: '5b95b7a87560b5e652834a132da9eee9b4295b59', width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'd93260a40a73539d9a712bc4928d947d819b8054', d: "M8 3v10M3.5 8.5L8 13l4.5-4.5", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))));
|
|
79
79
|
}
|
|
80
80
|
static get is() { return "bs-message-list"; }
|
|
81
81
|
static get encapsulation() { return "shadow"; }
|
|
@@ -91,7 +91,7 @@ export class BsPagination {
|
|
|
91
91
|
}
|
|
92
92
|
render() {
|
|
93
93
|
const pageList = this.getPageList();
|
|
94
|
-
return (h("nav", { key: '
|
|
94
|
+
return (h("nav", { key: '96915c9c13aad90a4db232b78062618d99b3e48f', "aria-label": this.navLabel }, h("ul", { key: '57e51e0ab7da9ac5bfae840579195bee1d7b0642', part: "list", class: "bs-pagination__list" }, h("li", { key: '831d06deaa95f1992ee7fa80e54b672a05ca5c5c', part: "item", class: "bs-pagination__item" }, h("button", { key: '3b513f181a3f95aa39869f64eb023b27597e151d', part: "prev", type: "button", class: "bs-pagination__control", "aria-label": this.previousLabel, disabled: this.currentPage <= 1, onClick: () => this.goToPage(this.currentPage - 1) }, h(ChevronLeftIcon, { key: 'e9dc1c534f7bccb9c4e30c91a2dc7b2344e4a2dd' }))), pageList.map((item, index) => item === 'ellipsis' ? (h("li", { part: "item", class: "bs-pagination__item", key: `ellipsis-${index}` }, h("span", { part: "ellipsis", class: "bs-pagination__ellipsis", "aria-hidden": "true" }, h(EllipsisIcon, null)))) : (h("li", { part: "item", class: "bs-pagination__item", key: item }, h("button", { part: item === this.currentPage ? 'page current' : 'page', type: "button", class: `bs-pagination__control bs-pagination__page ${item === this.currentPage ? 'bs-pagination__page--current' : ''}`, "aria-label": `${this.pageLabel} ${item}`, "aria-current": item === this.currentPage ? 'page' : undefined, onClick: () => this.goToPage(item) }, item)))), h("li", { key: '2f24b7b2dfc20820eccf8805ae4f1036adfe4911', part: "item", class: "bs-pagination__item" }, h("button", { key: '2888093afa769f6bb9bf6b2d9c8ff111332bf7ab', part: "next", type: "button", class: "bs-pagination__control", "aria-label": this.nextLabel, disabled: this.currentPage >= this.safeTotalPages, onClick: () => this.goToPage(this.currentPage + 1) }, h(ChevronRightIcon, { key: 'eaed42626409dc0a5784ed6f99cdb84c8fc2e1cb' }))))));
|
|
95
95
|
}
|
|
96
96
|
static get is() { return "bs-pagination"; }
|
|
97
97
|
static get encapsulation() { return "shadow"; }
|
|
@@ -104,7 +104,7 @@ export class BsRadio {
|
|
|
104
104
|
}
|
|
105
105
|
};
|
|
106
106
|
render() {
|
|
107
|
-
return (h("label", { key: '
|
|
107
|
+
return (h("label", { key: '5c69e7244183b1116d44e50079371d0bf29ac058', class: `bs-radio ${this.disabled ? 'bs-radio--disabled' : ''}` }, h("input", { key: 'f40a114f0e9fcb21ff0e7bb02876ded6979b7727', class: "bs-radio__input", type: "radio", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, tabIndex: this.checked || !this.groupHasChecked ? 0 : -1, onKeyDown: this.onKeyDown, onChange: this.onChange }), h("span", { key: '4cca356fd757d34f24ec5d8a8a3a2517da004409', class: "bs-radio__hit-area" }, h("span", { key: '6beda905b88e822335ebf67a64eba5df86beb4a9', class: "bs-radio__state-layer" }, h("span", { key: '28e63967c2ad046f694c2097d2aec35f4ebcf843', part: "circle", class: `bs-radio__circle ${this.checked ? 'bs-radio__circle--selected' : ''}` }, this.checked && h("span", { key: 'cda8ba5bf3f5bf99564e6f0f1af115803e33f6c0', part: "dot", class: "bs-radio__dot" })))), h("span", { key: 'df59f8b97fb54cc037732a22412ec64464df8bdc', part: "label", class: "bs-radio__label" }, h("slot", { key: '154be3de3d6fe5aa0cb8fd7d806c28956a21e87d' }))));
|
|
108
108
|
}
|
|
109
109
|
static get is() { return "bs-radio"; }
|
|
110
110
|
static get encapsulation() { return "shadow"; }
|
|
@@ -51,8 +51,8 @@ export class BsSourceLink {
|
|
|
51
51
|
};
|
|
52
52
|
render() {
|
|
53
53
|
const inner = [
|
|
54
|
-
h("span", { key: '
|
|
55
|
-
h("span", { key: '
|
|
54
|
+
h("span", { key: '37082ba8b750f01d04cec4e437fc3d5481768f27', class: "bs-source-link__left" }, h("span", { key: '10f49ce451047e0b2656d0ec724a5841b112046a', class: "bs-source-link__filename-row" }, h("span", { key: '63b4c0dcb376053f68a5d62c6232a205451f1826', part: "icon", class: "bs-source-link__icon" }, h("slot", { key: '6df8546c36387bd130b68cda5f8aa5e3c35fd388', name: "icon" }, h(FileTextIcon, { key: '8ba49429459a63d05324e31b6994fa5f3b5c6534' }))), h("p", { key: '0b6d7826f62526c903048a25610bfed99381bce0', part: "filename", class: "bs-source-link__filename" }, this.fileName)), h("span", { key: 'f71e6440d5fe06486d5a10493ab5c7b17e2cfd78', class: "bs-source-link__meta" }, this.sourceName && (h("span", { key: 'a4d97d5fd1be65d17d9dca52d30eaa9d1a022f0e', part: "source", class: "bs-source-link__source" }, this.sourceName)), this.sourceName && this.version && h("span", { key: '809b5e51e436270dd304db280f98e164f2722eda', class: "bs-source-link__dot", "aria-hidden": "true" }), this.version && (h("span", { key: '5e30c00db6cf2d659c62a6fc863a7c6fd8111d12', part: "version", class: "bs-source-link__version" }, this.version)))),
|
|
55
|
+
h("span", { key: '89dcb19eec419f95ed277d729925296ecfe0e4b1', part: "arrow", class: "bs-source-link__arrow", "aria-hidden": "true" }, h(ArrowUpRightIcon, { key: '8d2c8521747a1f3d7cd8b6bff5385ee04b2a7923' })),
|
|
56
56
|
];
|
|
57
57
|
return this.href ? (h("a", { class: "bs-source-link", href: this.href, target: this.target, rel: "noopener noreferrer", onClick: this.onClick }, inner)) : (h("button", { type: "button", class: "bs-source-link", onClick: this.onClick }, inner));
|
|
58
58
|
}
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import { render, h, describe, it, expect } from "@stencil/vitest";
|
|
2
|
+
const mount = (props = {}, panes = 3) => render(h("div", { style: { width: '900px', height: '400px' } }, h("bs-split-pane", { ...props }, h("div", { slot: "pane-1" }, "One"), h("div", { slot: "pane-2" }, "Two"), panes === 3 && h("div", { slot: "pane-3" }, "Three"))));
|
|
3
|
+
const size = (el, axis = 'width') => el.getBoundingClientRect()[axis];
|
|
4
|
+
describe('bs-split-pane', () => {
|
|
5
|
+
it('renders one divider per gap between panes, with separator semantics', async () => {
|
|
6
|
+
const { root } = await mount();
|
|
7
|
+
const split = root.querySelector('bs-split-pane');
|
|
8
|
+
const dividers = split.shadowRoot.querySelectorAll('[part="divider"]');
|
|
9
|
+
expect(dividers.length).toBe(2);
|
|
10
|
+
expect(dividers[0]).toEqualAttribute('role', 'separator');
|
|
11
|
+
expect(dividers[0]).toEqualAttribute('aria-orientation', 'vertical');
|
|
12
|
+
expect(dividers[0]).toEqualAttribute('aria-label', 'Resize panes');
|
|
13
|
+
expect(dividers[0]).toEqualAttribute('tabindex', '0');
|
|
14
|
+
expect(split.shadowRoot.querySelectorAll('[part~="pane"]').length).toBe(3);
|
|
15
|
+
});
|
|
16
|
+
it('follows the filled slots: two panes means one divider', async () => {
|
|
17
|
+
const { root } = await mount({}, 2);
|
|
18
|
+
const split = root.querySelector('bs-split-pane');
|
|
19
|
+
expect(split.shadowRoot.querySelectorAll('[part="divider"]').length).toBe(1);
|
|
20
|
+
});
|
|
21
|
+
it('uses horizontal dividers when vertical', async () => {
|
|
22
|
+
const { root } = await mount({ orientation: 'vertical' });
|
|
23
|
+
const split = root.querySelector('bs-split-pane');
|
|
24
|
+
expect(split.shadowRoot.querySelector('[part="divider"]')).toEqualAttribute('aria-orientation', 'horizontal');
|
|
25
|
+
});
|
|
26
|
+
it('gives the first pane its fixed size and shrinks it to the rail when collapsed', async () => {
|
|
27
|
+
const { root, waitForChanges } = await mount();
|
|
28
|
+
const split = root.querySelector('bs-split-pane');
|
|
29
|
+
const first = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
30
|
+
expect(Math.round(size(first))).toBe(333);
|
|
31
|
+
split.setAttribute('collapsed', '');
|
|
32
|
+
await waitForChanges();
|
|
33
|
+
expect(Math.round(size(first))).toBe(106);
|
|
34
|
+
});
|
|
35
|
+
it('resizes the first pane with arrow keys and emits bsResize', async () => {
|
|
36
|
+
const { root, waitForChanges } = await mount();
|
|
37
|
+
const split = root.querySelector('bs-split-pane');
|
|
38
|
+
const events = [];
|
|
39
|
+
split.addEventListener('bsResize', (e) => events.push(e.detail));
|
|
40
|
+
const first = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
41
|
+
const divider = split.shadowRoot.querySelector('[part="divider"]');
|
|
42
|
+
divider.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true, cancelable: true }));
|
|
43
|
+
await waitForChanges();
|
|
44
|
+
expect(Math.round(size(first))).toBe(349);
|
|
45
|
+
divider.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft', shiftKey: true, bubbles: true, cancelable: true }));
|
|
46
|
+
await waitForChanges();
|
|
47
|
+
expect(Math.round(size(first))).toBe(285);
|
|
48
|
+
expect(events.length).toBe(2);
|
|
49
|
+
expect(events[1][0]).toBe(285);
|
|
50
|
+
});
|
|
51
|
+
it('clamps to the minimum size with Home', async () => {
|
|
52
|
+
const { root, waitForChanges } = await mount();
|
|
53
|
+
const split = root.querySelector('bs-split-pane');
|
|
54
|
+
const first = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
55
|
+
const divider = split.shadowRoot.querySelector('[part="divider"]');
|
|
56
|
+
divider.dispatchEvent(new KeyboardEvent('keydown', { key: 'Home', bubbles: true, cancelable: true }));
|
|
57
|
+
await waitForChanges();
|
|
58
|
+
expect(Math.round(size(first))).toBe(96);
|
|
59
|
+
});
|
|
60
|
+
it('resizes by dragging with the pointer', async () => {
|
|
61
|
+
const { root, waitForChanges } = await mount();
|
|
62
|
+
const split = root.querySelector('bs-split-pane');
|
|
63
|
+
const first = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
64
|
+
const divider = split.shadowRoot.querySelector('[part="divider"]');
|
|
65
|
+
const fire = (type, clientX) => divider.dispatchEvent(new PointerEvent(type, { clientX, pointerId: 1, bubbles: true, cancelable: true }));
|
|
66
|
+
// setPointerCapture throws for synthetic pointer ids; the component only needs the move/up events.
|
|
67
|
+
divider.setPointerCapture = () => { };
|
|
68
|
+
fire('pointerdown', 340);
|
|
69
|
+
fire('pointermove', 440);
|
|
70
|
+
await waitForChanges();
|
|
71
|
+
expect(Math.round(size(first))).toBe(433);
|
|
72
|
+
fire('pointerup', 440);
|
|
73
|
+
await waitForChanges();
|
|
74
|
+
expect(Math.round(size(first))).toBe(433);
|
|
75
|
+
});
|
|
76
|
+
it('toggles collapsed with Enter on the first divider and emits bsCollapsedChange', async () => {
|
|
77
|
+
const { root, waitForChanges } = await mount();
|
|
78
|
+
const split = root.querySelector('bs-split-pane');
|
|
79
|
+
const events = [];
|
|
80
|
+
split.addEventListener('bsCollapsedChange', (e) => events.push(e.detail));
|
|
81
|
+
const divider = split.shadowRoot.querySelector('[part="divider"]');
|
|
82
|
+
divider.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true }));
|
|
83
|
+
await waitForChanges();
|
|
84
|
+
expect(split.collapsed).toBe(true);
|
|
85
|
+
expect(split).toHaveAttribute('collapsed');
|
|
86
|
+
expect(events).toEqual([true]);
|
|
87
|
+
});
|
|
88
|
+
it('is not focusable and ignores keys when resizable is false', async () => {
|
|
89
|
+
const { root, waitForChanges } = await mount({ resizable: false });
|
|
90
|
+
const split = root.querySelector('bs-split-pane');
|
|
91
|
+
const first = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
92
|
+
const divider = split.shadowRoot.querySelector('[part="divider"]');
|
|
93
|
+
expect(divider).not.toHaveAttribute('tabindex');
|
|
94
|
+
divider.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true, cancelable: true }));
|
|
95
|
+
await waitForChanges();
|
|
96
|
+
expect(Math.round(size(first))).toBe(333);
|
|
97
|
+
});
|
|
98
|
+
it('follows dark mode: slotted text and panes use the dark tokens', async () => {
|
|
99
|
+
const { root } = await render(h("div", { "data-theme": "dark", style: { width: '600px', height: '300px' } }, h("bs-split-pane", null, h("div", { slot: "pane-1" }, "One"), h("div", { slot: "pane-2" }, "Two"))));
|
|
100
|
+
const split = root.querySelector('bs-split-pane');
|
|
101
|
+
const pane = split.shadowRoot.querySelector('[part~="pane-1"]');
|
|
102
|
+
const container = split.shadowRoot.querySelector('.bs-split-pane');
|
|
103
|
+
expect(getComputedStyle(root.querySelector('[slot="pane-1"]')).color).toBe('rgb(255, 255, 255)');
|
|
104
|
+
expect(getComputedStyle(pane).backgroundColor).not.toBe('rgb(255, 255, 255)');
|
|
105
|
+
expect(getComputedStyle(container).color).toBe('rgb(255, 255, 255)');
|
|
106
|
+
});
|
|
107
|
+
});
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
:host {
|
|
2
|
+
display: block;
|
|
3
|
+
height: 100%;
|
|
4
|
+
min-height: 0;
|
|
5
|
+
--bs-split-pane-radius: var(--bs-border-radius-100);
|
|
6
|
+
--bs-split-pane-bg: var(--bs-surface-base);
|
|
7
|
+
--bs-split-pane-color: var(--bs-text-default);
|
|
8
|
+
/* Pane sizes below are the literal values from the Figma "Split pane" variants (333 / 106). */
|
|
9
|
+
--bs-split-pane-first-size: 333px;
|
|
10
|
+
--bs-split-pane-collapsed-size: 106px;
|
|
11
|
+
--bs-split-pane-min-size: 96px;
|
|
12
|
+
--bs-split-pane-divider-size: var(--bs-spacing-75);
|
|
13
|
+
--bs-split-pane-divider-bg: var(--bs-surface-container);
|
|
14
|
+
--bs-split-pane-divider-thumb: var(--bs-border-neutral-container);
|
|
15
|
+
--bs-split-pane-divider-thumb-active: var(--bs-border-neutral-hover);
|
|
16
|
+
--bs-split-pane-divider-thumb-length: 250px;
|
|
17
|
+
--bs-split-pane-border: var(--bs-border-neutral-container);
|
|
18
|
+
--bs-split-pane-focus-ring: var(--bs-border-neutral-focus);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.bs-split-pane {
|
|
22
|
+
box-sizing: border-box;
|
|
23
|
+
display: flex;
|
|
24
|
+
width: 100%;
|
|
25
|
+
height: 100%;
|
|
26
|
+
overflow: clip;
|
|
27
|
+
border-radius: var(--bs-split-pane-radius);
|
|
28
|
+
background: var(--bs-split-pane-bg);
|
|
29
|
+
color: var(--bs-split-pane-color);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.bs-split-pane--vertical {
|
|
33
|
+
flex-direction: column;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.bs-split-pane__pane {
|
|
37
|
+
box-sizing: border-box;
|
|
38
|
+
min-width: 0;
|
|
39
|
+
min-height: 0;
|
|
40
|
+
overflow: auto;
|
|
41
|
+
background: var(--bs-split-pane-bg);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.bs-split-pane--horizontal > .bs-split-pane__pane {
|
|
45
|
+
min-width: min(var(--bs-split-pane-min-size), 100%);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.bs-split-pane--vertical > .bs-split-pane__pane {
|
|
49
|
+
min-height: min(var(--bs-split-pane-min-size), 100%);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.bs-split-pane__divider {
|
|
53
|
+
position: relative;
|
|
54
|
+
flex: 0 0 var(--bs-split-pane-divider-size);
|
|
55
|
+
display: flex;
|
|
56
|
+
background: var(--bs-split-pane-divider-bg);
|
|
57
|
+
touch-action: none;
|
|
58
|
+
outline: none;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.bs-split-pane--horizontal > .bs-split-pane__divider {
|
|
62
|
+
cursor: col-resize;
|
|
63
|
+
flex-direction: column;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.bs-split-pane--vertical > .bs-split-pane__divider {
|
|
67
|
+
cursor: row-resize;
|
|
68
|
+
flex-direction: row;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.bs-split-pane__divider--static {
|
|
72
|
+
cursor: default;
|
|
73
|
+
pointer-events: none;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.bs-split-pane__thumb {
|
|
77
|
+
display: block;
|
|
78
|
+
border-radius: var(--bs-border-radius-full);
|
|
79
|
+
background: var(--bs-split-pane-divider-thumb);
|
|
80
|
+
transition: background-color var(--bs-duration-fast) var(--bs-easing-standard);
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.bs-split-pane--horizontal > .bs-split-pane__divider > .bs-split-pane__thumb {
|
|
84
|
+
width: 100%;
|
|
85
|
+
height: min(var(--bs-split-pane-divider-thumb-length), 100%);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.bs-split-pane--vertical > .bs-split-pane__divider > .bs-split-pane__thumb {
|
|
89
|
+
height: 100%;
|
|
90
|
+
width: min(var(--bs-split-pane-divider-thumb-length), 100%);
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.bs-split-pane__divider:hover > .bs-split-pane__thumb,
|
|
94
|
+
.bs-split-pane__divider--active > .bs-split-pane__thumb,
|
|
95
|
+
.bs-split-pane__divider:focus-visible > .bs-split-pane__thumb {
|
|
96
|
+
background: var(--bs-split-pane-divider-thumb-active);
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.bs-split-pane__divider:focus-visible {
|
|
100
|
+
outline: 2px solid var(--bs-split-pane-focus-ring);
|
|
101
|
+
outline-offset: 0;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
@media (prefers-reduced-motion: reduce) {
|
|
105
|
+
.bs-split-pane__thumb {
|
|
106
|
+
transition: none;
|
|
107
|
+
}
|
|
108
|
+
}
|