From b4412e51d012cb8e77476ce95090713ceefdbce0 Mon Sep 17 00:00:00 2001 From: wangtaofeng <1507337624@qq.com> Date: Mon, 31 Jul 2023 10:28:47 +0800 Subject: [PATCH 1/4] fix: upload bugs --- packages/upload/src/list/uploadProgress.tsx | 21 +-------------------- packages/upload/src/style.ts | 10 +++++++++- packages/upload/src/trigger-node.tsx | 4 +++- packages/upload/stories/upload.stories.tsx | 6 +----- 4 files changed, 14 insertions(+), 27 deletions(-) diff --git a/packages/upload/src/list/uploadProgress.tsx b/packages/upload/src/list/uploadProgress.tsx index e8d4b3d97..57bdd9af3 100644 --- a/packages/upload/src/list/uploadProgress.tsx +++ b/packages/upload/src/list/uploadProgress.tsx @@ -1,7 +1,7 @@ import { FC, useContext } from "react" import { STATUS, UploadProgressProps } from "../interface" import { Progress } from "@illa-design/progress" -import { UploadIcon, SuccessIcon, VideoPlayIcon } from "@illa-design/icon" +import { UploadIcon, SuccessIcon } from "@illa-design/icon" import { isFunction } from "@illa-design/system" import { ConfigProviderContext, @@ -12,7 +12,6 @@ import { successIconStyle, uploadProgressFailStyle, uploadProgressStatus, - uploadProgressStyle, } from "../style" import { handleKeyDown } from "../utils" import { globalColor, illaPrefix } from "@illa-design/theme" @@ -35,23 +34,6 @@ const UploadProgress: FC = (props) => { onReupload && onReupload(file) } - const handleFileUpload = () => { - onUpload && onUpload(file) - } - - const startIcon = status === STATUS.INIT && props.startIcon !== null && ( - handleKeyDown(e, handleFileUpload)} - > - {props.startIcon || } - - ) - const dom = ( <> {status === STATUS.FAIL && props.reuploadIcon !== null && ( @@ -87,7 +69,6 @@ const UploadProgress: FC = (props) => { trailColor={globalColor(`--${illaPrefix}-blue-06`)} {...progressProps} /> - {startIcon} )} diff --git a/packages/upload/src/style.ts b/packages/upload/src/style.ts index 6a18648a7..3192beb18 100644 --- a/packages/upload/src/style.ts +++ b/packages/upload/src/style.ts @@ -92,7 +92,13 @@ export const textItemImageStyle = css` width: 40px; height: 40px; flex-shrink: 0; + display: flex; border-radius: 4px; + & span { + display: flex; + width: 100%; + height: 100%; + } & img, & svg { width: 100%; @@ -214,7 +220,9 @@ export const getPictureCardContainerStyle = (disabled: boolean) => { width: 100px; height: 100px; border-radius: 2px; - padding: 32px 28px 22px 28px; + display: flex; + justify-content: center; + align-items: center; box-sizing: border-box; ` if (disabled) { diff --git a/packages/upload/src/trigger-node.tsx b/packages/upload/src/trigger-node.tsx index 823b217c6..606789ca6 100644 --- a/packages/upload/src/trigger-node.tsx +++ b/packages/upload/src/trigger-node.tsx @@ -157,7 +157,9 @@ const TriggerNode = (props: PropsWithChildren) => { aria-label={locale.upload} >
- + + +
{text ?? locale.upload}
diff --git a/packages/upload/stories/upload.stories.tsx b/packages/upload/stories/upload.stories.tsx index 4f0284df0..c93328de7 100644 --- a/packages/upload/stories/upload.stories.tsx +++ b/packages/upload/stories/upload.stories.tsx @@ -59,15 +59,11 @@ const Template: Story = (props) => { name: "image.png", status: "error", }, - { - uid: "-3", - name: "image.png", - status: "uploading", - }, { uid: "-1", name: "image.png", status: "init", + percent: 50, }, { uid: "-2", From 9072aa5a5ea4259e59bf8d6c61129e217623bdc8 Mon Sep 17 00:00:00 2001 From: wangtaofeng <1507337624@qq.com> Date: Mon, 31 Jul 2023 19:29:52 +0800 Subject: [PATCH 2/4] fix: time date disabled icon color --- packages/date-picker/src/input/rangeInput.tsx | 5 ++++- packages/date-picker/src/input/singleInput.tsx | 2 +- packages/date-picker/src/input/style.ts | 4 ++-- 3 files changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/date-picker/src/input/rangeInput.tsx b/packages/date-picker/src/input/rangeInput.tsx index 2c19c5137..709670e73 100644 --- a/packages/date-picker/src/input/rangeInput.tsx +++ b/packages/date-picker/src/input/rangeInput.tsx @@ -168,7 +168,10 @@ export const RangeDateInput = forwardRef< )} - + {suffixIcon} diff --git a/packages/date-picker/src/input/singleInput.tsx b/packages/date-picker/src/input/singleInput.tsx index cac38f7b0..c6d743194 100644 --- a/packages/date-picker/src/input/singleInput.tsx +++ b/packages/date-picker/src/input/singleInput.tsx @@ -109,7 +109,7 @@ export const DateInput = forwardRef( )} - + {suffixIcon} diff --git a/packages/date-picker/src/input/style.ts b/packages/date-picker/src/input/style.ts index 48d9e8f42..fb26f0b5b 100644 --- a/packages/date-picker/src/input/style.ts +++ b/packages/date-picker/src/input/style.ts @@ -192,8 +192,8 @@ export const clearIconStyle = css` cursor: pointer; ` -export const suffixIconStyle = css` - color: ${getColor("grayBlue", "01")}; +export const suffixIconStyle = (disabled?: boolean) => css` + color: ${getColor("grayBlue", disabled ? "05" : "01")}; height: 100%; svg { vertical-align: unset; From 9925d35eb343fe25fc27eb761a25f6919a6516c5 Mon Sep 17 00:00:00 2001 From: wangtaofeng <1507337624@qq.com> Date: Tue, 1 Aug 2023 19:28:55 +0800 Subject: [PATCH 3/4] fix: date picker select year bug --- packages/date-picker/src/panels/date/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/date-picker/src/panels/date/index.tsx b/packages/date-picker/src/panels/date/index.tsx index 5326bfa43..7fb7e2a51 100644 --- a/packages/date-picker/src/panels/date/index.tsx +++ b/packages/date-picker/src/panels/date/index.tsx @@ -153,6 +153,7 @@ export const DatePickerPanel: FC = (props) => { Date: Tue, 1 Aug 2023 19:47:22 +0800 Subject: [PATCH 4/4] feat: select support fuzzy search --- packages/select/src/interface.ts | 4 +++- packages/select/src/multiple-select.tsx | 2 +- packages/select/src/single-select.tsx | 8 +++++--- 3 files changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/select/src/interface.ts b/packages/select/src/interface.ts index e65accb7c..7aa91dc97 100644 --- a/packages/select/src/interface.ts +++ b/packages/select/src/interface.ts @@ -58,7 +58,9 @@ export interface SelectProps defaultValue?: T showSearch?: boolean value?: T - filterOption?: boolean | ((inputValue: string | number) => boolean) + filterOption?: + | boolean + | ((inputValue: string | number, option: SelectOptionObject) => boolean) onChange?: (value?: T) => void onClear?: () => void readOnly?: boolean diff --git a/packages/select/src/multiple-select.tsx b/packages/select/src/multiple-select.tsx index cac8d57c1..1b09b56fd 100644 --- a/packages/select/src/multiple-select.tsx +++ b/packages/select/src/multiple-select.tsx @@ -89,7 +89,7 @@ export const MultipleSelect = forwardRef( ) { newOptions = newOptions.filter((option) => { if (typeof filterOption === "function") { - return filterOption(finalInputValue) + return filterOption(finalInputValue, option) } return ( typeof option.label === "string" && diff --git a/packages/select/src/single-select.tsx b/packages/select/src/single-select.tsx index ee3bb087b..9d21b7a9b 100644 --- a/packages/select/src/single-select.tsx +++ b/packages/select/src/single-select.tsx @@ -178,17 +178,19 @@ export const SingleSelect = forwardRef( ) { newOptions = newOptions.filter((option) => { if (typeof filterOption === "function") { - return filterOption(finalInputValue) + return filterOption(finalInputValue, option) } return ( typeof option.label === "string" && - option.label.includes(finalInputValue.toString()) + option.label + .toLowerCase() + .includes(finalInputValue.toString().toLowerCase()) ) }) } return newOptions - }, [filterOption, finalInputValue, options]) + }, [filterOption, finalInputValue, options, showSearch]) return (