@carbon/ibm-products-web-components 0.45.0 → 0.46.0-rc.0

package/custom-elements.json

@@ -222,9 +222,15 @@
         },
         {
           "name": "item-count",
-          "description": "Item count for display",
-          "type": "number",
-          "default": "0"
+          "description": "Item count for display. When undefined, no count badge is rendered.",
+          "type": "number | undefined",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "hide-search",
+          "description": "Whether to hide the search input",
+          "type": "boolean",
+          "default": "false"
         },
         {
           "name": "path",
@@ -265,9 +271,16 @@
         {
           "name": "itemCount",
           "attribute": "item-count",
-          "description": "Item count for display",
-          "type": "number",
-          "default": "0"
+          "description": "Item count for display. When undefined, no count badge is rendered.",
+          "type": "number | undefined",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "hideSearch",
+          "attribute": "hide-search",
+          "description": "Whether to hide the search input",
+          "type": "boolean",
+          "default": "false"
         },
         {
           "name": "path",
@@ -284,25 +297,156 @@
       "events": [
         {
           "name": "c4p-add-select-body-search",
-          "description": "Fired when search term changes"
+          "description": "Fired when search term changes; detail: { searchTerm }"
+        },
+        {
+          "name": "c4p-add-select-body-breadcrumb-click",
+          "description": "Fired when a breadcrumb link is clicked; detail: { index }"
         }
       ],
       "slots": [
         {
           "name": "default",
-          "description": "The main content area containing c4p-add-select-content"
+          "description": "The main content area containing c4p-add-select-column or rows"
         },
         {
           "name": "header",
-          "description": "Custom header content"
+          "description": "Replaces the entire header section"
+        },
+        {
+          "name": "actions",
+          "description": "Custom actions (filter/sort) rendered next to the search input"
+        },
+        {
+          "name": "sub-header-actions",
+          "description": "Custom content rendered after breadcrumbs and item count"
         }
       ]
     },
     {
-      "name": "c4p-add-select-content",
-      "path": "./src/components/add-select/add-select-content.ts",
-      "description": "Add Select Content component - contains the list of selectable items",
+      "name": "c4p-add-select-column",
+      "path": "./src/components/add-select/add-select-column.ts",
+      "description": "Add Select Column component — optional column wrapper providing column-level\nsearch, title, and \"Select All\" functionality. Propagates `multi` context to\nchild rows via the `multi` property/attribute.",
+      "attributes": [
+        {
+          "name": "title",
+          "description": "Column title shown in the header",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "search-label",
+          "description": "Label text for the column search input (accessibility)",
+          "type": "string",
+          "default": "\"Search\""
+        },
+        {
+          "name": "search-placeholder",
+          "description": "Placeholder text for the column search input",
+          "type": "string",
+          "default": "\"Search\""
+        },
+        {
+          "name": "hide-search",
+          "description": "Whether to hide the column search input",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "multi",
+          "description": "Whether this column uses multi-selection (checkboxes) or single-selection (radio buttons)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "show-select-all",
+          "description": "Whether to show the \"Select All\" checkbox (only when multi is true)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "item-count",
+          "description": "Total number of items in the column (shown in tag badge)",
+          "type": "number",
+          "default": "0"
+        },
+        {
+          "name": "all-selected",
+          "description": "Whether all items are currently selected",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "all-indeterminate",
+          "description": "Whether the \"Select All\" checkbox is in an indeterminate state",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
       "properties": [
+        {
+          "name": "title",
+          "attribute": "title",
+          "description": "Column title shown in the header",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "searchLabel",
+          "attribute": "search-label",
+          "description": "Label text for the column search input (accessibility)",
+          "type": "string",
+          "default": "\"Search\""
+        },
+        {
+          "name": "searchPlaceholder",
+          "attribute": "search-placeholder",
+          "description": "Placeholder text for the column search input",
+          "type": "string",
+          "default": "\"Search\""
+        },
+        {
+          "name": "hideSearch",
+          "attribute": "hide-search",
+          "description": "Whether to hide the column search input",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "multi",
+          "attribute": "multi",
+          "description": "Whether this column uses multi-selection (checkboxes) or single-selection (radio buttons)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "showSelectAll",
+          "attribute": "show-select-all",
+          "description": "Whether to show the \"Select All\" checkbox (only when multi is true)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "itemCount",
+          "attribute": "item-count",
+          "description": "Total number of items in the column (shown in tag badge)",
+          "type": "number",
+          "default": "0"
+        },
+        {
+          "name": "allSelected",
+          "attribute": "all-selected",
+          "description": "Whether all items are currently selected",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "allIndeterminate",
+          "attribute": "all-indeterminate",
+          "description": "Whether the \"Select All\" checkbox is in an indeterminate state",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "styles",
           "default": "\"styles\""
@@ -310,16 +454,108 @@
       ],
       "events": [
         {
-          "name": "c4p-add-select-row-navigate"
+          "name": "c4p-add-select-column-search",
+          "description": "Fired when column search changes; detail: { searchTerm }"
         },
         {
-          "name": "c4p-add-select-row-select"
+          "name": "c4p-add-select-column-select-all",
+          "description": "Fired when \"Select All\" checkbox changes; detail: { checked }"
         }
       ],
       "slots": [
         {
           "name": "default",
-          "description": "Contains c4p-add-select-row components"
+          "description": "AddSelectRow elements"
+        },
+        {
+          "name": "actions",
+          "description": "Custom actions (filter/sort) placed next to column search"
+        }
+      ]
+    },
+    {
+      "name": "c4p-add-select-item-panel",
+      "path": "./src/components/add-select/add-select-item-panel.ts",
+      "description": "Add Select Item Panel — side panel displaying detailed information about an item.\nCSS modifier `${blockClass}__item-summary-panel--open` is added when `open` is true,\nenabling CSS-driven slide-in/out transitions.",
+      "attributes": [
+        {
+          "name": "title",
+          "description": "Panel title",
+          "type": "string",
+          "default": "\"Item details\""
+        },
+        {
+          "name": "open",
+          "description": "Controls panel visibility via CSS modifier class (enables CSS transitions)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "close-icon-description",
+          "description": "Accessible label for the close icon button",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "show-close-button",
+          "description": "Whether to show the close button",
+          "type": "boolean",
+          "default": "true"
+        }
+      ],
+      "properties": [
+        {
+          "name": "title",
+          "attribute": "title",
+          "description": "Panel title",
+          "type": "string",
+          "default": "\"Item details\""
+        },
+        {
+          "name": "item",
+          "description": "Item data (set via JS property)",
+          "type": "AddSelectItem | null"
+        },
+        {
+          "name": "open",
+          "attribute": "open",
+          "description": "Controls panel visibility via CSS modifier class (enables CSS transitions)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "closeIconDescription",
+          "attribute": "close-icon-description",
+          "description": "Accessible label for the close icon button",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "showCloseButton",
+          "attribute": "show-close-button",
+          "description": "Whether to show the close button",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        }
+      ],
+      "events": [
+        {
+          "name": "c4p-add-select-item-panel-close",
+          "description": "Fired when close icon is clicked"
+        }
+      ],
+      "slots": [
+        {
+          "name": "default",
+          "description": "Highest priority: replaces all body rendering when populated"
+        },
+        {
+          "name": "render-item",
+          "description": "Medium priority: receives item for custom rendering"
         }
       ]
     },
@@ -358,12 +594,42 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "indeterminate",
+          "description": "Whether the checkbox is in an indeterminate state (multi hierarchical)",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "disabled",
           "description": "Whether the item is disabled",
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "skeleton",
+          "description": "Whether to render the row as a skeleton (loading) state",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "has-item-panel",
+          "description": "Whether to show the item details icon button",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "item-panel-open",
+          "description": "Whether the item panel is currently open for this item",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "item-panel-icon-description",
+          "description": "Accessible label for the item panel icon button",
+          "type": "string",
+          "default": "\"View details\""
+        },
         {
           "name": "has-children",
           "description": "Whether the item has children (for navigation)",
@@ -413,6 +679,13 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "indeterminate",
+          "attribute": "indeterminate",
+          "description": "Whether the checkbox is in an indeterminate state (multi hierarchical)",
+          "type": "boolean",
+          "default": "false"
+        },
         {
           "name": "disabled",
           "attribute": "disabled",
@@ -420,6 +693,34 @@
           "type": "boolean",
           "default": "false"
         },
+        {
+          "name": "skeleton",
+          "attribute": "skeleton",
+          "description": "Whether to render the row as a skeleton (loading) state",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "hasItemPanel",
+          "attribute": "has-item-panel",
+          "description": "Whether to show the item details icon button",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "itemPanelOpen",
+          "attribute": "item-panel-open",
+          "description": "Whether the item panel is currently open for this item",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "itemPanelIconDescription",
+          "attribute": "item-panel-icon-description",
+          "description": "Accessible label for the item panel icon button",
+          "type": "string",
+          "default": "\"View details\""
+        },
         {
           "name": "hasChildren",
           "attribute": "has-children",
@@ -447,6 +748,10 @@
         {
           "name": "c4p-add-select-row-navigate",
           "description": "Fired when navigating to children"
+        },
+        {
+          "name": "c4p-add-select-row-item-panel-click",
+          "description": "Fired when the item panel icon button is clicked"
         }
       ],
       "slots": [
@@ -464,6 +769,176 @@
         }
       ]
     },
+    {
+      "name": "c4p-add-select-selection-summary-item",
+      "path": "./src/components/add-select/add-select-selection-summary-item.ts",
+      "description": "Add Select Selection Summary Item — individual selected item display.",
+      "attributes": [
+        {
+          "name": "use-accordion",
+          "description": "Use accordion pattern for display",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "remove-button-label",
+          "description": "Accessible label for the remove button",
+          "type": "string",
+          "default": "\"Remove item\""
+        },
+        {
+          "name": "hide-remove-button",
+          "description": "When true, the remove button is not rendered",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "item",
+          "description": "Item data (set via JS property)",
+          "type": "AddSelectItem | null"
+        },
+        {
+          "name": "useAccordion",
+          "attribute": "use-accordion",
+          "description": "Use accordion pattern for display",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "removeButtonLabel",
+          "attribute": "remove-button-label",
+          "description": "Accessible label for the remove button",
+          "type": "string",
+          "default": "\"Remove item\""
+        },
+        {
+          "name": "hideRemoveButton",
+          "attribute": "hide-remove-button",
+          "description": "When true, the remove button is not rendered",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        }
+      ],
+      "events": [
+        {
+          "name": "c4p-add-select-selection-summary-item-remove",
+          "description": "Fired when remove button clicked; detail: { itemId }"
+        }
+      ],
+      "slots": [
+        {
+          "name": "default",
+          "description": "Highest priority: replaces all rendering when populated"
+        },
+        {
+          "name": "render-item",
+          "description": "Custom full-row renderer; replaces title/subtitle/body but keeps remove button (second priority after default slot)"
+        },
+        {
+          "name": "accordion-title",
+          "description": "Custom accordion title (used when use-accordion is true)"
+        },
+        {
+          "name": "accordion-body",
+          "description": "Custom accordion body (used when use-accordion is true)"
+        }
+      ]
+    },
+    {
+      "name": "c4p-add-select-selection-summary",
+      "path": "./src/components/add-select/add-select-selection-summary.ts",
+      "description": "Add Select Selection Summary — displays the list of selected items.",
+      "attributes": [
+        {
+          "name": "title",
+          "description": "Panel title",
+          "type": "string",
+          "default": "\"Selected items\""
+        },
+        {
+          "name": "selected-item-count",
+          "description": "Number of selected items — shown as a badge next to the title when provided.\nBadge is hidden when this is omitted/undefined.",
+          "type": "number | undefined",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "show-edit-icon",
+          "description": "Show edit icon next to title",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "edit-icon-description",
+          "description": "Accessible label for the edit icon button",
+          "type": "string",
+          "default": "\"Edit selections\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "title",
+          "attribute": "title",
+          "description": "Panel title",
+          "type": "string",
+          "default": "\"Selected items\""
+        },
+        {
+          "name": "selectedItemCount",
+          "attribute": "selected-item-count",
+          "description": "Number of selected items — shown as a badge next to the title when provided.\nBadge is hidden when this is omitted/undefined.",
+          "type": "number | undefined",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "showEditIcon",
+          "attribute": "show-edit-icon",
+          "description": "Show edit icon next to title",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "editIconDescription",
+          "attribute": "edit-icon-description",
+          "description": "Accessible label for the edit icon button",
+          "type": "string",
+          "default": "\"Edit selections\""
+        },
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        }
+      ],
+      "events": [
+        {
+          "name": "c4p-add-select-selection-summary-edit",
+          "description": "Fired when edit icon is clicked"
+        }
+      ],
+      "slots": [
+        {
+          "name": "default",
+          "description": "SelectionSummaryItem components or custom body content"
+        },
+        {
+          "name": "header",
+          "description": "Replaces the entire header section"
+        },
+        {
+          "name": "header-actions",
+          "description": "Custom actions alongside the edit icon"
+        },
+        {
+          "name": "empty-state",
+          "description": "Shown when selectedItemCount is 0 or not set"
+        }
+      ]
+    },
     {
       "name": "c4p-add-select",
       "path": "./src/components/add-select/add-select.ts",
@@ -3755,15 +4230,15 @@
         }
       ],
       "properties": [
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        },
         {
           "name": "tearsheetType",
           "attribute": "tearsheet-type",
           "type": "string",
           "default": "\"wide\""
-        },
-        {
-          "name": "styles",
-          "default": "\"styles\""
         }
       ]
     },

