@uniai-fe/uds-primitives 0.13.1 → 0.13.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-primitives",
-  "version": "0.13.1",
+  "version": "0.13.2",
   "description": "UNIAI Design System; Primitives Components Package",
   "type": "module",
   "private": false,
@@ -83,13 +83,13 @@
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.5",
     "eslint": "^9.39.5",
-    "prettier": "^3.9.6",
+    "prettier": "^3.9.10",
     "react-hook-form": "^7.86.0",
     "sass": "^1.102.0",
     "typescript": "6.0.3",
-    "@uniai-fe/tsconfig": "0.2.0",
+    "@uniai-fe/eslint-config": "0.4.5",
     "@uniai-fe/next-devkit": "0.4.1",
-    "@uniai-fe/eslint-config": "0.4.4",
+    "@uniai-fe/tsconfig": "0.2.0",
     "@uniai-fe/uds-foundation": "0.6.0",
     "@uniai-fe/util-functions": "0.4.3"
   },

package/src/components/select/markup/multiple/SelectedChip.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import clsx from "clsx";
+import type { MouseEvent } from "react";
 
 import RemoveIcon from "../../img/remove.svg";
 import type { SelectMultipleChipProps } from "../../types/multiple";
@@ -8,12 +9,12 @@ import type { SelectMultipleChipProps } from "../../types/multiple";
 /**
  * Select Markup; Multiple 선택값 Chip 렌더링 컴포넌트
  * @component
- * @param {SelectMultipleChipProps} props chip props
- * @param {React.ReactNode} props.label chip 라벨
- * @param {React.ReactNode} [props.suffix] 라벨 뒤에 붙는 서브 라벨
- * @param {boolean} [props.removable=true] remove 버튼 노출 여부
- * @param {() => void} [props.onRemove] remove 클릭 핸들러
- * @param {"value" | "summary"} [props.kind="value"] chip 용도 구분
+ * @property {React.ReactNode} label chip 라벨
+ * @property {React.ReactNode} [suffix] 라벨 뒤에 붙는 서브 라벨
+ * @property {boolean} [removable=true] remove 버튼 노출 여부
+ * @property {() => void} [onRemove] remove 클릭 핸들러
+ * @property {"value" | "summary"} [kind="value"] chip 용도 구분
+ * @desc native 제거 버튼의 기본 활성화를 유지하고 부모 Select trigger의 열림 동작과 분리한다.
  * @example
  * <SelectMultipleSelectedChip label="Apple" removable onRemove={() => {}} />
  */
@@ -25,7 +26,9 @@ export function SelectMultipleSelectedChip({
   kind = "value",
 }: SelectMultipleChipProps) {
   const isRemovable = removable && typeof onRemove === "function";
-  const handleRemove = () => {
+  // 제거 클릭은 소비자 콜백만 실행하고 부모 trigger의 클릭으로 전파하지 않는다.
+  const handleRemove = (event: MouseEvent<HTMLButtonElement>) => {
+    event.stopPropagation();
     if (isRemovable) {
       onRemove?.();
     }
@@ -49,6 +52,13 @@ export function SelectMultipleSelectedChip({
           type="button"
           className="select-tag-remove"
           aria-label="remove tag"
+          onPointerDown={event => event.stopPropagation()}
+          onKeyDown={event => {
+            // native 클릭은 취소하지 않고 부모 trigger의 Enter·Space 처리만 막는다.
+            if (event.key === "Enter" || event.key === " ") {
+              event.stopPropagation();
+            }
+          }}
           onClick={handleRemove}
         >
           <RemoveIcon width={16} height={16} />