From 66942ad3b9185d7989052aa4645e9bfcf890ee0c Mon Sep 17 00:00:00 2001 From: zhouyun1 Date: Thu, 19 Sep 2024 20:46:20 +0800 Subject: [PATCH 1/4] feat(select): Add searchOnInit api (#3004) --- .changeset/clever-monkeys-speak.md | 6 ++++++ .changeset/rude-ways-look.md | 7 +++++++ packages/hooks/use-search-mode/src/index.ts | 9 +++++++-- packages/ui/check-select/src/CheckSelect.tsx | 6 ++++++ packages/ui/check-select/stories/data-source.stories.tsx | 1 + packages/ui/select/src/Select.tsx | 6 ++++++ packages/ui/select/stories/data-source.stories.tsx | 1 + 7 files changed, 34 insertions(+), 2 deletions(-) create mode 100644 .changeset/clever-monkeys-speak.md create mode 100644 .changeset/rude-ways-look.md diff --git a/.changeset/clever-monkeys-speak.md b/.changeset/clever-monkeys-speak.md new file mode 100644 index 000000000..c6b721793 --- /dev/null +++ b/.changeset/clever-monkeys-speak.md @@ -0,0 +1,6 @@ +--- +"@hi-ui/hiui": patch +--- + +feat(select): Add searchOnInit api +feat(check-select): Add searchOnInit api diff --git a/.changeset/rude-ways-look.md b/.changeset/rude-ways-look.md new file mode 100644 index 000000000..dec82e2c1 --- /dev/null +++ b/.changeset/rude-ways-look.md @@ -0,0 +1,7 @@ +--- +"@hi-ui/use-search-mode": minor +"@hi-ui/check-select": minor +"@hi-ui/select": minor +--- + +feat: Add searchOnInit api diff --git a/packages/hooks/use-search-mode/src/index.ts b/packages/hooks/use-search-mode/src/index.ts index 14009d5ed..e8ab0dff5 100644 --- a/packages/hooks/use-search-mode/src/index.ts +++ b/packages/hooks/use-search-mode/src/index.ts @@ -20,6 +20,7 @@ export const useSearchMode = ({ searchable: searchableProp, strategies, keyword: keywordProp, + searchOnInit, }: UseSearchModeProps) => { const [keyword, setKeyword] = useUncontrolledState('', keywordProp) @@ -43,11 +44,11 @@ export const useSearchMode = ({ const runSearch = useCallback( (keyword: string) => { if (!searchable) return - if (keyword && runSearchStrategy) { + if ((keyword || searchOnInit) && runSearchStrategy) { runSearchStrategy(keyword, setStateInSearch) } }, - [searchable, runSearchStrategy] + [searchable, searchOnInit, runSearchStrategy] ) const onSearch = useCallback( @@ -108,6 +109,10 @@ export interface UseSearchModeProps { * 异步加载数据 */ dataSource?: UseDataSource + /** + * 初始化时执行一次搜索，仅在 dataSource 不为空时有效 + */ + searchOnInit?: boolean // DataSourceFun | TreeSelectDataSource | Promise strategies: any[] } diff --git a/packages/ui/check-select/src/CheckSelect.tsx b/packages/ui/check-select/src/CheckSelect.tsx index aea4cd6f9..1466de077 100644 --- a/packages/ui/check-select/src/CheckSelect.tsx +++ b/packages/ui/check-select/src/CheckSelect.tsx @@ -67,6 +67,7 @@ export const CheckSelect = forwardRef( invalid, // search dataSource, + searchOnInit, filterOption, searchable: searchableProp, render: titleRender, @@ -144,6 +145,7 @@ export const CheckSelect = forwardRef( searchable: searchableProp, keyword: keywordProp, strategies: [dataSourceStrategy, customSearchStrategy, filterSearchStrategy], + searchOnInit, }) // 拦截 titleRender，自定义高亮展示 @@ -461,6 +463,10 @@ export interface CheckSelectProps * 异步加载数据 */ dataSource?: UseDataSource + /** + * 初始化时执行一次搜索，仅在 dataSource 不为空时有效 + */ + searchOnInit?: boolean /** * 自定义下拉菜单底部渲染 */ diff --git a/packages/ui/check-select/stories/data-source.stories.tsx b/packages/ui/check-select/stories/data-source.stories.tsx index 6fac6c253..cdddfaa97 100644 --- a/packages/ui/check-select/stories/data-source.stories.tsx +++ b/packages/ui/check-select/stories/data-source.stories.tsx @@ -35,6 +35,7 @@ export const DataSource = () => { // searchPlaceholder="请输入搜索内容" data={data} onChange={console.log} + // searchOnInit dataSource={(keyword) => { console.log('DataSource', keyword) const url = diff --git a/packages/ui/select/src/Select.tsx b/packages/ui/select/src/Select.tsx index dec864c72..673478d61 100644 --- a/packages/ui/select/src/Select.tsx +++ b/packages/ui/select/src/Select.tsx @@ -61,6 +61,7 @@ export const Select = forwardRef( searchable: searchableProp, keyword: keywordProp, dataSource, + searchOnInit, filterOption, // popper visible, @@ -132,6 +133,7 @@ export const Select = forwardRef( searchable: searchableProp, keyword: keywordProp, strategies: [dataSourceStrategy, customSearchStrategy, filterSearchStrategy], + searchOnInit, }) // 拦截 titleRender，自定义高亮展示 @@ -380,6 +382,10 @@ export interface SelectProps * 异步加载数据 */ dataSource?: UseDataSource + /** + * 初始化时执行一次搜索，仅在 dataSource 不为空时有效 + */ + searchOnInit?: boolean /** * 搜索时触发 */ diff --git a/packages/ui/select/stories/data-source.stories.tsx b/packages/ui/select/stories/data-source.stories.tsx index 1dfeb9b23..56ab2ab2d 100644 --- a/packages/ui/select/stories/data-source.stories.tsx +++ b/packages/ui/select/stories/data-source.stories.tsx @@ -35,6 +35,7 @@ export const DataSource = () => { // searchPlaceholder="请输入搜索内容" data={data} onChange={console.log} + // searchOnInit dataSource={(keyword) => { console.log('DataSource', keyword) const url = From 9adae0ec573fe3ee570096c60ba01bf8ca94a4bf Mon Sep 17 00:00:00 2001 From: zhouyun1 Date: Tue, 24 Sep 2024 20:04:30 +0800 Subject: [PATCH 2/4] =?UTF-8?q?chore(use-search-mode):=20=E5=AE=8C?= =?UTF-8?q?=E5=96=84searchOnInit=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/hooks/use-search-mode/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/hooks/use-search-mode/src/index.ts b/packages/hooks/use-search-mode/src/index.ts index e8ab0dff5..891b7902d 100644 --- a/packages/hooks/use-search-mode/src/index.ts +++ b/packages/hooks/use-search-mode/src/index.ts @@ -70,7 +70,7 @@ export const useSearchMode = ({ runSearch(keywordLatestRef.current) }, [keywordLatestRef, runSearch]) - const inSearch = !!keyword + const inSearch = !!keyword || searchOnInit const isEmpty = inSearch && stateInSearch.data.length === 0 return { From d9a4cd20c251f28b3b5774fbc0ad5ae6a0ce66c2 Mon Sep 17 00:00:00 2001 From: zhouyun1 Date: Wed, 9 Oct 2024 16:22:06 +0800 Subject: [PATCH 3/4] =?UTF-8?q?chore:=20=E4=BF=AE=E6=94=B9=E5=8F=98?= =?UTF-8?q?=E6=9B=B4=E8=AE=B0=E5=BD=95=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .changeset/clever-monkeys-speak.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/clever-monkeys-speak.md b/.changeset/clever-monkeys-speak.md index c6b721793..541cde5b0 100644 --- a/.changeset/clever-monkeys-speak.md +++ b/.changeset/clever-monkeys-speak.md @@ -1,5 +1,5 @@ --- -"@hi-ui/hiui": patch +"@hi-ui/hiui": minor --- feat(select): Add searchOnInit api From 0fdc12c06f464195e426f0bddd1c430eaae9d8a5 Mon Sep 17 00:00:00 2001 From: zhouyun1 Date: Tue, 15 Oct 2024 14:29:29 +0800 Subject: [PATCH 4/4] =?UTF-8?q?fix(check-select):=20=E4=BF=AE=E5=A4=8Dsear?= =?UTF-8?q?chOnInit=E6=A8=A1=E5=BC=8F=E4=B8=8B=E5=88=9D=E5=A7=8B=E5=8C=96?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=B2=A1=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/ui/check-select/src/CheckSelect.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ui/check-select/src/CheckSelect.tsx b/packages/ui/check-select/src/CheckSelect.tsx index 1466de077..45a38f7e6 100644 --- a/packages/ui/check-select/src/CheckSelect.tsx +++ b/packages/ui/check-select/src/CheckSelect.tsx @@ -172,7 +172,7 @@ export const CheckSelect = forwardRef( [titleRender, searchValue, searchMode] ) - const shouldUseSearch = !!searchValue && !hasError + const shouldUseSearch = (!!searchValue || searchOnInit) && !hasError const showData = useMemo(() => { return shouldUseSearch ? stateInSearch.data : flattedData }, [shouldUseSearch, flattedData, stateInSearch.data])