@nurix/ui-component-library 1.1.7-stage.145 → 1.1.7-stage.146

package/dist/index.d.mts

@@ -3668,6 +3668,13 @@ interface MultiSelectProps<T extends string = string> {
      * @default true
      */
     showSelectAll?: boolean;
+    /**
+     * When every selectable item is selected, collapse the trigger summary to
+     * this label plus the count — e.g. `allSelectedLabel="All tools selected"`
+     * renders `All tools selected (4)` instead of the comma-separated list.
+     * When omitted, the comma summary is shown for the all-selected case too.
+     */
+    allSelectedLabel?: string;
     /**
      * Size variant. Same vocabulary as `SelectTrigger.size` so a paired
      * single-select and multi-select stay visually aligned.
@@ -3717,7 +3724,7 @@ interface MultiSelectProps<T extends string = string> {
  * a filter pill — so it slots into form layouts next to a normal Select
  * without visual drift.
  */
-declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, allSelectedLabel, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ChipProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onClick"> {
     /**

package/dist/index.d.ts

@@ -3668,6 +3668,13 @@ interface MultiSelectProps<T extends string = string> {
      * @default true
      */
     showSelectAll?: boolean;
+    /**
+     * When every selectable item is selected, collapse the trigger summary to
+     * this label plus the count — e.g. `allSelectedLabel="All tools selected"`
+     * renders `All tools selected (4)` instead of the comma-separated list.
+     * When omitted, the comma summary is shown for the all-selected case too.
+     */
+    allSelectedLabel?: string;
     /**
      * Size variant. Same vocabulary as `SelectTrigger.size` so a paired
      * single-select and multi-select stay visually aligned.
@@ -3717,7 +3724,7 @@ interface MultiSelectProps<T extends string = string> {
  * a filter pill — so it slots into form layouts next to a normal Select
  * without visual drift.
  */
-declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, allSelectedLabel, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ChipProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onClick"> {
     /**

package/dist/index.js

@@ -18013,6 +18013,7 @@ function MultiSelect({
   showSearch = false,
   searchPlaceholder = "Search\u2026",
   showSelectAll = true,
+  allSelectedLabel,
   size = "regular",
   bg = "default",
   disabled = false,
@@ -18047,11 +18048,12 @@ function MultiSelect({
   };
   const summary = React48.useMemo(() => {
     if (value.length === 0) return "";
+    if (allSelected && allSelectedLabel) return `${allSelectedLabel} (${value.length})`;
     const valueSet = new Set(value);
     const labels = items.filter((i) => valueSet.has(i.value)).map((i) => i.label);
     if (labels.length <= 2) return labels.join(", ");
     return `${labels.slice(0, 2).join(", ")} +${labels.length - 2}`;
-  }, [items, value]);
+  }, [items, value, allSelected, allSelectedLabel]);
   const sizeClass = size === "small" ? SELECT_TOKENS.container.singleLineSmall : size === "large" ? SELECT_TOKENS.container.singleLineLarge : SELECT_TOKENS.container.singleLineRegular;
   const trigger = /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
     "button",

package/dist/index.mjs

@@ -17908,6 +17908,7 @@ function MultiSelect({
   showSearch = false,
   searchPlaceholder = "Search\u2026",
   showSelectAll = true,
+  allSelectedLabel,
   size = "regular",
   bg = "default",
   disabled = false,
@@ -17942,11 +17943,12 @@ function MultiSelect({
   };
   const summary = React48.useMemo(() => {
     if (value.length === 0) return "";
+    if (allSelected && allSelectedLabel) return `${allSelectedLabel} (${value.length})`;
     const valueSet = new Set(value);
     const labels = items.filter((i) => valueSet.has(i.value)).map((i) => i.label);
     if (labels.length <= 2) return labels.join(", ");
     return `${labels.slice(0, 2).join(", ")} +${labels.length - 2}`;
-  }, [items, value]);
+  }, [items, value, allSelected, allSelectedLabel]);
   const sizeClass = size === "small" ? SELECT_TOKENS.container.singleLineSmall : size === "large" ? SELECT_TOKENS.container.singleLineLarge : SELECT_TOKENS.container.singleLineRegular;
   const trigger = /* @__PURE__ */ jsxs35(
     "button",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nurix/ui-component-library",
-  "version": "1.1.7-stage.145",
+  "version": "1.1.7-stage.146",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",