diff --git a/.changeset-pending/sixty-elephants-join.md b/.changeset-pending/sixty-elephants-join.md deleted file mode 100644 index cb29c087f..000000000 --- a/.changeset-pending/sixty-elephants-join.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@hi-ui/hiui": minor -"@hi-ui/resize-box": minor ---- - -feat: 增加 ResizeBox 组件 diff --git a/packages/ui/alert/stories/size.stories.tsx b/packages/ui/alert/stories/size.stories.tsx index d023d2feb..a03df856a 100644 --- a/packages/ui/alert/stories/size.stories.tsx +++ b/packages/ui/alert/stories/size.stories.tsx @@ -3,8 +3,7 @@ import Alert from '../src' import Button from '@hi-ui/button' /** - * @title 基础用法 - * @desc 根据用户的操作进行页面级或模块、区块级的提示 + * @title 不同尺寸 */ export const Size = () => { return ( diff --git a/packages/ui/avatar/hi-docs.config.mdx b/packages/ui/avatar/hi-docs.config.mdx index b753a7721..c86a67146 100644 --- a/packages/ui/avatar/hi-docs.config.mdx +++ b/packages/ui/avatar/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# Avatar 组件中文名 +# Avatar 头像 -组件中文介绍 +用来代表用户或事物，支持图片、图标或字符展示。 ## 何时使用 diff --git a/packages/ui/check-cascader/hi-docs.config.mdx b/packages/ui/check-cascader/hi-docs.config.mdx index 1d4777c0a..87ecabc53 100644 --- a/packages/ui/check-cascader/hi-docs.config.mdx +++ b/packages/ui/check-cascader/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# CheckCascader 组件中文名 +# CheckCascader 多项级联选择器 -组件中文介绍 +通过采用多级分类的方式将选项进行分隔，便于用户完成多项选择，在不同类型之间切换。 ## 何时使用 diff --git a/packages/ui/check-select/hi-docs.config.mdx b/packages/ui/check-select/hi-docs.config.mdx index 29d956fa2..6c8399fe7 100644 --- a/packages/ui/check-select/hi-docs.config.mdx +++ b/packages/ui/check-select/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# CheckSelect 组件中文名 +# CheckSelect 多项选择器 -组件中文介绍 +弹出一个下拉菜单给用户进行部分选项选择的操作。 ## 何时使用 diff --git a/packages/ui/check-tree-select/hi-docs.config.mdx b/packages/ui/check-tree-select/hi-docs.config.mdx index c1da10559..0d429defe 100644 --- a/packages/ui/check-tree-select/hi-docs.config.mdx +++ b/packages/ui/check-tree-select/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# CheckTreeSelect 组件中文名 +# CheckTreeSelect 多选树形选择器 -组件中文介绍 +一种接收树形数据结构的多项选择器，为用户提供复杂数据展示的能力。 ## 何时使用 diff --git a/packages/ui/date-picker/stories/custom-render.stories.tsx b/packages/ui/date-picker/stories/custom-render.stories.tsx index c2d62756e..408e0ac50 100644 --- a/packages/ui/date-picker/stories/custom-render.stories.tsx +++ b/packages/ui/date-picker/stories/custom-render.stories.tsx @@ -8,48 +8,48 @@ import Input from '@hi-ui/input' export const CustomRender = () => { return ( <> -

日期

+

自定义触发器

-

基础

+

日期

{ console.log('onChange', date, dateStr) }} onSelect={console.log} customRender={(data) => { - return + const date = new Date(data[0] ?? new Date()) + const year = date.getFullYear() + const month = (date.getMonth() + 1).toString().padStart(2, '0') + const day = date.getDate().toString().padStart(2, '0') + const formattedDate = `${year}-${month}-${day}` + return }} /> -

日期时间范围

+

日期范围

