sellmate-design-system-react 9.0.0-beta.78 → 9.0.0-beta.79

package/dist/index.js

@@ -15930,11 +15930,46 @@ var SSelectImpl = /* @__PURE__ */ forwardRef(function SSelect({
     () => new Set(flat.filter((o) => !o.isGroup && o.disabled).map((o) => o.value)),
     [flat]
   );
-  const chips = showChips ? selected.map((v) => ({
-    value: v,
-    label: labelByValue.get(v) ?? valueOptions.get(v)?.label ?? v,
-    removable: !effectiveDisabled && !disabledValues.has(v)
-  })) : [];
+  const fullGroupByLeaf = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    if (!showChips || type !== "multi_depth") return map;
+    flat.forEach((o, i) => {
+      if (!o.isGroup) return;
+      const leafValues = collectGroupLeafValues(flat, i);
+      if (leafValues.length === 0 || leafValues.some((v) => !selectedSet.has(v))) return;
+      if (map.has(leafValues[0])) return;
+      const group = { value: o.value, label: o.label, leafValues };
+      for (let j = i + 1; j < flat.length && flat[j].depth > o.depth; j++) {
+        if (!flat[j].isGroup && selectedSet.has(flat[j].value)) map.set(flat[j].value, group);
+      }
+    });
+    return map;
+  }, [flat, selectedSet, showChips, type]);
+  const chips = [];
+  if (showChips) {
+    const placedGroups = /* @__PURE__ */ new Set();
+    for (const v of selected) {
+      const group = fullGroupByLeaf.get(v);
+      if (group != null) {
+        if (placedGroups.has(group.value)) continue;
+        placedGroups.add(group.value);
+        chips.push({
+          // 그룹 value 와 리프 value 가 겹쳐도 key 가 부딪히지 않게 구분한다.
+          key: `__group_${group.value}__`,
+          label: group.label,
+          values: group.leafValues,
+          removable: !effectiveDisabled
+        });
+        continue;
+      }
+      chips.push({
+        key: v,
+        label: labelByValue.get(v) ?? valueOptions.get(v)?.label ?? v,
+        values: [v],
+        removable: !effectiveDisabled && !disabledValues.has(v)
+      });
+    }
+  }
   const isPlaceholder = selected.length === 0;
   const showTriggerSpinner = loading2 && !effectiveDisabled;
   const showClear = clearable && !effectiveDisabled && !isPlaceholder;
@@ -15942,8 +15977,9 @@ var SSelectImpl = /* @__PURE__ */ forwardRef(function SSelect({
     emit3([]);
     if (rules && rules.length > 0) setRuleError(runRules(multi ? [] : "", rules));
   };
-  const handleRemoveChip = (target) => {
-    const next = selected.filter((v) => v !== target);
+  const handleRemoveChip = (targets) => {
+    const remove = new Set(targets);
+    const next = selected.filter((v) => !remove.has(v));
     emit3(next);
     if (rules && rules.length > 0) setRuleError(runRules(next, rules));
     triggerRef.current?.focus();
@@ -16163,12 +16199,12 @@ var SSelectImpl = /* @__PURE__ */ forwardRef(function SSelect({
                             TriggerRemoveButton,
                             {
                               ariaLabel: `${isHtmlLabel(chip.label) ? extractText(chip.label) : chip.label} \uC120\uD0DD \uD574\uC81C`,
-                              onRemove: () => handleRemoveChip(chip.value)
+                              onRemove: () => handleRemoveChip(chip.values)
                             }
                           )
                         ]
                       },
-                      chip.value
+                      chip.key
                     ))
                   }
                 )