diff --git a/.changeset/sour-dogs-collect.md b/.changeset/sour-dogs-collect.md new file mode 100644 index 000000000..fd8bc87f7 --- /dev/null +++ b/.changeset/sour-dogs-collect.md @@ -0,0 +1,6 @@ +--- +"@wizleap-inc/wiz-ui-react": patch +"@wizleap-inc/wiz-ui-next": patch +--- + +Fix(search-selector): 選択時に検索文字列をクリアする diff --git a/packages/wiz-ui-next/src/components/base/inputs/search-input/search-input.vue b/packages/wiz-ui-next/src/components/base/inputs/search-input/search-input.vue index 3c956b580..5a4520739 100644 --- a/packages/wiz-ui-next/src/components/base/inputs/search-input/search-input.vue +++ b/packages/wiz-ui-next/src/components/base/inputs/search-input/search-input.vue @@ -276,12 +276,16 @@ const emit = defineEmits<{ (e: "toggle", value: boolean): void; }>(); +const searchValue = ref(""); + const checkValues = computed({ get: () => props.modelValue, - set: (value: number[]) => emit("update:modelValue", value), + set: (value: number[]) => { + emit("update:modelValue", value); + searchValue.value = ""; + }, }); -const searchValue = ref(""); const filteredOptions = ref([]); const selectedItem = ref([]); const activeItem = ref(); diff --git a/packages/wiz-ui-react/src/components/base/inputs/search-input/components/search-input.tsx b/packages/wiz-ui-react/src/components/base/inputs/search-input/components/search-input.tsx index 732ac4d50..201795eaa 100644 --- a/packages/wiz-ui-react/src/components/base/inputs/search-input/components/search-input.tsx +++ b/packages/wiz-ui-react/src/components/base/inputs/search-input/components/search-input.tsx @@ -109,7 +109,7 @@ const SearchInput: FC = ({ }); return map; - }, [options]); + }, [options, showParentLabel]); const IconComponent = icon; @@ -128,6 +128,11 @@ const SearchInput: FC = ({ const displayingSelectedItems = showSelectedItem && values.length > 0; + const handleClickPanelItem = (value: number[]) => { + onChangeValues(value); + setFilteringText(""); + }; + return ( <>
= ({ width={popupWidth} emptyMessage={emptyMessage} singleSelect={singleSelect} - onChangeValues={(changed) => onChangeValues(changed)} + onChangeValues={handleClickPanelItem} />