@brandsync/wc 1.20.1 → 1.22.0

package/dist/collection/components/bs-chatbot-feedback/bs-chatbot-feedback.js

@@ -139,7 +139,7 @@ export class BsChatbotFeedback {
     }
     render() {
         const stars = [1, 2, 3, 4, 5];
-        return (h("div", { key: '9642427bb2feedde50e355c71f6853df257f69d2', class: "bs-chatbot-feedback", role: "region", "aria-label": this.computedHeading() }, h("button", { key: '7d01f9ee81864b7f93886288dc9aa430aab9bc35', type: "button", part: "close", class: "bs-chatbot-feedback__close", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h("bs-icon", { key: '6a3ee3614ef48446b0a9137f877145549484852c', name: "x", tone: "inherit", size: "md" })), h("div", { key: 'b7193bc13441c56edc89974ca0e0ba43c8d47a66', class: "bs-chatbot-feedback__top" }, h("div", { key: '9b93d4ee252f9eab36808b84171f6d85e6da7be2', class: "bs-chatbot-feedback__text" }, h("p", { key: '204ad4eac6e3ae69ca539b8efe9319dd834dbcdf', part: "heading", class: "bs-chatbot-feedback__heading" }, this.computedHeading()), h("p", { key: 'e3ddf360ba370314985a66ad28782a89b57ba51a', part: "subtitle", class: "bs-chatbot-feedback__subtitle" }, this.computedSubtitle())), h("div", { key: '50eaa4821ca056cb16bdabb96306ccc52bb987e4', 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("bs-icon", { name: this.rating >= value ? 'star-fill' : 'star', tone: "inherit" }))))), !this.submitted && (h("div", { key: '754de919956347beb69d38ab2fd95cbc741a5cc0', class: "bs-chatbot-feedback__field" }, h("label", { key: '1ba7da633b0b2b6ac036d62849c6b8d594c5dc2e', part: "label", class: "bs-chatbot-feedback__label", htmlFor: "bs-chatbot-feedback-comment" }, this.commentLabel), h("textarea", { key: '0abc18be7c42e7ddec42e94a4b88e845af29c9f3', 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: '5e772be2c5b47bda8e35fac82b785fc488b87d37', part: "comment", class: "bs-chatbot-feedback__comment" }, this.comment))), h("div", { key: '0473e7afaa3d96f1a1044f9410a95e468cc33db4', class: "bs-chatbot-feedback__actions" }, !this.submitted && (h("button", { key: 'a319bbd909a72c177649e899e4c6500778d57dce', type: "button", part: "submit", class: "bs-chatbot-feedback__submit", disabled: this.rating === 0, onClick: this.onSubmitClick }, h("bs-icon", { key: '29baadc25644ea985faf7f874741db4c2dcdd089', name: "paper-plane-right", tone: "inherit" }), this.submitLabel)), h("button", { key: 'aadd03c3f2b18d7e821e50891b9e94e884b6c36f', 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("bs-icon", { key: 'f9f088c5e2f0b9cd8f86d433cb1c516e65d1418f', name: "note-pencil", tone: "inherit" }), this.newChatLabel))));
+        return (h("div", { key: '7a50681030486ab27a4323ee5f897348d7054dda', class: "bs-chatbot-feedback", role: "region", "aria-label": this.computedHeading() }, h("button", { key: '8fdbe16bfab78fcdeccba80ff0d1f72bfb509a4d', type: "button", part: "close", class: "bs-chatbot-feedback__close", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h("bs-icon", { key: '58ec82e0696b1dfddadfd7c23c0f04c146573886', name: "x", tone: "inherit", size: "md" })), h("div", { key: 'e070e8a904cf5d05627b759b208cea8c659a5374', class: "bs-chatbot-feedback__top" }, h("div", { key: '8a5d70831fa13103e3074c27c5ab53ea2766e68e', class: "bs-chatbot-feedback__text" }, h("p", { key: '49a7bd263db92b81691e4d30906eaba2595c3fb2', part: "heading", class: "bs-chatbot-feedback__heading" }, this.computedHeading()), h("p", { key: '707d7c9c24383f5bb0c9e89849522d4ec15c9b13', part: "subtitle", class: "bs-chatbot-feedback__subtitle" }, this.computedSubtitle())), h("div", { key: 'ce91679a9da5a71b7f123ec426a36534b161557d', 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("bs-icon", { name: this.rating >= value ? 'star-fill' : 'star', tone: "inherit" }))))), !this.submitted && (h("div", { key: '85216ceebc74598c818eba609e9f830805ff110f', class: "bs-chatbot-feedback__field" }, h("label", { key: '729a48818acec8b7c65d61a729ff450056cc9005', part: "label", class: "bs-chatbot-feedback__label", htmlFor: "bs-chatbot-feedback-comment" }, this.commentLabel), h("textarea", { key: '9ff69a3d5c044052e408eaaca43cf9cc8c1a225c', 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: '2eb910a1b883e53617a0981d3d0748b064c2149f', part: "comment", class: "bs-chatbot-feedback__comment" }, this.comment))), h("div", { key: '7e03fb9105fabe2afb4c4b82c09b37fb0deb3713', class: "bs-chatbot-feedback__actions" }, !this.submitted && (h("button", { key: '3bf2178edaf22b8611c37e7029438d7f4d04c19a', type: "button", part: "submit", class: "bs-chatbot-feedback__submit", disabled: this.rating === 0, onClick: this.onSubmitClick }, h("bs-icon", { key: 'e50616ff771a11bc420c570110759764981d4e08', name: "paper-plane-right", tone: "inherit" }), this.submitLabel)), h("button", { key: 'f0251e2f9e6f12970e2ee3a33f09933601fe966a', 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("bs-icon", { key: '7cf6dccf7c7376acae72bfaa2f37dc915d52ffc9', name: "note-pencil", tone: "inherit" }), this.newChatLabel))));
     }
     static get is() { return "bs-chatbot-feedback"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-chatbot-header/bs-chatbot-header.js

@@ -93,7 +93,7 @@ export class BsChatbotHeader {
         this.bsClose.emit();
     };
     render() {
-        return (h("div", { key: 'f0c324bef5be83ad32e9ceba663c8549ff656e4f', class: "bs-chatbot-header", role: "banner", "aria-label": this.heading }, h("div", { key: '5eddf01ee18aa11f4447b46813c95b7fdc119865', part: "logo", class: "bs-chatbot-header__logo", role: "img", "aria-label": this.heading, innerHTML: GENIE_LOGO_SVG }), h("div", { key: 'c9289ee0c7e7ef6b68ea632f71797b0117d50e74', class: "bs-chatbot-header__actions" }, h("slot", { key: 'b32fdb607945a114c88ca9e699a79937e0acd1cf', name: "actions" }), !this.hideNewChat && (h("span", { key: '46dca4bc6488c5b722154e76fe400c318c42e9c9', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '023dacbfea16996c8e82793e4b5fc1269bf1a358', type: "button", part: "new-chat", class: "bs-chatbot-header__button", "aria-label": this.newChatLabel, onClick: this.onNewChatClick }, h("slot", { key: 'f1163cb48f30a0f30b63b4e456839aef082a3055', name: "new-chat-icon" }, h("bs-icon", { key: '6cce81b2e77ddb4279d82364a861642622a54f95', name: "note-pencil", tone: "inherit" }))), h("bs-tooltip", { key: '128a86c14973dcc83df59f129fba56c3aaa0a43e', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.newChatLabel))), !this.hideHistory && (h("span", { key: '8f11045491e416e8ac9dc9e3c5d6a2628e7edefb', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '07bebd752033ce96bb6037a0c26ab0fd76877769', type: "button", part: "history", class: "bs-chatbot-header__button", "aria-label": this.historyLabel, onClick: this.onHistoryClick }, h("slot", { key: 'b136a662ef52891d356f123e79e7dfd269127290', name: "history-icon" }, h("bs-icon", { key: '9a16baba88b301ad536242a3b160ab7c5309ed5b', name: "clock-counter-clockwise", tone: "inherit" }))), h("bs-tooltip", { key: '006423bbdd39cd97b126799ca0abde9dd49a2fdb', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.historyLabel))), !this.hideExpand && (h("span", { key: 'c7b5f5a6881445597066ab72a58a63bc7a27257e', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: 'b12e87c73b3aeb48c49dee42caf404bebf211616', 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: 'b2c0af3e216151753a1865c3d7003aeaf6f5ac4e', name: "expand-icon" }, h("bs-icon", { key: 'cc11a845475bb70d254d21304bc7548b3bb4d908', name: "arrows-out-simple", tone: "inherit" }))), h("bs-tooltip", { key: '69900f0f7c83bebfdec08e7b2890b2b364102e1e', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.expanded ? this.collapseLabel : this.expandLabel))), !this.hideClose && (h("span", { key: 'f8527d411010504c6fbf18d82bbf48e920bad539', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: 'ebe64fb9ed16a35f4ff29bd3ad62286dc6cc0211', type: "button", part: "close", class: "bs-chatbot-header__button", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h("slot", { key: 'd93a5b6958872e8b967abeb71ce1ef9631b44b8c', name: "close-icon" }, h("bs-icon", { key: '3d18f704f5094d28c1b3a4c3bfe713cbe42cbf81', name: "x", tone: "inherit" }))), h("bs-tooltip", { key: '263181de49c246cbb88d8c2757978001debd2e69', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.closeLabel))))));
+        return (h("div", { key: 'e00d2c04032f6da62fb30d2a46d8271f4fbe7984', class: "bs-chatbot-header", role: "banner", "aria-label": this.heading }, h("div", { key: '5b88e19c44bc77420ac91280b6bf79863623679a', part: "logo", class: "bs-chatbot-header__logo", role: "img", "aria-label": this.heading, innerHTML: GENIE_LOGO_SVG }), h("div", { key: '759fbc628be055a0fbf3b323eeb8ee084cb42139', class: "bs-chatbot-header__actions" }, h("slot", { key: '471f5f381d01b424eade667d2d35089ef5f4d79c', name: "actions" }), !this.hideNewChat && (h("span", { key: '30ddc2248884c52373f4a89132fbb1ce611b41a3', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '93d66092f02f037e10837552305e32ae8864f0b3', type: "button", part: "new-chat", class: "bs-chatbot-header__button", "aria-label": this.newChatLabel, onClick: this.onNewChatClick }, h("slot", { key: 'f636904fff9ea7b404f1d7727dd04ba83b857f1f', name: "new-chat-icon" }, h("bs-icon", { key: '236d7d5591c61b6f748c3ff03821274eb35cd2c7', name: "note-pencil", tone: "inherit" }))), h("bs-tooltip", { key: '4ec4fe6cd923da268db5bf0b326e4206a46938df', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.newChatLabel))), !this.hideHistory && (h("span", { key: '82dd351e1c7f49f4d67a55c5651ed652fe381bc7', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '09fd37777cc37d1dd7e7298ea1a62a26d7f05f20', type: "button", part: "history", class: "bs-chatbot-header__button", "aria-label": this.historyLabel, onClick: this.onHistoryClick }, h("slot", { key: '20f3b6404e283a3e929527ba59b546c41b64592c', name: "history-icon" }, h("bs-icon", { key: '089f4b6440f87f9643e1b0d85a078a56237e27a5', name: "clock-counter-clockwise", tone: "inherit" }))), h("bs-tooltip", { key: '41a0214817c694ea1b7e697d1d52ee5f8dae62f6', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.historyLabel))), !this.hideExpand && (h("span", { key: 'ad8868a07d2c30cb650d5b14a966fae99801a025', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: 'fb12562f5e45a3d956739fadecfbc8b3bfd13a27', 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: '2e4b23c0298b2bb95a2ecc2fb4b3157e0a6d0575', name: "expand-icon" }, h("bs-icon", { key: '8a16305e7e3fc831ee066b8d62520ae0eb7bb8f8', name: "arrows-out-simple", tone: "inherit" }))), h("bs-tooltip", { key: '0f277c45ae63476f2869df72a5a0b0f070411122', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.expanded ? this.collapseLabel : this.expandLabel))), !this.hideClose && (h("span", { key: '8c12788267dc0329317550db291b09a9570e5974', class: "bs-chatbot-header__tooltip-wrapper" }, h("button", { key: '3850dff47134015bc2b58561a4bc8d11dc94d037', type: "button", part: "close", class: "bs-chatbot-header__button", "aria-label": this.closeLabel, onClick: this.onCloseClick }, h("slot", { key: '67068158843289fb36f4842c9abed77418828672', name: "close-icon" }, h("bs-icon", { key: 'eed846764082900c82b4f35b0e4ba870cdabde7b', name: "x", tone: "inherit" }))), h("bs-tooltip", { key: 'fb575a06a00426beb496dc89cb5841c77ddcaec3', class: "bs-chatbot-header__tooltip", placement: "top", "aria-hidden": "true" }, this.closeLabel))))));
     }
     static get is() { return "bs-chatbot-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-chatbot-response-action/bs-chatbot-response-action.js

@@ -128,7 +128,7 @@ export class BsChatbotResponseAction {
     };
     render() {
         const hasSources = !!this.sourcesCount && this.sourcesCount > 0;
-        return (h("div", { key: 'd6ec5d7832cb89fa6a9dc97d735e6ea55a7b7241', class: "bs-chatbot-response-action" }, h("button", { key: '17cbcd07677e2ab40b199dd7834c04b4570b7b8c', type: "button", part: "like", class: "bs-chatbot-response-action__button", "aria-label": this.likeLabel, "aria-pressed": this.liked ? 'true' : 'false', onClick: this.onLikeClick }, h("bs-ripple", { key: '4b768312fdf2bad4344958eebecddb65f4763219', part: "ripple", centered: true }), h("slot", { key: '6c821d89ed0046629b3f5f37718235a1616af813', name: "like-icon" }, h(ThumbsUpIcon, { key: '3190624e18324a064cc3da5bcc86a9b13684ef4b' }))), h("button", { key: 'af8bda39744ce0f66cf28b3b1e9336cc662233b3', type: "button", part: "dislike", class: "bs-chatbot-response-action__button", "aria-label": this.dislikeLabel, "aria-pressed": this.disliked ? 'true' : 'false', onClick: this.onDislikeClick }, h("bs-ripple", { key: 'dcf47fb5f3b7106e2247e60d88f6e2ae7b4e0bfe', part: "ripple", centered: true }), h("slot", { key: '92bd3a554dab27bfe5fb17aa216204bdb1e32b26', name: "dislike-icon" }, h(ThumbsDownIcon, { key: '4a4b2b1a781af704be5e3998444e24b92e45e794' }))), h("button", { key: '982758c52f1354a67a5ff57a2cb9b3f33de0d28d', type: "button", part: "copy", class: "bs-chatbot-response-action__button", "aria-label": this.copyLabel, onClick: this.onCopyClick }, h("bs-ripple", { key: '9fb0ea077279a7275bf77255e2fa88e644782c03', part: "ripple", centered: true }), h("slot", { key: '1d24ad346d08c41aa02b9e3c6b9a7bbd5d7afbbf', name: "copy-icon" }, h(CopyIcon, { key: '87ac9fdade8339b56d6bab2c937fac4cdf7e9600' }))), !this.hideRegenerate && (h("button", { key: 'bde35dbce8fe3cfc28a408c508d6774d4676d7da', type: "button", part: "regenerate", class: "bs-chatbot-response-action__button", "aria-label": this.regenerateLabel, onClick: this.onRegenerateClick }, h("bs-ripple", { key: '7e1bdea5844684936c18547ab5f793cb302ea5a6', part: "ripple", centered: true }), h("slot", { key: 'ec96ae7eada9da8b20f41e2e0646426e0e0bacf7', name: "regenerate-icon" }, h(RegenerateIcon, { key: 'c09ef6b4e47964f56bef9f004443b7dd2e24b401' })))), h("div", { key: '7776215dc4ca739c9ea55577f2b0e8869df35000', class: "bs-chatbot-response-action__menu-wrapper" }, h("button", { key: 'a8fe7faa099961d9c6cf14745f72b8c5afa50e84', 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("bs-ripple", { key: '109b246498589a0d1d80a0f3573f2a66f35f96d8', part: "ripple", centered: true }), h("slot", { key: '4e9e725c8cec5bc1fa6db8608ff7fdc1d78d53b8', name: "menu-icon" }, h(MenuIcon, { key: '4675b0d7b17211de98336a62e04e0d0b7876d83d' }))), this.menuOpen && (h("div", { key: 'cc48f0a1c834cd94f9ecc016f68b6a85138be604', class: "bs-chatbot-response-action__menu-popup" }, h("slot", { key: 'b9ad1bc5d4717e294ed196b50fec8ca0a340c655', name: "menu" })))), hasSources && (h("button", { key: 'c86ce3e4529f1e7c3e74ae59a0b6728ad5701190', type: "button", part: "sources", class: "bs-chatbot-response-action__sources", onClick: this.onSourcesClick }, h("slot", { key: 'cdd832fdc3ad9eb27103be3f4d2b08acd1141b1b', name: "sources-icon" }, h(SourcesIcon, { key: 'b82a6db98ce52e5b5e1f24f078c48734bafcaf59' })), h("span", { key: 'e1b7633db592eb2ee198c56f0b4e145037b671a4', class: "bs-chatbot-response-action__sources-label" }, this.sourcesCount, " ", this.sourcesCount === 1 ? this.sourceLabel : this.sourcesLabel)))));
+        return (h("div", { key: 'e1dceaea05bf062b9101af3b600ed955b7860d7c', class: "bs-chatbot-response-action" }, h("button", { key: '594369fb42987cf942753163eca978e9d32d1a77', type: "button", part: "like", class: "bs-chatbot-response-action__button", "aria-label": this.likeLabel, "aria-pressed": this.liked ? 'true' : 'false', onClick: this.onLikeClick }, h("bs-ripple", { key: '7a422b5e9366b093625229b0b2aced735afab6df', part: "ripple", centered: true }), h("slot", { key: 'ef5e89558e39cacb97f33ea438dbea7acefa159d', name: "like-icon" }, h(ThumbsUpIcon, { key: '6b8a2b12c735424502382edb51a39217ac150514' }))), h("button", { key: 'bd5697f0ac6f06c2cde2e7884cecd5d7e37126bb', type: "button", part: "dislike", class: "bs-chatbot-response-action__button", "aria-label": this.dislikeLabel, "aria-pressed": this.disliked ? 'true' : 'false', onClick: this.onDislikeClick }, h("bs-ripple", { key: '3a8c25ace69423516c47e4888b287a230f6cf959', part: "ripple", centered: true }), h("slot", { key: '47c944affbe8e835a2935d09379a8bba1d40676b', name: "dislike-icon" }, h(ThumbsDownIcon, { key: '7b4ea0aa2939e7c2279f1be9436bb23662895741' }))), h("button", { key: '228e47271ca3d2c29f98a624fb9aac5fa7aa5c73', type: "button", part: "copy", class: "bs-chatbot-response-action__button", "aria-label": this.copyLabel, onClick: this.onCopyClick }, h("bs-ripple", { key: '976a7aa72b6aa7381cdfb3d2b57c8102b02f82eb', part: "ripple", centered: true }), h("slot", { key: 'da9e6cd712ada2119b7e7fce17a6e16e8fa58e69', name: "copy-icon" }, h(CopyIcon, { key: 'f1d5ab12239750a0b07584b33ee5b2a649d05631' }))), !this.hideRegenerate && (h("button", { key: '334a46a5b574f72d82f9f530143cd0046c7a280c', type: "button", part: "regenerate", class: "bs-chatbot-response-action__button", "aria-label": this.regenerateLabel, onClick: this.onRegenerateClick }, h("bs-ripple", { key: '5660a8e6eb4fcb8360542eb5723cb5bb51c76c7d', part: "ripple", centered: true }), h("slot", { key: '4a67443d0d1153d5175586387b6322ad72032781', name: "regenerate-icon" }, h(RegenerateIcon, { key: '9b8fb478f8072ccb2e611b89050a3d6254fb2587' })))), h("div", { key: '5be42f79158e217347b7700d41b2e80647058d06', class: "bs-chatbot-response-action__menu-wrapper" }, h("button", { key: '95e09e53f83546c24b244ccfbdf160dd70a18a72', 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("bs-ripple", { key: '34195f1ac957ce1bf4d524b833c95682795e7738', part: "ripple", centered: true }), h("slot", { key: 'a725a6b2ed797afd8a25ce6a6e77f76ea1c55642', name: "menu-icon" }, h(MenuIcon, { key: '36cab1a3ea55eca56cf1f68c9d7575d3c0474699' }))), this.menuOpen && (h("div", { key: 'f8ce2de8a6678b249be9dda14e8d9309729addf2', class: "bs-chatbot-response-action__menu-popup" }, h("slot", { key: '5832b33e625da7c4497d5ab7f915ac66cb1cd5b2', name: "menu" })))), hasSources && (h("button", { key: '07f4fc5cefb1009925fc8aa09657249d9b36ad73', type: "button", part: "sources", class: "bs-chatbot-response-action__sources", onClick: this.onSourcesClick }, h("slot", { key: '66e6551c5bee14482bd30dfd859ecb7fbcf591f5', name: "sources-icon" }, h(SourcesIcon, { key: '11d2d3cfc3ec03c1093066cbd711167e80edca5e' })), h("span", { key: '7f274379a117a1bccce9c6df3de960420d3216d1', class: "bs-chatbot-response-action__sources-label" }, this.sourcesCount, " ", this.sourcesCount === 1 ? this.sourceLabel : this.sourcesLabel)))));
     }
     static get is() { return "bs-chatbot-response-action"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-chatbot-sources-drawer/bs-chatbot-sources-drawer.js

@@ -59,7 +59,7 @@ export class BsChatbotSourcesDrawer {
     };
     render() {
         const displayCount = this.count ?? this.slottedCount;
-        return (h("div", { key: '1d0c3253af7cf38b81b36ac15a78033c03e14c91', class: "bs-chatbot-sources-drawer", role: "region", "aria-label": this.heading }, h("div", { key: 'd5eb2089574325eb8540a98d0603368e46b8c73d', class: "bs-chatbot-sources-drawer__header" }, h("div", { key: '1fb338f2a8c1f868daef29625eb7bfc2ffb3ce0e', class: "bs-chatbot-sources-drawer__title-group" }, h("h2", { key: '6c4ab9c5de55e70cfe9c163d454cfa419bc83ea8', part: "heading", class: "bs-chatbot-sources-drawer__heading" }, this.heading), displayCount > 0 && (h("span", { key: 'fe7a147f6f7148f7c1252a93cd56060dc38b3eb2', part: "count", class: "bs-chatbot-sources-drawer__count" }, displayCount))), h("button", { key: 'fe09c59453243448e8c48ed6e451b5e49c3608d3', type: "button", part: "collapse", class: "bs-chatbot-sources-drawer__collapse", "aria-label": this.collapseLabel, onClick: this.onCollapseClick }, h("slot", { key: 'da8e67e324afb7eb6dc75d160ba3a6c447c33354', name: "collapse-icon" }, h(CaretRightIcon, { key: 'c079b91874239e6bdaea1cdeb65d7ccf70de90cd' })))), h("div", { key: 'f9098edd11a91137bb55deab94ab0b999e530cac', part: "list", class: "bs-chatbot-sources-drawer__list" }, h("slot", { key: 'e0c95d42eef55be86cee88f850556f2a4c712fcd', onSlotchange: this.onSlotchange }))));
+        return (h("div", { key: 'e5cd2f50245abdf4d9a05348ba915dba9bc79573', class: "bs-chatbot-sources-drawer", role: "region", "aria-label": this.heading }, h("div", { key: '997a59d151f334fc6a1a8e30411f8674b1a8534f', class: "bs-chatbot-sources-drawer__header" }, h("div", { key: 'c72b346306dbfcd72dfcdfc3022fc048ccea6d83', class: "bs-chatbot-sources-drawer__title-group" }, h("h2", { key: '8c1c858fefd2e4d12a7a7f3e442866b1f3848e4f', part: "heading", class: "bs-chatbot-sources-drawer__heading" }, this.heading), displayCount > 0 && (h("span", { key: 'fca19f5498634aff0f7bec44e187ea6dde558c3d', part: "count", class: "bs-chatbot-sources-drawer__count" }, displayCount))), h("button", { key: '219bf542af1c6ccd16e5b2b28e68ac161c8f870a', type: "button", part: "collapse", class: "bs-chatbot-sources-drawer__collapse", "aria-label": this.collapseLabel, onClick: this.onCollapseClick }, h("slot", { key: '599f9de30d93f624751a6b8c69df4554fb38acea', name: "collapse-icon" }, h(CaretRightIcon, { key: '43da27fe3aa229fd3fe9d1c2725c28258e586c18' })))), h("div", { key: '76eabacbe8380a57189787180a15e7c414a280ec', part: "list", class: "bs-chatbot-sources-drawer__list" }, h("slot", { key: '7cd661e7884bca5677ec69bf21a9f414808a44ac', onSlotchange: this.onSlotchange }))));
     }
     static get is() { return "bs-chatbot-sources-drawer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-chatbot-suggestion-button/bs-chatbot-suggestion-button.js

@@ -46,7 +46,7 @@ export class BsChatbotSuggestionButton {
         this.bsSelect.emit();
     };
     render() {
-        return (h("button", { key: '5dec9f6d82254f0cac7ec92734ed199ffe22e421', type: "button", part: "button", class: "bs-chatbot-suggestion-button", disabled: this.disabled, onClick: this.onClick }, h("bs-ripple", { key: 'b4c464e7c9cbdb988f503babd2cb99f27e80b62f', part: "ripple", centered: false, disabled: this.disabled }), h("slot", { key: '73b0f23768b8ff67035d4dee7352eeff1bdde7c6' })));
+        return (h("button", { key: '7e2eec8f12239cc5038740f7bc4d98cb40f4b4e5', type: "button", part: "button", class: "bs-chatbot-suggestion-button", disabled: this.disabled, onClick: this.onClick }, h("bs-ripple", { key: '59e94b073e82320148196c6ea526db559e55e8cb', part: "ripple", centered: false, disabled: this.disabled }), h("slot", { key: 'b137e2270b7da3437a6c16d5b34b968fb325b46c' })));
     }
     static get is() { return "bs-chatbot-suggestion-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-checkbox/bs-checkbox-skeleton/bs-checkbox-skeleton.js

@@ -35,7 +35,7 @@ export class BsCheckboxSkeleton {
     /** Accessible name announced for the loading placeholder. */
     loadingLabel = 'Loading';
     render() {
-        return (h("span", { key: '8458201ffae956d841ea313054cc75b0a51ad6ff', part: "container", class: "bs-checkbox-skeleton", role: "status", "aria-label": this.loadingLabel }, h("span", { key: '6c99ce841d3b9788cba16afbe23b4ec27e3fe1ce', part: "box", class: `bs-checkbox-skeleton__box bs-checkbox-skeleton__box--${this.size}` }), h("span", { key: 'f950ba0f0b3025d19ca5da7cefe3a75bb47932b1', part: "label", class: "bs-checkbox-skeleton__label" })));
+        return (h("span", { key: 'afdd1bab3322df2b766e2a75b29d043d710bd9a7', part: "container", class: "bs-checkbox-skeleton", role: "status", "aria-label": this.loadingLabel }, h("span", { key: '491a550c60e8b98e622efd6cf8c7a2335b20b7f2', part: "box", class: `bs-checkbox-skeleton__box bs-checkbox-skeleton__box--${this.size}` }), h("span", { key: '12d364db8342098312d8fd6c1237cf63cab52b35', part: "label", class: "bs-checkbox-skeleton__label" })));
     }
     static get is() { return "bs-checkbox-skeleton"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-checkbox/bs-checkbox.stories.js

@@ -1,5 +1,7 @@
 import { html } from "lit";
 import { componentDescription, propDescription } from "../../stories-utils";
+import { expect, userEvent, waitFor } from "storybook/test";
+import { ready, inShadow, recordEvents } from "../../play-utils";
 const sizes = ['sm', 'md', 'lg'];
 const meta = {
     title: 'Components/bs-checkbox',
@@ -33,7 +35,20 @@ const meta = {
     },
 };
 export default meta;
-export const Default = {};
+export const Default = {
+    play: async ({ canvasElement }) => {
+        const host = await ready(canvasElement, 'bs-checkbox');
+        const changes = recordEvents(host, 'bsChange');
+        const input = inShadow(host, 'input');
+        await expect(input).not.toBeChecked();
+        await userEvent.click(input);
+        await waitFor(() => expect(input).toBeChecked());
+        await expect(changes.map(e => e.detail)).toEqual([true]);
+        await userEvent.click(input);
+        await waitFor(() => expect(input).not.toBeChecked());
+        await expect(changes.map(e => e.detail)).toEqual([true, false]);
+    },
+};
 export const Horizontal = {
     // A layout demo, not a real prop -- bs-checkbox has no orientation/group concept of its own
     // (unlike Carbon's <cds-checkbox-group>), so arranging multiple instances in a row is purely the
@@ -54,6 +69,15 @@ export const Indeterminate = {
 };
 export const Disabled = {
     args: { disabled: true },
+    play: async ({ canvasElement }) => {
+        const host = await ready(canvasElement, 'bs-checkbox');
+        const changes = recordEvents(host, 'bsChange');
+        const input = inShadow(host, 'input');
+        await expect(input).toBeDisabled();
+        await userEvent.click(input);
+        await expect(input.checked).toBe(false);
+        await expect(changes).toHaveLength(0);
+    },
 };
 export const DisabledChecked = {
     name: 'Disabled + checked',

package/dist/collection/components/bs-checkbox-group/bs-checkbox-group.cmp.test.js

@@ -4,6 +4,15 @@ const boxes = (root) => Array.from(root.querySelectorAll('bs-checkbox'));
 const input = (b) => b.shadowRoot.querySelector('input');
 const basic = (extra = {}) => (h("bs-checkbox-group", { label: "Notify by", ...extra }, h("bs-checkbox", { value: "email" }, "Email"), h("bs-checkbox", { value: "sms" }, "SMS"), h("bs-checkbox", { value: "push" }, "Push")));
 describe('bs-checkbox-group', () => {
+    it('announces required via legend text, not aria-required (invalid on a fieldset)', async () => {
+        const { root } = await render(basic({ required: true }));
+        const group = root.shadowRoot.querySelector('fieldset');
+        expect(group.hasAttribute('aria-required')).toBe(false);
+        expect(root.shadowRoot.querySelector('legend').textContent).toContain('(required)');
+        root.requiredLabel = 'påkrævet';
+        await new Promise(r => setTimeout(r, 50));
+        expect(root.shadowRoot.querySelector('legend').textContent).toContain('(påkrævet)');
+    });
     it('is a fieldset with a legend', async () => {
         const { root } = await render(basic());
         expect(root.shadowRoot.querySelector('fieldset')).not.toBeNull();

package/dist/collection/components/bs-checkbox-group/bs-checkbox-group.css

@@ -63,3 +63,16 @@
 .bs-checkbox-group__error {
   color: var(--bs-checkbox-group-error-color);
 }
+
+/* Visually hidden, still read by screen readers. */
+.bs-checkbox-group__sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  border: 0;
+}

package/dist/collection/components/bs-checkbox-group/bs-checkbox-group.js

@@ -31,8 +31,10 @@ export class BsCheckboxGroup {
     error;
     /** Layout of the checkboxes. */
     orientation = 'vertical';
-    /** Marks the group as required: shows an asterisk after the label and sets `aria-required`. */
+    /** Marks the group as required: shows an asterisk after the label and adds the `requiredLabel` text to the legend for assistive tech. */
     required = false;
+    /** Text appended (visually hidden) to the legend when `required`, so screen readers announce it. `aria-required` is not valid on a `fieldset`. */
+    requiredLabel = 'required';
     /** `value`s of the checked checkboxes. An array, so set it as a JS property, not an attribute. Setting it checks the matching boxes and unchecks the rest. */
     value = [];
     /** Emitted with the new array of checked `value`s when the user toggles a checkbox. Replaces the checkboxes' own `bsChange`, which does not reach listeners outside the group. */
@@ -75,7 +77,10 @@ export class BsCheckboxGroup {
     render() {
         const descId = `${this.id}-desc`;
         const note = this.error || this.description;
-        return (h("fieldset", { key: '0fe78473d394ca02d2901e2dd6ee2b41bf0c8f82', part: "group", class: { 'bs-checkbox-group': true, 'bs-checkbox-group--error': !!this.error }, "aria-describedby": note ? descId : undefined, "aria-invalid": this.error ? 'true' : undefined, "aria-required": this.required ? 'true' : undefined }, this.label && (h("legend", { key: '93ebc36796a72142d0c37a5242fc3c41aac4cb24', part: "label", class: "bs-checkbox-group__label" }, this.label, this.required && h("span", { key: 'eafcf168ac7d17feef71686e3a57498093ab0b97', "aria-hidden": "true" }, " *"))), h("div", { key: '4473ad6ab2d88e0e1e6a68f5669d9008716a061b', part: "options", class: "bs-checkbox-group__options" }, h("slot", { key: '948c5302774f93e6e5173d0693450d14eb4230e3', onSlotchange: this.onSlotchange })), note && (h("span", { key: 'b625aa5a79b78c5fb2cceea6fa412582d41d4180', id: descId, part: this.error ? 'error' : 'description', class: this.error ? 'bs-checkbox-group__error' : 'bs-checkbox-group__description' }, this.error || this.description))));
+        return (h("fieldset", { key: '8f7fb1a067e1f56befc8b0482405333f4eb5d3b1', part: "group", class: { 'bs-checkbox-group': true, 'bs-checkbox-group--error': !!this.error }, "aria-describedby": note ? descId : undefined, "aria-invalid": this.error ? 'true' : undefined }, this.label && (h("legend", { key: '4184cdfef2d458b06159289c44ed62093ec43fbe', part: "label", class: "bs-checkbox-group__label" }, this.label, this.required && [
+            h("span", { key: '7c50ad16bb5a62aee6bb7c1c6171fb7fc7843cbc', "aria-hidden": "true" }, " *"),
+            h("span", { key: '07c282bd08e6ba04aa245f37987985bd3e19e842', class: "bs-checkbox-group__sr-only" }, " (", this.requiredLabel, ")"),
+        ])), h("div", { key: '2f418bcf802da9f6c312b103a0f49096e7bd0f08', part: "options", class: "bs-checkbox-group__options" }, h("slot", { key: '276403e8a81f0d6801ede58375a0802b382841a0', onSlotchange: this.onSlotchange })), note && (h("span", { key: 'bd3e98d357755bf1135c9dd9e3defb35090559da', id: descId, part: this.error ? 'error' : 'description', class: this.error ? 'bs-checkbox-group__error' : 'bs-checkbox-group__description' }, this.error || this.description))));
     }
     static get is() { return "bs-checkbox-group"; }
     static get encapsulation() { return "shadow"; }
@@ -186,7 +191,7 @@ export class BsCheckboxGroup {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Marks the group as required: shows an asterisk after the label and sets `aria-required`."
+                    "text": "Marks the group as required: shows an asterisk after the label and adds the `requiredLabel` text to the legend for assistive tech."
                 },
                 "getter": false,
                 "setter": false,
@@ -194,6 +199,26 @@ export class BsCheckboxGroup {
                 "attribute": "required",
                 "defaultValue": "false"
             },
+            "requiredLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Text appended (visually hidden) to the legend when `required`, so screen readers announce it. `aria-required` is not valid on a `fieldset`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "required-label",
+                "defaultValue": "'required'"
+            },
             "value": {
                 "type": "unknown",
                 "mutable": true,

package/dist/collection/components/bs-chip/bs-chip-filter/bs-chip-filter.js

@@ -71,7 +71,7 @@ export class BsChipFilter {
         // label-only edge gets more -- except when NEITHER edge has a glyph, where both edges use a
         // third, larger value rather than the label-only one (see bs-chip-filter.css's own comment).
         const paddingVariant = this.hasIcon && this.dropdown ? 'icon-dropdown' : this.hasIcon ? 'icon-only' : this.dropdown ? 'dropdown-only' : 'text-only';
-        return (h("button", { key: '06a4efff34f6542d59f9e46b4df706cae4a3118c', type: "button", class: `bs-chip-filter bs-chip-filter--${this.size} bs-chip-filter--${paddingVariant} ${this.selected ? 'bs-chip-filter--selected' : ''}`, disabled: this.disabled, "aria-pressed": String(this.selected), "aria-label": this.ariaLabel, onClick: this.onClick }, h("bs-ripple", { key: 'd76f2c368b82361e021d92eda38f68783910c4d7', part: "ripple", centered: false, disabled: this.disabled }), h("span", { key: 'e31e9dbb2f8663c8c496c0c24a465025de3513d9', part: "icon", class: `bs-chip-filter__icon ${this.hasIcon ? 'bs-chip-filter__icon--visible' : ''}` }, h("slot", { key: 'c9c11954b627f6f0cf2defd3bc24d39c83f8b6f7', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: 'af8b16f4c1c36d68db0ecef3844ef81e0c2a95f2', part: "label", class: "bs-chip-filter__label" }, h("slot", { key: 'afed8547e55dd8851f4a35204dfc8c19aac9552c' })), this.dropdown && (h("span", { key: 'ae9a53b2c520650bd8ec765ea21471800e9434ff', part: "caret", class: "bs-chip-filter__caret", "aria-hidden": "true" }, h(ChevronDownIcon, { key: '0311c2312584e20590bfb8d3c34a7b0d5efea652' })))));
+        return (h("button", { key: '7cfdd0089c8023f1409ccf9751ffe03329a6d884', type: "button", class: `bs-chip-filter bs-chip-filter--${this.size} bs-chip-filter--${paddingVariant} ${this.selected ? 'bs-chip-filter--selected' : ''}`, disabled: this.disabled, "aria-pressed": String(this.selected), "aria-label": this.ariaLabel, onClick: this.onClick }, h("bs-ripple", { key: '3aa54019b1985b8cf77834c31b1df31a56e28774', part: "ripple", centered: false, disabled: this.disabled }), h("span", { key: '752fbf3f55aad2206e38f27e6841a4a8cb775449', part: "icon", class: `bs-chip-filter__icon ${this.hasIcon ? 'bs-chip-filter__icon--visible' : ''}` }, h("slot", { key: '51435c1edb40d989241b59413dc6e30b353b5b46', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '34db254d4ee9616e2497705bc57237bcaac3b6a2', part: "label", class: "bs-chip-filter__label" }, h("slot", { key: '35a15ed0702180ab8cb58e6249b78d1322ee4b5b' })), this.dropdown && (h("span", { key: 'e72f4c5612cf67848711c31f2ab32403bdc645f2', part: "caret", class: "bs-chip-filter__caret", "aria-hidden": "true" }, h(ChevronDownIcon, { key: '513939f3b41904070b43fed9ac8169fb2c92ef6d' })))));
     }
     static get is() { return "bs-chip-filter"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/bs-chip/bs-chip-informative/bs-chip-informative.cmp.test.js

@@ -40,4 +40,48 @@ describe('bs-chip-informative', () => {
         const { root } = await render(h("bs-chip-informative", null, "Active"));
         expect(root).toHaveTextContent('Active');
     });
+    describe('removable and href (replaces bs-tag)', () => {
+        const removeBtn = (root) => root.shadowRoot.querySelector('[part="remove"]');
+        it('is non-interactive by default: no remove button and no link', async () => {
+            const { root } = await render(h("bs-chip-informative", null, "Label"));
+            expect(removeBtn(root)).toBeNull();
+            expect(root.shadowRoot.querySelector('a')).toBeNull();
+            expect(root.shadowRoot.querySelector('[part="label"]').tagName).toBe('SPAN');
+        });
+        it('removable renders a named remove button, reflects the attribute and emits bsRemove on click', async () => {
+            const { root, spyOnEvent, waitForChanges } = await render(h("bs-chip-informative", { removable: true }, "Design"));
+            await waitForChanges();
+            expect(root).toHaveAttribute('removable');
+            expect(removeBtn(root).ariaLabel).toBe('Remove Design');
+            const spy = spyOnEvent('bsRemove');
+            removeBtn(root).click();
+            expect(spy).toHaveReceivedEventTimes(1);
+        });
+        it('removeLabel changes the prefix of the remove button name', async () => {
+            const { root, waitForChanges } = await render(h("bs-chip-informative", { removable: true, removeLabel: "Fjern" }, "Design"));
+            await waitForChanges();
+            expect(removeBtn(root).ariaLabel).toBe('Fjern Design');
+        });
+        it('href renders a real link, and target="_blank" adds rel="noopener noreferrer"', async () => {
+            const { root } = await render(h("bs-chip-informative", { href: "/topics/design", target: "_blank" }, "Design"));
+            const a = root.shadowRoot.querySelector('a[part="label"]');
+            expect(a).not.toBeNull();
+            expect(a.getAttribute('href')).toBe('/topics/design');
+            expect(a.getAttribute('rel')).toBe('noopener noreferrer');
+        });
+        it('can be a link and removable at the same time', async () => {
+            const { root } = await render(h("bs-chip-informative", { href: "#x", removable: true }, "Design"));
+            expect(root.shadowRoot.querySelector('a[part="label"]')).not.toBeNull();
+            expect(removeBtn(root)).not.toBeNull();
+        });
+        it('disabled is never a link, and its remove button is disabled and emits nothing', async () => {
+            const { root, spyOnEvent, waitForChanges } = await render(h("bs-chip-informative", { disabled: true, href: "#x", removable: true }, "Design"));
+            await waitForChanges();
+            expect(root.shadowRoot.querySelector('a')).toBeNull();
+            expect(removeBtn(root).disabled).toBe(true);
+            const spy = spyOnEvent('bsRemove');
+            removeBtn(root).shadowRoot.querySelector('button').click();
+            expect(spy).not.toHaveReceivedEvent();
+        });
+    });
 });

package/dist/collection/components/bs-chip/bs-chip-informative/bs-chip-informative.css

@@ -20,6 +20,10 @@
  * @prop --bs-chip-informative-font-size: Aliased to --bs-font-size-sm (size="md"/"lg").
  * @prop --bs-chip-informative-line-height: Aliased to --bs-line-height-body-sm (size="md"/"lg").
  * @prop --bs-chip-informative-font-weight: Aliased to --bs-font-weight-regular.
+ * @prop --bs-chip-informative-padding-right-removable: Right-edge padding when `removable` (the remove
+ * button supplies its own visual padding). Aliased to --bs-spacing-50.
+ * @prop --bs-chip-informative-focus-ring: Focus ring colour of the link label. Aliased to
+ * --bs-border-neutral-focus.
  *
  * Color (background/text per color/disabled) comes directly from brandsync-tokens' own pre-built
  * chip token set below -- shared across the whole bs-chip family, not local to this component,
@@ -48,6 +52,8 @@
   --bs-chip-informative-font-size: var(--bs-font-size-sm);
   --bs-chip-informative-line-height: var(--bs-line-height-body-sm);
   --bs-chip-informative-font-weight: var(--bs-font-weight-regular);
+  --bs-chip-informative-padding-right-removable: var(--bs-spacing-50);
+  --bs-chip-informative-focus-ring: var(--bs-border-neutral-focus);
 }
 
 :host(.bs-chip-informative--lg) {
@@ -78,6 +84,10 @@
   padding-inline-end: var(--bs-chip-informative-padding-x-plain-side);
 }
 
+:host(.bs-chip-informative--removable) {
+  padding-inline-end: var(--bs-chip-informative-padding-right-removable);
+}
+
 .bs-chip-informative__icon {
   display: none;
   flex-shrink: 0;
@@ -102,6 +112,26 @@
   align-items: center;
 }
 
+.bs-chip-informative__label--link {
+  color: inherit;
+  text-decoration: underline;
+  border-radius: var(--bs-border-radius-50);
+}
+
+.bs-chip-informative__label--link:hover {
+  text-decoration-thickness: 2px;
+}
+
+.bs-chip-informative__label--link:focus-visible {
+  outline: 2px solid var(--bs-chip-informative-focus-ring);
+  outline-offset: 2px;
+}
+
+.bs-chip-informative__remove {
+  flex-shrink: 0;
+  color: inherit;
+}
+
 :host(.bs-chip-informative--neutral) {
   background: var(--bs-chip-bg-neutral-container);
   color: var(--bs-chip-text-neutral);

package/dist/collection/components/bs-chip/bs-chip-informative/bs-chip-informative.js

@@ -1,21 +1,28 @@
 import { Host, h } from "@stencil/core";
 /**
- * A pill-shaped, non-interactive label for conveying a category or status at a glance, optionally
- * paired with a leading icon. Unlike `bs-chip-filter`/`bs-chip-input`, this is purely informational
- * -- no click/select/remove behavior, no hover/focus/pressed states.
+ * A pill-shaped label for conveying a category or status at a glance, optionally paired with a
+ * leading icon. By default it is purely informational -- no click/select behavior, no
+ * hover/focus/pressed states. Two opt-ins cover what used to need a separate `bs-tag`: `removable`
+ * adds a remove button (`bsRemove`), and `href` turns the label into a link.
  *
  * ## When to use
  * - Conveying a category or status inline with other content, with more color options and an
  *   optional icon than `bs-badge` offers.
+ * - Metadata on a record (topics, keywords, owners) that can be removed one by one (`removable`) or
+ *   that leads to a filtered view or detail page (`href`).
  *
  * ## When not to use
- * - Anything clickable/selectable -- use `bs-chip-filter`.
+ * - Toggling a filter on and off -- use `bs-chip-filter`; entering free-text values -- use
+ *   `bs-chip-input`.
  * - A short, fixed status label with no color/icon needs -- `bs-badge` is the simpler choice.
  *
+ * **Built from:** `bs-icon-button` (the remove control, `size="xs"`).
+ *
  * @slot - Default slot: the chip's label content.
  * @slot icon - Optional leading icon.
  * @part icon - The icon wrapper element.
- * @part label - The text label element.
+ * @part label - The text label element (a link when `href` is set).
+ * @part remove - The remove button (`bs-icon-button`), only when `removable`.
  */
 export class BsChipInformative {
     el;
@@ -30,12 +37,37 @@ export class BsChipInformative {
     /** Overrides `color` with the disabled token set, regardless of its value. Reflected so
      * `:host([disabled])` can apply it in CSS. */
     disabled = false;
+    /** Shows a remove button that emits `bsRemove`. The consumer removes the element. Off by default,
+     * so a plain chip stays non-interactive. */
+    removable = false;
+    /** Turns the label into a link to this URL. Ignored while `disabled`. */
+    href;
+    /** Link target, only used with `href`. `_blank` also sets `rel="noopener noreferrer"`. */
+    target;
+    /** Prefix of the remove button's accessible name ("Remove {label}"). */
+    removeLabel = 'Remove';
+    /** Fires when the remove button is activated, only when `removable`. No payload; the consumer
+     * removes the chip. Move focus somewhere sensible in your handler -- it is lost with the element. */
+    bsRemove;
     /** Tracks whether the `icon` slot has assigned content, so the icon/label gap and left-edge
      * padding only apply when there's actually a leading icon. */
     hasIcon = false;
+    /** The label's text, used for the remove button's accessible name. */
+    labelText = '';
     componentWillLoad() {
         this.hasIcon = this.hasSlottedContent('icon');
+        this.labelText = this.readLabel();
+    }
+    readLabel() {
+        return Array.from(this.el.childNodes)
+            .filter(n => !(n.nodeType === Node.ELEMENT_NODE && n.hasAttribute('slot')))
+            .map(n => n.textContent || '')
+            .join('')
+            .trim();
     }
+    onRemove = () => {
+        this.bsRemove.emit();
+    };
     hasSlottedContent(slotName) {
         return Array.from(this.el.childNodes).some(node => node.nodeType === Node.ELEMENT_NODE && node.getAttribute('slot') === slotName);
     }
@@ -44,7 +76,10 @@ export class BsChipInformative {
     };
     render() {
         const paddingVariant = this.hasIcon ? 'icon' : 'text';
-        return (h(Host, { key: '859a7b1d4d42f8dcb3954b66d013c588453a2dfd', class: `bs-chip-informative bs-chip-informative--${this.color} bs-chip-informative--${this.size} bs-chip-informative--${paddingVariant}`, "aria-disabled": this.disabled ? 'true' : undefined }, h("span", { key: 'f9d97bc62eea33379adb890e004ecd0a2a8c5c3d', part: "icon", class: `bs-chip-informative__icon ${this.hasIcon ? 'bs-chip-informative__icon--visible' : ''}` }, h("slot", { key: '4e41027828c2514bfdc68a1e13b4bb0ca0278653', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '9519ca92daaadce0572e0dccb6607390d7e019c8', part: "label", class: "bs-chip-informative__label" }, h("slot", { key: '1231db6420ffbfbb63cbba714ca51d571f5bd981' }))));
+        const isLink = !!this.href && !this.disabled;
+        const rel = isLink && this.target === '_blank' ? 'noopener noreferrer' : undefined;
+        const label = h("slot", { key: 'ef28047f16d39f511b22c44dc8d5fed7031d2f42', onSlotchange: () => (this.labelText = this.readLabel()) });
+        return (h(Host, { key: '1efcc6d4f937ca210e938e6c6d146ed190f9a9c7', class: `bs-chip-informative bs-chip-informative--${this.color} bs-chip-informative--${this.size} bs-chip-informative--${paddingVariant} ${this.removable ? 'bs-chip-informative--removable' : ''}`, "aria-disabled": this.disabled ? 'true' : undefined }, h("span", { key: 'fd333a339d4cea6ff26362d9b583de0ae58b2d97', part: "icon", class: `bs-chip-informative__icon ${this.hasIcon ? 'bs-chip-informative__icon--visible' : ''}` }, h("slot", { key: '1b24fa6d1144ae046e7e63a61bec7197ad146626', name: "icon", onSlotchange: this.onIconSlotchange })), isLink ? (h("a", { part: "label", class: "bs-chip-informative__label bs-chip-informative__label--link", href: this.href, target: this.target, rel: rel }, label)) : (h("span", { part: "label", class: "bs-chip-informative__label" }, label)), this.removable && (h("bs-icon-button", { key: '907d4095f2fb64ee3d3d928c7ff41cacb1656911', part: "remove", class: "bs-chip-informative__remove", size: "xs", variant: "subtle", disabled: this.disabled, ariaLabel: `${this.removeLabel} ${this.labelText}`.trim(), onClick: this.onRemove }, h("svg", { key: '7ff06d4309db7e3462600bb8e620b6092d55ba66', viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: '8bff2d547b88bdb5a240a13a82f71a0f3345ba59', d: "M12.5 3.5L3.5 12.5M12.5 12.5L3.5 3.5", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))));
     }
     static get is() { return "bs-chip-informative"; }
     static get encapsulation() { return "shadow"; }
@@ -131,13 +166,110 @@ export class BsChipInformative {
                 "reflect": true,
                 "attribute": "disabled",
                 "defaultValue": "false"
+            },
+            "removable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Shows a remove button that emits `bsRemove`. The consumer removes the element. Off by default,\nso a plain chip stays non-interactive."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "removable",
+                "defaultValue": "false"
+            },
+            "href": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Turns the label into a link to this URL. Ignored while `disabled`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "href"
+            },
+            "target": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Link target, only used with `href`. `_blank` also sets `rel=\"noopener noreferrer\"`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "target"
+            },
+            "removeLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Prefix of the remove button's accessible name (\"Remove {label}\")."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "remove-label",
+                "defaultValue": "'Remove'"
             }
         };
     }
     static get states() {
         return {
-            "hasIcon": {}
+            "hasIcon": {},
+            "labelText": {}
         };
     }
+    static get events() {
+        return [{
+                "method": "bsRemove",
+                "name": "bsRemove",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fires when the remove button is activated, only when `removable`. No payload; the consumer\nremoves the chip. Move focus somewhere sensible in your handler -- it is lost with the element."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
     static get elementRef() { return "el"; }
 }

package/dist/collection/components/bs-chip/bs-chip-informative/bs-chip-informative.stories.js

@@ -47,6 +47,13 @@ export const WithIcon = {
 export const Disabled = {
     args: { disabled: true },
 };
+export const Removable = {
+    render: args => html ` <bs-chip-informative color=${args.color} size=${args.size} ?disabled=${args.disabled} removable>${args.label}</bs-chip-informative> `,
+};
+export const AsLink = {
+    name: 'As link',
+    render: args => html ` <bs-chip-informative color=${args.color} size=${args.size} ?disabled=${args.disabled} href="#topic">${args.label}</bs-chip-informative> `,
+};
 export const Small = {
     args: { size: 'sm' },
 };

package/dist/collection/components/bs-chip/bs-chip-input/bs-chip-input.js

@@ -80,7 +80,7 @@ export class BsChipInput {
     };
     render() {
         const paddingVariant = this.hasIcon ? 'icon' : 'text';
-        return (h(Host, { key: '8ab76f06cb483dbc73d33b0d18a5bd480835a73c', class: `bs-chip-input bs-chip-input--${this.size} bs-chip-input--${paddingVariant}` }, h("button", { key: '5bbf3a240d0e3bafbb05d2e1f08b1a536957845a', type: "button", part: "body", class: "bs-chip-input__body", disabled: this.disabled, "aria-pressed": String(this.selected), onClick: this.onBodyClick }, h("bs-ripple", { key: '0fb4d5f11b8f4f688c84d81d8f6a5a1588ef8e98', part: "ripple", centered: false, disabled: this.disabled }), h("span", { key: '6933afdd4c1d7cbee3c44fd5a4bdda6d50a057c6', part: "icon", class: `bs-chip-input__icon ${this.hasIcon ? 'bs-chip-input__icon--visible' : ''}` }, h("slot", { key: '76ceb9abac6525345e6c10fd0d32391e566754bb', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '436b7b71ce8cfd6233a42097a54a0b4b1b63d446', part: "label", class: "bs-chip-input__label" }, h("slot", { key: '9a8e09c8a8cbc92951251b8cfb28b2bce6e21225', onSlotchange: this.onLabelSlotchange }))), h("button", { key: '52d5a5fac66271314c75bec429c9b44b21d9ea1c', type: "button", part: "remove", class: "bs-chip-input__remove", disabled: this.disabled, "aria-label": `${this.removeLabel} ${this.labelText}`, onClick: this.onRemoveClick }, h("bs-ripple", { key: 'fa18494eb706510dd91701d98b670b123dfbfb3c', part: "ripple", centered: true, disabled: this.disabled }), h(CloseIcon, { key: 'a56ac8cbc660bd9349ab82179901eadcb005ea2a' }))));
+        return (h(Host, { key: '138a3e7ee6dc966c580f664ec184466f71272f11', class: `bs-chip-input bs-chip-input--${this.size} bs-chip-input--${paddingVariant}` }, h("button", { key: '6d81c76a47b8a4f5d410f62da65bc21fd73ab326', type: "button", part: "body", class: "bs-chip-input__body", disabled: this.disabled, "aria-pressed": String(this.selected), onClick: this.onBodyClick }, h("bs-ripple", { key: 'd625ac5a1c658215730aa694b69e426a3f17e138', part: "ripple", centered: false, disabled: this.disabled }), h("span", { key: 'd073ce98fe4a7ad884c055da57ccab870337f468', part: "icon", class: `bs-chip-input__icon ${this.hasIcon ? 'bs-chip-input__icon--visible' : ''}` }, h("slot", { key: 'fc9323f052532e20e443ec52d36f7343a5438148', name: "icon", onSlotchange: this.onIconSlotchange })), h("span", { key: '0e174e2a29afbaff6e6468e9b0e1fc17d1e59fbf', part: "label", class: "bs-chip-input__label" }, h("slot", { key: 'a1c9457b41944c59dc49666361eeae0f2dceedb0', onSlotchange: this.onLabelSlotchange }))), h("button", { key: '981a4d06c8fce2ee6ca3a01adb438eaa95652aac', type: "button", part: "remove", class: "bs-chip-input__remove", disabled: this.disabled, "aria-label": `${this.removeLabel} ${this.labelText}`, onClick: this.onRemoveClick }, h("bs-ripple", { key: '8946515916aaedcd3d73961be2e9534e57ab0e17', part: "ripple", centered: true, disabled: this.disabled }), h(CloseIcon, { key: '2f67baae389fc4fbfaa29f4e6c720a2e02a8c8c4' }))));
     }
     static get is() { return "bs-chip-input"; }
     static get encapsulation() { return "shadow"; }