package/es/components/add-select/add-select-body.d.ts

@@ -15,16 +15,14 @@ import '@carbon/web-components/es/components/link/index.js';
 /**
  * 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 }
  */
 declare class CDSAddSelectBody extends LitElement {
-    /**
-     * Whether this is a multi-select (inherited from parent c4p-add-select)
-     * @private
-     */
-    private get _multi();
     /**
      * Label for items section
      */
@@ -52,9 +50,13 @@ declare class CDSAddSelectBody extends LitElement {
      */
     private _searchTerm;
     /**
-     * Item count for display
+     * Item count for display. When undefined, no count badge is rendered.
+     */
+    itemCount: number | undefined;
+    /**
+     * Whether to hide the search input
      */
-    itemCount: number;
+    hideSearch: boolean;
     /**
      * Navigation path for breadcrumbs
      */
@@ -66,6 +68,9 @@ declare class CDSAddSelectBody extends LitElement {
      * Handle search input
      */
     private _handleSearch;
+    /** Tracks whether the header slot has been filled by the consumer */
+    private _hasHeaderSlot;
+    private _handleHeaderSlotChange;
     render(): import("lit-html").TemplateResult<1>;
     /**
      * The name of the custom event fired when search term changes

package/es/components/add-select/add-select-body.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"add-select-body.d.ts","sourceRoot":"","sources":["../../../src/components/add-select/add-select-body.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAIvC,OAAO,sDAAsD,CAAC;AAC9D,OAAO,sDAAsD,CAAC;AAC9D,OAAO,mDAAmD,CAAC;AAC3D,OAAO,0DAA0D,CAAC;AAClE,OAAO,oDAAoD,CAAC;AAM5D;;;;;;GAMG;AACH,cACM,gBAAiB,SAAQ,UAAU;IACvC;;;OAGG;IACH,OAAO,KAAK,MAAM,GAGjB;IAED;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,iBAAiB,SAAM;IAEvB;;OAEG;IAEH,uBAAuB,SAAY;IAEnC;;OAEG;IAIH;;OAEG;IAIH;;OAEG;IAEH,kBAAkB,SAAoB;IAEtC;;OAEG;IAEH,OAAO,CAAC,WAAW,CAAM;IAEzB;;OAEG;IAEH,SAAS,SAAK;IAEd;;OAEG;IAEH,IAAI,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAM;IAEhD;;OAEG;IACH,OAAO,CAAC,aAAa;IAgBrB,MAAM;IA2GN;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,oBAAoB,WAE9B;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"add-select-body.d.ts","sourceRoot":"","sources":["../../../src/components/add-select/add-select-body.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAGhD,OAAO,sDAAsD,CAAC;AAC9D,OAAO,sDAAsD,CAAC;AAC9D,OAAO,mDAAmD,CAAC;AAC3D,OAAO,0DAA0D,CAAC;AAClE,OAAO,oDAAoD,CAAC;AAM5D;;;;;;;;;GASG;AACH,cACM,gBAAiB,SAAQ,UAAU;IACvC;;OAEG;IAEH,UAAU,SAAM;IAEhB;;OAEG;IAEH,iBAAiB,SAAM;IAEvB;;OAEG;IAEH,uBAAuB,SAAY;IAEnC;;OAEG;IAIH;;OAEG;IAIH;;OAEG;IAEH,kBAAkB,SAAoB;IAEtC;;OAEG;IAEH,OAAO,CAAC,WAAW,CAAM;IAEzB;;OAEG;IAEH,SAAS,EAAE,MAAM,GAAG,SAAS,CAAa;IAE1C;;OAEG;IAEH,UAAU,UAAS;IAEnB;;OAEG;IAEH,IAAI,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAM;IAEhD;;OAEG;IACH,OAAO,CAAC,aAAa;IAgBrB,qEAAqE;IAErE,OAAO,CAAC,cAAc,CAAS;IAE/B,OAAO,CAAC,uBAAuB;IAK/B,MAAM;IA4IN;;OAEG;IACH,MAAM,KAAK,WAAW,WAErB;IAED;;OAEG;IACH,MAAM,KAAK,oBAAoB,WAE9B;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,gBAAgB,CAAC"}