{ console.log('onChange', date, dateStr) }} defaultValue={[new Date(), new Date()]} customRender={(data) => { - const date1 = new Date(data[0]) - const date2 = new Date(data[1]) + const date1 = new Date(data[0] ?? new Date()) + const date2 = new Date(data[1] ?? new Date()) const year1 = date1.getFullYear() const year2 = date2.getFullYear() const month1 = (date1.getMonth() + 1).toString().padStart(2, '0') const month2 = (date2.getMonth() + 1).toString().padStart(2, '0') const day1 = date1.getDate().toString().padStart(2, '0') const day2 = date2.getDate().toString().padStart(2, '0') - const hours1 = date1.getHours().toString().padStart(2, '0') - const hours2 = date2.getHours().toString().padStart(2, '0') - const minutes1 = date1.getMinutes().toString().padStart(2, '0') - const minutes2 = date2.getMinutes().toString().padStart(2, '0') - const seconds1 = date1.getSeconds().toString().padStart(2, '0') - const seconds2 = date2.getSeconds().toString().padStart(2, '0') - const formattedDateTime1 = `${year1}-${month1}-${day1} ${hours1}:${minutes1}:${seconds1}` - const formattedDateTime2 = `${year2}-${month2}-${day2} ${hours2}:${minutes2}:${seconds2}` + const formattedDateTime1 = `${year1}-${month1}-${day1}` + const formattedDateTime2 = `${year2}-${month2}-${day2}` + return ( diff --git a/packages/ui/date-picker/stories/need-confirm.stories.tsx b/packages/ui/date-picker/stories/need-confirm.stories.tsx index f26a1f252..16d273fa4 100644 --- a/packages/ui/date-picker/stories/need-confirm.stories.tsx +++ b/packages/ui/date-picker/stories/need-confirm.stories.tsx @@ -20,6 +20,7 @@ export const NeedConfirm = () => { />

日期时间选择

{ - const [container, setContainer] = useState(null) + const [container, setContainer] = useState() const message = useMemo( () => createMessage({ @@ -23,29 +23,37 @@ export const Custom = () => {
{ - setContainer(e) + setContainer(e as HTMLDivElement) }} - id="ddd" style={{ - width: 700, - height: 400, - background: 'rgb(245, 247, 250)', - zIndex: 1500, - // Need add it + width: '100%', + minWidth: 660, + height: 420, + marginBottom: 20, + background: '#f5f7fa', + boxShadow: '1px 2px 8px #ddd', + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + + // Need add for it position: 'relative', overflow: 'hidden', - }} - >
- + +
) diff --git a/packages/ui/modal/hi-docs.config.mdx b/packages/ui/modal/hi-docs.config.mdx index 6facae84d..f7cf8750e 100644 --- a/packages/ui/modal/hi-docs.config.mdx +++ b/packages/ui/modal/hi-docs.config.mdx @@ -1,6 +1,6 @@ # Modal 模态框 -模态对话框一般会中断当前任务流，在相对无信息干扰的环境下完成微型任务 +模态对话框一般会中断当前任务流，在相对无信息干扰的环境下完成微型任务。 ## 何时使用 diff --git a/packages/ui/notification/hi-docs.config.mdx b/packages/ui/notification/hi-docs.config.mdx index d783d5ea2..28f70ada9 100644 --- a/packages/ui/notification/hi-docs.config.mdx +++ b/packages/ui/notification/hi-docs.config.mdx @@ -1,6 +1,6 @@ # Notification 通知 -系统发布通知、公布、公告等类型的全局信息 +系统发布通知、公布、公告等类型的全局信息。 ## 何时使用 diff --git a/packages/ui/notification/stories/custom.stories.tsx b/packages/ui/notification/stories/custom.stories.tsx index e3b638a28..34903866b 100644 --- a/packages/ui/notification/stories/custom.stories.tsx +++ b/packages/ui/notification/stories/custom.stories.tsx @@ -12,7 +12,7 @@ export const Custom = () => { const notification = useMemo( () => createNotification({ - container: container, + container, zIndex: 2000, }), [container] diff --git a/packages/ui/number-input/hi-docs.config.mdx b/packages/ui/number-input/hi-docs.config.mdx index f6eabe176..a7bba1fbf 100644 --- a/packages/ui/number-input/hi-docs.config.mdx +++ b/packages/ui/number-input/hi-docs.config.mdx @@ -1,6 +1,6 @@ # NumberInput 数字输入框 -专门用于接收用户数字输入的输入框 +专门用于接收用户数字输入的输入框。 ## 何时使用 diff --git a/packages/ui/pagination/hi-docs.config.mdx b/packages/ui/pagination/hi-docs.config.mdx index 3cd8bc3fb..db36cc2ed 100644 --- a/packages/ui/pagination/hi-docs.config.mdx +++ b/packages/ui/pagination/hi-docs.config.mdx @@ -1,6 +1,6 @@ # Pagination 分页 -用来分隔一个长列表，每次只加载一个页面，从而可释放后端服务器加载压力 +用来分隔一个长列表，每次只加载一个页面，从而可释放后端服务器加载压力。 ## 何时使用 diff --git a/packages/ui/picker/hi-docs.config.mdx b/packages/ui/picker/hi-docs.config.mdx index fd553c6be..36dac456c 100644 --- a/packages/ui/picker/hi-docs.config.mdx +++ b/packages/ui/picker/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# Picker 组件中文名 +# Picker 选择器 -组件中文介绍 +下拉框选择器。 ## 何时使用 diff --git a/packages/ui/pop-confirm/hi-docs.config.mdx b/packages/ui/pop-confirm/hi-docs.config.mdx index e2e158527..88e43a951 100644 --- a/packages/ui/pop-confirm/hi-docs.config.mdx +++ b/packages/ui/pop-confirm/hi-docs.config.mdx @@ -1,6 +1,6 @@ -# PopConfirm 组件中文名 +# PopConfirm 气泡确认框 -组件中文介绍 +气泡确认框是指点击元素，弹出气泡式的确认框。 ## 何时使用 diff --git a/packages/ui/pop-confirm/stories/gutter-gap.stories.tsx b/packages/ui/pop-confirm/stories/gutter-gap.stories.tsx index 66c5387d2..d440020f0 100644 --- a/packages/ui/pop-confirm/stories/gutter-gap.stories.tsx +++ b/packages/ui/pop-confirm/stories/gutter-gap.stories.tsx @@ -3,7 +3,8 @@ import PopConfirm from '../src' import Button from '@hi-ui/button' /** - * @title 设置基于依附元素的间隙偏移量 + * @title 设置间隙偏移量 + * @desc 设置基于依附元素的间隙偏移量 */ export const GutterGap = () => { return ( diff --git a/packages/ui/popover/hi-docs.config.mdx b/packages/ui/popover/hi-docs.config.mdx index 69a80d32a..70fd06868 100644 --- a/packages/ui/popover/hi-docs.config.mdx +++ b/packages/ui/popover/hi-docs.config.mdx @@ -1,6 +1,6 @@ # Popover 气泡卡片 -以气泡的样式，在响应事件的时候，以浮层的形式弹出 +以气泡的样式，在响应事件的时候，以浮层的形式弹出。 ## 何时使用 diff --git a/packages/ui/popover/stories/gutter-gap.stories.tsx b/packages/ui/popover/stories/gutter-gap.stories.tsx index b87d139c0..4f8d868af 100644 --- a/packages/ui/popover/stories/gutter-gap.stories.tsx +++ b/packages/ui/popover/stories/gutter-gap.stories.tsx @@ -3,7 +3,8 @@ import Popover from '../src' import Button from '@hi-ui/button' /** - * @title 设置基于依附元素的间隙偏移量 + * @title 设置间隙偏移量 + * @desc 设置基于依附元素的间隙偏移量 */ export const GutterGap = () => { const title = 文字提示 diff --git a/packages/ui/popover/stories/with-api.stories.tsx b/packages/ui/popover/stories/with-api.stories.tsx index 1cf10f8cb..83f5d3247 100644 --- a/packages/ui/popover/stories/with-api.stories.tsx +++ b/packages/ui/popover/stories/with-api.stories.tsx @@ -11,9 +11,9 @@ import { IconButton } from '@hi-ui/icon-button' */ export const WithApi = () => { const FormItem = Form.Item - const key1 = 'key1' + const key = 'my_key' - const Title = ({ title }) => { + const Title = ({ title }: { title: string }) => { return (
{ }} > {title} - } onClick={() => Popover.close(key1)} /> + } onClick={() => Popover.close(key)} />
) } @@ -64,7 +64,7 @@ export const WithApi = () => {
-