npm - @carbon/ibm-products-web-components - Versions diffs - 0.45.0 → 0.46.0 - Mend

@carbon/ibm-products-web-components 0.45.0 → 0.46.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.

Files changed (128) hide show

package/es/components/add-select/add-select-body.js CHANGED Viewed

@@ -8,8 +8,7 @@
 import "../../globals/settings.js";
 import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.127.0/helpers/decorate.js";
 import add_select_body_default$1 from "./add-select-body.scss.js";
-import { classMap } from "lit/directives/class-map.js";
-import { LitElement, html } from "lit";
+import { LitElement, html, nothing } from "lit";
 import { property, state } from "lit/decorators.js";
 import "@carbon/web-components/es/components/button/index.js";
 import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
@@ -30,9 +29,12 @@ const blockClass = `c4p--add-select__next`;
 /**
 * Add Select Body component - contains the main content area
 * @element c4p-add-select-body
-* @slot default - The main content area containing c4p-add-select-content
-* @slot header - Custom header content
-* @fires c4p-add-select-body-search - Fired when search term changes
+* @slot default - The main content area containing c4p-add-select-column or rows
+* @slot header - Replaces the entire header section
+* @slot actions - Custom actions (filter/sort) rendered next to the search input
+* @slot sub-header-actions - Custom content rendered after breadcrumbs and item count
+* @fires c4p-add-select-body-search - Fired when search term changes; detail: { searchTerm }
+* @fires c4p-add-select-body-breadcrumb-click - Fired when a breadcrumb link is clicked; detail: { index }
 */
 let CDSAddSelectBody = class CDSAddSelectBody extends LitElement {
 	constructor(..._args) {
@@ -42,15 +44,10 @@ let CDSAddSelectBody = class CDSAddSelectBody extends LitElement {
 		this.globalSearchPlaceholder = "Search";
 		this.searchResultsTitle = "Search results";
 		this._searchTerm = "";
-		this.itemCount = 0;
+		this.itemCount = void 0;
+		this.hideSearch = false;
 		this.path = [];
-	}
-	/**
-	* Whether this is a multi-select (inherited from parent c4p-add-select)
-	* @private
-	*/
-	get _multi() {
-		return this.closest(`c4p-add-select`)?.multi ?? false;
+		this._hasHeaderSlot = false;
 	}
 	/**
 	* Handle search input
@@ -65,81 +62,100 @@ let CDSAddSelectBody = class CDSAddSelectBody extends LitElement {
 		};
 		this.dispatchEvent(new CustomEvent(this.constructor.eventSearch, init));
 	}
+	_handleHeaderSlotChange(e) {
+		const slot = e.target;
+		this._hasHeaderSlot = slot.assignedElements({ flatten: true }).length > 0;
+	}
 	render() {
-		const { itemsLabel, globalSearchLabel, globalSearchPlaceholder, searchResultsTitle, itemCount, path, _searchTerm: searchTerm, _handleSearch: handleSearch } = this;
+		const { itemsLabel, globalSearchLabel, globalSearchPlaceholder, searchResultsTitle, itemCount, hideSearch, path, _searchTerm: searchTerm, _handleSearch: handleSearch } = this;
 		return html`
-      <div class=${classMap({
-			[`${blockClass}__body`]: true,
-			[`${blockClass}__body--single`]: !this._multi,
-			[`${blockClass}__body--multi`]: this._multi
-		})}>
-        <!-- Header Section -->
-        <div class="${blockClass}__header">
-          <slot name="header">
-            <!-- Search -->
-            <div class="${blockClass}__search">
-              <cds-search
-                label-text=${globalSearchLabel}
-                placeholder=${globalSearchPlaceholder}
-                size="lg"
-                @cds-search-input=${handleSearch}
-              ></cds-search>
-            </div>
+      <div class="${blockClass}__body">
+        ${!hideSearch || this._hasHeaderSlot || itemCount !== void 0 || path && path.length > 0 ? html`
+              <div class="${blockClass}__header">
+                <!-- Named slot: consumer can replace the entire header -->
+                <slot
+                  name="header"
+                  @slotchange=${this._handleHeaderSlotChange}
+                ></slot>
-            <!-- Sub-header with breadcrumbs or item label -->
-            <div class="${blockClass}__sub-header">
-              <div class="${blockClass}__tags">
-                ${searchTerm ? html`
-                      <p class="${blockClass}__tags-label">
-                        ${searchResultsTitle}
-                      </p>
-                    ` : path && path.length > 0 ? html`
-                        <cds-breadcrumb
-                          no-trailing-slash
-                          class="${classMap({
-			[`c4p--add-select__next__breadcrumbs`]: true,
-			[`c4p--add-select__next__breadcrumbs--multi`]: this._multi
-		})}"
-                        >
-                          ${path.map((entry, idx) => {
+                ${!this._hasHeaderSlot ? html`
+                      <!-- Search + optional actions -->
+                      ${!hideSearch ? html`
+                            <div
+                              class="${blockClass}__search ${blockClass}__search--with-actions"
+                            >
+                              <div class="${blockClass}__search-input">
+                                <cds-search
+                                  label-text=${globalSearchLabel}
+                                  placeholder=${globalSearchPlaceholder}
+                                  size="lg"
+                                  @cds-search-input=${handleSearch}
+                                ></cds-search>
+                              </div>
+                              <div class="${blockClass}__global-actions">
+                                <slot name="actions"></slot>
+                              </div>
+                            </div>
+                          ` : nothing}
+                      <!-- Sub-header: breadcrumbs / label + item count + optional actions -->
+                      <div class="${blockClass}__sub-header">
+                        <div class="${blockClass}__tags">
+                          ${searchTerm ? html`
+                                <p class="${blockClass}__tags-label">
+                                  ${searchResultsTitle}
+                                </p>
+                              ` : path && path.length > 0 ? html`
+                                  <cds-breadcrumb
+                                    no-trailing-slash
+                                    class="${blockClass}__breadcrumbs"
+                                  >
+                                    ${path.map((entry, idx) => {
 			const isCurrentPage = idx === path.length - 1;
 			return html`
-                              <cds-breadcrumb-item
-                                ?is-current-page=${isCurrentPage}
-                              >
-                                ${isCurrentPage ? entry.title : html`
-                                      <cds-link
-                                        href="#"
-                                        @click=${(e) => {
+                                        <cds-breadcrumb-item
+                                          ?is-current-page=${isCurrentPage}
+                                        >
+                                          ${isCurrentPage ? entry.title : html`
+                                                <cds-link
+                                                  href="#"
+                                                  @click=${(e) => {
 				e.preventDefault();
-				const init = {
+				this.dispatchEvent(new CustomEvent(this.constructor.eventBreadcrumbClick, {
 					bubbles: true,
 					cancelable: true,
 					composed: true,
 					detail: { index: idx }
-				};
-				this.dispatchEvent(new CustomEvent(this.constructor.eventBreadcrumbClick, init));
+				}));
 			}}
-                                      >
-                                        ${entry.title}
-                                      </cds-link>
-                                    `}
-                              </cds-breadcrumb-item>
-                            `;
+                                                >
+                                                  ${entry.title}
+                                                </cds-link>
+                                              `}
+                                        </cds-breadcrumb-item>
+                                      `;
 		})}
-                        </cds-breadcrumb>
-                      ` : html`
-                        <p class="${blockClass}__tags-label">${itemsLabel}</p>
-                      `}
-                <cds-tag type="gray" size="sm">${itemCount}</cds-tag>
+                                  </cds-breadcrumb>
+                                ` : html`
+                                  <p class="${blockClass}__tags-label">
+                                    ${itemsLabel}
+                                  </p>
+                                `}
+                          ${itemCount !== void 0 ? html`<cds-tag type="gray" size="sm"
+                                >${itemCount}</cds-tag
+                              >` : nothing}
+                        </div>
+                        <slot name="sub-header-actions"></slot>
+                      </div>
+                    ` : nothing}
               </div>
-            </div>
-          </slot>
-        </div>
+            ` : nothing}
         <!-- Body Content -->
-        <div class="${blockClass}__content">
-          <slot></slot>
+        <div class="${blockClass}__content" role="grid" tabindex="0">
+          <div class="${blockClass}-list-body" role="rowgroup">
+            <slot></slot>
+          </div>
         </div>
       </div>
     `;
@@ -181,7 +197,13 @@ __decorate([property({
 	type: Number,
 	attribute: "item-count"
 })], CDSAddSelectBody.prototype, "itemCount", void 0);
+__decorate([property({
+	type: Boolean,
+	attribute: "hide-search",
+	reflect: true
+})], CDSAddSelectBody.prototype, "hideSearch", void 0);
 __decorate([property({ type: Array })], CDSAddSelectBody.prototype, "path", void 0);
+__decorate([state()], CDSAddSelectBody.prototype, "_hasHeaderSlot", void 0);
 CDSAddSelectBody = __decorate([carbonElement(`c4p-add-select-body`)], CDSAddSelectBody);
 var add_select_body_default = CDSAddSelectBody;
 //#endregion

package/es/components/add-select/add-select-body.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"add-select-body.js","names":["styles","customElement"],"sources":["../../../src/components/add-select/add-select-body.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { LitElement, html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport '@carbon/web-components/es/components/button/index.js';\nimport '@carbon/web-components/es/components/search/index.js';\nimport '@carbon/web-components/es/components/tag/index.js';\nimport '@carbon/web-components/es/components/breadcrumb/index.js';\nimport '@carbon/web-components/es/components/link/index.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './add-select-body.scss?lit';\n\nconst blockClass = `${prefix}--add-select__next`;\n\n/\n Add Select Body component - contains the main content area\n * @element c4p-add-select-body\n * @slot default - The main content area containing c4p-add-select-content\n * @slot header - Custom header content\n * @fires c4p-add-select-body-search - Fired when search term changes\n /\n@customElement(`${prefix}-add-select-body`)\nclass CDSAddSelectBody extends LitElement {\n /\n Whether this is a multi-select (inherited from parent c4p-add-select)\n * @private\n /\n private get _multi(): boolean {\n const parent = this.closest(`${prefix}-add-select`) as any;\n return parent?.multi ?? false;\n }\n\n /\n Label for items section\n /\n @property({ type: String, attribute: 'items-label' })\n itemsLabel = '';\n\n /\n Global search label\n /\n @property({ type: String, attribute: 'global-search-label' })\n globalSearchLabel = '';\n\n /\n Global search placeholder\n /\n @property({ type: String, attribute: 'global-search-placeholder' })\n globalSearchPlaceholder = 'Search';\n\n /\n No results title\n /\n // @property({ type: String, attribute: 'no-results-title' })\n // noResultsTitle = 'No results found';\n\n /\n No results description\n /\n // @property({ type: String, attribute: 'no-results-description' })\n // noResultsDescription = 'Try adjusting your search or filter';\n\n /\n Search results title\n /\n @property({ type: String, attribute: 'search-results-title' })\n searchResultsTitle = 'Search results';\n\n /\n Current search term\n /\n @state()\n private _searchTerm = '';\n\n /\n Item count for display\n /\n @property({ type: Number, attribute: 'item-count' })\n itemCount = 0;\n\n /\n Navigation path for breadcrumbs\n /\n @property({ type: Array })\n path: Array<{ id: string; title: string }> = [];\n\n /\n Handle search input\n /\n private _handleSearch(event: CustomEvent) {\n this._searchTerm = event.detail.value \|\| '';\n const init = {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: { searchTerm: this._searchTerm },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSAddSelectBody).eventSearch,\n init\n )\n );\n }\n\n render() {\n const {\n itemsLabel,\n globalSearchLabel,\n globalSearchPlaceholder,\n searchResultsTitle,\n itemCount,\n path,\n _searchTerm: searchTerm,\n _handleSearch: handleSearch,\n } = this;\n\n const bodyClasses = classMap({\n [`${blockClass}__body`]: true,\n [`${blockClass}__body--single`]: !this._multi,\n [`${blockClass}__body--multi`]: this._multi,\n });\n\n return html`\n <div class=${bodyClasses}>\n <!-- Header Section -->\n <div class=\"${blockClass}__header\">\n <slot name=\"header\">\n <!-- Search -->\n <div class=\"${blockClass}__search\">\n <cds-search\n label-text=${globalSearchLabel}\n placeholder=${globalSearchPlaceholder}\n size=\"lg\"\n @cds-search-input=${handleSearch}\n ></cds-search>\n </div>\n\n <!-- Sub-header with breadcrumbs or item label -->\n <div class=\"${blockClass}__sub-header\">\n <div class=\"${blockClass}__tags\">\n ${searchTerm\n ? html`\n <p class=\"${blockClass}__tags-label\">\n ${searchResultsTitle}\n </p>\n `\n : path && path.length > 0\n ? html`\n <cds-breadcrumb\n no-trailing-slash\n class=\"${classMap({\n [`${prefix}--add-select__next__breadcrumbs`]: true,\n [`${prefix}--add-select__next__breadcrumbs--multi`]:\n this._multi,\n })}\"\n >\n ${path.map((entry, idx) => {\n const isCurrentPage = idx === path.length - 1;\n return html`\n <cds-breadcrumb-item\n ?is-current-page=${isCurrentPage}\n >\n ${isCurrentPage\n ? entry.title\n : html`\n <cds-link\n href=\"#\"\n @click=${(e: Event) => {\n e.preventDefault();\n const init = {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: { index: idx },\n };\n this.dispatchEvent(\n new CustomEvent(\n (\n this\n .constructor as typeof CDSAddSelectBody\n ).eventBreadcrumbClick,\n init\n )\n );\n }}\n >\n ${entry.title}\n </cds-link>\n `}\n </cds-breadcrumb-item>\n `;\n })}\n </cds-breadcrumb>\n `\n : html`\n <p class=\"${blockClass}__tags-label\">${itemsLabel}</p>\n `}\n <cds-tag type=\"gray\" size=\"sm\">${itemCount}</cds-tag>\n </div>\n </div>\n </slot>\n </div>\n\n <!-- Body Content -->\n <div class=\"${blockClass}__content\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n /\n The name of the custom event fired when search term changes\n /\n static get eventSearch() {\n return `${prefix}-add-select-body-search`;\n }\n\n /\n The name of the custom event fired when breadcrumb is clicked\n */\n static get eventBreadcrumbClick() {\n return `${prefix}-add-select-body-breadcrumb-click`;\n }\n\n static styles = styles;\n}\n\nexport default CDSAddSelectBody;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAM,aAAa;;;;;;;;AASnB,IAAA,mBAAA,MACM,yBAAyB,WAAW;;;oBAc3B;2BAMO;iCAMM;4BAkBL;qBAMC;mBAMV;cAMiC,EAAE;;;;;;CAzD/C,IAAY,SAAkB;AAE5B,SADe,KAAK,QAAQ,iBACf,EAAE,SAAS;;;;;CA4D1B,cAAsB,OAAoB;AACxC,OAAK,cAAc,MAAM,OAAO,SAAS;EACzC,MAAM,OAAO;GACX,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ,EAAE,YAAY,KAAK,aAAa;GACzC;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAwC,aAC9C,KACD,CACF;;CAGH,SAAS;EACP,MAAM,EACJ,YACA,mBACA,yBACA,oBACA,WACA,MACA,aAAa,YACb,eAAe,iBACb;AAQJ,SAAO,IAAI;mBANS,SAAS;IAC1B,GAAG,WAAW,UAAU;IACxB,GAAG,WAAW,kBAAkB,CAAC,KAAK;IACtC,GAAG,WAAW,iBAAiB,KAAK;GACtC,CAGyB,CAAC;;sBAET,WAAW;;;0BAGP,WAAW;;6BAER,kBAAkB;8BACjB,wBAAwB;;oCAElB,aAAa;;;;;0BAKvB,WAAW;4BACT,WAAW;kBACrB,aACE,IAAI;kCACU,WAAW;0BACnB,mBAAmB;;wBAGzB,QAAQ,KAAK,SAAS,IACpB,IAAI;;;mCAGS,SAAS;IACf,uCAA6C;IAC7C,8CACC,KAAK;GACR,CAAC,CAAC;;4BAED,KAAK,KAAK,OAAO,QAAQ;GACzB,MAAM,gBAAgB,QAAQ,KAAK,SAAS;AAC5C,UAAO,IAAI;;mDAEY,cAAc;;kCAE/B,gBACE,MAAM,QACN,IAAI;;;kDAGU,MAAa;AACrB,MAAE,gBAAgB;IAClB,MAAM,OAAO;KACX,SAAS;KACT,YAAY;KACZ,UAAU;KACV,QAAQ,EAAE,OAAO,KAAK;KACvB;AACD,SAAK,cACH,IAAI,YAEA,KACG,YACH,sBACF,KACD,CACF;KACD;;0CAEA,MAAM,MAAM;;sCAEhB;;;IAGV,CAAC;;0BAGP,IAAI;oCACU,WAAW,gBAAgB,WAAW;wBAClD;iDACyB,UAAU;;;;;;;sBAOrC,WAAW;;;;;;;;;CAU/B,WAAW,cAAc;AACvB,SAAO;;;;;CAMT,WAAW,uBAAuB;AAChC,SAAO;;;gBAGOA;;;YA/Lf,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAe,CAAC,CAAA,EAAA,iBAAA,WAAA,cAAA,KAAA,EAAA;YAMpD,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAuB,CAAC,CAAA,EAAA,iBAAA,WAAA,qBAAA,KAAA,EAAA;YAM5D,SAAS;CAAE,MAAM;CAAQ,WAAW;CAA6B,CAAC,CAAA,EAAA,iBAAA,WAAA,2BAAA,KAAA,EAAA;YAkBlE,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAwB,CAAC,CAAA,EAAA,iBAAA,WAAA,sBAAA,KAAA,EAAA;YAM7D,OAAO,CAAA,EAAA,iBAAA,WAAA,eAAA,KAAA,EAAA;YAMP,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAc,CAAC,CAAA,EAAA,iBAAA,WAAA,aAAA,KAAA,EAAA;YAMnD,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,EAAA,iBAAA,WAAA,QAAA,KAAA,EAAA;+BA9D3BC,cAAc,sBAA4B,CAAA,EAAA,iBAAA;AAgN3C,IAAA,0BAAe"}
1	+ {"version":3,"file":"add-select-body.js","names":["styles","customElement"],"sources":["../../../src/components/add-select/add-select-body.ts"],"sourcesContent":["/*\n @license\n \n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport '@carbon/web-components/es/components/button/index.js';\nimport '@carbon/web-components/es/components/search/index.js';\nimport '@carbon/web-components/es/components/tag/index.js';\nimport '@carbon/web-components/es/components/breadcrumb/index.js';\nimport '@carbon/web-components/es/components/link/index.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './add-select-body.scss?lit';\n\nconst blockClass = `${prefix}--add-select__next`;\n\n/\n Add Select Body component - contains the main content area\n * @element c4p-add-select-body\n * @slot default - The main content area containing c4p-add-select-column or rows\n * @slot header - Replaces the entire header section\n * @slot actions - Custom actions (filter/sort) rendered next to the search input\n * @slot sub-header-actions - Custom content rendered after breadcrumbs and item count\n * @fires c4p-add-select-body-search - Fired when search term changes; detail: { searchTerm }\n * @fires c4p-add-select-body-breadcrumb-click - Fired when a breadcrumb link is clicked; detail: { index }\n /\n@customElement(`${prefix}-add-select-body`)\nclass CDSAddSelectBody extends LitElement {\n /\n Label for items section\n /\n @property({ type: String, attribute: 'items-label' })\n itemsLabel = '';\n\n /\n Global search label\n /\n @property({ type: String, attribute: 'global-search-label' })\n globalSearchLabel = '';\n\n /\n Global search placeholder\n /\n @property({ type: String, attribute: 'global-search-placeholder' })\n globalSearchPlaceholder = 'Search';\n\n /\n No results title\n /\n // @property({ type: String, attribute: 'no-results-title' })\n // noResultsTitle = 'No results found';\n\n /\n No results description\n /\n // @property({ type: String, attribute: 'no-results-description' })\n // noResultsDescription = 'Try adjusting your search or filter';\n\n /\n Search results title\n /\n @property({ type: String, attribute: 'search-results-title' })\n searchResultsTitle = 'Search results';\n\n /\n Current search term\n /\n @state()\n private _searchTerm = '';\n\n /\n Item count for display. When undefined, no count badge is rendered.\n /\n @property({ type: Number, attribute: 'item-count' })\n itemCount: number \| undefined = undefined;\n\n /\n Whether to hide the search input\n /\n @property({ type: Boolean, attribute: 'hide-search', reflect: true })\n hideSearch = false;\n\n /\n Navigation path for breadcrumbs\n /\n @property({ type: Array })\n path: Array<{ id: string; title: string }> = [];\n\n /\n Handle search input\n /\n private _handleSearch(event: CustomEvent) {\n this._searchTerm = event.detail.value \|\| '';\n const init = {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: { searchTerm: this._searchTerm },\n };\n this.dispatchEvent(\n new CustomEvent(\n (this.constructor as typeof CDSAddSelectBody).eventSearch,\n init\n )\n );\n }\n\n /* Tracks whether the header slot has been filled by the consumer /\n @state()\n private _hasHeaderSlot = false;\n\n private _handleHeaderSlotChange(e: Event) {\n const slot = e.target as HTMLSlotElement;\n this._hasHeaderSlot = slot.assignedElements({ flatten: true }).length > 0;\n }\n\n render() {\n const {\n itemsLabel,\n globalSearchLabel,\n globalSearchPlaceholder,\n searchResultsTitle,\n itemCount,\n hideSearch,\n path,\n _searchTerm: searchTerm,\n _handleSearch: handleSearch,\n } = this;\n\n // Only render the __header div when it has visible content.\n // When hideSearch is true, no header slot is filled, no item count,\n // and no path — the div is omitted entirely to avoid blank space.\n const hasHeader =\n !hideSearch \|\|\n this._hasHeaderSlot \|\|\n itemCount !== undefined \|\|\n (path && path.length > 0);\n\n return html`\n <div class=\"${blockClass}__body\">\n ${hasHeader\n ? html`\n <div class=\"${blockClass}__header\">\n <!-- Named slot: consumer can replace the entire header -->\n <slot\n name=\"header\"\n @slotchange=${this._handleHeaderSlotChange}\n ></slot>\n\n ${!this._hasHeaderSlot\n ? html`\n <!-- Search + optional actions -->\n ${!hideSearch\n ? html`\n <div\n class=\"${blockClass}__search ${blockClass}__search--with-actions\"\n >\n <div class=\"${blockClass}__search-input\">\n <cds-search\n label-text=${globalSearchLabel}\n placeholder=${globalSearchPlaceholder}\n size=\"lg\"\n @cds-search-input=${handleSearch}\n ></cds-search>\n </div>\n <div class=\"${blockClass}__global-actions\">\n <slot name=\"actions\"></slot>\n </div>\n </div>\n `\n : nothing}\n\n <!-- Sub-header: breadcrumbs / label + item count + optional actions -->\n <div class=\"${blockClass}__sub-header\">\n <div class=\"${blockClass}__tags\">\n ${searchTerm\n ? html`\n <p class=\"${blockClass}__tags-label\">\n ${searchResultsTitle}\n </p>\n `\n : path && path.length > 0\n ? html`\n <cds-breadcrumb\n no-trailing-slash\n class=\"${blockClass}__breadcrumbs\"\n >\n ${path.map((entry, idx) => {\n const isCurrentPage =\n idx === path.length - 1;\n return html`\n <cds-breadcrumb-item\n ?is-current-page=${isCurrentPage}\n >\n ${isCurrentPage\n ? entry.title\n : html`\n <cds-link\n href=\"#\"\n @click=${(e: Event) => {\n e.preventDefault();\n this.dispatchEvent(\n new CustomEvent(\n (\n this\n .constructor as typeof CDSAddSelectBody\n ).eventBreadcrumbClick,\n {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {\n index: idx,\n },\n }\n )\n );\n }}\n >\n ${entry.title}\n </cds-link>\n `}\n </cds-breadcrumb-item>\n `;\n })}\n </cds-breadcrumb>\n `\n : html`\n <p class=\"${blockClass}__tags-label\">\n ${itemsLabel}\n </p>\n `}\n ${itemCount !== undefined\n ? html`<cds-tag type=\"gray\" size=\"sm\"\n >${itemCount}</cds-tag\n >`\n : nothing}\n </div>\n <slot name=\"sub-header-actions\"></slot>\n </div>\n `\n : nothing}\n </div>\n `\n : nothing}\n\n <!-- Body Content -->\n <div class=\"${blockClass}__content\" role=\"grid\" tabindex=\"0\">\n <div class=\"${blockClass}-list-body\" role=\"rowgroup\">\n <slot></slot>\n </div>\n </div>\n </div>\n `;\n }\n\n /\n The name of the custom event fired when search term changes\n /\n static get eventSearch() {\n return `${prefix}-add-select-body-search`;\n }\n\n /\n The name of the custom event fired when breadcrumb is clicked\n */\n static get eventBreadcrumbClick() {\n return `${prefix}-add-select-body-breadcrumb-click`;\n }\n\n static styles = styles;\n}\n\nexport default CDSAddSelectBody;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,aAAa;;;;;;;;;;;AAYnB,IAAA,mBAAA,MACM,yBAAyB,WAAW;;;oBAK3B;2BAMO;iCAMM;4BAkBL;qBAMC;mBAMU,KAAA;oBAMnB;cAMgC,EAAE;wBAuBtB;;;;;CAlBzB,cAAsB,OAAoB;AACxC,OAAK,cAAc,MAAM,OAAO,SAAS;EACzC,MAAM,OAAO;GACX,SAAS;GACT,YAAY;GACZ,UAAU;GACV,QAAQ,EAAE,YAAY,KAAK,aAAa;GACzC;AACD,OAAK,cACH,IAAI,YACD,KAAK,YAAwC,aAC9C,KACD,CACF;;CAOH,wBAAgC,GAAU;EACxC,MAAM,OAAO,EAAE;AACf,OAAK,iBAAiB,KAAK,iBAAiB,EAAE,SAAS,MAAM,CAAC,CAAC,SAAS;;CAG1E,SAAS;EACP,MAAM,EACJ,YACA,mBACA,yBACA,oBACA,WACA,YACA,MACA,aAAa,YACb,eAAe,iBACb;AAWJ,SAAO,IAAI;oBACK,WAAW;UANzB,CAAC,cACD,KAAK,kBACL,cAAc,KAAA,KACb,QAAQ,KAAK,SAAS,IAKjB,IAAI;4BACY,WAAW;;;;gCAIP,KAAK,wBAAwB;;;kBAG3C,CAAC,KAAK,iBACJ,IAAI;;wBAEA,CAAC,aACC,IAAI;;uCAES,WAAW,WAAW,WAAW;;4CAE5B,WAAW;;+CAER,kBAAkB;gDACjB,wBAAwB;;sDAElB,aAAa;;;4CAGvB,WAAW;;;;8BAK7B,QAAQ;;;oCAGE,WAAW;sCACT,WAAW;4BACrB,aACE,IAAI;4CACU,WAAW;oCACnB,mBAAmB;;kCAGzB,QAAQ,KAAK,SAAS,IACpB,IAAI;;;6CAGS,WAAW;;sCAElB,KAAK,KAAK,OAAO,QAAQ;GACzB,MAAM,gBACJ,QAAQ,KAAK,SAAS;AACxB,UAAO,IAAI;;6DAEY,cAAc;;4CAE/B,gBACE,MAAM,QACN,IAAI;;;4DAGU,MAAa;AACrB,MAAE,gBAAgB;AAClB,SAAK,cACH,IAAI,YAEA,KACG,YACH,sBACF;KACE,SAAS;KACT,YAAY;KACZ,UAAU;KACV,QAAQ,EACN,OAAO,KACR;KACF,CACF,CACF;KACD;;oDAEA,MAAM,MAAM;;gDAEhB;;;IAGV,CAAC;;oCAGP,IAAI;8CACU,WAAW;sCACnB,WAAW;;kCAEf;4BACN,cAAc,KAAA,IACZ,IAAI;mCACC,UAAU;mCAEf,QAAQ;;;;wBAKlB,QAAQ;;gBAGhB,QAAQ;;;sBAGE,WAAW;wBACT,WAAW;;;;;;;;;;CAWjC,WAAW,cAAc;AACvB,SAAO;;;;;CAMT,WAAW,uBAAuB;AAChC,SAAO;;;gBAGOA;;;YA/Of,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAe,CAAC,CAAA,EAAA,iBAAA,WAAA,cAAA,KAAA,EAAA;YAMpD,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAuB,CAAC,CAAA,EAAA,iBAAA,WAAA,qBAAA,KAAA,EAAA;YAM5D,SAAS;CAAE,MAAM;CAAQ,WAAW;CAA6B,CAAC,CAAA,EAAA,iBAAA,WAAA,2BAAA,KAAA,EAAA;YAkBlE,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAwB,CAAC,CAAA,EAAA,iBAAA,WAAA,sBAAA,KAAA,EAAA;YAM7D,OAAO,CAAA,EAAA,iBAAA,WAAA,eAAA,KAAA,EAAA;YAMP,SAAS;CAAE,MAAM;CAAQ,WAAW;CAAc,CAAC,CAAA,EAAA,iBAAA,WAAA,aAAA,KAAA,EAAA;YAMnD,SAAS;CAAE,MAAM;CAAS,WAAW;CAAe,SAAS;CAAM,CAAC,CAAA,EAAA,iBAAA,WAAA,cAAA,KAAA,EAAA;YAMpE,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,EAAA,iBAAA,WAAA,QAAA,KAAA,EAAA;YAuBzB,OAAO,CAAA,EAAA,iBAAA,WAAA,kBAAA,KAAA,EAAA;+BAlFTC,cAAc,sBAA4B,CAAA,EAAA,iBAAA;AAuP3C,IAAA,0BAAe"}

package/es/components/add-select/add-select-body.scss.js CHANGED Viewed

@@ -7,7 +7,7 @@
 import { css } from "lit";
 //#region src/components/add-select/add-select-body.scss?lit
-var add_select_body_default = css([".c4p--add-select__next{position:relative}.c4p--add-select__next,.c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}.c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block-end:.5rem;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next__search{margin-block-end:1rem}.c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next__search-input{flex:1}.c4p--add-select__next__global-actions{align-items:flex-end;display:flex}.c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}.c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}.c4p--add-select__next__content{display:flex;flex:1;flex-direction:column;overflow:auto}.c4p--add-select__next-list{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-list{overflow-block:auto}}.c4p--add-select__next-list:focus{outline:none}.c4p--add-select__next-list-body{display:flex;flex-direction:column}.c4p--add-select__next-list-body--horizontal{align-items:stretch;block-size:100%;flex-direction:row}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-row{border-inline-start:.125rem solid transparent;display:flex;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row:focus:not(:focus-visible){outline:none}.c4p--add-select__next-row--selected{background-color:var(--cds-layer-selected-01,#e0e0e0)}.c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper{border-block-end-color:var(--cds-border-subtle-selected-01,#c6c6c6)}.c4p--add-select__next-row--disabled{cursor:not-allowed}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__title{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-link-primary,#0f62fe)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-selected-hover-01,#d1d1d1)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row__cell{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__cell-wrapper{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;justify-content:space-between;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem}.c4p--add-select__next-row__content{align-items:center;align-self:center;display:flex;flex:1}.c4p--add-select__next-row__checkbox{align-self:center;flex:none;margin-inline-end:1rem}.c4p--add-select__next-row__radio{align-self:center}.c4p--add-select__next-row__radio .cds--radio-button__appearance{margin-inline-end:0}.c4p--add-select__next-row__icon{align-items:center;display:flex;margin-inline-end:.5rem}.c4p--add-select__next-row__text{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616);display:block;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next-row__subtitle{color:var(--cds-text-secondary,#525252);display:block;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.c4p--add-select__next-row__meta{align-items:center;display:flex;margin-inline-start:.5rem}.c4p--add-select__next-row__view-item-panel{margin-inline-start:auto}.c4p--add-select__next-row-item-panel--selected{background-color:var(--cds-layer-hover-01,#e8e8e8);border-inline-start:.125rem solid var(--cds-interactive,#0f62fe)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:none}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}}.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row--skeleton{cursor:default;pointer-events:none}.c4p--add-select__next-row--skeleton:hover{background:none}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control{background-color:var(--cds-skeleton-element,#c6c6c6);block-size:1rem;border-radius:.125rem;flex:none;inline-size:1rem;margin-inline-end:1rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton{block-size:2rem;border-radius:50%;inline-size:2rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton:before{animation:none;border-radius:50%}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title{margin-block-end:0}.c4p--add-select__next-column{block-size:100%;border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;flex-direction:column;min-inline-size:300px;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column:last-child{border-inline-end:none}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child{border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6)}.c4p--add-select__next-column__actions,.c4p--add-select__next-column__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next-column__search-bar{padding-block-end:0;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next-column__search-wrapper{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__search-input{flex:1}.c4p--add-select__next-column__controls{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__filter-button,.c4p--add-select__next-column__sort-button{flex:none}.c4p--add-select__next-column__filter-popover{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper{margin-block-end:.5rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper:last-child{margin-block-end:0}.c4p--add-select__next-column__header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__select-all .cds--checkbox-label{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__select-all .cds--checkbox-label-text{align-items:center;display:flex;gap:.5rem;margin-inline-start:.5rem}.c4p--add-select__next-column__title-wrapper{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next-column__title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next-column__rows{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-column__rows{overflow-block:auto}}.c4p--add-select__next__breadcrumbs{flex-wrap:wrap}.c4p--add-select__next__breadcrumb-item,.c4p--add-select__next__breadcrumbs{align-items:center;display:flex;gap:.25rem}.c4p--add-select__next__breadcrumb-button{background:none;border:none;color:var(--cds-link-primary,#0f62fe);cursor:pointer;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);padding-block:0;padding-inline:0;text-decoration:none}.c4p--add-select__next__breadcrumb-button:hover{color:var(--cds-link-primary-hover,#0043ce);text-decoration:underline}.c4p--add-select__next__breadcrumb-button:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:.125rem}.c4p--add-select__next__breadcrumb-separator{align-items:center;color:var(--cds-text-secondary,#525252);display:flex}.c4p--add-select__next__breadcrumb-separator svg{fill:currentColor}.c4p--add-select__next__breadcrumb-current{color:var(--cds-text-primary,#161616);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary{display:flex;flex-direction:column}.c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;padding-block-end:.5rem;padding-block-start:1.5rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin-inline-end:.5rem}.c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:auto}.c4p--add-select__next__selection-summary-item-default{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item-default-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-default-subtitle{color:var(--cds-text-secondary,#525252);font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857)}.c4p--add-select__next__selection-summary-item{background-color:var(--cds-layer-01,#f4f4f4);border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);position:relative}.c4p--add-select__next__selection-summary-item:hover{background-color:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item,.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child{border-block-end:none;border-block-start:none}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading{min-block-size:unset;padding-block:.75rem;padding-inline-end:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between;padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content{padding-block-end:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__selection-summary-item-selected-item{flex:1}.c4p--add-select__next__selection-summary-item-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-subtitle{color:var(--cds-text-secondary,#525252);font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857)}.c4p--add-select__next__selection-summary-item-entry{margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-header{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-end:.5rem}.c4p--add-select__next__selection-summary-item-body{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-remove-button-container{align-items:center;display:inline-flex;justify-content:center;padding-inline-start:.5rem}.c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container{inset-block-start:50%;inset-inline-end:1rem;padding-inline-start:0;position:absolute;transform:translateY(-50%)}.c4p--add-select__next__selection-summary-item-remove-button{opacity:0;transition:opacity 70ms cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next__selection-summary-item-remove-button{transition:none}}.c4p--add-select__next__selection-summary-item:focus-within .c4p--add-select__next__selection-summary-item-remove-button,.c4p--add-select__next__selection-summary-item:hover .c4p--add-select__next__selection-summary-item-remove-button{opacity:1}.c4p--add-select__next__selection-summary-item-content{margin-block-start:0}.c4p--add-select__next__selection-summary .cds--accordion__arrow{transform:rotate(90deg)}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow{transform:rotate(-90deg)}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow{margin-block:0;margin-inline-end:0;margin-inline-start:1rem}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title{margin-inline-end:0;margin-inline-start:.5rem;padding-inline-end:2rem}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content{margin-block-start:0;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;gap:.5rem;justify-content:space-between;padding-block-end:.5rem;padding-block-start:2rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375)}.c4p--add-select__next__item-summary-panel-body{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-entry{margin-block-end:1rem}.c4p--add-select__next__item-summary-panel-entry-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__item-summary-panel-entry-body{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}:host(c4p-add-select-body){display:block}:host(c4p-add-select-body) .c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}:host(c4p-add-select-body) .c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding:1rem}:host(c4p-add-select-body) .c4p--add-select__next__search{margin-block-end:1rem}:host(c4p-add-select-body) .c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}:host(c4p-add-select-body) .c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}:host(c4p-add-select-body) .c4p--add-select__next__tags-label{color:var(--cds-text-secondary,#525252);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);margin:0}:host(c4p-add-select-body) .c4p--add-select__next__content{flex:1;overflow:auto}"]);
+var add_select_body_default = css([".c4p--add-select__next{position:relative}.c4p--add-select__next,.c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}.c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding-block-end:.5rem;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next__search{margin-block-end:1rem}.c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next__search-input{flex:1}.c4p--add-select__next__global-actions{align-items:flex-end;display:flex}.c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}.c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}.c4p--add-select__next__content{display:flex;flex:1;flex-direction:column;overflow:auto}.c4p--add-select__next-list{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-list{overflow-block:auto}}.c4p--add-select__next-list:focus{outline:none}.c4p--add-select__next-list-body{display:flex;flex-direction:column}.c4p--add-select__next-list-body--horizontal{align-items:stretch;block-size:100%;flex-direction:row}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-row{border-inline-start:.125rem solid transparent;display:flex;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row:focus:not(:focus-visible){outline:none}.c4p--add-select__next-row--selected{background-color:var(--cds-layer-selected-01,#e0e0e0)}.c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper{border-block-end-color:var(--cds-border-subtle-selected-01,#c6c6c6)}.c4p--add-select__next-row--disabled{cursor:not-allowed}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__title{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-link-primary,#0f62fe)}.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled){background:var(--cds-layer-selected-hover-01,#d1d1d1)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616)}.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg,.c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row__cell{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__cell-wrapper{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;justify-content:space-between;min-block-size:3rem;padding-block:.5rem;padding-inline:1rem}.c4p--add-select__next-row__content{align-items:center;align-self:center;display:flex;flex:1}.c4p--add-select__next-row__checkbox{align-self:center;flex:none;margin-inline-end:1rem}.c4p--add-select__next-row__radio{align-self:center}.c4p--add-select__next-row__radio .cds--radio-button__appearance{margin-inline-end:0}.c4p--add-select__next-row__icon{align-items:center;display:flex;margin-inline-end:.5rem}.c4p--add-select__next-row__text{display:flex;flex:1;flex-direction:column}.c4p--add-select__next-row__title{color:var(--cds-text-primary,#161616);display:block;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next-row__subtitle{color:var(--cds-text-secondary,#525252);display:block;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.c4p--add-select__next-row__meta{align-items:center;display:flex;margin-inline-start:.5rem}.c4p--add-select__next-row__view-item-panel{margin-inline-start:auto}.c4p--add-select__next-row-item-panel--selected{background-color:var(--cds-layer-hover-01,#e8e8e8);border-inline-start:.125rem solid var(--cds-interactive,#0f62fe)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:none}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}}.c4p--add-select__next-row__nav-indicator{align-items:center;cursor:pointer;display:flex;justify-content:center;margin-inline-start:.5rem;padding-block:.25rem;padding-inline:.25rem;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.c4p--add-select__next-row__nav-indicator:hover{background-color:var(--cds-background-hover,hsla(0,0%,55%,.12))}.c4p--add-select__next-row__nav-indicator:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:-.125rem}.c4p--add-select__next-row__nav-indicator svg{fill:var(--cds-icon-primary,#161616)}.c4p--add-select__next-row--skeleton{cursor:default;pointer-events:none}.c4p--add-select__next-row--skeleton:hover{background:none}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control{background-color:var(--cds-skeleton-element,#c6c6c6);block-size:1rem;border-radius:.125rem;flex:none;inline-size:1rem;margin-inline-end:1rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton{block-size:2rem;border-radius:50%;inline-size:2rem}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton:before{animation:none;border-radius:50%}.c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title{margin-block-end:0}.c4p--add-select__next-column{block-size:100%;border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;flex-direction:column;min-inline-size:300px;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column:last-child{border-inline-end:none}.c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child{border-inline-end:1px solid var(--cds-border-subtle-01,#c6c6c6)}.c4p--add-select__next-column__actions,.c4p--add-select__next-column__search--with-actions{align-items:flex-end;display:flex}.c4p--add-select__next-column__search-bar{padding-block-end:0;padding-block-start:1rem;padding-inline:1rem}.c4p--add-select__next-column__search-wrapper{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__search-input{flex:1}.c4p--add-select__next-column__controls{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__filter-button,.c4p--add-select__next-column__sort-button{flex:none}.c4p--add-select__next-column__filter-popover{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper{margin-block-end:.5rem}.c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper:last-child{margin-block-end:0}.c4p--add-select__next-column__header{align-items:center;border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);display:flex;padding-block:1rem;padding-inline:1rem}.c4p--add-select__next-column__select-all .cds--checkbox-label{align-items:center;display:flex;gap:0}.c4p--add-select__next-column__select-all .cds--checkbox-label-text{align-items:center;display:flex;gap:.5rem;margin-inline-start:.5rem}.c4p--add-select__next-column__title-wrapper{align-items:center;display:flex;gap:.5rem}.c4p--add-select__next-column__title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next-column__rows{display:flex;flex:1;flex-direction:column;overflow-y:auto}@supports (overflow-block:auto){.c4p--add-select__next-column__rows{overflow-block:auto}}.c4p--add-select__next__breadcrumbs{flex-wrap:wrap}.c4p--add-select__next__breadcrumb-item,.c4p--add-select__next__breadcrumbs{align-items:center;display:flex;gap:.25rem}.c4p--add-select__next__breadcrumb-button{background:none;border:none;color:var(--cds-link-primary,#0f62fe);cursor:pointer;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);padding-block:0;padding-inline:0;text-decoration:none}.c4p--add-select__next__breadcrumb-button:hover{color:var(--cds-link-primary-hover,#0043ce);text-decoration:underline}.c4p--add-select__next__breadcrumb-button:focus{outline:.125rem solid var(--cds-focus,#0f62fe);outline-offset:.125rem}.c4p--add-select__next__breadcrumb-separator{align-items:center;color:var(--cds-text-secondary,#525252);display:flex}.c4p--add-select__next__breadcrumb-separator svg{fill:currentColor}.c4p--add-select__next__breadcrumb-current{color:var(--cds-text-primary,#161616);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary{display:flex;flex-direction:column}.c4p--add-select__next__selection-summary-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;padding-block-end:.5rem;padding-block-start:1.5rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin-inline-end:.5rem}.c4p--add-select__next__selection-summary-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:auto}.c4p--add-select__next__selection-summary-item{background-color:var(--cds-layer-01,#f4f4f4);border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);position:relative}.c4p--add-select__next__selection-summary-item:hover{background-color:var(--cds-layer-hover-01,#e8e8e8)}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item,.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child{border-block-end:none;border-block-start:none}.c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading{min-block-size:unset;padding-block:.75rem;padding-inline-end:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between;padding-block:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content{padding-block-end:.75rem;padding-inline:1rem}.c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-title-wrapper{align-items:center;display:flex;justify-content:space-between}.c4p--add-select__next__selection-summary-item-selected-item{flex:1}.c4p--add-select__next__selection-summary-item-title{color:var(--cds-text-primary,#161616);font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.c4p--add-select__next__selection-summary-item-subtitle{color:var(--cds-text-secondary,#525252);font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857)}.c4p--add-select__next__selection-summary-item-entry{margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-header{color:var(--cds-text-secondary,#525252);font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333);margin-block-end:.5rem}.c4p--add-select__next__selection-summary-item-body{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857);margin-block-end:1rem}.c4p--add-select__next__selection-summary-item-remove-button-container{align-items:center;display:inline-flex;justify-content:center;padding-inline-start:.5rem}.c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container{inset-block-start:50%;inset-inline-end:1rem;padding-inline-start:0;position:absolute;transform:translateY(-50%)}.c4p--add-select__next__selection-summary-item-remove-button{opacity:0;transition:opacity 70ms cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.c4p--add-select__next__selection-summary-item-remove-button{transition:none}}.c4p--add-select__next__selection-summary-item:focus-within .c4p--add-select__next__selection-summary-item-remove-button,.c4p--add-select__next__selection-summary-item:hover .c4p--add-select__next__selection-summary-item-remove-button{opacity:1}.c4p--add-select__next__selection-summary-item-content{margin-block-start:0}.c4p--add-select__next__selection-summary .cds--accordion__arrow{transform:rotate(90deg)}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow{transform:rotate(-90deg)}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow{margin-block:0;margin-inline-end:0;margin-inline-start:1rem}.c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title{margin-inline-end:0;margin-inline-start:.5rem;padding-inline-end:2rem}.c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content{margin-block-start:0;padding-block:1rem;padding-inline:1rem}@keyframes add-select-item-panel-entrance{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes add-select-item-panel-exit{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes add-select-item-panel-entrance-reduced{0%{opacity:0}to{opacity:1}}@keyframes add-select-item-panel-exit-reduced{0%{opacity:1}to{opacity:0}}.c4p--add-select__next__item-summary-panel{block-size:100%;display:none;inline-size:100%;transform:translateX(0);transition-behavior:allow-discrete;transition-duration:.15s;transition-property:display,opacity,transform}.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance .15s cubic-bezier(0,0,.38,.9) forwards;display:flex;flex-direction:column}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(100%)}}@media (prefers-reduced-motion){.c4p--add-select__next__item-summary-panel--open{animation:add-select-item-panel-entrance-reduced .15s cubic-bezier(0,0,.38,.9) forwards}@starting-style{.c4p--add-select__next__item-summary-panel--open{opacity:0;transform:translateX(0)}}}.c4p--add-select__next__item-summary-panel-header{align-items:center;border-block-end:1px solid var(--cds-layer-accent-01,#e0e0e0);display:flex;gap:.5rem;justify-content:space-between;padding-block-end:.5rem;padding-block-start:2rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-title{font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375)}.c4p--add-select__next__item-summary-panel-body{padding-block:1rem;padding-inline:1rem}.c4p--add-select__next__item-summary-panel-entry{margin-block-end:1rem}.c4p--add-select__next__item-summary-panel-entry-title{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}.c4p--add-select__next__item-summary-panel-entry-body{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}:host(c4p-add-select-body){display:block}:host(c4p-add-select-body) .c4p--add-select__next__body{block-size:100%;display:flex;flex-direction:column;inline-size:100%}:host(c4p-add-select-body) .c4p--add-select__next__header{border-block-end:1px solid var(--cds-border-subtle-01,#c6c6c6);padding:1rem}:host(c4p-add-select-body) .c4p--add-select__next__header--custom .c4p--add-select__next__search,:host(c4p-add-select-body) .c4p--add-select__next__header--custom .c4p--add-select__next__sub-header{display:none}:host(c4p-add-select-body) .c4p--add-select__next__search--with-actions{align-items:flex-end;display:flex;margin-block-end:1rem}:host(c4p-add-select-body) .c4p--add-select__next__search-input{flex:1}:host(c4p-add-select-body) .c4p--add-select__next__global-actions{align-items:flex-end;display:flex}:host(c4p-add-select-body) .c4p--add-select__next__sub-header{align-items:center;display:flex;justify-content:space-between}:host(c4p-add-select-body) .c4p--add-select__next__tags{align-items:center;display:flex;gap:.5rem}:host(c4p-add-select-body) .c4p--add-select__next__tags-label{color:var(--cds-text-primary,#161616);font-size:var(--cds-heading-compact-02-font-size,1rem);font-weight:var(--cds-heading-compact-02-font-weight,600);letter-spacing:var(--cds-heading-compact-02-letter-spacing,0);line-height:var(--cds-heading-compact-02-line-height,1.375);margin:0}:host(c4p-add-select-body) .c4p--add-select__next__sub-header-actions{align-items:center;display:flex;gap:.5rem;margin-inline-start:1rem}:host(c4p-add-select-body) .c4p--add-select__next__content{flex:1;overflow:auto}:host(c4p-add-select-body) .c4p--add-select__next-list-body{display:flex;flex-direction:column}"]);
 //#endregion
 export { add_select_body_default as default };

package/es/components/add-select/add-select-body.scss.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"add-select-body.scss.js","names":[],"sources":["../../../src/components/add-select/add-select-body.scss?lit"],"sourcesContent":["/*\n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n$css--plex: true !default;\n\n/ Carbon and IBM Products styles /\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/type';\n\n$prefix: 'c4p';\n\n/ Import shared AddSelect composable/next styles from ibm-products-styles /\n@use '@carbon/ibm-products-styles/scss/components/AddSelect/add-select_next'\n as ;\n\n/* Web Component specific overrides /\n:host(#{$prefix}-add-select-body) {\n display: block;\n\n ~~/ Apply shared styles within shadow DOM */\n~~ .#{$block-class__next}__body {\n display: flex;\n flex-direction: column;\n block-size: 100%;\n inline-size: 100%;\n }\n\n .#{$block-class__next}__header {\n padding: $spacing-05;\n border-block-end: 1px solid $border-subtle-01;\n }\n\n .#{$block-class__next}__search {\n margin-block-end: $spacing-05;\n }\n\n .#{$block-class__next}__sub-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .#{$block-class__next}__tags {\n display: flex;\n align-items: center;\n gap: $spacing-03;\n }\n\n .#{$block-class__next}__tags-label {\n @include type.type-style('~~body~~-compact-01');\n\n margin: 0;\n color: $text-~~secondary~~;\n }\n\n .#{$block-class__next}__content {\n overflow: auto;\n flex: 1;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"add-select-body.scss.js","names":[],"sources":["../../../src/components/add-select/add-select-body.scss?lit"],"sourcesContent":["/*\n Copyright IBM Corp. 2026\n \n This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n$css--plex: true !default;\n\n/ Carbon and IBM Products styles /\n@use '@carbon/styles/scss/theme' as ;\n@use '@carbon/styles/scss/spacing' as ;\n@use '@carbon/styles/scss/type';\n\n$prefix: 'c4p';\n\n/ Import shared AddSelect composable/next styles from ibm-products-styles /\n@use '@carbon/ibm-products-styles/scss/components/AddSelect/add-select_next'\n as ;\n\n/* Web Component specific overrides */\n:host(#{$prefix}-add-select-body) {\n display: block;\n\n .#{$block-class__next}__body {\n display: flex;\n flex-direction: column;\n block-size: 100%;\n inline-size: 100%;\n }\n\n .#{$block-class__next}__header {\n padding: $spacing-05;\n border-block-end: 1px solid $border-subtle-01;\n }\n\n // When consumer provides a custom header via slot=\"header\",\n // hide the default search/sub-header content.\n .#{$block-class__next}__header--custom {\n .#{$block-class__next}__search,\n .#{$block-class__next}__sub-header {\n display: none;\n }\n }\n\n // Search row: input + actions side by side (matches __search--with-actions)\n .#{$block-class__next}__search--with-actions {\n display: flex;\n align-items: flex-end;\n margin-block-end: $spacing-05;\n }\n\n .#{$block-class__next}__search-input {\n flex: 1;\n }\n\n .#{$block-class__next}__global-actions {\n display: flex;\n align-items: flex-end;\n }\n\n .#{$block-class__next}__sub-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .#{$block-class__next}__tags {\n display: flex;\n align-items: center;\n gap: $spacing-03;\n }\n\n .#{$block-class__next}__tags-label {\n @include type.type-style('heading-compact-02');\n\n margin: 0;\n color: $text-primary;\n }\n\n .#{$block-class__next}__sub-header-actions {\n display: flex;\n align-items: center;\n gap: $spacing-03;\n margin-inline-start: $spacing-05;\n }\n\n .#{$block-class__next}__content {\n overflow: auto;\n flex: 1;\n }\n\n .#{$block-class__next}-list-body {\n display: flex;\n flex-direction: column;\n }\n}\n"],"mappings":""}

package/es/components/add-select/add-select-column.d.ts ADDED Viewed

@@ -0,0 +1,83 @@
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { LitElement } from 'lit';
+import '@carbon/web-components/es/components/search/index.js';
+import '@carbon/web-components/es/components/tag/index.js';
+import '@carbon/web-components/es/components/checkbox/index.js';
+/**
+ * Add Select Column component — optional column wrapper providing column-level
+ * search, title, and "Select All" functionality. Propagates `multi` context to
+ * child rows via the `multi` property/attribute.
+ * @element c4p-add-select-column
+ * @slot default - AddSelectRow elements
+ * @slot actions - Custom actions (filter/sort) placed next to column search
+ * @fires c4p-add-select-column-search - Fired when column search changes; detail: { searchTerm }
+ * @fires c4p-add-select-column-select-all - Fired when "Select All" checkbox changes; detail: { checked }
+ */
+declare class CDSAddSelectColumn extends LitElement {
+    /**
+     * Column title shown in the header
+     */
+    title: string;
+    /**
+     * Label text for the column search input (accessibility)
+     */
+    searchLabel: string;
+    /**
+     * Placeholder text for the column search input
+     */
+    searchPlaceholder: string;
+    /**
+     * Whether to hide the column search input
+     */
+    hideSearch: boolean;
+    /**
+     * Whether this column uses multi-selection (checkboxes) or single-selection (radio buttons)
+     */
+    multi: boolean;
+    /**
+     * Whether to show the "Select All" checkbox (only when multi is true)
+     */
+    showSelectAll: boolean;
+    /**
+     * Total number of items in the column (shown in tag badge)
+     */
+    itemCount: number;
+    /**
+     * Whether all items are currently selected
+     */
+    allSelected: boolean;
+    /**
+     * Whether the "Select All" checkbox is in an indeterminate state
+     */
+    allIndeterminate: boolean;
+    /** Internal column search term */
+    private _searchTerm;
+    /** Whether the actions slot has any assigned content */
+    private _hasActionsSlot;
+    private _handleActionsSlotChange;
+    private _handleSearch;
+    private _handleSelectAll;
+    private _handleSlotChange;
+    updated(changed: Map<string, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+    /**
+     * The name of the custom event fired when column search changes.
+     * detail: { searchTerm: string }
+     */
+    static get eventSearch(): string;
+    /**
+     * The name of the custom event fired when "Select All" is toggled.
+     * detail: { checked: boolean }
+     */
+    static get eventSelectAll(): string;
+    static styles: any;
+}
+export default CDSAddSelectColumn;
+//# sourceMappingURL=add-select-column.d.ts.map

package/es/components/add-select/add-select-column.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"add-select-column.d.ts","sourceRoot":"","sources":["../../../src/components/add-select/add-select-column.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAIhD,OAAO,sDAAsD,CAAC;AAC9D,OAAO,mDAAmD,CAAC;AAC3D,OAAO,wDAAwD,CAAC;AAMhE;;;;;;;;;GASG;AACH,cACM,kBAAmB,SAAQ,UAAU;IACzC;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,WAAW,SAAY;IAEvB;;OAEG;IAEH,iBAAiB,SAAY;IAE7B;;OAEG;IAEH,UAAU,UAAS;IAEnB;;OAEG;IAEH,KAAK,UAAS;IAEd;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,SAAS,SAAK;IAEd;;OAEG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,gBAAgB,UAAS;IAEzB,kCAAkC;IAElC,OAAO,CAAC,WAAW,CAAM;IAEzB,wDAAwD;IAExD,OAAO,CAAC,eAAe,CAAS;IAEhC,OAAO,CAAC,wBAAwB;IAKhC,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,gBAAgB;IAexB,OAAO,CAAC,iBAAiB;IAmBzB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMrC,MAAM;IAkGN;;;OAGG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;;OAGG;IACH,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,kBAAkB,CAAC"}