From 6894b55e275c54ffb6a24264dc7ed9c8254cf5b6 Mon Sep 17 00:00:00 2001 From: songsong <353833373@qq.com> Date: Wed, 18 Dec 2024 17:18:47 +0800 Subject: [PATCH 01/19] =?UTF-8?q?fix(countup):=20=E5=88=86=E9=9A=94?= =?UTF-8?q?=E7=AC=A6=E6=96=87=E5=AD=97=E9=A2=9C=E8=89=B2=E6=94=AF=E6=8C=81?= =?UTF-8?q?css=E5=8F=98=E9=87=8F=E4=BF=AE=E6=94=B9=20(#2871)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 解决微信小程序滚动报错问题 * fix(countup): 分隔符文字颜色支持css变量修改 --- src/packages/animatingnumbers/countup.scss | 2 +- src/packages/animatingnumbers/demos/h5/demo2.tsx | 1 + src/packages/animatingnumbers/demos/taro/demo2.tsx | 1 + src/packages/animatingnumbers/doc.en-US.md | 1 + src/packages/animatingnumbers/doc.md | 1 + src/packages/animatingnumbers/doc.taro.md | 1 + src/packages/animatingnumbers/doc.zh-TW.md | 1 + src/styles/variables.scss | 4 ++++ 8 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/packages/animatingnumbers/countup.scss b/src/packages/animatingnumbers/countup.scss index 12779786c9..a2d53654cc 100644 --- a/src/packages/animatingnumbers/countup.scss +++ b/src/packages/animatingnumbers/countup.scss @@ -24,7 +24,7 @@ display: flex; height: 80%; align-items: flex-end; - color: $countup-bg-color; + color: $countup-separator-color; font-size: $countup-base-size; font-weight: $font-weight-bold; } diff --git a/src/packages/animatingnumbers/demos/h5/demo2.tsx b/src/packages/animatingnumbers/demos/h5/demo2.tsx index 324a8812e7..fe7dcf1399 100644 --- a/src/packages/animatingnumbers/demos/h5/demo2.tsx +++ b/src/packages/animatingnumbers/demos/h5/demo2.tsx @@ -7,6 +7,7 @@ const Demo2 = () => { nutuiCountupBgColor: `var(--nutui-color-primary)`, nutuiCountupColor: `#fff`, nutuiCountupLrMargin: `1px`, + nutuiCountupSeparatorColor: `var(--nutui-color-primary)`, } const [value, setEndNumer] = useState('1570.99') useEffect(() => { diff --git a/src/packages/animatingnumbers/demos/taro/demo2.tsx b/src/packages/animatingnumbers/demos/taro/demo2.tsx index a16bb9d4a5..caa6b8ac4a 100644 --- a/src/packages/animatingnumbers/demos/taro/demo2.tsx +++ b/src/packages/animatingnumbers/demos/taro/demo2.tsx @@ -7,6 +7,7 @@ const Demo2 = () => { nutuiCountupBgColor: `var(--nutui-color-primary)`, nutuiCountupColor: `#fff`, nutuiCountupLrMargin: `1px`, + nutuiCountupSeparatorColor: `var(--nutui-color-primary)`, } const [value, setEndNumer] = useState('1570.99') useEffect(() => { diff --git a/src/packages/animatingnumbers/doc.en-US.md b/src/packages/animatingnumbers/doc.en-US.md index da9320582e..f9fea38408 100644 --- a/src/packages/animatingnumbers/doc.en-US.md +++ b/src/packages/animatingnumbers/doc.en-US.md @@ -53,3 +53,4 @@ The component provides the following CSS variables, which can be used to customi | \--nutui-countup-lr-margin | margin of item | `0` | | \--nutui-countup-bg-color | background color of item | `inherit` | | \--nutui-countup-color | color of item | `$color-title` | +| \--nutui-countup-separator-color | The font color of the separator | `$color-title` | diff --git a/src/packages/animatingnumbers/doc.md b/src/packages/animatingnumbers/doc.md index f65ebf7ddc..78c824a6dc 100644 --- a/src/packages/animatingnumbers/doc.md +++ b/src/packages/animatingnumbers/doc.md @@ -53,3 +53,4 @@ import { AnimatingNumbers } from '@nutui/nutui-react' | \--nutui-countup-lr-margin | 每个数字的margin | `0` | | \--nutui-countup-bg-color | 每个数字块的背景色 | `inherit` | | \--nutui-countup-color | 每个数字块的字色 | `$color-title` | +| \--nutui-countup-separator-color | 分隔符的字体颜色 | `$color-title` | diff --git a/src/packages/animatingnumbers/doc.taro.md b/src/packages/animatingnumbers/doc.taro.md index cb821e0abd..13582470ea 100644 --- a/src/packages/animatingnumbers/doc.taro.md +++ b/src/packages/animatingnumbers/doc.taro.md @@ -53,3 +53,4 @@ import { AnimatingNumbers } from '@nutui/nutui-react-taro' | \--nutui-countup-lr-margin | 每个数字的margin | `0` | | \--nutui-countup-bg-color | 每个数字块的背景色 | `inherit` | | \--nutui-countup-color | 每个数字块的字色 | `$color-title` | +| \--nutui-countup-separator-color | 分隔符的字体颜色 | `$color-title` | diff --git a/src/packages/animatingnumbers/doc.zh-TW.md b/src/packages/animatingnumbers/doc.zh-TW.md index 8c50042e5f..7c7a85f486 100644 --- a/src/packages/animatingnumbers/doc.zh-TW.md +++ b/src/packages/animatingnumbers/doc.zh-TW.md @@ -53,3 +53,4 @@ import { AnimatingNumbers } from '@nutui/nutui-react' | \--nutui-countup-lr-margin | 每個數字的margin | `0` | | \--nutui-countup-bg-color | 每個數字塊的背景色 | `inherit` | | \--nutui-countup-color | 每個數字塊的字色 | `$color-title` | +| \--nutui-countup-separator-color | 分隔符的字體顏色 | `$color-title` | diff --git a/src/styles/variables.scss b/src/styles/variables.scss index ee8dc9720c..e995510c55 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -2423,6 +2423,10 @@ $countup-border-radius: var(--nutui-countup-border-radius, 4px) !default; $countup-lr-margin: var(--nutui-countup-lr-margin, 0) !default; $countup-bg-color: var(--nutui-countup-bg-color, inherit) !default; $countup-color: var(--nutui-countup-color, $color-title) !default; +$countup-separator-color: var( + --nutui-countup-separator-color, + $color-title +) !default; // layout（✅） $row-content-color: var(--nutui-row-content-color, #fff) !default; From 8d41a635079e20b315cea18be411c5298a751209 Mon Sep 17 00:00:00 2001 From: songsong <353833373@qq.com> Date: Wed, 18 Dec 2024 18:05:37 +0800 Subject: [PATCH 02/19] =?UTF-8?q?feat(badge):=20v15=E9=80=82=E9=85=8D=20(#?= =?UTF-8?q?2826)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: update marking * fix: v14适配 * fix: update docs * feat: 0.5px边框 * fix: update types * fix: update test and docs * fix: tabbar test 有问题 * fix: update doc * fix: modify style * fix: 升级文档pr修改 * fix: removing the color property is done using a css variable * fix: update test * fix: update test * fix: update test --- migrate-from-v2.md | 7 +- src/config.json | 3 +- .../__snapshots__/badge.spec.tsx.snap | 5 +- src/packages/badge/__test__/badge.spec.tsx | 38 ++------ src/packages/badge/badge.scss | 95 ++++++++++++------- src/packages/badge/badge.taro.tsx | 72 ++++---------- src/packages/badge/badge.tsx | 54 ++++------- src/packages/badge/demos/h5/demo1.tsx | 58 ++++++++--- src/packages/badge/demos/h5/demo2.tsx | 8 +- src/packages/badge/demos/h5/demo3.tsx | 35 ++++--- src/packages/badge/demos/h5/demo4.tsx | 17 +--- src/packages/badge/demos/h5/demo5.tsx | 22 ++--- src/packages/badge/demos/h5/demo6.tsx | 14 +-- src/packages/badge/demos/h5/demo7.tsx | 8 +- src/packages/badge/demos/h5/demo8.tsx | 14 +-- src/packages/badge/demos/taro/demo1.tsx | 67 ++++++++----- src/packages/badge/demos/taro/demo2.tsx | 25 ++--- src/packages/badge/demos/taro/demo3.tsx | 48 +++++----- src/packages/badge/demos/taro/demo4.tsx | 47 ++------- src/packages/badge/demos/taro/demo5.tsx | 34 ++----- src/packages/badge/demos/taro/demo6.tsx | 23 ++--- src/packages/badge/demos/taro/demo7.tsx | 14 +-- src/packages/badge/demos/taro/demo8.tsx | 32 +++---- src/packages/badge/doc.en-US.md | 39 ++++---- src/packages/badge/doc.md | 30 +++--- src/packages/badge/doc.taro.md | 30 +++--- src/packages/badge/doc.zh-TW.md | 30 +++--- src/packages/badge/index.taro.ts | 2 +- src/packages/badge/index.ts | 2 +- src/packages/badge/types.ts | 14 +++ .../__snapshots__/tabbar.spec.tsx.snap | 2 +- src/styles/variables.scss | 27 ++++-- 32 files changed, 432 insertions(+), 484 deletions(-) create mode 100644 src/packages/badge/types.ts diff --git a/migrate-from-v2.md b/migrate-from-v2.md index ffcd44f21a..95e11099a3 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -667,11 +667,8 @@ plugins: [ #### Badge -- 移除 `zIndex`，目前没有用到，也不生效，直接去掉。 -- 移除 `icon`，自定义 `icon` 可放在 `value` 中实现，扩充了 `value` 的类型。 -- 修改 `max` 的最大值为99（之前为10000），比较贴合实际场景。 -- 主题定制的 `css` 变量中，去掉和 `dot` 有关的其他值，只保留 `width`。其他值由 `width` 计算而来. -- 主题定制，增加包含 icon 情况下的样式变量。 +- 新增 `size` 属性，dot 尺寸，当 dot 等于 `true` 时生效 +- 移除 `徽标背景颜色`，通过css变量`--nutui-badge-background-color`实现 #### CircleProgress diff --git a/src/config.json b/src/config.json index e1ff16c552..2ca7625731 100644 --- a/src/config.json +++ b/src/config.json @@ -739,6 +739,7 @@ "sort": 4, "show": true, "taro": true, + "v14": true, "author": "lzz" }, { @@ -1274,4 +1275,4 @@ ] } ] -} \ No newline at end of file +} diff --git a/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap b/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap index 4ed86572f6..35c4685cbf 100644 --- a/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap +++ b/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap @@ -7,6 +7,7 @@ exports[`should match custom icon 1`] = ` >
8
diff --git a/src/packages/badge/__test__/badge.spec.tsx b/src/packages/badge/__test__/badge.spec.tsx index 8f38b2578a..6a9919e66c 100644 --- a/src/packages/badge/__test__/badge.spec.tsx +++ b/src/packages/badge/__test__/badge.spec.tsx @@ -12,13 +12,13 @@ test('should match snapshot', () => { test('should match value is string', () => { const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] + const badgeContent = container.querySelectorAll('.nut-badge-sup')[0] expect(badgeContent).toHaveTextContent('new') }) test('should match max size', () => { const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] + const badgeContent = container.querySelectorAll('.nut-badge-sup')[0] expect(badgeContent.textContent).toBe('9+') }) @@ -29,42 +29,18 @@ test('should match dot', () => { }) test('should match top、right: bad number', () => { - const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] - expect(badgeContent).toHaveStyle({ top: '0px' }) -}) - -test('should match top、right: have px', () => { - const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] - expect(badgeContent).toHaveStyle({ top: '10px', right: '0px' }) + const { container } = render() + const badgeContent = container.querySelectorAll('.nut-badge-sup')[0] + expect(badgeContent).toHaveStyle({ top: '10px' }) }) test('should match top、right: float', () => { - const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] + const { container } = render() + const badgeContent = container.querySelectorAll('.nut-badge-sup')[0] expect(badgeContent).toHaveStyle({ top: '10.8px', right: '0.5px' }) }) -test('should match custom color', () => { - const { container } = render() - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] - expect(badgeContent).toHaveStyle({ 'background-color': 'orange' }) -}) - test('should match custom icon', () => { const { asFragment } = render(} />) expect(asFragment()).toMatchSnapshot() }) - -test('should match custom color when fill = outline', () => { - const { container } = render( - - ) - const badgeContent = container.querySelectorAll('.nut-badge-content')[0] - expect(badgeContent).toHaveStyle({ - border: '1px solid orange', - color: 'orange', - background: '#fff', - }) -}) diff --git a/src/packages/badge/badge.scss b/src/packages/badge/badge.scss index b320fffc1a..5f904fd2f7 100644 --- a/src/packages/badge/badge.scss +++ b/src/packages/badge/badge.scss @@ -2,22 +2,14 @@ position: relative; display: inline-flex; width: auto; - /* #ifdef harmony */ - min-width: 1px; - /* #endif */ - /* #ifndef harmony */ - min-width: auto; - /* #endif */ + &-icon { - position: absolute; display: flex; justify-content: center; align-items: center; background: $badge-background-color; padding: $badge-icon-padding; text-align: center; - border: $badge-border; - border-radius: $badge-border-radius; z-index: $badge-z-index; .nut-icon { @@ -27,53 +19,88 @@ } } + &-sup, + &-icon { + border-radius: $badge-border-radius; + &::after { + content: ''; + position: absolute; + top: -50%; + bottom: -50%; + left: -50%; + right: -50%; + transform: scale(0.5); + border: $badge-border; + border-radius: $badge-border-radius; + } + } + &-sup { - height: $badge-height; - position: absolute; - display: flex; + display: inline-flex; justify-content: center; - align-items: center; - /* #ifdef harmony */ - background: $color-primary; - /* #endif */ - /* #ifndef harmony */ - background: $badge-background-color; - /* #endif */ - color: $badge-color; + height: $badge-height; + min-width: $badge-min-width; padding: $badge-padding; + box-sizing: border-box; + color: $badge-color; font-size: $badge-font-size; - font-weight: normal; - text-align: center; - border: $badge-border; - border-radius: $badge-border-radius; - min-width: $badge-min-width; + line-height: 12px; white-space: nowrap; + font-weight: normal; + vertical-align: middle; + background: $badge-background-color; z-index: 1; } + &-number { + font-family: 'JD'; + /* #ifdef harmony */ + line-height: 12px; + /* #endif */ + /* #ifndef harmony */ + line-height: 13px; + /* #endif */ + } + &-one { height: $badge-height; width: $badge-height; - padding: 0; } &-content { - /* #ifndef rn */ + position: absolute; transform: $badge-content-transform; - /* #endif */ } &-dot { - width: $badge-dot-width; - height: $badge-dot-width; - border: $badge-dot-border; - border-radius: $badge-dot-width; padding: 0; + border-radius: 50%; + &::after { + border: $badge-dot-border; + border-radius: 50%; + } + &-normal { + min-width: $badge-dot-width; + width: $badge-dot-width; + height: $badge-dot-width; + } + &-small { + min-width: $badge-dot-small-width; + width: $badge-dot-small-width; + height: $badge-dot-small-width; + } + &-large { + min-width: $badge-dot-large-width; + width: $badge-dot-large-width; + height: $badge-dot-large-width; + } } &-outline { background: $color-primary-text; - border: 1px solid $color-primary; - color: $color-primary; + color: $badge-outline-color; + &::after { + border: $badge-outline-border; + } } } diff --git a/src/packages/badge/badge.taro.tsx b/src/packages/badge/badge.taro.tsx index 339a6254c6..31a1d8cf10 100644 --- a/src/packages/badge/badge.taro.tsx +++ b/src/packages/badge/badge.taro.tsx @@ -1,38 +1,27 @@ import React, { CSSProperties, FunctionComponent, - ReactNode, useEffect, useRef, useState, } from 'react' import classNames from 'classnames' import { View } from '@tarojs/components' -import { BasicComponent, ComponentDefaults } from '@/utils/typings' +import { ComponentDefaults } from '@/utils/typings' import { useRtl } from '@/packages/configprovider/index.taro' import pxTransform from '@/utils/px-transform' -import { getRectByTaro } from '@/utils/get-rect-by-taro' -import { harmony, rn } from '@/utils/platform-taro' +import { harmony } from '@/utils/platform-taro' +import { BadgeProps } from './types' -export type BadgeFill = 'solid' | 'outline' -export interface BadgeProps extends BasicComponent { - value: ReactNode - dot: boolean - max: number - top: string | number - right: string | number - color: string - fill: BadgeFill -} const defaultProps = { ...ComponentDefaults, value: '', dot: false, max: 99, - top: '4', - right: '8', - color: '', + top: 0, + right: 0, fill: 'solid', + size: 'large', } as BadgeProps export const Badge: FunctionComponent> = (props) => { const rtl = useRtl() @@ -45,8 +34,8 @@ export const Badge: FunctionComponent> = (props) => { dot, top, right, - color, fill, + size, } = { ...defaultProps, ...props, @@ -77,12 +66,15 @@ export const Badge: FunctionComponent> = (props) => { if (typeof value === 'string' && value) return value } - const contentClasses = classNames(`${classPrefix}-content`, { + const contentClasses = classNames({ [`${classPrefix}-sup`]: isNumber() || isString() || dot, + [`${classPrefix}-number`]: isNumber(), [`${classPrefix}-one`]: typeof content() === 'string' && `${content()}`?.length === 1, [`${classPrefix}-dot`]: dot, + [`${classPrefix}-dot-${size}`]: dot, [`${classPrefix}-${fill}`]: fill === 'outline', + [`${classPrefix}-content`]: children, }) useEffect(() => { @@ -92,41 +84,14 @@ export const Badge: FunctionComponent> = (props) => { }, []) const getPositionStyle = async () => { const style: CSSProperties = {} - style.top = pxTransform(-Number(top) || 0) - if (rn()) { - const reacts = await getRectByTaro(badgeRef.current) - style.left = - reacts?.width && reacts?.width > Number(right) - ? pxTransform(reacts.width - Number(right)) - : 0 - } else { - const dir = rtl ? 'left' : 'right' - style[dir] = isHarmony - ? pxTransform(Number(right)) - : `${Number(right) || parseFloat(String(right)) || 0}px` - } + style.top = pxTransform(Number(top) || 0) + const dir = rtl ? 'left' : 'right' + style[dir] = isHarmony + ? pxTransform(Number(right)) + : `${Number(right) || 0}px` setContentStyle(style) } - const getStyle = () => { - const style: CSSProperties = {} - if (color) { - if (fill === 'outline') { - style.color = color - isHarmony - ? (style.backgroundColor = '#fff') - : (style.background = '#fff') - if (!color?.includes('gradient')) { - style.borderColor = color - } - } else { - style.color = '#fff' - isHarmony ? (style.backgroundColor = color) : (style.background = color) - } - } - return style - } - return ( {isIcon() && ( @@ -142,10 +107,7 @@ export const Badge: FunctionComponent> = (props) => { )} {children} {!isIcon() && ( - + {content()} )} diff --git a/src/packages/badge/badge.tsx b/src/packages/badge/badge.tsx index a49031bc24..edc527ec87 100644 --- a/src/packages/badge/badge.tsx +++ b/src/packages/badge/badge.tsx @@ -1,28 +1,18 @@ -import React, { CSSProperties, FunctionComponent, ReactNode } from 'react' +import React, { CSSProperties, FunctionComponent } from 'react' import classNames from 'classnames' -import { BasicComponent, ComponentDefaults } from '@/utils/typings' +import { ComponentDefaults } from '@/utils/typings' import { useRtl } from '@/packages/configprovider' +import { BadgeProps } from './types' -export type BadgeFill = 'solid' | 'outline' - -export interface BadgeProps extends BasicComponent { - value: ReactNode - dot: boolean - max: number - top: string | number - right: string | number - color: string - fill: BadgeFill -} const defaultProps = { ...ComponentDefaults, value: '', dot: false, max: 99, - top: '4', - right: '8', - color: '', + top: 0, + right: 0, fill: 'solid', + size: 'large', } as BadgeProps export const Badge: FunctionComponent> = (props) => { const rtl = useRtl() @@ -35,16 +25,14 @@ export const Badge: FunctionComponent> = (props) => { dot, top, right, - color, fill, + size, } = { ...defaultProps, ...props, } const classPrefix = 'nut-badge' - const classes = classNames(classPrefix, className, { - [`${classPrefix}-${fill}`]: fill === 'outline', - }) + const classes = classNames(classPrefix, className) function content() { if (dot || typeof value === 'object' || value === 0) return null @@ -66,33 +54,24 @@ export const Badge: FunctionComponent> = (props) => { if (typeof value === 'string' && value) return value } - const contentClasses = classNames(`${classPrefix}-content`, { + const contentClasses = classNames({ [`${classPrefix}-sup`]: isNumber() || isString() || dot, + [`${classPrefix}-number`]: isNumber(), [`${classPrefix}-one`]: typeof content() === 'string' && `${content()}`?.length === 1, [`${classPrefix}-dot`]: dot, + [`${classPrefix}-dot-${size}`]: dot, [`${classPrefix}-${fill}`]: fill === 'outline', + [`${classPrefix}-content`]: children, }) - const getStyle = () => { + const getPositionStyle = () => { const style: CSSProperties = {} - style.top = `${Number(-top) || parseFloat(String(-top)) || 0}px` + style.top = `${Number(top) || 0}px` const dir = rtl ? 'left' : 'right' style[dir] = `${Number(right) || parseFloat(String(right)) || 0}px` - - if (color) { - if (fill === 'outline') { - style.color = color - style.background = '#fff' - if (!color?.includes('gradient')) { - style.border = `1px solid ${color}` - } - } else { - style.color = '#fff' - style.background = color - } - } return style } + return (
{isIcon() && ( @@ -101,13 +80,14 @@ export const Badge: FunctionComponent> = (props) => { [`${classPrefix}-icon`]: true, [`${classPrefix}-icon-rtl`]: rtl, })} + style={getPositionStyle()} > {value}
)} {children} {!isIcon() && ( -
+
{content()}
)} diff --git a/src/packages/badge/demos/h5/demo1.tsx b/src/packages/badge/demos/h5/demo1.tsx index 8e542d0e10..f627259e76 100644 --- a/src/packages/badge/demos/h5/demo1.tsx +++ b/src/packages/badge/demos/h5/demo1.tsx @@ -1,23 +1,51 @@ -import { User } from '@nutui/icons-react' +import { Dongdong, User } from '@nutui/icons-react' import { Avatar, Badge, Cell } from '@nutui/nutui-react' import React from 'react' const Demo1 = () => { + const renderText = () => { + return ( + + 文字内容 + + ) + } return ( - - - } shape="square" /> - - - } shape="square" /> - - - } shape="square" /> - - - } shape="square" /> - - + <> + + {renderText()} + + + + + } shape="square" /> + + + + {renderText()} + + + + + } shape="square" /> + + + + + {renderText()} + + + + + + } shape="square" /> + + + ) } export default Demo1 diff --git a/src/packages/badge/demos/h5/demo2.tsx b/src/packages/badge/demos/h5/demo2.tsx index 12d6101cf3..b7e93fdf47 100644 --- a/src/packages/badge/demos/h5/demo2.tsx +++ b/src/packages/badge/demos/h5/demo2.tsx @@ -4,14 +4,14 @@ import { User } from '@nutui/icons-react' const Demo2 = () => { return ( - - + + } shape="square" /> - + } shape="square" /> - + } shape="square" /> diff --git a/src/packages/badge/demos/h5/demo3.tsx b/src/packages/badge/demos/h5/demo3.tsx index e173df2f4d..d6be8764c5 100644 --- a/src/packages/badge/demos/h5/demo3.tsx +++ b/src/packages/badge/demos/h5/demo3.tsx @@ -4,34 +4,31 @@ import { User } from '@nutui/icons-react' const Demo3 = () => { return ( - + - } shape="square" /> - - } shape="square" /> } shape="square" /> } shape="square" /> diff --git a/src/packages/badge/demos/h5/demo4.tsx b/src/packages/badge/demos/h5/demo4.tsx index 38eb81691b..29b41b1695 100644 --- a/src/packages/badge/demos/h5/demo4.tsx +++ b/src/packages/badge/demos/h5/demo4.tsx @@ -4,23 +4,14 @@ import { User, Checklist, Link as LinkIcon, Download } from '@nutui/icons-react' const Demo4 = () => { return ( - - } - > + + }> } shape="square" /> - } - > + }> } shape="square" /> - } - > + }> } shape="square" /> diff --git a/src/packages/badge/demos/h5/demo5.tsx b/src/packages/badge/demos/h5/demo5.tsx index 034634ddd4..02114f4892 100644 --- a/src/packages/badge/demos/h5/demo5.tsx +++ b/src/packages/badge/demos/h5/demo5.tsx @@ -6,23 +6,17 @@ const customTheme = { nutuiBadgeBorderRadius: '12px 12px 12px 0', } -const customTheme2 = { - nutuiBadgeDotWidth: '14px', - nutuiBadgeDotHeight: '14px', - nutuiBadgeBorder: '2px solid #fff', -} - const Demo5 = () => { return ( - + + + } shape="square" /> + + + } shape="square" /> + - - } shape="square" /> - - - - - + } shape="square" /> diff --git a/src/packages/badge/demos/h5/demo6.tsx b/src/packages/badge/demos/h5/demo6.tsx index c933a73c3a..66f7e37bbe 100644 --- a/src/packages/badge/demos/h5/demo6.tsx +++ b/src/packages/badge/demos/h5/demo6.tsx @@ -4,15 +4,15 @@ import React from 'react' const Demo6 = () => { return ( - - - } shape="square" /> + + + } /> - - } shape="square" /> + + } /> - - } shape="square" /> + + } /> ) diff --git a/src/packages/badge/demos/h5/demo7.tsx b/src/packages/badge/demos/h5/demo7.tsx index d8b63f6d54..7ec29a60e7 100644 --- a/src/packages/badge/demos/h5/demo7.tsx +++ b/src/packages/badge/demos/h5/demo7.tsx @@ -3,10 +3,10 @@ import React from 'react' const Demo7 = () => { return ( - - - - + + + + ) } diff --git a/src/packages/badge/demos/h5/demo8.tsx b/src/packages/badge/demos/h5/demo8.tsx index 6124b11036..548d9b12dc 100644 --- a/src/packages/badge/demos/h5/demo8.tsx +++ b/src/packages/badge/demos/h5/demo8.tsx @@ -4,18 +4,20 @@ import React from 'react' const Demo8 = () => { return ( - - + + } shape="square" /> - + } shape="square" /> } shape="square" /> diff --git a/src/packages/badge/demos/taro/demo1.tsx b/src/packages/badge/demos/taro/demo1.tsx index 7f51d295ee..cdb42f65e3 100644 --- a/src/packages/badge/demos/taro/demo1.tsx +++ b/src/packages/badge/demos/taro/demo1.tsx @@ -1,32 +1,53 @@ -import { User } from '@nutui/icons-react-taro' -import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' import React from 'react' +import { Dongdong, User } from '@nutui/icons-react-taro' +import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' +import { Text } from '@tarojs/components' import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo1 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> + const renderText = () => { + return ( + + 文字内容 + + ) } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - {renderChildren()} - - - {renderChildren()} - - - {renderChildren()} - - - {renderChildren()} - - + <> + + {renderText()} + + + + + } shape="square" /> + + + + {renderText()} + + + + + } shape="square" /> + + + + + {renderText()} + + + + + + } shape="square" /> + + + ) } export default Demo1 diff --git a/src/packages/badge/demos/taro/demo2.tsx b/src/packages/badge/demos/taro/demo2.tsx index 1bb5941275..2764308982 100644 --- a/src/packages/badge/demos/taro/demo2.tsx +++ b/src/packages/badge/demos/taro/demo2.tsx @@ -1,27 +1,18 @@ +import React from 'react' import { User } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' -import React from 'react' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo2 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - {renderChildren()} + + + } shape="square" /> - - {renderChildren()} + + } shape="square" /> - - {renderChildren()} + + } shape="square" /> ) diff --git a/src/packages/badge/demos/taro/demo3.tsx b/src/packages/badge/demos/taro/demo3.tsx index 1eafbbf3f6..4148dbb84c 100644 --- a/src/packages/badge/demos/taro/demo3.tsx +++ b/src/packages/badge/demos/taro/demo3.tsx @@ -1,36 +1,36 @@ +import React from 'react' import { User } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' -import React from 'react' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo3 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - {renderChildren()} - - - {renderChildren()} + + + } shape="square" /> - - {renderChildren()} + + } shape="square" /> - {renderChildren()} + } shape="square" /> ) diff --git a/src/packages/badge/demos/taro/demo4.tsx b/src/packages/badge/demos/taro/demo4.tsx index e52bf7a2cd..fd4442e772 100644 --- a/src/packages/badge/demos/taro/demo4.tsx +++ b/src/packages/badge/demos/taro/demo4.tsx @@ -1,46 +1,19 @@ -import { Checklist, User } from '@nutui/icons-react-taro' -import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' import React from 'react' -import { Icon } from '@tarojs/components' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' +import { Checklist, User, Dongdong, Download } from '@nutui/icons-react-taro' +import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' const Demo4 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } - const renderIcon = () => { - return ( - <> - {isRnAndHarmony ? ( - - ) : ( - - )} - - ) - } return ( - - - {renderChildren()} + + }> + } shape="square" /> + + }> + } shape="square" /> - {/* } - > - {renderChildren()} + }> + } shape="square" /> - } - > - {renderChildren()} - */} ) } diff --git a/src/packages/badge/demos/taro/demo5.tsx b/src/packages/badge/demos/taro/demo5.tsx index 1bab589954..06feb167d1 100644 --- a/src/packages/badge/demos/taro/demo5.tsx +++ b/src/packages/badge/demos/taro/demo5.tsx @@ -1,38 +1,24 @@ +import React from 'react' import { User } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell, ConfigProvider } from '@nutui/nutui-react-taro' -import React from 'react' import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const customTheme = { nutuiBadgeBorderRadius: `${pxTransform(12)} ${pxTransform(12)} ${pxTransform(12)} 0`, } -const customTheme2 = { - nutuiBadgeDotWidth: pxTransform(14), - nutuiBadgeDotHeight: pxTransform(14), - nutuiBadgeBorder: `${pxTransform(2)} solid #000`, -} - const Demo5 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - + + + } shape="square" /> + + + } shape="square" /> + - - {renderChildren()} - - - - - - {renderChildren()} + + } shape="square" /> diff --git a/src/packages/badge/demos/taro/demo6.tsx b/src/packages/badge/demos/taro/demo6.tsx index bfaf5b92ea..a245e37280 100644 --- a/src/packages/badge/demos/taro/demo6.tsx +++ b/src/packages/badge/demos/taro/demo6.tsx @@ -1,27 +1,18 @@ import { User } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' import React from 'react' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo6 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - {renderChildren()} + + + } /> - - {renderChildren()} + + } /> - - {renderChildren()} + + } /> ) diff --git a/src/packages/badge/demos/taro/demo7.tsx b/src/packages/badge/demos/taro/demo7.tsx index 2aecef14b1..089388c9ae 100644 --- a/src/packages/badge/demos/taro/demo7.tsx +++ b/src/packages/badge/demos/taro/demo7.tsx @@ -1,18 +1,12 @@ import React from 'react' import { Badge, Cell } from '@nutui/nutui-react-taro' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo7 = () => { - const isRnAndHarmony = harmonyAndRn() - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - - + + + + ) } diff --git a/src/packages/badge/demos/taro/demo8.tsx b/src/packages/badge/demos/taro/demo8.tsx index 75f1be594f..48bfc0d3c5 100644 --- a/src/packages/badge/demos/taro/demo8.tsx +++ b/src/packages/badge/demos/taro/demo8.tsx @@ -1,27 +1,25 @@ +import React from 'react' import { User } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' -import React from 'react' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo8 = () => { - const isRnAndHarmony = harmonyAndRn() - const renderChildren = () => { - return } shape="square" /> - } - const marginStyles = isRnAndHarmony - ? { marginRight: pxTransform(40) } - : { marginInlineEnd: '40px' } return ( - - - {renderChildren()} + + + } shape="square" /> - - {renderChildren()} + + } shape="square" /> - - {renderChildren()} + + } shape="square" /> ) diff --git a/src/packages/badge/doc.en-US.md b/src/packages/badge/doc.en-US.md index 90f1f32589..ca72b96ac2 100644 --- a/src/packages/badge/doc.en-US.md +++ b/src/packages/badge/doc.en-US.md @@ -83,9 +83,10 @@ import { Badge } from '@nutui/nutui-react' | value | value to show, eg number、charctor and custom content | `ReactNode` | `-` | | max | when value is number, it's the max size | `number` | `99` | | dot | Is dotted, When `value` is a custom content, dot does not take effect | `boolean` | `false` | -| top | Up and down offset, support unit setting, can be set to: "0" or 0, etc. | `string` \| `number` | `"0"` | -| right | Left and right offset, support unit setting, can be set to: "5" or 5, etc. | `string` \| `number` | `"5"` | -| color | background color,the default value is the theme primary color | `string` | `-` | + +| size | dot size, effective when dot is equal to `true` | `small` \| `normal` \| `large` | `large` | +| top | Up and down offset, can be set to: "0" or 0, etc. | `string` \| `number` | `0` | +| right | Left and right offset, can be set to: "0" or 0, etc. | `string` \| `number` | `0` | | fill | Fill Mode | `solid` \| `outline` | `solid` | ## Theming @@ -96,17 +97,21 @@ The component provides the following CSS variables, which can be used to customi | Name | Description | Default | | --- | --- | --- | -| \--nutui-badge-height | badge height | `14px` | -| \--nutui-badge-background-color | badge background color | `linear-gradient(135deg, $color-primary 0%, $color-primary-stop-2 100%))` | -| \--nutui-badge-color | badge content color | `#fff` | -| \--nutui-badge-font-size | badge content font size | `$font-size-s` | -| \--nutui-badge-border | badge border | `0px solid $color-primary-text` | -| \--nutui-badge-border-radius | badge border-radius | `14px` | -| \--nutui-badge-min-width | badge min-width | `5px` | -| \--nutui-badge-padding | badge padding value | `0 5px` | -| \--nutui-badge-icon-padding | when badge is icon,badge padding | `2px` | -| \--nutui-badge-icon-size | when badge is icon,badge size | `12px` | -| \--nutui-badge-content-transform | badge content transform | `translateY(-50%) translateX(100%)` | -| \--nutui-badge-z-index | when badge is icon, badge z-index | `1` | -| \--nutui-badge-dot-width | when badge is dot, the dot width,height and border radius | `7px` | -| \--nutui-badge-dot-border | when badge is dot, the dot border | `0px solid $color-primary-text` | +| \--nutui-badge-height | The height of the badge | `14px` | +| \--nutui-badge-background-color | badge background color | `$color-primary` | +| \--nutui-badge-color | badge content color value | `$color-primary-text)` | +| \--nutui-badge-font-size | badge content font size | `$font-size-xxs` | +| \--nutui-badge-border | badge border | `1px solid $color-primary-text` | +| \--nutui-badge-border-radius | badge border rounded corners | `14px` | +| \--nutui-badge-min-width | badge minimum width | `6px` | +| \--nutui-badge-padding | badge’s padding value | `1px 4px` | +| \--nutui-badge-icon-padding | The padding value when badge is a custom icon | `2px` | +| \--nutui-badge-icon-size | The size of badge when it is a custom icon | `10px` | +| \--nutui-badge-content-transform | badge content position | `translate(50%, -50%)` | +| \--nutui-badge-z-index | badge z-index when customizing the icon | `1` | +| \--nutui-badge-dot-width | When the badge is a dot, the size is equal to the width and height of normal | `6px` | +| \--nutui-badge-dot-small-width | When badge is a dot, size is equal to the width and height of small | `4px` | +| \--nutui-badge-dot-large-width | When the badge is a dot, size is equal to the width and height of large | `8px` | +| \--nutui-badge-dot-border | The border when the badge is a dot | `1px solid $color-primary-text` | +| \--nutui-badge-outline-color | The border when badge is outline text color value | `$color-primary` | +| \--nutui-badge-outline-border | The border when badge is outline fill mode | `1px solid $color-primary-text` | diff --git a/src/packages/badge/doc.md b/src/packages/badge/doc.md index a6643dfebb..17d94c954c 100644 --- a/src/packages/badge/doc.md +++ b/src/packages/badge/doc.md @@ -83,9 +83,9 @@ import { Badge } from '@nutui/nutui-react' | value | 显示的内容，支持数字、字符和自定义内容 | `ReactNode` | `-` | | max | value 为数值时，最大值 | `number` | `99` | | dot | 是否为小点，当`value`值为自定义内容时，dot不生效 | `boolean` | `false` | -| top | 上下偏移量，支持单位设置，可设置为："0"或0 等 | `string` \| `number` | `"0"` | -| right | 左右偏移量，支持单位设置，可设置为："5"或5 等 | `string` \| `number` | `"5"` | -| color | 徽标背景颜色,默认值为当前主题色 | `string` | `-` | +| size | dot 尺寸，当 dot 等于 `true` 时生效 | `small` \| `normal` \| `large` | `large` | +| top | 上下偏移量，可设置为："0"或0 等 | `string` \| `number` | `0` | +| right | 左右偏移量，可设置为："0"或0 等 | `string` \| `number` | `0` | | fill | 填充模式 | `solid` \| `outline` | `solid` | ## 主题定制 @@ -97,16 +97,20 @@ import { Badge } from '@nutui/nutui-react' | 名称 | 说明 | 默认值 | | --- | --- | --- | | \--nutui-badge-height | badge 的高度 | `14px` | -| \--nutui-badge-background-color | badge 背景色 | `linear-gradient(135deg, $color-primary 0%, $color-primary-stop-2 100%))` | -| \--nutui-badge-color | badge 内容色值 | `#fff` | -| \--nutui-badge-font-size | badge 内容字号 | `$font-size-s` | -| \--nutui-badge-border | badge 边框 | `0px solid $color-primary-text` | +| \--nutui-badge-background-color | badge 背景色 | `$color-primary` | +| \--nutui-badge-color | badge 内容色值 | `$color-primary-text` | +| \--nutui-badge-font-size | badge 内容字号 | `$font-size-xxs` | +| \--nutui-badge-border | badge 边框 | `1px solid $color-primary-text` | | \--nutui-badge-border-radius | badge 边框圆角 | `14px` | -| \--nutui-badge-min-width | badge 最小宽度 | `5px` | -| \--nutui-badge-padding | badge 的padding值 | `0 5px` | +| \--nutui-badge-min-width | badge 最小宽度 | `6px` | +| \--nutui-badge-padding | badge 的padding值 | `1px 4px` | | \--nutui-badge-icon-padding | badge 为自定义icon时 的 padding值 | `2px` | -| \--nutui-badge-icon-size | badge 为自定义icon时 的 size | `12px` | -| \--nutui-badge-content-transform | badge 内容位置 | `translateY(-50%) translateX(100%)` | +| \--nutui-badge-icon-size | badge 为自定义icon时 的 size | `10px` | +| \--nutui-badge-content-transform | badge 内容位置 | `translate(50%, -50%)` | | \--nutui-badge-z-index | badge 自定义icon时的z-index | `1` | -| \--nutui-badge-dot-width | badge 为圆点时的宽度、高度、圆角 | `7px` | -| \--nutui-badge-dot-border | badge 为圆点时的边框 | `0px solid $color-primary-text` | +| \--nutui-badge-dot-width | badge 为圆点时，size 等于 normal 的宽高 | `6px` | +| \--nutui-badge-dot-small-width | badge 为圆点时，size 等于 small 的宽高 | `4px` | +| \--nutui-badge-dot-large-width | badge 为圆点时，size 等于 large 的宽高 | `8px` | +| \--nutui-badge-dot-border | badge 为圆点时的边框 | `1px solid $color-primary-text` | +| \--nutui-badge-outline-color | badge 为 outline 文字色值 | `$color-primary` | +| \--nutui-badge-outline-border | badge 为 outline 填充模式时的边框 | `1px solid $color-primary-text` | diff --git a/src/packages/badge/doc.taro.md b/src/packages/badge/doc.taro.md index c1eb009cb6..c7aaed3911 100644 --- a/src/packages/badge/doc.taro.md +++ b/src/packages/badge/doc.taro.md @@ -83,9 +83,9 @@ import { Badge } from '@nutui/nutui-react-taro' | value | 显示的内容，支持数字、字符和自定义内容 | `ReactNode` | `-` | | max | value 为数值时，最大值 | `number` | `99` | | dot | 是否为小点，当`value`值为自定义内容时，dot不生效 | `boolean` | `false` | -| top | 上下偏移量，支持单位设置，可设置为："0"或0 等 | `string` \| `number` | `"0"` | -| right | 左右偏移量，支持单位设置，可设置为："5"或5 等 | `string` \| `number` | `"5"` | -| color | 徽标背景颜色 | `string` | `-` | +| size | dot 尺寸，当 dot 等于 `true` 时生效 | `small` \| `normal` \| `large` | `large` | +| top | 上下偏移量，可设置为："0"或0 等 | `string` \| `number` | `"0"` | +| right | 左右偏移量，可设置为："0"或0 等 | `string` \| `number` | `"0"` | | fill | 填充模式 | `solid` \| `outline` | `solid` | ## 主题定制 @@ -97,16 +97,20 @@ import { Badge } from '@nutui/nutui-react-taro' | 名称 | 说明 | 默认值 | | --- | --- | --- | | \--nutui-badge-height | badge 的高度 | `14px` | -| \--nutui-badge-background-color | badge 背景色 | `linear-gradient(135deg, $color-primary 0%, $color-primary-stop-2 100%))` | -| \--nutui-badge-color | badge 内容色值 | `#fff` | -| \--nutui-badge-font-size | badge 内容字号 | `$font-size-s` | -| \--nutui-badge-border | badge 边框 | `0px solid $color-primary-text` | +| \--nutui-badge-background-color | badge 背景色 | `$color-primary` | +| \--nutui-badge-color | badge 内容色值 | `$color-primary-text` | +| \--nutui-badge-font-size | badge 内容字号 | `$font-size-xxs` | +| \--nutui-badge-border | badge 边框 | `1px solid $color-primary-text` | | \--nutui-badge-border-radius | badge 边框圆角 | `14px` | -| \--nutui-badge-min-width | badge 最小宽度 | `5px` | -| \--nutui-badge-padding | badge 的padding值 | `0 5px` | +| \--nutui-badge-min-width | badge 最小宽度 | `6px` | +| \--nutui-badge-padding | badge 的padding值 | `1px 4px` | | \--nutui-badge-icon-padding | badge 为自定义icon时 的 padding值 | `2px` | -| \--nutui-badge-icon-size | badge 为自定义icon时 的 size | `12px` | -| \--nutui-badge-content-transform | badge 内容位置 | `translateY(-50%) translateX(100%)` | +| \--nutui-badge-icon-size | badge 为自定义icon时 的 size | `10px` | +| \--nutui-badge-content-transform | badge 内容位置 | `translate(50%, -50%)` | | \--nutui-badge-z-index | badge 自定义icon时的z-index | `1` | -| \--nutui-badge-dot-width | badge 为圆点时的宽度、高度、圆角 | `7px` | -| \--nutui-badge-dot-border | badge 为圆点时的边框 | `0px solid $color-primary-text` | +| \--nutui-badge-dot-width | badge 为圆点时，size 等于 normal 的宽高 | `6px` | +| \--nutui-badge-dot-small-width | badge 为圆点时，size 等于 small 的宽高 | `4px` | +| \--nutui-badge-dot-large-width | badge 为圆点时，size 等于 large 的宽高 | `8px` | +| \--nutui-badge-dot-border | badge 为圆点时的边框 | `1px solid $color-primary-text` | +| \--nutui-badge-outline-color | badge 为 outline 文字色值 | `$color-primary` | +| \--nutui-badge-outline-border | badge 为 outline 填充模式时的边框 | `1px solid $color-primary-text` | diff --git a/src/packages/badge/doc.zh-TW.md b/src/packages/badge/doc.zh-TW.md index 8637392947..947d9ef103 100644 --- a/src/packages/badge/doc.zh-TW.md +++ b/src/packages/badge/doc.zh-TW.md @@ -83,9 +83,9 @@ import { Badge } from '@nutui/nutui-react' | value | 顯示的內容，支持數字、字符和自定義內容 | `ReactNode` | `-` | | max | value 為數值時，最大值 | `number` | `99` | | dot | 是否為小點，當`value`值為自定義內容時，dot不生效 | `boolean` | `false` | -| top | 上下偏移量，支持單位設置，可設置為："0"或0 等 | `string` \| `number` | `"0"` | -| right | 左右偏移量，支持單位設置，可設置為："5"或5 等 | `string` \| `number` | `"5"` | -| color | 徽標背景顏色,默認值為當前主題色 | `string` | `-` | +| size | dot 尺寸，當 dot 等於 `true` 時生效 | `small` \| `normal` \| `large` | `large` | +| top | 上下偏移量，可設置為："0"或0 等 | `string` \| `number` | `0` | +| right | 左右偏移量，可設置為："0"或0 等 | `string` \| `number` | `0` | | fill | 填充模式 | `solid` \| `outline` | `solid` | ## 主題定制 @@ -97,16 +97,20 @@ import { Badge } from '@nutui/nutui-react' | 名稱 | 說明 | 默認值 | | --- | --- | --- | | \--nutui-badge-height | badge 的高度 | `14px` | -| \--nutui-badge-background-color | badge 背景色 | `linear-gradient(135deg, $color-primary 0%, $color-primary-stop-2 100%))` | -| \--nutui-badge-color | badge 內容色值 | `#fff` | -| \--nutui-badge-font-size | badge 內容字號 | `$font-size-s` | -| \--nutui-badge-border | badge 邊框 | `0px solid $color-primary-text` | +| \--nutui-badge-background-color | badge 背景色 | `$color-primary` | +| \--nutui-badge-color | badge 內容色值 | `$color-primary-text)` | +| \--nutui-badge-font-size | badge 內容字號 | `$font-size-xxs` | +| \--nutui-badge-border | badge 邊框 | `1px solid $color-primary-text` | | \--nutui-badge-border-radius | badge 邊框圓角 | `14px` | -| \--nutui-badge-min-width | badge 最小寬度 | `5px` | -| \--nutui-badge-padding | badge 的padding值 | `0 5px` | +| \--nutui-badge-min-width | badge 最小寬度 | `6px` | +| \--nutui-badge-padding | badge 的padding值 | `1px 4px` | | \--nutui-badge-icon-padding | badge 為自定義icon時 的 padding值 | `2px` | -| \--nutui-badge-icon-size | badge 為自定義icon時 的 size | `12px` | -| \--nutui-badge-content-transform | badge 內容位置 | `translateY(-50%) translateX(100%)` | +| \--nutui-badge-icon-size | badge 為自定義icon時 的 size | `10px` | +| \--nutui-badge-content-transform | badge 內容位置 | `translate(50%, -50%)` | | \--nutui-badge-z-index | badge 自定義icon時的z-index | `1` | -| \--nutui-badge-dot-width | badge 為圓點時的寬度、高度、圓角 | `7px` | -| \--nutui-badge-dot-border | badge 為圓點時的邊框 | `0px solid $color-primary-text` | +| \--nutui-badge-dot-width | badge 為圓點時，size 等於 normal 的寬高 | `6px` | +| \--nutui-badge-dot-small-width | badge 為圓點時，size 等於 small 的寬高 | `4px` | +| \--nutui-badge-dot-large-width | badge 為圓點時，size 等於 large 的寬高 | `8px` | +| \--nutui-badge-dot-border | badge 為圓點時的邊框 | `1px solid $color-primary-text` | +| \--nutui-badge-outline-color | badge 為 outline 文字色值 | `$color-primary` | +| \--nutui-badge-outline-border | badge 為 outline 填充模式時的邊框 | `1px solid $color-primary-text` | diff --git a/src/packages/badge/index.taro.ts b/src/packages/badge/index.taro.ts index 3191faeb66..3ce5d6af76 100644 --- a/src/packages/badge/index.taro.ts +++ b/src/packages/badge/index.taro.ts @@ -1,4 +1,4 @@ import { Badge } from './badge.taro' -export type { BadgeFill, BadgeProps } from './badge.taro' +export type { BadgeFill, BadgeDotSize, BadgeProps } from './types' export default Badge diff --git a/src/packages/badge/index.ts b/src/packages/badge/index.ts index 89062c5a6d..77131479f3 100644 --- a/src/packages/badge/index.ts +++ b/src/packages/badge/index.ts @@ -1,4 +1,4 @@ import { Badge } from './badge' -export type { BadgeFill, BadgeProps } from './badge' +export type { BadgeFill, BadgeDotSize, BadgeProps } from './types' export default Badge diff --git a/src/packages/badge/types.ts b/src/packages/badge/types.ts new file mode 100644 index 0000000000..473b24078d --- /dev/null +++ b/src/packages/badge/types.ts @@ -0,0 +1,14 @@ +import { BasicComponent } from '@/utils/typings' + +export type BadgeFill = 'solid' | 'outline' +export type BadgeDotSize = 'small' | 'normal' | 'large' + +export interface BadgeProps extends BasicComponent { + value: React.ReactNode + dot: boolean + max: number + top: string | number + right: string | number + fill: BadgeFill + size: BadgeDotSize +} diff --git a/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap b/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap index 2c1b62f27f..e09c341b1f 100644 --- a/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap +++ b/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap @@ -1,5 +1,5 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`should only render title 1`] = `"
首页
11
分类
发现
"`; +exports[`should only render title 1`] = `"
首页
11
分类
发现
"`; exports[`should render fixed element when using bottom prop 1`] = `"
首页
分类
"`; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index e995510c55..1c573916cc 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -1602,26 +1602,33 @@ $tag-mark-border-radius: var( $badge-height: var(--nutui-badge-height, 14px) !default; $badge-background-color: var( --nutui-badge-background-color, - $color-primary-gradient-1 + $color-primary ) !default; -$badge-color: var(--nutui-badge-color, #fff) !default; +$badge-color: var(--nutui-badge-color, $color-primary-text) !default; $badge-font-size: var(--nutui-badge-font-size, $font-size-xxs) !default; $badge-border: var( --nutui-badge-border, - 0px solid $color-primary-text + 1px solid $color-primary-text ) !default; $badge-border-radius: var(--nutui-badge-border-radius, $badge-height) !default; -$badge-min-width: var(--nutui-badge-min-width, 5px) !default; -$badge-padding: var(--nutui-badge-padding, 0 4px) !default; -$badge-icon-padding: var(--nutui-badge-icon-padding, 3px) !default; -$badge-icon-size: var(--nutui-badge-icon-size, 12px) !default; +$badge-min-width: var(--nutui-badge-min-width, 6px) !default; +$badge-padding: var(--nutui-badge-padding, 1px 4px) !default; +$badge-icon-padding: var(--nutui-badge-icon-padding, 2px) !default; +$badge-icon-size: var(--nutui-badge-icon-size, 10px) !default; $badge-content-transform: var( --nutui-badge-content-transform, - translateX(100%) + translate(50%, -50%) ) !default; $badge-z-index: var(--nutui-badge-z-index, 1) !default; -$badge-dot-width: var(--nutui-badge-dot-width, 7px) !default; -$badge-dot-border: var(--nutui-badge-dot-border, 0px solid $color-primary-text); +$badge-dot-width: var(--nutui-badge-dot-width, 6px) !default; +$badge-dot-small-width: var(--nutui-badge-dot-width, 4px) !default; +$badge-dot-large-width: var(--nutui-badge-dot-width, 8px) !default; +$badge-dot-border: var(--nutui-badge-dot-border, 1px solid $color-primary-text); +$badge-outline-color: var(--nutui-badge-outline-color, $color-primary) !default; +$badge-outline-border: var( + --nutui-badge-outline-border, + 1px solid $color-primary +); //popover（✅） $popover-border-radius: var(--nutui-popover-border-radius, 8px) !default; From 42b3e5361956ba21e93389c5ce1210ae0f69a02e Mon Sep 17 00:00:00 2001 From: xiaoyatong <84436086+xiaoyatong@users.noreply.github.com> Date: Fri, 20 Dec 2024 20:06:34 +0800 Subject: [PATCH 03/19] feat(Backtop): refactor backtop using hoverbutton and v15 adaption (#2866) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * refactor: use hoverbutton * fix: 鸿蒙下露出 * test: fixed * test: add tests * feat: 支持 icon * fix: lint ts * test: update case --------- Co-authored-by: oasis --- migrate-from-v2.md | 7 +- src/config.json | 1 + .../__snapshots__/backtop.spec.tsx.snap | 43 ++++++------ .../backtop/__test__/backtop.spec.tsx | 53 +++++++++------ src/packages/backtop/backtop.scss | 25 +++---- src/packages/backtop/backtop.taro.tsx | 68 +++++++------------ src/packages/backtop/backtop.tsx | 42 ++++++------ src/packages/backtop/demo.taro.tsx | 29 +++----- src/packages/backtop/demo.tsx | 6 +- src/packages/backtop/demos/h5/demo1.tsx | 4 +- src/packages/backtop/demos/h5/demo2.tsx | 4 +- src/packages/backtop/demos/h5/demo3.tsx | 18 ++--- src/packages/backtop/demos/h5/demo4.tsx | 4 +- src/packages/backtop/demos/h5/demo5.tsx | 28 ++------ src/packages/backtop/demos/taro/demo1.tsx | 25 +------ src/packages/backtop/demos/taro/demo2.tsx | 5 +- src/packages/backtop/demos/taro/demo3.tsx | 16 ++--- src/packages/backtop/demos/taro/demo4.tsx | 30 +------- src/packages/backtop/demos/taro/demo5.tsx | 63 ++++------------- src/packages/hoverbutton/demos/taro/demo4.tsx | 1 - .../hoverbuttonitem/hoverbuttonitem.scss | 6 +- src/styles/variables.scss | 7 +- 22 files changed, 172 insertions(+), 313 deletions(-) diff --git a/migrate-from-v2.md b/migrate-from-v2.md index 95e11099a3..b16fc20d68 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -562,10 +562,9 @@ plugins: [ #### BackTop -- `elId` 重命名为 `target` -- 移除 `right`、`bottom`，通过 style 传入，增加支持 `left`、`top` -- `distance` 重命名为 `threshold` -- 移除 `isAnimation`，通过 `duration` 设置 0 实现无动画效果 +- 使用 `HoverButton` 重构 `BackTop` +- 新增 `icon` 字段，可直接修改图标 +- 继续支持自定义节点 #### Dialog diff --git a/src/config.json b/src/config.json index 2ca7625731..db596b002d 100644 --- a/src/config.json +++ b/src/config.json @@ -274,6 +274,7 @@ "tarodoc": true, "show": true, "taro": true, + "v15": true, "author": "vickyYe" }, { diff --git a/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap b/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap index e5d4163b07..7111d44f28 100644 --- a/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap +++ b/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap @@ -3,33 +3,38 @@ exports[`backtop custom test 1`] = `
- - -
- 顶部 + + + +
+ 顶部 +
+
`; diff --git a/src/packages/backtop/__test__/backtop.spec.tsx b/src/packages/backtop/__test__/backtop.spec.tsx index 0aec865738..c4e8169553 100644 --- a/src/packages/backtop/__test__/backtop.spec.tsx +++ b/src/packages/backtop/__test__/backtop.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import '@testing-library/jest-dom' import { Top } from '@nutui/icons-react' -import { render, fireEvent } from '@testing-library/react' +import { act, fireEvent, render, waitFor } from '@testing-library/react' import BackTop from '@/packages/backtop' test('backtop props test', () => { @@ -37,31 +37,46 @@ test('backtop custom test', () => { }} onClick={handleClick} > -
- -
顶部
-
+ +
顶部
) expect(container.querySelector('.nut-backtop')).toHaveAttribute( 'style', 'z-index: 900; bottom: 110px; right: 10px;' ) - expect(container.querySelector('.backtop-demo')).toHaveAttribute( - 'style', - 'display: flex; flex-direction: column; align-items: center;' - ) - expect(container.querySelector('.nut-icon-Top')).toHaveClass( - 'nut-backtop-main' - ) fireEvent.click(container) expect(handleClick).toBeCalled expect(container).toMatchSnapshot() }) + +test('scroll', async () => { + const { container } = render( +
+ {new Array(24).fill(0).map((_, index) => { + return ( +
+ 我是测试数据{index} +
+ ) + })} + +
+ ) + const track = container.querySelector('.backtop-wrapper') + const element18 = container.querySelectorAll( + '.nut-hoverbutton-item-container' + )[0] + const element19 = container.querySelectorAll('.nut-hoverbutton-container')[0] + if (track) { + track.scrollTo = vi.fn() + track.scrollTop = 200 + act(() => { + track.dispatchEvent(new Event('scroll')) + }) + await waitFor(() => { + expect(element19).toHaveClass('nut-backtop-show') + }) + fireEvent.click(element18 as Element) + } +}) diff --git a/src/packages/backtop/backtop.scss b/src/packages/backtop/backtop.scss index 685e3b5089..91341391b2 100644 --- a/src/packages/backtop/backtop.scss +++ b/src/packages/backtop/backtop.scss @@ -1,31 +1,22 @@ .nut-backtop { display: none; - position: fixed; &-rn { position: absolute; } &-show { - width: 40px; - height: 40px; display: flex; align-items: center; justify-content: center; - background: $color-background-overlay; - color: $color-title; - border: 1px solid $backtop-border-color; - border-radius: 21px; - z-index: 100; - - &:active, - &-active { - background: $color-background; - } - } - - &-main { + width: $hoverbutton-item-size; + height: $hoverbutton-item-size; transition: all 0.2s ease-in-out; - color: $color-title; + .nut-hoverbutton-item-container { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + } } } diff --git a/src/packages/backtop/backtop.taro.tsx b/src/packages/backtop/backtop.taro.tsx index ed3342aa6c..6caea1359f 100644 --- a/src/packages/backtop/backtop.taro.tsx +++ b/src/packages/backtop/backtop.taro.tsx @@ -2,7 +2,6 @@ import React, { FunctionComponent, useCallback, useState, - useMemo, useEffect, useRef, } from 'react' @@ -13,15 +12,16 @@ import { PageScrollObject, getSystemInfo, } from '@tarojs/taro' -import { View, ITouchEvent } from '@tarojs/components' -import { Top } from '@nutui/icons-react-taro' +import { ITouchEvent, View } from '@tarojs/components' import classNames from 'classnames' -import { BasicComponent, ComponentDefaults } from '@/utils/typings' -import { useRtl } from '@/packages/configprovider/index.taro' -import { harmonyAndRn, rn } from '@/utils/platform-taro' -import pxTransform from '@/utils/px-transform' +import { Top } from '@nutui/icons-react-taro' +import { ComponentDefaults } from '@/utils/typings' +import HoverButton, { + HoverButtonProps, +} from '@/packages/hoverbutton/index.taro' +import { rn } from '@/utils/platform-taro' -export interface BackTopProps extends BasicComponent { +export interface BackTopProps extends HoverButtonProps { threshold: number zIndex: number duration: number @@ -29,7 +29,7 @@ export interface BackTopProps extends BasicComponent { * 容器滚动时的回调参数，主要用于 rn、鸿蒙端 */ scrollRes?: PageScrollObject - onClick?: (event: React.MouseEvent | ITouchEvent) => void + onClick?: (event: React.MouseEvent | ITouchEvent) => void } const defaultProps = { @@ -39,18 +39,16 @@ const defaultProps = { duration: 1000, } as BackTopProps -const isNative = harmonyAndRn() - export const BackTop: FunctionComponent< Partial & Omit, 'onClick'> > = (props) => { - const rtl = useRtl() const { children, threshold, zIndex, className, duration, + icon, style, scrollRes, onClick, @@ -60,12 +58,10 @@ export const BackTop: FunctionComponent< } const classPrefix = 'nut-backtop' const [backTop, setBackTop] = useState(false) - const [isTouchStart, setTouchStart] = useState(false) const cls = classNames( classPrefix, { [`${classPrefix}-show`]: backTop, - [`${classPrefix}-show-active`]: isNative && isTouchStart, [`${classPrefix}-rn`]: rn(), }, className @@ -77,14 +73,6 @@ export const BackTop: FunctionComponent< }) }, []) - const handleActiveStart = useCallback(() => { - isNative && setTouchStart(true) - }, []) - - const handleActiveEnd = useCallback(() => { - isNative && setTouchStart(false) - }, []) - const onScroll = useCallback( (res: PageScrollObject) => { const { scrollTop } = res @@ -103,7 +91,7 @@ export const BackTop: FunctionComponent< // 返回顶部点击事件 const goTop = useCallback( - (e: React.MouseEvent | ITouchEvent) => { + (e: MouseEvent | ITouchEvent) => { onClick?.(e) pageScrollTo({ scrollTop: 0, @@ -113,32 +101,26 @@ export const BackTop: FunctionComponent< [duration, onClick] ) - const styles = useMemo(() => { - return Object.keys(style || {}).length !== 0 - ? { - zIndex, - ...style, - } - : { - [rtl ? 'left' : 'right']: pxTransform(10), - bottom: pxTransform(20), - zIndex, - } - }, [rtl, style, zIndex]) - return ( - )} onClick={(e) => { goTop(e) }} - onTouchStart={handleActiveStart} - onTouchEnd={handleActiveEnd} - onTouchCancel={handleActiveEnd} > - {children || } - + {children && ( + { + goTop(e) + }} + > + {children} + + )} + ) } diff --git a/src/packages/backtop/backtop.tsx b/src/packages/backtop/backtop.tsx index 97fa3edbd4..964d09ef0f 100644 --- a/src/packages/backtop/backtop.tsx +++ b/src/packages/backtop/backtop.tsx @@ -4,16 +4,15 @@ import React, { useState, useRef, useCallback, - useMemo, } from 'react' import type { MouseEvent } from 'react' -import { Top } from '@nutui/icons-react' import classNames from 'classnames' -import { BasicComponent, ComponentDefaults } from '@/utils/typings' +import { Top } from '@nutui/icons-react' +import { ComponentDefaults } from '@/utils/typings' import requestAniFrame, { cancelRaf } from '@/utils/raf' -import { useRtl } from '@/packages/configprovider' +import HoverButton, { HoverButtonProps } from '@/packages/hoverbutton/index' -export interface BackTopProps extends BasicComponent { +export interface BackTopProps extends HoverButtonProps { target: string threshold: number zIndex: number @@ -32,7 +31,6 @@ const defaultProps = { export const BackTop: FunctionComponent< Partial & Omit, 'onClick'> > = (props) => { - const rtl = useRtl() const { children, target, @@ -40,6 +38,7 @@ export const BackTop: FunctionComponent< zIndex, className, duration, + icon, style, onClick, } = { @@ -121,29 +120,26 @@ export const BackTop: FunctionComponent< [duration, onClick, scroll, scrollAnimation] ) - const styles = useMemo(() => { - return Object.keys(style || {}).length !== 0 - ? { - zIndex, - ...style, - } - : { - [rtl ? 'left' : 'right']: '10px', - bottom: '20px', - zIndex, - } - }, [rtl, style, zIndex]) - return ( -
)} onClick={(e) => { goTop(e) }} > - {children || } -
+ {children && ( +
{ + goTop(e) + }} + > + {children} +
+ )} + ) } diff --git a/src/packages/backtop/demo.taro.tsx b/src/packages/backtop/demo.taro.tsx index ae980ec231..f1e42dbb61 100644 --- a/src/packages/backtop/demo.taro.tsx +++ b/src/packages/backtop/demo.taro.tsx @@ -5,7 +5,7 @@ import { useTranslate } from '@/sites/assets/locale/taro' import Header from '@/sites/components/header' import Demo1 from './demos/taro/demo1' import Demo5 from './demos/taro/demo5' -import { harmonyAndRn } from '@/utils/platform-taro' +import { harmony } from '@/utils/platform-taro' const BackTopDemo = () => { const [translated] = useTranslate({ @@ -26,24 +26,17 @@ const BackTopDemo = () => { return ( <> - {harmonyAndRn() ? ( - <> - -
- - - +
+ {harmony() ? ( + ) : ( - <> -
- - {translated.title} - - - + + {translated.title} + + )} ) diff --git a/src/packages/backtop/demo.tsx b/src/packages/backtop/demo.tsx index 837e4acd69..3ce6a5a76d 100644 --- a/src/packages/backtop/demo.tsx +++ b/src/packages/backtop/demo.tsx @@ -17,11 +17,7 @@ const BackTopDemo = () => { return ( <> -
+

{translated.title}

diff --git a/src/packages/backtop/demos/h5/demo1.tsx b/src/packages/backtop/demos/h5/demo1.tsx index df048d6255..02f195d174 100644 --- a/src/packages/backtop/demos/h5/demo1.tsx +++ b/src/packages/backtop/demos/h5/demo1.tsx @@ -3,12 +3,12 @@ import { BackTop, Cell } from '@nutui/nutui-react' const Demo1 = () => { return ( -
+ <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} -
+ ) } export default Demo1 diff --git a/src/packages/backtop/demos/h5/demo2.tsx b/src/packages/backtop/demos/h5/demo2.tsx index 9f73b520a9..fd0a71727a 100644 --- a/src/packages/backtop/demos/h5/demo2.tsx +++ b/src/packages/backtop/demos/h5/demo2.tsx @@ -3,12 +3,12 @@ import { BackTop, Cell } from '@nutui/nutui-react' const Demo2 = () => { return ( -
+ <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} -
+ ) } export default Demo2 diff --git a/src/packages/backtop/demos/h5/demo3.tsx b/src/packages/backtop/demos/h5/demo3.tsx index a423c33f8c..d516babff8 100644 --- a/src/packages/backtop/demos/h5/demo3.tsx +++ b/src/packages/backtop/demos/h5/demo3.tsx @@ -4,23 +4,15 @@ import { BackTop, Cell } from '@nutui/nutui-react' const Demo3 = () => { return ( -
+ <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - -
- -
顶部
-
+ + +
顶部
 -
+ ) } export default Demo3 diff --git a/src/packages/backtop/demos/h5/demo4.tsx b/src/packages/backtop/demos/h5/demo4.tsx index f26641211a..0377c9040d 100644 --- a/src/packages/backtop/demos/h5/demo4.tsx +++ b/src/packages/backtop/demos/h5/demo4.tsx @@ -3,11 +3,11 @@ import { BackTop, Cell } from '@nutui/nutui-react' const Demo4 = () => { return ( -
+
{new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - +
) } diff --git a/src/packages/backtop/demos/h5/demo5.tsx b/src/packages/backtop/demos/h5/demo5.tsx index bfeb250a5d..28a569a6c8 100644 --- a/src/packages/backtop/demos/h5/demo5.tsx +++ b/src/packages/backtop/demos/h5/demo5.tsx @@ -1,37 +1,23 @@ import React from 'react' import { BackTop, Cell } from '@nutui/nutui-react' -import { Top } from '@nutui/icons-react' const Demo5 = () => { const handleClick = () => { - console.log('触发返回顶部') + const ele = document.getElementsByClassName('backtop-button')[0] } return ( -
+ <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} { + handleClick() }} - onClick={handleClick} target="target" - > -
- -
顶部
-
- -
+ className="backtop-button" + /> + ) } export default Demo5 diff --git a/src/packages/backtop/demos/taro/demo1.tsx b/src/packages/backtop/demos/taro/demo1.tsx index 86a1f8d7ef..042f0da74f 100644 --- a/src/packages/backtop/demos/taro/demo1.tsx +++ b/src/packages/backtop/demos/taro/demo1.tsx @@ -1,33 +1,14 @@ import React from 'react' -import { View } from '@tarojs/components' import { BackTop, Cell } from '@nutui/nutui-react-taro' -import { Top } from '@nutui/icons-react-taro' const Demo1 = () => { return ( - + <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - - - - 顶部 - - - + + ) } export default Demo1 diff --git a/src/packages/backtop/demos/taro/demo2.tsx b/src/packages/backtop/demos/taro/demo2.tsx index c1637fa61b..edafeeffe0 100644 --- a/src/packages/backtop/demos/taro/demo2.tsx +++ b/src/packages/backtop/demos/taro/demo2.tsx @@ -1,15 +1,14 @@ import React from 'react' -import { View } from '@tarojs/components' import { BackTop, Cell } from '@nutui/nutui-react-taro' const Demo2 = () => { return ( - + <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - + ) } export default Demo2 diff --git a/src/packages/backtop/demos/taro/demo3.tsx b/src/packages/backtop/demos/taro/demo3.tsx index 559ff5fd0e..de1a181176 100644 --- a/src/packages/backtop/demos/taro/demo3.tsx +++ b/src/packages/backtop/demos/taro/demo3.tsx @@ -5,23 +5,15 @@ import { BackTop, Cell } from '@nutui/nutui-react-taro' const Demo3 = () => { return ( - + <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - - - 顶部 - + + 顶部 - + ) } export default Demo3 diff --git a/src/packages/backtop/demos/taro/demo4.tsx b/src/packages/backtop/demos/taro/demo4.tsx index f02dcd988d..7d3a6d9263 100644 --- a/src/packages/backtop/demos/taro/demo4.tsx +++ b/src/packages/backtop/demos/taro/demo4.tsx @@ -1,41 +1,17 @@ import React from 'react' -import { View } from '@tarojs/components' import { BackTop, Cell } from '@nutui/nutui-react-taro' -import { Top } from '@nutui/icons-react-taro' const Demo4 = () => { const handleClick = () => { console.log('触发返回顶部') } - const demoStyle = { - height: 'auto', - minHeight: 'auto', - } return ( - + <> {new Array(24).fill(0).map((_, index) => { return 我是测试数据{index} })} - - - - 顶部 - - - + + ) } export default Demo4 diff --git a/src/packages/backtop/demos/taro/demo5.tsx b/src/packages/backtop/demos/taro/demo5.tsx index 59c528d2a3..85a3ed7277 100644 --- a/src/packages/backtop/demos/taro/demo5.tsx +++ b/src/packages/backtop/demos/taro/demo5.tsx @@ -1,68 +1,29 @@ /** * JDRN 端最佳实践 */ -import React, { useRef, useState } from 'react' +import React, { useState } from 'react' import Taro from '@tarojs/taro' import { ScrollView, View } from '@tarojs/components' import { BackTop, Cell } from '@nutui/nutui-react-taro' -import { Top } from '@nutui/icons-react-taro' -import pxTransform from '@/utils/px-transform' -import { harmony, rn } from '@/utils/platform-taro' const Demo5 = () => { const [scrollRes, setScrollRes] = useState(null) - const sv = useRef(null) return ( // @TODO 待 taro 侧支持获取视窗尺寸后调整 - { + setScrollRes(res.detail) }} + className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`} + style={{ width: '100%', height: '100%' }} > - { - setScrollRes(res.detail) - }} - ref={sv} - // @TODO RN 端暂不支持 - // trapScroll={true} - className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`} - style={{ height: 'auto' }} - > - 基础用法 - {new Array(24).fill(0).map((_, index) => { - return 我是测试数据{index} - })} - - { - if (harmony()) { - if (!sv.current?.scroller?.scrollEdge) return - // @ts-ignore - sv.current.scroller.scrollEdge(Edge.Top) - } - if (rn()) { - if (!sv.current?.scrollToOffset) return - sv.current.scrollToOffset({ offset: 0 }) - } - }} - > - - - - - + 基础用法 + {new Array(24).fill(0).map((_, index) => { + return 我是测试数据{index} + })} + + ) } export default Demo5 diff --git a/src/packages/hoverbutton/demos/taro/demo4.tsx b/src/packages/hoverbutton/demos/taro/demo4.tsx index ff73546357..9ce4b9a1e9 100644 --- a/src/packages/hoverbutton/demos/taro/demo4.tsx +++ b/src/packages/hoverbutton/demos/taro/demo4.tsx @@ -31,7 +31,6 @@ const App = () => { > 这个图层层级为 1000 - {/* */} ) diff --git a/src/packages/hoverbuttonitem/hoverbuttonitem.scss b/src/packages/hoverbuttonitem/hoverbuttonitem.scss index 5f9ad95c88..d33de14b34 100644 --- a/src/packages/hoverbuttonitem/hoverbuttonitem.scss +++ b/src/packages/hoverbuttonitem/hoverbuttonitem.scss @@ -1,8 +1,8 @@ .nut-hoverbutton-item { &-container { - width: 40px; - height: 40px; - border-radius: 20px; + width: $hoverbutton-item-size; + height: $hoverbutton-item-size; + border-radius: $hoverbutton-item-size; border: 1px solid $hoverbutton-item-border-color; background-color: $hoverbutton-item-background; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index 1c573916cc..d78efc5184 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -960,12 +960,6 @@ $tour-content-bottom-btn-border-radius: var( 4px ) !default; -//backtop（✅） -$backtop-border-color: var( - --nutui-backtop-border-color, - $color-border -) !default; - // calendar（✅） $calendar-active-background-color: var( --nutui-calendar-active-background-color, @@ -1025,6 +1019,7 @@ $hoverbutton-position-right: var( --nutui-hoverbutton-position-right, $spacing-base ) !default; +$hoverbutton-item-size: var(--nutui-hoverbutton-item-size, 40px) !default; $hoverbutton-item-border-color: var( --nutui-hoverbutton-item-border-color, rgba(0, 0, 0, 0.12) From a159571f99a7b331f29eb477025b5b4c683bb874 Mon Sep 17 00:00:00 2001 From: oasis Date: Fri, 20 Dec 2024 20:38:42 +0800 Subject: [PATCH 04/19] chore(release): v3.0.0-beta.8 --- package.json | 4 ++-- src/packages/configprovider/types.ts | 10 +++++++--- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 8351a64575..9c04182a6c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { - "name": "@nutui/nutui-react-taro", - "version": "3.0.0-beta.7", + "name": "@nutui/nutui-react", + "version": "3.0.0-beta.8", "style": "dist/style.css", "main": "dist/nutui.react.umd.js", "module": "dist/es/packages/nutui.react.build.js", diff --git a/src/packages/configprovider/types.ts b/src/packages/configprovider/types.ts index 3c46280bc9..71102e3b7f 100644 --- a/src/packages/configprovider/types.ts +++ b/src/packages/configprovider/types.ts @@ -8,6 +8,7 @@ export type NutCSSVariables = | 'nutuiColorPrimaryLightPressed' | 'nutuiRed6' | 'nutuiGray8' + | 'nutuiColorPrimarySpecialdisabled' | 'nutuiColorDefault' | 'nutuiColorDefaultPressed' | 'nutuiColorDefaultLight' @@ -217,7 +218,6 @@ export type NutCSSVariables = | 'nutuiInputnumberInputMargin' | 'nutuiInputnumberButtonWidth' | 'nutuiInputnumberButtonHeight' - | 'nutuiInputnumberButtonBorderRadius' | 'nutuiInputnumberButtonBackgroundColor' | 'nutuiInputnumberIconColor' | 'nutuiInputnumberIconSize' @@ -319,7 +319,6 @@ export type NutCSSVariables = | 'nutuiTourContentBottomBtnPadding' | 'nutuiTourContentBottomBtnFontSize' | 'nutuiTourContentBottomBtnBorderRadius' - | 'nutuiBacktopBorderColor' | 'nutuiCalendarActiveBackgroundColor' | 'nutuiCalendarChooseBackgroundColor' | 'nutuiCalendarChooseColor' @@ -337,6 +336,7 @@ export type NutCSSVariables = | 'nutuiHoverbuttonSpacing' | 'nutuiHoverbuttonPositionBottom' | 'nutuiHoverbuttonPositionRight' + | 'nutuiHoverbuttonItemSize' | 'nutuiHoverbuttonItemBorderColor' | 'nutuiHoverbuttonItemBackground' | 'nutuiHoverbuttonItemBackgroundActive' @@ -540,9 +540,11 @@ export type NutCSSVariables = | 'nutuiBadgeZIndex' | 'nutuiBadgeDotWidth' | 'nutuiBadgeDotBorder' + | 'nutuiBadgeOutlineColor' + | 'nutuiBadgeOutlineBorder' | 'nutuiPopoverBorderRadius' - | 'nutuiPopoverFontSize' | 'nutuiPopoverBorderColor' + | 'nutuiPopoverFontSize' | 'nutuiPopoverContentBackgroundColor' | 'nutuiPopoverTextColor' | 'nutuiPopoverHoverBackgroundColor' @@ -550,6 +552,7 @@ export type NutCSSVariables = | 'nutuiPopoverDisableColor' | 'nutuiPopoverDividerColor' | 'nutuiPopoverMenuItemPadding' + | 'nutuiPopoverMenuItemWidth' | 'nutuiProgressHeight' | 'nutuiProgressColor' | 'nutuiProgressBackground' @@ -802,6 +805,7 @@ export type NutCSSVariables = | 'nutuiCountupLrMargin' | 'nutuiCountupBgColor' | 'nutuiCountupColor' + | 'nutuiCountupSeparatorColor' | 'nutuiRowContentColor' | 'nutuiRowContentBackgroundColor' | 'nutuiRowContentBorderRadius' From 651fcc239cfde38a6756bf74f31fc0937caad2a7 Mon Sep 17 00:00:00 2001 From: oasis Date: Fri, 20 Dec 2024 20:41:07 +0800 Subject: [PATCH 05/19] fix: update variables --- src/styles/variables-jmapp.scss | 4 ++++ src/styles/variables-jrkf.scss | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/src/styles/variables-jmapp.scss b/src/styles/variables-jmapp.scss index 87be011c18..0c4e74f5f2 100644 --- a/src/styles/variables-jmapp.scss +++ b/src/styles/variables-jmapp.scss @@ -2394,6 +2394,10 @@ $countup-border-radius: var(--nutui-countup-border-radius, 4px) !default; $countup-lr-margin: var(--nutui-countup-lr-margin, 0) !default; $countup-bg-color: var(--nutui-countup-bg-color, inherit) !default; $countup-color: var(--nutui-countup-color, $color-title) !default; +$countup-separator-color: var( + --nutui-countup-separator-color, + $color-title +) !default; // layout（✅） $row-content-color: var(--nutui-row-content-color, #fff) !default; diff --git a/src/styles/variables-jrkf.scss b/src/styles/variables-jrkf.scss index 7730842f40..ea64b13cb0 100644 --- a/src/styles/variables-jrkf.scss +++ b/src/styles/variables-jrkf.scss @@ -2430,6 +2430,10 @@ $countup-border-radius: var(--nutui-countup-border-radius, 4px) !default; $countup-lr-margin: var(--nutui-countup-lr-margin, 0) !default; $countup-bg-color: var(--nutui-countup-bg-color, inherit) !default; $countup-color: var(--nutui-countup-color, $color-text-title) !default; +$countup-separator-color: var( + --nutui-countup-separator-color, + $color-title +) !default; // layout（✅） $row-content-color: var(--nutui-row-content-color, #fff) !default; From 83cee35f7a7def2f41e2ae29da3111f0242321c4 Mon Sep 17 00:00:00 2001 From: xiaoyatong <84436086+xiaoyatong@users.noreply.github.com> Date: Sun, 22 Dec 2024 17:17:58 +0800 Subject: [PATCH 06/19] fix: icons for v15 (#2874) * fix: icons v15 * fix: test * chore: update version of icons * chore: lock * fix: demos --- package.json | 4 +- pnpm-lock.yaml | 584 ++++++++++-------- .../__snapshots__/address.spec.tsx.snap | 6 +- .../__snapshots__/audio.spec.tsx.snap | 4 +- src/packages/audio/demos/h5/demo3.tsx | 8 +- src/packages/avatar/demo.tsx | 2 +- src/packages/avatarcropper/demo.tsx | 2 +- .../__snapshots__/backtop.spec.tsx.snap | 4 +- .../__snapshots__/badge.spec.tsx.snap | 8 +- src/packages/badge/__test__/badge.spec.tsx | 4 +- src/packages/badge/demos/h5/demo1.tsx | 8 +- src/packages/badge/demos/h5/demo4.tsx | 6 +- src/packages/badge/demos/taro/demo4.tsx | 6 +- src/packages/button/button.scss | 1 + .../__snapshots__/cascader.spec.tsx.snap | 32 +- src/packages/cascader/cascader.taro.tsx | 6 +- src/packages/cascader/cascader.tsx | 6 +- .../__snapshots__/checkbox.spec.tsx.snap | 4 +- src/packages/checkbox/demos/h5/demo1.tsx | 6 +- src/packages/checkbox/demos/h5/demo2.tsx | 14 +- src/packages/checkbox/demos/h5/demo7.tsx | 14 +- src/packages/checkbox/demos/taro/demo1.tsx | 6 +- src/packages/checkbox/demos/taro/demo2.tsx | 14 +- src/packages/checkbox/demos/taro/demo7.tsx | 14 +- .../__snapshots__/collapse.spec.tsx.snap | 6 +- src/packages/collapse/demos/h5/demo5.tsx | 6 +- src/packages/collapse/demos/h5/demo6.tsx | 9 +- src/packages/collapse/demos/taro/demo5.tsx | 6 +- src/packages/collapse/demos/taro/demo6.tsx | 9 +- src/packages/countdown/demos/h5/demo9.tsx | 30 +- src/packages/countdown/demos/taro/demo9.tsx | 31 +- .../__test__/__snapshots__/grid.spec.tsx.snap | 130 +--- .../__snapshots__/hoverbutton.spec.tsx.snap | 24 +- src/packages/hoverbutton/demos/taro/demo3.tsx | 4 +- .../__snapshots__/image.spec.tsx.snap | 10 +- src/packages/inputnumber/inputnumber.scss | 4 +- .../__test__/__snapshots__/menu.spec.tsx.snap | 12 +- .../__snapshots__/noticebar.spec.tsx.snap | 6 +- .../_test_/__snapshots__/index.spec.tsx.snap | 2 +- src/packages/popover/demos/h5/demo2.tsx | 4 +- src/packages/popover/demos/taro/demo2.tsx | 4 +- src/packages/radio/__test__/radio.spec.tsx | 8 +- src/packages/radio/demos/h5/demo8.tsx | 7 +- src/packages/radio/demos/h5/demo9.tsx | 10 +- src/packages/radio/demos/taro/demo8.tsx | 4 +- src/packages/radio/demos/taro/demo9.tsx | 14 +- .../__test__/__snapshots__/rate.spec.tsx.snap | 4 +- .../__snapshots__/resultpage.spec.tsx.snap | 10 +- src/packages/segmented/demos/h5/demo3.tsx | 6 +- src/packages/segmented/demos/taro/demo3.tsx | 6 +- src/packages/steps/__tests__/steps.spec.tsx | 8 +- src/packages/steps/demos/h5/demo6.tsx | 4 +- src/packages/steps/demos/h5/demo7.tsx | 6 +- src/packages/steps/demos/taro/demo6.tsx | 4 +- src/packages/steps/demos/taro/demo7.tsx | 6 +- src/packages/swipe/demos/h5/demo4.tsx | 22 +- src/packages/swipe/demos/taro/demo4.tsx | 6 +- .../__snapshots__/tabbar.spec.tsx.snap | 4 +- src/packages/tabbar/__tests__/tabbar.spec.tsx | 12 +- src/packages/tabbar/demos/h5/demo1.tsx | 4 +- src/packages/tabbar/demos/h5/demo2.tsx | 4 +- src/packages/tabbar/demos/h5/demo3.tsx | 4 +- src/packages/tabbar/demos/h5/demo4.tsx | 2 +- src/packages/tabbar/demos/h5/demo5.tsx | 4 +- src/packages/tabbar/demos/h5/demo6.tsx | 4 +- src/packages/tabbar/demos/h5/demo7.tsx | 4 +- src/packages/tabbar/demos/h5/demo8.tsx | 4 +- src/packages/tabbar/demos/h5/demo9.tsx | 4 +- src/packages/tabbar/demos/taro/demo1.tsx | 4 +- src/packages/tabbar/demos/taro/demo2.tsx | 4 +- src/packages/tabbar/demos/taro/demo3.tsx | 4 +- src/packages/tabbar/demos/taro/demo4.tsx | 2 +- src/packages/tabbar/demos/taro/demo5.tsx | 4 +- src/packages/tabbar/demos/taro/demo6.tsx | 4 +- src/packages/tabbar/demos/taro/demo7.tsx | 4 +- src/packages/tabbar/demos/taro/demo8.tsx | 4 +- src/packages/tabbar/demos/taro/demo9.tsx | 4 +- .../__snapshots__/timeselect.spec.tsx.snap | 2 + src/sites/doc/components/issue/issue.tsx | 4 +- 79 files changed, 621 insertions(+), 654 deletions(-) diff --git a/package.json b/package.json index 9c04182a6c..53877aa614 100644 --- a/package.json +++ b/package.json @@ -102,8 +102,8 @@ }, "dependencies": { "@babel/runtime": "^7.23.9", - "@nutui/icons-react": "^2.0.1", - "@nutui/icons-react-taro": "^2.0.1", + "@nutui/icons-react": "^3.0.0-beta.1", + "@nutui/icons-react-taro": "^3.0.1-beta.0", "@nutui/jdesign-icons-react-taro": "1.0.6-beta.2", "@nutui/touch-emulator": "^1.0.0", "@react-spring/web": "~9.6.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 313bf3d1d2..52330a57a8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -18,11 +18,11 @@ importers: specifier: ^7.23.9 version: 7.25.4 '@nutui/icons-react': - specifier: ^2.0.1 - version: 2.0.1 + specifier: ^3.0.0-beta.1 + version: 3.0.0-beta.1 '@nutui/icons-react-taro': - specifier: ^2.0.1 - version: 2.0.1 + specifier: ^3.0.1-beta.0 + version: 3.0.1-beta.1 '@nutui/jdesign-icons-react-taro': specifier: 1.0.6-beta.2 version: 1.0.6-beta.2 @@ -453,7 +453,7 @@ importers: version: 1.1.0 jscodeshift: specifier: ^17.0.0 - version: 17.0.0(@babel/preset-env@7.26.0(@babel/core@7.26.0)) + version: 17.0.0(@babel/preset-env@7.26.0(@babel/core@7.25.2)) devDependencies: jest: specifier: ^29.7.0 @@ -466,7 +466,7 @@ importers: version: 17.6.0(typescript@5.7.2) ts-jest: specifier: ^29.1.2 - version: 29.2.5(@babel/core@7.26.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.26.0))(jest@29.7.0(@types/node@20.16.1)(ts-node@10.9.2(@swc/core@1.10.1(@swc/helpers@0.5.15))(@types/node@20.16.1)(typescript@5.7.2)))(typescript@5.7.2) + version: 29.2.5(@babel/core@7.25.2)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.25.2))(jest@29.7.0(@types/node@20.16.1)(ts-node@10.9.2(@swc/core@1.10.1(@swc/helpers@0.5.15))(@types/node@20.16.1)(typescript@5.7.2)))(typescript@5.7.2) packages/nutui-taro-demo: dependencies: @@ -1489,7 +1489,7 @@ packages: resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==} '@colors/colors@1.5.0': - resolution: {integrity: sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==} + resolution: {integrity: sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==, tarball: https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz} engines: {node: '>=0.1.90'} '@commitlint/cli@19.4.0': @@ -1562,7 +1562,7 @@ packages: engines: {node: '>=v18'} '@cspotcode/source-map-support@0.8.1': - resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==} + resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==, tarball: https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz} engines: {node: '>=12'} '@csstools/css-parser-algorithms@3.0.4': @@ -1607,427 +1607,427 @@ packages: engines: {node: '>=16'} '@esbuild/aix-ppc64@0.21.5': - resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==} + resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==, tarball: https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz} engines: {node: '>=12'} cpu: [ppc64] os: [aix] '@esbuild/aix-ppc64@0.23.1': - resolution: {integrity: sha512-6VhYk1diRqrhBAqpJEdjASR/+WVRtfjpqKuNw11cLiaWpAT/Uu+nokB+UJnevzy/P9C/ty6AOe0dwueMrGh/iQ==} + resolution: {integrity: sha512-6VhYk1diRqrhBAqpJEdjASR/+WVRtfjpqKuNw11cLiaWpAT/Uu+nokB+UJnevzy/P9C/ty6AOe0dwueMrGh/iQ==, tarball: https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.23.1.tgz} engines: {node: '>=18'} cpu: [ppc64] os: [aix] '@esbuild/aix-ppc64@0.24.0': - resolution: {integrity: sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==} + resolution: {integrity: sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==, tarball: https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.24.0.tgz} engines: {node: '>=18'} cpu: [ppc64] os: [aix] '@esbuild/android-arm64@0.21.5': - resolution: {integrity: sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==} + resolution: {integrity: sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==, tarball: https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm64] os: [android] '@esbuild/android-arm64@0.23.1': - resolution: {integrity: sha512-xw50ipykXcLstLeWH7WRdQuysJqejuAGPd30vd1i5zSyKK3WE+ijzHmLKxdiCMtH1pHz78rOg0BKSYOSB/2Khw==} + resolution: {integrity: sha512-xw50ipykXcLstLeWH7WRdQuysJqejuAGPd30vd1i5zSyKK3WE+ijzHmLKxdiCMtH1pHz78rOg0BKSYOSB/2Khw==, tarball: https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [android] '@esbuild/android-arm64@0.24.0': - resolution: {integrity: sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==} + resolution: {integrity: sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==, tarball: https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [android] '@esbuild/android-arm@0.21.5': - resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==} + resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==, tarball: https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm] os: [android] '@esbuild/android-arm@0.23.1': - resolution: {integrity: sha512-uz6/tEy2IFm9RYOyvKl88zdzZfwEfKZmnX9Cj1BHjeSGNuGLuMD1kR8y5bteYmwqKm1tj8m4cb/aKEorr6fHWQ==} + resolution: {integrity: sha512-uz6/tEy2IFm9RYOyvKl88zdzZfwEfKZmnX9Cj1BHjeSGNuGLuMD1kR8y5bteYmwqKm1tj8m4cb/aKEorr6fHWQ==, tarball: https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm] os: [android] '@esbuild/android-arm@0.24.0': - resolution: {integrity: sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==} + resolution: {integrity: sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==, tarball: https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm] os: [android] '@esbuild/android-x64@0.21.5': - resolution: {integrity: sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==} + resolution: {integrity: sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==, tarball: https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [android] '@esbuild/android-x64@0.23.1': - resolution: {integrity: sha512-nlN9B69St9BwUoB+jkyU090bru8L0NA3yFvAd7k8dNsVH8bi9a8cUAUSEcEEgTp2z3dbEDGJGfP6VUnkQnlReg==} + resolution: {integrity: sha512-nlN9B69St9BwUoB+jkyU090bru8L0NA3yFvAd7k8dNsVH8bi9a8cUAUSEcEEgTp2z3dbEDGJGfP6VUnkQnlReg==, tarball: https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [android] '@esbuild/android-x64@0.24.0': - resolution: {integrity: sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==} + resolution: {integrity: sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==, tarball: https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [android] '@esbuild/darwin-arm64@0.21.5': - resolution: {integrity: sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==} + resolution: {integrity: sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==, tarball: https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm64] os: [darwin] '@esbuild/darwin-arm64@0.23.1': - resolution: {integrity: sha512-YsS2e3Wtgnw7Wq53XXBLcV6JhRsEq8hkfg91ESVadIrzr9wO6jJDMZnCQbHm1Guc5t/CdDiFSSfWP58FNuvT3Q==} + resolution: {integrity: sha512-YsS2e3Wtgnw7Wq53XXBLcV6JhRsEq8hkfg91ESVadIrzr9wO6jJDMZnCQbHm1Guc5t/CdDiFSSfWP58FNuvT3Q==, tarball: https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [darwin] '@esbuild/darwin-arm64@0.24.0': - resolution: {integrity: sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==} + resolution: {integrity: sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==, tarball: https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [darwin] '@esbuild/darwin-x64@0.21.5': - resolution: {integrity: sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==} + resolution: {integrity: sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==, tarball: https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [darwin] '@esbuild/darwin-x64@0.23.1': - resolution: {integrity: sha512-aClqdgTDVPSEGgoCS8QDG37Gu8yc9lTHNAQlsztQ6ENetKEO//b8y31MMu2ZaPbn4kVsIABzVLXYLhCGekGDqw==} + resolution: {integrity: sha512-aClqdgTDVPSEGgoCS8QDG37Gu8yc9lTHNAQlsztQ6ENetKEO//b8y31MMu2ZaPbn4kVsIABzVLXYLhCGekGDqw==, tarball: https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [darwin] '@esbuild/darwin-x64@0.24.0': - resolution: {integrity: sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==} + resolution: {integrity: sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==, tarball: https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [darwin] '@esbuild/freebsd-arm64@0.21.5': - resolution: {integrity: sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==} + resolution: {integrity: sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==, tarball: https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm64] os: [freebsd] '@esbuild/freebsd-arm64@0.23.1': - resolution: {integrity: sha512-h1k6yS8/pN/NHlMl5+v4XPfikhJulk4G+tKGFIOwURBSFzE8bixw1ebjluLOjfwtLqY0kewfjLSrO6tN2MgIhA==} + resolution: {integrity: sha512-h1k6yS8/pN/NHlMl5+v4XPfikhJulk4G+tKGFIOwURBSFzE8bixw1ebjluLOjfwtLqY0kewfjLSrO6tN2MgIhA==, tarball: https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [freebsd] '@esbuild/freebsd-arm64@0.24.0': - resolution: {integrity: sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==} + resolution: {integrity: sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==, tarball: https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [freebsd] '@esbuild/freebsd-x64@0.21.5': - resolution: {integrity: sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==} + resolution: {integrity: sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==, tarball: https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [freebsd] '@esbuild/freebsd-x64@0.23.1': - resolution: {integrity: sha512-lK1eJeyk1ZX8UklqFd/3A60UuZ/6UVfGT2LuGo3Wp4/z7eRTRYY+0xOu2kpClP+vMTi9wKOfXi2vjUpO1Ro76g==} + resolution: {integrity: sha512-lK1eJeyk1ZX8UklqFd/3A60UuZ/6UVfGT2LuGo3Wp4/z7eRTRYY+0xOu2kpClP+vMTi9wKOfXi2vjUpO1Ro76g==, tarball: https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [freebsd] '@esbuild/freebsd-x64@0.24.0': - resolution: {integrity: sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==} + resolution: {integrity: sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==, tarball: https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [freebsd] '@esbuild/linux-arm64@0.21.5': - resolution: {integrity: sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==} + resolution: {integrity: sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==, tarball: https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm64] os: [linux] '@esbuild/linux-arm64@0.23.1': - resolution: {integrity: sha512-/93bf2yxencYDnItMYV/v116zff6UyTjo4EtEQjUBeGiVpMmffDNUyD9UN2zV+V3LRV3/on4xdZ26NKzn6754g==} + resolution: {integrity: sha512-/93bf2yxencYDnItMYV/v116zff6UyTjo4EtEQjUBeGiVpMmffDNUyD9UN2zV+V3LRV3/on4xdZ26NKzn6754g==, tarball: https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [linux] '@esbuild/linux-arm64@0.24.0': - resolution: {integrity: sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==} + resolution: {integrity: sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==, tarball: https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [linux] '@esbuild/linux-arm@0.21.5': - resolution: {integrity: sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==} + resolution: {integrity: sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==, tarball: https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm] os: [linux] '@esbuild/linux-arm@0.23.1': - resolution: {integrity: sha512-CXXkzgn+dXAPs3WBwE+Kvnrf4WECwBdfjfeYHpMeVxWE0EceB6vhWGShs6wi0IYEqMSIzdOF1XjQ/Mkm5d7ZdQ==} + resolution: {integrity: sha512-CXXkzgn+dXAPs3WBwE+Kvnrf4WECwBdfjfeYHpMeVxWE0EceB6vhWGShs6wi0IYEqMSIzdOF1XjQ/Mkm5d7ZdQ==, tarball: https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm] os: [linux] '@esbuild/linux-arm@0.24.0': - resolution: {integrity: sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==} + resolution: {integrity: sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==, tarball: https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm] os: [linux] '@esbuild/linux-ia32@0.21.5': - resolution: {integrity: sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==} + resolution: {integrity: sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==, tarball: https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz} engines: {node: '>=12'} cpu: [ia32] os: [linux] '@esbuild/linux-ia32@0.23.1': - resolution: {integrity: sha512-VTN4EuOHwXEkXzX5nTvVY4s7E/Krz7COC8xkftbbKRYAl96vPiUssGkeMELQMOnLOJ8k3BY1+ZY52tttZnHcXQ==} + resolution: {integrity: sha512-VTN4EuOHwXEkXzX5nTvVY4s7E/Krz7COC8xkftbbKRYAl96vPiUssGkeMELQMOnLOJ8k3BY1+ZY52tttZnHcXQ==, tarball: https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.23.1.tgz} engines: {node: '>=18'} cpu: [ia32] os: [linux] '@esbuild/linux-ia32@0.24.0': - resolution: {integrity: sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==} + resolution: {integrity: sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==, tarball: https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.24.0.tgz} engines: {node: '>=18'} cpu: [ia32] os: [linux] '@esbuild/linux-loong64@0.21.5': - resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==} + resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==, tarball: https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz} engines: {node: '>=12'} cpu: [loong64] os: [linux] '@esbuild/linux-loong64@0.23.1': - resolution: {integrity: sha512-Vx09LzEoBa5zDnieH8LSMRToj7ir/Jeq0Gu6qJ/1GcBq9GkfoEAoXvLiW1U9J1qE/Y/Oyaq33w5p2ZWrNNHNEw==} + resolution: {integrity: sha512-Vx09LzEoBa5zDnieH8LSMRToj7ir/Jeq0Gu6qJ/1GcBq9GkfoEAoXvLiW1U9J1qE/Y/Oyaq33w5p2ZWrNNHNEw==, tarball: https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.23.1.tgz} engines: {node: '>=18'} cpu: [loong64] os: [linux] '@esbuild/linux-loong64@0.24.0': - resolution: {integrity: sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==} + resolution: {integrity: sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==, tarball: https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.24.0.tgz} engines: {node: '>=18'} cpu: [loong64] os: [linux] '@esbuild/linux-mips64el@0.21.5': - resolution: {integrity: sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==} + resolution: {integrity: sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==, tarball: https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz} engines: {node: '>=12'} cpu: [mips64el] os: [linux] '@esbuild/linux-mips64el@0.23.1': - resolution: {integrity: sha512-nrFzzMQ7W4WRLNUOU5dlWAqa6yVeI0P78WKGUo7lg2HShq/yx+UYkeNSE0SSfSure0SqgnsxPvmAUu/vu0E+3Q==} + resolution: {integrity: sha512-nrFzzMQ7W4WRLNUOU5dlWAqa6yVeI0P78WKGUo7lg2HShq/yx+UYkeNSE0SSfSure0SqgnsxPvmAUu/vu0E+3Q==, tarball: https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.23.1.tgz} engines: {node: '>=18'} cpu: [mips64el] os: [linux] '@esbuild/linux-mips64el@0.24.0': - resolution: {integrity: sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==} + resolution: {integrity: sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==, tarball: https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.24.0.tgz} engines: {node: '>=18'} cpu: [mips64el] os: [linux] '@esbuild/linux-ppc64@0.21.5': - resolution: {integrity: sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==} + resolution: {integrity: sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==, tarball: https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz} engines: {node: '>=12'} cpu: [ppc64] os: [linux] '@esbuild/linux-ppc64@0.23.1': - resolution: {integrity: sha512-dKN8fgVqd0vUIjxuJI6P/9SSSe/mB9rvA98CSH2sJnlZ/OCZWO1DJvxj8jvKTfYUdGfcq2dDxoKaC6bHuTlgcw==} + resolution: {integrity: sha512-dKN8fgVqd0vUIjxuJI6P/9SSSe/mB9rvA98CSH2sJnlZ/OCZWO1DJvxj8jvKTfYUdGfcq2dDxoKaC6bHuTlgcw==, tarball: https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.23.1.tgz} engines: {node: '>=18'} cpu: [ppc64] os: [linux] '@esbuild/linux-ppc64@0.24.0': - resolution: {integrity: sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==} + resolution: {integrity: sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==, tarball: https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.24.0.tgz} engines: {node: '>=18'} cpu: [ppc64] os: [linux] '@esbuild/linux-riscv64@0.21.5': - resolution: {integrity: sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==} + resolution: {integrity: sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==, tarball: https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz} engines: {node: '>=12'} cpu: [riscv64] os: [linux] '@esbuild/linux-riscv64@0.23.1': - resolution: {integrity: sha512-5AV4Pzp80fhHL83JM6LoA6pTQVWgB1HovMBsLQ9OZWLDqVY8MVobBXNSmAJi//Csh6tcY7e7Lny2Hg1tElMjIA==} + resolution: {integrity: sha512-5AV4Pzp80fhHL83JM6LoA6pTQVWgB1HovMBsLQ9OZWLDqVY8MVobBXNSmAJi//Csh6tcY7e7Lny2Hg1tElMjIA==, tarball: https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.23.1.tgz} engines: {node: '>=18'} cpu: [riscv64] os: [linux] '@esbuild/linux-riscv64@0.24.0': - resolution: {integrity: sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==} + resolution: {integrity: sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==, tarball: https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.24.0.tgz} engines: {node: '>=18'} cpu: [riscv64] os: [linux] '@esbuild/linux-s390x@0.21.5': - resolution: {integrity: sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==} + resolution: {integrity: sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==, tarball: https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz} engines: {node: '>=12'} cpu: [s390x] os: [linux] '@esbuild/linux-s390x@0.23.1': - resolution: {integrity: sha512-9ygs73tuFCe6f6m/Tb+9LtYxWR4c9yg7zjt2cYkjDbDpV/xVn+68cQxMXCjUpYwEkze2RcU/rMnfIXNRFmSoDw==} + resolution: {integrity: sha512-9ygs73tuFCe6f6m/Tb+9LtYxWR4c9yg7zjt2cYkjDbDpV/xVn+68cQxMXCjUpYwEkze2RcU/rMnfIXNRFmSoDw==, tarball: https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.23.1.tgz} engines: {node: '>=18'} cpu: [s390x] os: [linux] '@esbuild/linux-s390x@0.24.0': - resolution: {integrity: sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==} + resolution: {integrity: sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==, tarball: https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.24.0.tgz} engines: {node: '>=18'} cpu: [s390x] os: [linux] '@esbuild/linux-x64@0.21.5': - resolution: {integrity: sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==} + resolution: {integrity: sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==, tarball: https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [linux] '@esbuild/linux-x64@0.23.1': - resolution: {integrity: sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==} + resolution: {integrity: sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==, tarball: https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [linux] '@esbuild/linux-x64@0.24.0': - resolution: {integrity: sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==} + resolution: {integrity: sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==, tarball: https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [linux] '@esbuild/netbsd-x64@0.21.5': - resolution: {integrity: sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==} + resolution: {integrity: sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==, tarball: https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [netbsd] '@esbuild/netbsd-x64@0.23.1': - resolution: {integrity: sha512-aevEkCNu7KlPRpYLjwmdcuNz6bDFiE7Z8XC4CPqExjTvrHugh28QzUXVOZtiYghciKUacNktqxdpymplil1beA==} + resolution: {integrity: sha512-aevEkCNu7KlPRpYLjwmdcuNz6bDFiE7Z8XC4CPqExjTvrHugh28QzUXVOZtiYghciKUacNktqxdpymplil1beA==, tarball: https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [netbsd] '@esbuild/netbsd-x64@0.24.0': - resolution: {integrity: sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==} + resolution: {integrity: sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==, tarball: https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [netbsd] '@esbuild/openbsd-arm64@0.23.1': - resolution: {integrity: sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==} + resolution: {integrity: sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==, tarball: https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [openbsd] '@esbuild/openbsd-arm64@0.24.0': - resolution: {integrity: sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==} + resolution: {integrity: sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==, tarball: https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [openbsd] '@esbuild/openbsd-x64@0.21.5': - resolution: {integrity: sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==} + resolution: {integrity: sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==, tarball: https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [openbsd] '@esbuild/openbsd-x64@0.23.1': - resolution: {integrity: sha512-aY2gMmKmPhxfU+0EdnN+XNtGbjfQgwZj43k8G3fyrDM/UdZww6xrWxmDkuz2eCZchqVeABjV5BpildOrUbBTqA==} + resolution: {integrity: sha512-aY2gMmKmPhxfU+0EdnN+XNtGbjfQgwZj43k8G3fyrDM/UdZww6xrWxmDkuz2eCZchqVeABjV5BpildOrUbBTqA==, tarball: https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [openbsd] '@esbuild/openbsd-x64@0.24.0': - resolution: {integrity: sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==} + resolution: {integrity: sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==, tarball: https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [openbsd] '@esbuild/sunos-x64@0.21.5': - resolution: {integrity: sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==} + resolution: {integrity: sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==, tarball: https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [sunos] '@esbuild/sunos-x64@0.23.1': - resolution: {integrity: sha512-RBRT2gqEl0IKQABT4XTj78tpk9v7ehp+mazn2HbUeZl1YMdaGAQqhapjGTCe7uw7y0frDi4gS0uHzhvpFuI1sA==} + resolution: {integrity: sha512-RBRT2gqEl0IKQABT4XTj78tpk9v7ehp+mazn2HbUeZl1YMdaGAQqhapjGTCe7uw7y0frDi4gS0uHzhvpFuI1sA==, tarball: https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [sunos] '@esbuild/sunos-x64@0.24.0': - resolution: {integrity: sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==} + resolution: {integrity: sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==, tarball: https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [sunos] '@esbuild/win32-arm64@0.21.5': - resolution: {integrity: sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==} + resolution: {integrity: sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==, tarball: https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz} engines: {node: '>=12'} cpu: [arm64] os: [win32] '@esbuild/win32-arm64@0.23.1': - resolution: {integrity: sha512-4O+gPR5rEBe2FpKOVyiJ7wNDPA8nGzDuJ6gN4okSA1gEOYZ67N8JPk58tkWtdtPeLz7lBnY6I5L3jdsr3S+A6A==} + resolution: {integrity: sha512-4O+gPR5rEBe2FpKOVyiJ7wNDPA8nGzDuJ6gN4okSA1gEOYZ67N8JPk58tkWtdtPeLz7lBnY6I5L3jdsr3S+A6A==, tarball: https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.23.1.tgz} engines: {node: '>=18'} cpu: [arm64] os: [win32] '@esbuild/win32-arm64@0.24.0': - resolution: {integrity: sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==} + resolution: {integrity: sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==, tarball: https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.24.0.tgz} engines: {node: '>=18'} cpu: [arm64] os: [win32] '@esbuild/win32-ia32@0.21.5': - resolution: {integrity: sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==} + resolution: {integrity: sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==, tarball: https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz} engines: {node: '>=12'} cpu: [ia32] os: [win32] '@esbuild/win32-ia32@0.23.1': - resolution: {integrity: sha512-BcaL0Vn6QwCwre3Y717nVHZbAa4UBEigzFm6VdsVdT/MbZ38xoj1X9HPkZhbmaBGUD1W8vxAfffbDe8bA6AKnQ==} + resolution: {integrity: sha512-BcaL0Vn6QwCwre3Y717nVHZbAa4UBEigzFm6VdsVdT/MbZ38xoj1X9HPkZhbmaBGUD1W8vxAfffbDe8bA6AKnQ==, tarball: https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.23.1.tgz} engines: {node: '>=18'} cpu: [ia32] os: [win32] '@esbuild/win32-ia32@0.24.0': - resolution: {integrity: sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==} + resolution: {integrity: sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==, tarball: https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.24.0.tgz} engines: {node: '>=18'} cpu: [ia32] os: [win32] '@esbuild/win32-x64@0.21.5': - resolution: {integrity: sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==} + resolution: {integrity: sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==, tarball: https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz} engines: {node: '>=12'} cpu: [x64] os: [win32] '@esbuild/win32-x64@0.23.1': - resolution: {integrity: sha512-BHpFFeslkWrXWyUPnbKm+xYYVYruCinGcftSBaa8zoF9hZO4BcSCFUvHVTtzpIY6YzUnYtuEhZ+C9iEXjxnasg==} + resolution: {integrity: sha512-BHpFFeslkWrXWyUPnbKm+xYYVYruCinGcftSBaa8zoF9hZO4BcSCFUvHVTtzpIY6YzUnYtuEhZ+C9iEXjxnasg==, tarball: https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.23.1.tgz} engines: {node: '>=18'} cpu: [x64] os: [win32] '@esbuild/win32-x64@0.24.0': - resolution: {integrity: sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==} + resolution: {integrity: sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==, tarball: https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.24.0.tgz} engines: {node: '>=18'} cpu: [x64] os: [win32] @@ -2318,7 +2318,7 @@ packages: resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==} '@jridgewell/trace-mapping@0.3.9': - resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==} + resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==, tarball: https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz} '@kwsites/file-exists@1.1.1': resolution: {integrity: sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==} @@ -2369,7 +2369,7 @@ packages: resolution: {integrity: sha512-HAPjR3bnCsdXBsATpDIP5WCrw0JcACwhhrwIAQhiR46n+jm+a2F8kBsfseAuWtSyQ+H3Yebt2k43B5dy+04yMA==} '@nicolo-ribaudo/chokidar-2@2.1.8-no-fsevents.3': - resolution: {integrity: sha512-s88O1aVtXftvp5bCPB7WnmXc5IwOZZ7YPuwNPt+GtOOXpPvad1LfbmjYv+qII7zP6RU2QGnqve27dnLycEnyEQ==} + resolution: {integrity: sha512-s88O1aVtXftvp5bCPB7WnmXc5IwOZZ7YPuwNPt+GtOOXpPvad1LfbmjYv+qII7zP6RU2QGnqve27dnLycEnyEQ==, tarball: https://registry.npmjs.org/@nicolo-ribaudo/chokidar-2/-/chokidar-2-2.1.8-no-fsevents.3.tgz} '@nicolo-ribaudo/eslint-scope-5-internals@5.1.1-v1': resolution: {integrity: sha512-54/JRvkLIzzDWshCWfuhadfrfZVPiElY8Fcgmg1HroEly/EDSszzhBAsarCux+D/kOslTRquNzuyGSmUSTTHGg==} @@ -2386,14 +2386,14 @@ packages: resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==} engines: {node: '>= 8'} - '@nutui/icons-react-taro@2.0.1': - resolution: {integrity: sha512-/DYmt8Rfp0NGx37/67Nd+k85zB2sJMLjlJiLpLbKxXk75SY0inwka51HhgawFTUk53zeta0CH/sDscTZdN005w==} + '@nutui/icons-react-taro@3.0.1-beta.1': + resolution: {integrity: sha512-ZWsNgmApFEqczvVnjuGK0V73Tz8DXantIE2rJ4niF9Wo59ul1xz7nJGhHHSQeQDvkQEziSTCOL/6pu/6yEMAmg==, tarball: https://registry.npmjs.org/@nutui/icons-react-taro/-/icons-react-taro-3.0.1-beta.1.tgz} '@nutui/icons-react@1.0.5': resolution: {integrity: sha512-0TYl3Fk+sVz95DKqn/7isYAvaK5YGnaBwMMib4rqYLoqi9GGFwgU9rp2hYXu/X5IYdWgshj0xiuGMK75/vUYbQ==} - '@nutui/icons-react@2.0.1': - resolution: {integrity: sha512-xRgfR52G18DM7/8kb6Giem12G5CxpMo563YKg0HVc27Ch/0+TbB9ODvk0KwY8Wqnn+qMEdpv9UPp1uXj+Rfibg==} + '@nutui/icons-react@3.0.0-beta.1': + resolution: {integrity: sha512-2dpDPy8ZYcUHpqQ+F+/V7DKNDXi3NqJMsra/v79LWZ7k4/fnGKp/XDfsH7dC4LWjvX6PP+jiIB4m+7rYHZ60Dg==, tarball: https://registry.npmjs.org/@nutui/icons-react/-/icons-react-3.0.0-beta.1.tgz} '@nutui/jdesign-icons-react-taro@1.0.6-beta.2': resolution: {integrity: sha512-2Scz5c9o14gA7Mw5JdiEkc/KEbNlNWMcJMuqVyFVipYeeYN/118N/fvHVpocmJviN0Gc4P+u3ZB3dIQSA2j4Fw==} @@ -2462,7 +2462,7 @@ packages: resolution: {integrity: sha512-HdqWTf5Z3qwDVlzCrP8UJquMwunpDiMPt5er+QjGzL4hqr/vBVY/MauQgS1xWxCDT1oMx1EULyqxncdCY/NVSQ==} '@pkgjs/parseargs@0.11.0': - resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==} + resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==, tarball: https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz} engines: {node: '>=14'} '@pkgr/core@0.1.1': @@ -2667,177 +2667,177 @@ packages: optional: true '@rollup/rollup-android-arm-eabi@4.21.1': - resolution: {integrity: sha512-2thheikVEuU7ZxFXubPDOtspKn1x0yqaYQwvALVtEcvFhMifPADBrgRPyHV0TF3b+9BgvgjgagVyvA/UqPZHmg==} + resolution: {integrity: sha512-2thheikVEuU7ZxFXubPDOtspKn1x0yqaYQwvALVtEcvFhMifPADBrgRPyHV0TF3b+9BgvgjgagVyvA/UqPZHmg==, tarball: https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.21.1.tgz} cpu: [arm] os: [android] '@rollup/rollup-android-arm-eabi@4.28.1': - resolution: {integrity: sha512-2aZp8AES04KI2dy3Ss6/MDjXbwBzj+i0GqKtWXgw2/Ma6E4jJvujryO6gJAghIRVz7Vwr9Gtl/8na3nDUKpraQ==} + resolution: {integrity: sha512-2aZp8AES04KI2dy3Ss6/MDjXbwBzj+i0GqKtWXgw2/Ma6E4jJvujryO6gJAghIRVz7Vwr9Gtl/8na3nDUKpraQ==, tarball: https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.28.1.tgz} cpu: [arm] os: [android] '@rollup/rollup-android-arm64@4.21.1': - resolution: {integrity: sha512-t1lLYn4V9WgnIFHXy1d2Di/7gyzBWS8G5pQSXdZqfrdCGTwi1VasRMSS81DTYb+avDs/Zz4A6dzERki5oRYz1g==} + resolution: {integrity: sha512-t1lLYn4V9WgnIFHXy1d2Di/7gyzBWS8G5pQSXdZqfrdCGTwi1VasRMSS81DTYb+avDs/Zz4A6dzERki5oRYz1g==, tarball: https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.21.1.tgz} cpu: [arm64] os: [android] '@rollup/rollup-android-arm64@4.28.1': - resolution: {integrity: sha512-EbkK285O+1YMrg57xVA+Dp0tDBRB93/BZKph9XhMjezf6F4TpYjaUSuPt5J0fZXlSag0LmZAsTmdGGqPp4pQFA==} + resolution: {integrity: sha512-EbkK285O+1YMrg57xVA+Dp0tDBRB93/BZKph9XhMjezf6F4TpYjaUSuPt5J0fZXlSag0LmZAsTmdGGqPp4pQFA==, tarball: https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.28.1.tgz} cpu: [arm64] os: [android] '@rollup/rollup-darwin-arm64@4.21.1': - resolution: {integrity: sha512-AH/wNWSEEHvs6t4iJ3RANxW5ZCK3fUnmf0gyMxWCesY1AlUj8jY7GC+rQE4wd3gwmZ9XDOpL0kcFnCjtN7FXlA==} + resolution: {integrity: sha512-AH/wNWSEEHvs6t4iJ3RANxW5ZCK3fUnmf0gyMxWCesY1AlUj8jY7GC+rQE4wd3gwmZ9XDOpL0kcFnCjtN7FXlA==, tarball: https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.21.1.tgz} cpu: [arm64] os: [darwin] '@rollup/rollup-darwin-arm64@4.28.1': - resolution: {integrity: sha512-prduvrMKU6NzMq6nxzQw445zXgaDBbMQvmKSJaxpaZ5R1QDM8w+eGxo6Y/jhT/cLoCvnZI42oEqf9KQNYz1fqQ==} + resolution: {integrity: sha512-prduvrMKU6NzMq6nxzQw445zXgaDBbMQvmKSJaxpaZ5R1QDM8w+eGxo6Y/jhT/cLoCvnZI42oEqf9KQNYz1fqQ==, tarball: https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.28.1.tgz} cpu: [arm64] os: [darwin] '@rollup/rollup-darwin-x64@4.21.1': - resolution: {integrity: sha512-dO0BIz/+5ZdkLZrVgQrDdW7m2RkrLwYTh2YMFG9IpBtlC1x1NPNSXkfczhZieOlOLEqgXOFH3wYHB7PmBtf+Bg==} + resolution: {integrity: sha512-dO0BIz/+5ZdkLZrVgQrDdW7m2RkrLwYTh2YMFG9IpBtlC1x1NPNSXkfczhZieOlOLEqgXOFH3wYHB7PmBtf+Bg==, tarball: https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.21.1.tgz} cpu: [x64] os: [darwin] '@rollup/rollup-darwin-x64@4.28.1': - resolution: {integrity: sha512-WsvbOunsUk0wccO/TV4o7IKgloJ942hVFK1CLatwv6TJspcCZb9umQkPdvB7FihmdxgaKR5JyxDjWpCOp4uZlQ==} + resolution: {integrity: sha512-WsvbOunsUk0wccO/TV4o7IKgloJ942hVFK1CLatwv6TJspcCZb9umQkPdvB7FihmdxgaKR5JyxDjWpCOp4uZlQ==, tarball: https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.28.1.tgz} cpu: [x64] os: [darwin] '@rollup/rollup-freebsd-arm64@4.28.1': - resolution: {integrity: sha512-HTDPdY1caUcU4qK23FeeGxCdJF64cKkqajU0iBnTVxS8F7H/7BewvYoG+va1KPSL63kQ1PGNyiwKOfReavzvNA==} + resolution: {integrity: sha512-HTDPdY1caUcU4qK23FeeGxCdJF64cKkqajU0iBnTVxS8F7H/7BewvYoG+va1KPSL63kQ1PGNyiwKOfReavzvNA==, tarball: https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.28.1.tgz} cpu: [arm64] os: [freebsd] '@rollup/rollup-freebsd-x64@4.28.1': - resolution: {integrity: sha512-m/uYasxkUevcFTeRSM9TeLyPe2QDuqtjkeoTpP9SW0XxUWfcYrGDMkO/m2tTw+4NMAF9P2fU3Mw4ahNvo7QmsQ==} + resolution: {integrity: sha512-m/uYasxkUevcFTeRSM9TeLyPe2QDuqtjkeoTpP9SW0XxUWfcYrGDMkO/m2tTw+4NMAF9P2fU3Mw4ahNvo7QmsQ==, tarball: https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.28.1.tgz} cpu: [x64] os: [freebsd] '@rollup/rollup-linux-arm-gnueabihf@4.21.1': - resolution: {integrity: sha512-sWWgdQ1fq+XKrlda8PsMCfut8caFwZBmhYeoehJ05FdI0YZXk6ZyUjWLrIgbR/VgiGycrFKMMgp7eJ69HOF2pQ==} + resolution: {integrity: sha512-sWWgdQ1fq+XKrlda8PsMCfut8caFwZBmhYeoehJ05FdI0YZXk6ZyUjWLrIgbR/VgiGycrFKMMgp7eJ69HOF2pQ==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.21.1.tgz} cpu: [arm] os: [linux] '@rollup/rollup-linux-arm-gnueabihf@4.28.1': - resolution: {integrity: sha512-QAg11ZIt6mcmzpNE6JZBpKfJaKkqTm1A9+y9O+frdZJEuhQxiugM05gnCWiANHj4RmbgeVJpTdmKRmH/a+0QbA==} + resolution: {integrity: sha512-QAg11ZIt6mcmzpNE6JZBpKfJaKkqTm1A9+y9O+frdZJEuhQxiugM05gnCWiANHj4RmbgeVJpTdmKRmH/a+0QbA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.28.1.tgz} cpu: [arm] os: [linux] '@rollup/rollup-linux-arm-musleabihf@4.21.1': - resolution: {integrity: sha512-9OIiSuj5EsYQlmwhmFRA0LRO0dRRjdCVZA3hnmZe1rEwRk11Jy3ECGGq3a7RrVEZ0/pCsYWx8jG3IvcrJ6RCew==} + resolution: {integrity: sha512-9OIiSuj5EsYQlmwhmFRA0LRO0dRRjdCVZA3hnmZe1rEwRk11Jy3ECGGq3a7RrVEZ0/pCsYWx8jG3IvcrJ6RCew==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.21.1.tgz} cpu: [arm] os: [linux] '@rollup/rollup-linux-arm-musleabihf@4.28.1': - resolution: {integrity: sha512-dRP9PEBfolq1dmMcFqbEPSd9VlRuVWEGSmbxVEfiq2cs2jlZAl0YNxFzAQS2OrQmsLBLAATDMb3Z6MFv5vOcXg==} + resolution: {integrity: sha512-dRP9PEBfolq1dmMcFqbEPSd9VlRuVWEGSmbxVEfiq2cs2jlZAl0YNxFzAQS2OrQmsLBLAATDMb3Z6MFv5vOcXg==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.28.1.tgz} cpu: [arm] os: [linux] '@rollup/rollup-linux-arm64-gnu@4.21.1': - resolution: {integrity: sha512-0kuAkRK4MeIUbzQYu63NrJmfoUVicajoRAL1bpwdYIYRcs57iyIV9NLcuyDyDXE2GiZCL4uhKSYAnyWpjZkWow==} + resolution: {integrity: sha512-0kuAkRK4MeIUbzQYu63NrJmfoUVicajoRAL1bpwdYIYRcs57iyIV9NLcuyDyDXE2GiZCL4uhKSYAnyWpjZkWow==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.21.1.tgz} cpu: [arm64] os: [linux] '@rollup/rollup-linux-arm64-gnu@4.28.1': - resolution: {integrity: sha512-uGr8khxO+CKT4XU8ZUH1TTEUtlktK6Kgtv0+6bIFSeiSlnGJHG1tSFSjm41uQ9sAO/5ULx9mWOz70jYLyv1QkA==} + resolution: {integrity: sha512-uGr8khxO+CKT4XU8ZUH1TTEUtlktK6Kgtv0+6bIFSeiSlnGJHG1tSFSjm41uQ9sAO/5ULx9mWOz70jYLyv1QkA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.28.1.tgz} cpu: [arm64] os: [linux] '@rollup/rollup-linux-arm64-musl@4.21.1': - resolution: {integrity: sha512-/6dYC9fZtfEY0vozpc5bx1RP4VrtEOhNQGb0HwvYNwXD1BBbwQ5cKIbUVVU7G2d5WRE90NfB922elN8ASXAJEA==} + resolution: {integrity: sha512-/6dYC9fZtfEY0vozpc5bx1RP4VrtEOhNQGb0HwvYNwXD1BBbwQ5cKIbUVVU7G2d5WRE90NfB922elN8ASXAJEA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.21.1.tgz} cpu: [arm64] os: [linux] '@rollup/rollup-linux-arm64-musl@4.28.1': - resolution: {integrity: sha512-QF54q8MYGAqMLrX2t7tNpi01nvq5RI59UBNx+3+37zoKX5KViPo/gk2QLhsuqok05sSCRluj0D00LzCwBikb0A==} + resolution: {integrity: sha512-QF54q8MYGAqMLrX2t7tNpi01nvq5RI59UBNx+3+37zoKX5KViPo/gk2QLhsuqok05sSCRluj0D00LzCwBikb0A==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.28.1.tgz} cpu: [arm64] os: [linux] '@rollup/rollup-linux-loongarch64-gnu@4.28.1': - resolution: {integrity: sha512-vPul4uodvWvLhRco2w0GcyZcdyBfpfDRgNKU+p35AWEbJ/HPs1tOUrkSueVbBS0RQHAf/A+nNtDpvw95PeVKOA==} + resolution: {integrity: sha512-vPul4uodvWvLhRco2w0GcyZcdyBfpfDRgNKU+p35AWEbJ/HPs1tOUrkSueVbBS0RQHAf/A+nNtDpvw95PeVKOA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.28.1.tgz} cpu: [loong64] os: [linux] '@rollup/rollup-linux-powerpc64le-gnu@4.21.1': - resolution: {integrity: sha512-ltUWy+sHeAh3YZ91NUsV4Xg3uBXAlscQe8ZOXRCVAKLsivGuJsrkawYPUEyCV3DYa9urgJugMLn8Z3Z/6CeyRQ==} + resolution: {integrity: sha512-ltUWy+sHeAh3YZ91NUsV4Xg3uBXAlscQe8ZOXRCVAKLsivGuJsrkawYPUEyCV3DYa9urgJugMLn8Z3Z/6CeyRQ==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.21.1.tgz} cpu: [ppc64] os: [linux] '@rollup/rollup-linux-powerpc64le-gnu@4.28.1': - resolution: {integrity: sha512-pTnTdBuC2+pt1Rmm2SV7JWRqzhYpEILML4PKODqLz+C7Ou2apEV52h19CR7es+u04KlqplggmN9sqZlekg3R1A==} + resolution: {integrity: sha512-pTnTdBuC2+pt1Rmm2SV7JWRqzhYpEILML4PKODqLz+C7Ou2apEV52h19CR7es+u04KlqplggmN9sqZlekg3R1A==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.28.1.tgz} cpu: [ppc64] os: [linux] '@rollup/rollup-linux-riscv64-gnu@4.21.1': - resolution: {integrity: sha512-BggMndzI7Tlv4/abrgLwa/dxNEMn2gC61DCLrTzw8LkpSKel4o+O+gtjbnkevZ18SKkeN3ihRGPuBxjaetWzWg==} + resolution: {integrity: sha512-BggMndzI7Tlv4/abrgLwa/dxNEMn2gC61DCLrTzw8LkpSKel4o+O+gtjbnkevZ18SKkeN3ihRGPuBxjaetWzWg==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.21.1.tgz} cpu: [riscv64] os: [linux] '@rollup/rollup-linux-riscv64-gnu@4.28.1': - resolution: {integrity: sha512-vWXy1Nfg7TPBSuAncfInmAI/WZDd5vOklyLJDdIRKABcZWojNDY0NJwruY2AcnCLnRJKSaBgf/GiJfauu8cQZA==} + resolution: {integrity: sha512-vWXy1Nfg7TPBSuAncfInmAI/WZDd5vOklyLJDdIRKABcZWojNDY0NJwruY2AcnCLnRJKSaBgf/GiJfauu8cQZA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.28.1.tgz} cpu: [riscv64] os: [linux] '@rollup/rollup-linux-s390x-gnu@4.21.1': - resolution: {integrity: sha512-z/9rtlGd/OMv+gb1mNSjElasMf9yXusAxnRDrBaYB+eS1shFm6/4/xDH1SAISO5729fFKUkJ88TkGPRUh8WSAA==} + resolution: {integrity: sha512-z/9rtlGd/OMv+gb1mNSjElasMf9yXusAxnRDrBaYB+eS1shFm6/4/xDH1SAISO5729fFKUkJ88TkGPRUh8WSAA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.21.1.tgz} cpu: [s390x] os: [linux] '@rollup/rollup-linux-s390x-gnu@4.28.1': - resolution: {integrity: sha512-/yqC2Y53oZjb0yz8PVuGOQQNOTwxcizudunl/tFs1aLvObTclTwZ0JhXF2XcPT/zuaymemCDSuuUPXJJyqeDOg==} + resolution: {integrity: sha512-/yqC2Y53oZjb0yz8PVuGOQQNOTwxcizudunl/tFs1aLvObTclTwZ0JhXF2XcPT/zuaymemCDSuuUPXJJyqeDOg==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.28.1.tgz} cpu: [s390x] os: [linux] '@rollup/rollup-linux-x64-gnu@4.21.1': - resolution: {integrity: sha512-kXQVcWqDcDKw0S2E0TmhlTLlUgAmMVqPrJZR+KpH/1ZaZhLSl23GZpQVmawBQGVhyP5WXIsIQ/zqbDBBYmxm5w==} + resolution: {integrity: sha512-kXQVcWqDcDKw0S2E0TmhlTLlUgAmMVqPrJZR+KpH/1ZaZhLSl23GZpQVmawBQGVhyP5WXIsIQ/zqbDBBYmxm5w==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.21.1.tgz} cpu: [x64] os: [linux] '@rollup/rollup-linux-x64-gnu@4.28.1': - resolution: {integrity: sha512-fzgeABz7rrAlKYB0y2kSEiURrI0691CSL0+KXwKwhxvj92VULEDQLpBYLHpF49MSiPG4sq5CK3qHMnb9tlCjBw==} + resolution: {integrity: sha512-fzgeABz7rrAlKYB0y2kSEiURrI0691CSL0+KXwKwhxvj92VULEDQLpBYLHpF49MSiPG4sq5CK3qHMnb9tlCjBw==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.28.1.tgz} cpu: [x64] os: [linux] '@rollup/rollup-linux-x64-musl@4.21.1': - resolution: {integrity: sha512-CbFv/WMQsSdl+bpX6rVbzR4kAjSSBuDgCqb1l4J68UYsQNalz5wOqLGYj4ZI0thGpyX5kc+LLZ9CL+kpqDovZA==} + resolution: {integrity: sha512-CbFv/WMQsSdl+bpX6rVbzR4kAjSSBuDgCqb1l4J68UYsQNalz5wOqLGYj4ZI0thGpyX5kc+LLZ9CL+kpqDovZA==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.21.1.tgz} cpu: [x64] os: [linux] '@rollup/rollup-linux-x64-musl@4.28.1': - resolution: {integrity: sha512-xQTDVzSGiMlSshpJCtudbWyRfLaNiVPXt1WgdWTwWz9n0U12cI2ZVtWe/Jgwyv/6wjL7b66uu61Vg0POWVfz4g==} + resolution: {integrity: sha512-xQTDVzSGiMlSshpJCtudbWyRfLaNiVPXt1WgdWTwWz9n0U12cI2ZVtWe/Jgwyv/6wjL7b66uu61Vg0POWVfz4g==, tarball: https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.28.1.tgz} cpu: [x64] os: [linux] '@rollup/rollup-win32-arm64-msvc@4.21.1': - resolution: {integrity: sha512-3Q3brDgA86gHXWHklrwdREKIrIbxC0ZgU8lwpj0eEKGBQH+31uPqr0P2v11pn0tSIxHvcdOWxa4j+YvLNx1i6g==} + resolution: {integrity: sha512-3Q3brDgA86gHXWHklrwdREKIrIbxC0ZgU8lwpj0eEKGBQH+31uPqr0P2v11pn0tSIxHvcdOWxa4j+YvLNx1i6g==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.21.1.tgz} cpu: [arm64] os: [win32] '@rollup/rollup-win32-arm64-msvc@4.28.1': - resolution: {integrity: sha512-wSXmDRVupJstFP7elGMgv+2HqXelQhuNf+IS4V+nUpNVi/GUiBgDmfwD0UGN3pcAnWsgKG3I52wMOBnk1VHr/A==} + resolution: {integrity: sha512-wSXmDRVupJstFP7elGMgv+2HqXelQhuNf+IS4V+nUpNVi/GUiBgDmfwD0UGN3pcAnWsgKG3I52wMOBnk1VHr/A==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.28.1.tgz} cpu: [arm64] os: [win32] '@rollup/rollup-win32-ia32-msvc@4.21.1': - resolution: {integrity: sha512-tNg+jJcKR3Uwe4L0/wY3Ro0H+u3nrb04+tcq1GSYzBEmKLeOQF2emk1whxlzNqb6MMrQ2JOcQEpuuiPLyRcSIw==} + resolution: {integrity: sha512-tNg+jJcKR3Uwe4L0/wY3Ro0H+u3nrb04+tcq1GSYzBEmKLeOQF2emk1whxlzNqb6MMrQ2JOcQEpuuiPLyRcSIw==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.21.1.tgz} cpu: [ia32] os: [win32] '@rollup/rollup-win32-ia32-msvc@4.28.1': - resolution: {integrity: sha512-ZkyTJ/9vkgrE/Rk9vhMXhf8l9D+eAhbAVbsGsXKy2ohmJaWg0LPQLnIxRdRp/bKyr8tXuPlXhIoGlEB5XpJnGA==} + resolution: {integrity: sha512-ZkyTJ/9vkgrE/Rk9vhMXhf8l9D+eAhbAVbsGsXKy2ohmJaWg0LPQLnIxRdRp/bKyr8tXuPlXhIoGlEB5XpJnGA==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.28.1.tgz} cpu: [ia32] os: [win32] '@rollup/rollup-win32-x64-msvc@4.21.1': - resolution: {integrity: sha512-xGiIH95H1zU7naUyTKEyOA/I0aexNMUdO9qRv0bLKN3qu25bBdrxZHqA3PTJ24YNN/GdMzG4xkDcd/GvjuhfLg==} + resolution: {integrity: sha512-xGiIH95H1zU7naUyTKEyOA/I0aexNMUdO9qRv0bLKN3qu25bBdrxZHqA3PTJ24YNN/GdMzG4xkDcd/GvjuhfLg==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.21.1.tgz} cpu: [x64] os: [win32] '@rollup/rollup-win32-x64-msvc@4.28.1': - resolution: {integrity: sha512-ZvK2jBafvttJjoIdKm/Q/Bh7IJ1Ose9IBOwpOXcOvW3ikGTQGmKDgxTC6oCAzW6PynbkKP8+um1du81XJHZ0JA==} + resolution: {integrity: sha512-ZvK2jBafvttJjoIdKm/Q/Bh7IJ1Ose9IBOwpOXcOvW3ikGTQGmKDgxTC6oCAzW6PynbkKP8+um1du81XJHZ0JA==, tarball: https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.28.1.tgz} cpu: [x64] os: [win32] @@ -2903,121 +2903,121 @@ packages: hasBin: true '@swc/core-darwin-arm64@1.10.1': - resolution: {integrity: sha512-NyELPp8EsVZtxH/mEqvzSyWpfPJ1lugpTQcSlMduZLj1EASLO4sC8wt8hmL1aizRlsbjCX+r0PyL+l0xQ64/6Q==} + resolution: {integrity: sha512-NyELPp8EsVZtxH/mEqvzSyWpfPJ1lugpTQcSlMduZLj1EASLO4sC8wt8hmL1aizRlsbjCX+r0PyL+l0xQ64/6Q==, tarball: https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.10.1.tgz} engines: {node: '>=10'} cpu: [arm64] os: [darwin] '@swc/core-darwin-arm64@1.3.96': - resolution: {integrity: sha512-8hzgXYVd85hfPh6mJ9yrG26rhgzCmcLO0h1TIl8U31hwmTbfZLzRitFQ/kqMJNbIBCwmNH1RU2QcJnL3d7f69A==} + resolution: {integrity: sha512-8hzgXYVd85hfPh6mJ9yrG26rhgzCmcLO0h1TIl8U31hwmTbfZLzRitFQ/kqMJNbIBCwmNH1RU2QcJnL3d7f69A==, tarball: https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.3.96.tgz} engines: {node: '>=10'} cpu: [arm64] os: [darwin] '@swc/core-darwin-x64@1.10.1': - resolution: {integrity: sha512-L4BNt1fdQ5ZZhAk5qoDfUnXRabDOXKnXBxMDJ+PWLSxOGBbWE6aJTnu4zbGjJvtot0KM46m2LPAPY8ttknqaZA==} + resolution: {integrity: sha512-L4BNt1fdQ5ZZhAk5qoDfUnXRabDOXKnXBxMDJ+PWLSxOGBbWE6aJTnu4zbGjJvtot0KM46m2LPAPY8ttknqaZA==, tarball: https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.10.1.tgz} engines: {node: '>=10'} cpu: [x64] os: [darwin] '@swc/core-darwin-x64@1.3.96': - resolution: {integrity: sha512-mFp9GFfuPg+43vlAdQZl0WZpZSE8sEzqL7sr/7Reul5McUHP0BaLsEzwjvD035ESfkY8GBZdLpMinblIbFNljQ==} + resolution: {integrity: sha512-mFp9GFfuPg+43vlAdQZl0WZpZSE8sEzqL7sr/7Reul5McUHP0BaLsEzwjvD035ESfkY8GBZdLpMinblIbFNljQ==, tarball: https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.96.tgz} engines: {node: '>=10'} cpu: [x64] os: [darwin] '@swc/core-linux-arm-gnueabihf@1.10.1': - resolution: {integrity: sha512-Y1u9OqCHgvVp2tYQAJ7hcU9qO5brDMIrA5R31rwWQIAKDkJKtv3IlTHF0hrbWk1wPR0ZdngkQSJZple7G+Grvw==} + resolution: {integrity: sha512-Y1u9OqCHgvVp2tYQAJ7hcU9qO5brDMIrA5R31rwWQIAKDkJKtv3IlTHF0hrbWk1wPR0ZdngkQSJZple7G+Grvw==, tarball: https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.10.1.tgz} engines: {node: '>=10'} cpu: [arm] os: [linux] '@swc/core-linux-arm-gnueabihf@1.3.96': - resolution: {integrity: sha512-8UEKkYJP4c8YzYIY/LlbSo8z5Obj4hqcv/fUTHiEePiGsOddgGf7AWjh56u7IoN/0uEmEro59nc1ChFXqXSGyg==} + resolution: {integrity: sha512-8UEKkYJP4c8YzYIY/LlbSo8z5Obj4hqcv/fUTHiEePiGsOddgGf7AWjh56u7IoN/0uEmEro59nc1ChFXqXSGyg==, tarball: https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.96.tgz} engines: {node: '>=10'} cpu: [arm] os: [linux] '@swc/core-linux-arm64-gnu@1.10.1': - resolution: {integrity: sha512-tNQHO/UKdtnqjc7o04iRXng1wTUXPgVd8Y6LI4qIbHVoVPwksZydISjMcilKNLKIwOoUQAkxyJ16SlOAeADzhQ==} + resolution: {integrity: sha512-tNQHO/UKdtnqjc7o04iRXng1wTUXPgVd8Y6LI4qIbHVoVPwksZydISjMcilKNLKIwOoUQAkxyJ16SlOAeADzhQ==, tarball: https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.10.1.tgz} engines: {node: '>=10'} cpu: [arm64] os: [linux] '@swc/core-linux-arm64-gnu@1.3.96': - resolution: {integrity: sha512-c/IiJ0s1y3Ymm2BTpyC/xr6gOvoqAVETrivVXHq68xgNms95luSpbYQ28rqaZC8bQC8M5zdXpSc0T8DJu8RJGw==} + resolution: {integrity: sha512-c/IiJ0s1y3Ymm2BTpyC/xr6gOvoqAVETrivVXHq68xgNms95luSpbYQ28rqaZC8bQC8M5zdXpSc0T8DJu8RJGw==, tarball: https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.96.tgz} engines: {node: '>=10'} cpu: [arm64] os: [linux] '@swc/core-linux-arm64-musl@1.10.1': - resolution: {integrity: sha512-x0L2Pd9weQ6n8dI1z1Isq00VHFvpBClwQJvrt3NHzmR+1wCT/gcYl1tp9P5xHh3ldM8Cn4UjWCw+7PaUgg8FcQ==} + resolution: {integrity: sha512-x0L2Pd9weQ6n8dI1z1Isq00VHFvpBClwQJvrt3NHzmR+1wCT/gcYl1tp9P5xHh3ldM8Cn4UjWCw+7PaUgg8FcQ==, tarball: https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.10.1.tgz} engines: {node: '>=10'} cpu: [arm64] os: [linux] '@swc/core-linux-arm64-musl@1.3.96': - resolution: {integrity: sha512-i5/UTUwmJLri7zhtF6SAo/4QDQJDH2fhYJaBIUhrICmIkRO/ltURmpejqxsM/ye9Jqv5zG7VszMC0v/GYn/7BQ==} + resolution: {integrity: sha512-i5/UTUwmJLri7zhtF6SAo/4QDQJDH2fhYJaBIUhrICmIkRO/ltURmpejqxsM/ye9Jqv5zG7VszMC0v/GYn/7BQ==, tarball: https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.96.tgz} engines: {node: '>=10'} cpu: [arm64] os: [linux] '@swc/core-linux-x64-gnu@1.10.1': - resolution: {integrity: sha512-yyYEwQcObV3AUsC79rSzN9z6kiWxKAVJ6Ntwq2N9YoZqSPYph+4/Am5fM1xEQYf/kb99csj0FgOelomJSobxQA==} + resolution: {integrity: sha512-yyYEwQcObV3AUsC79rSzN9z6kiWxKAVJ6Ntwq2N9YoZqSPYph+4/Am5fM1xEQYf/kb99csj0FgOelomJSobxQA==, tarball: https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.10.1.tgz} engines: {node: '>=10'} cpu: [x64] os: [linux] '@swc/core-linux-x64-gnu@1.3.96': - resolution: {integrity: sha512-USdaZu8lTIkm4Yf9cogct/j5eqtdZqTgcTib4I+NloUW0E/hySou3eSyp3V2UAA1qyuC72ld1otXuyKBna0YKQ==} + resolution: {integrity: sha512-USdaZu8lTIkm4Yf9cogct/j5eqtdZqTgcTib4I+NloUW0E/hySou3eSyp3V2UAA1qyuC72ld1otXuyKBna0YKQ==, tarball: https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.96.tgz} engines: {node: '>=10'} cpu: [x64] os: [linux] '@swc/core-linux-x64-musl@1.10.1': - resolution: {integrity: sha512-tcaS43Ydd7Fk7sW5ROpaf2Kq1zR+sI5K0RM+0qYLYYurvsJruj3GhBCaiN3gkzd8m/8wkqNqtVklWaQYSDsyqA==} + resolution: {integrity: sha512-tcaS43Ydd7Fk7sW5ROpaf2Kq1zR+sI5K0RM+0qYLYYurvsJruj3GhBCaiN3gkzd8m/8wkqNqtVklWaQYSDsyqA==, tarball: https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.10.1.tgz} engines: {node: '>=10'} cpu: [x64] os: [linux] '@swc/core-linux-x64-musl@1.3.96': - resolution: {integrity: sha512-QYErutd+G2SNaCinUVobfL7jWWjGTI0QEoQ6hqTp7PxCJS/dmKmj3C5ZkvxRYcq7XcZt7ovrYCTwPTHzt6lZBg==} + resolution: {integrity: sha512-QYErutd+G2SNaCinUVobfL7jWWjGTI0QEoQ6hqTp7PxCJS/dmKmj3C5ZkvxRYcq7XcZt7ovrYCTwPTHzt6lZBg==, tarball: https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.96.tgz} engines: {node: '>=10'} cpu: [x64] os: [linux] '@swc/core-win32-arm64-msvc@1.10.1': - resolution: {integrity: sha512-D3Qo1voA7AkbOzQ2UGuKNHfYGKL6eejN8VWOoQYtGHHQi1p5KK/Q7V1ku55oxXBsj79Ny5FRMqiRJpVGad7bjQ==} + resolution: {integrity: sha512-D3Qo1voA7AkbOzQ2UGuKNHfYGKL6eejN8VWOoQYtGHHQi1p5KK/Q7V1ku55oxXBsj79Ny5FRMqiRJpVGad7bjQ==, tarball: https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.10.1.tgz} engines: {node: '>=10'} cpu: [arm64] os: [win32] '@swc/core-win32-arm64-msvc@1.3.96': - resolution: {integrity: sha512-hjGvvAduA3Un2cZ9iNP4xvTXOO4jL3G9iakhFsgVhpkU73SGmK7+LN8ZVBEu4oq2SUcHO6caWvnZ881cxGuSpg==} + resolution: {integrity: sha512-hjGvvAduA3Un2cZ9iNP4xvTXOO4jL3G9iakhFsgVhpkU73SGmK7+LN8ZVBEu4oq2SUcHO6caWvnZ881cxGuSpg==, tarball: https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.96.tgz} engines: {node: '>=10'} cpu: [arm64] os: [win32] '@swc/core-win32-ia32-msvc@1.10.1': - resolution: {integrity: sha512-WalYdFoU3454Og+sDKHM1MrjvxUGwA2oralknXkXL8S0I/8RkWZOB++p3pLaGbTvOO++T+6znFbQdR8KRaa7DA==} + resolution: {integrity: sha512-WalYdFoU3454Og+sDKHM1MrjvxUGwA2oralknXkXL8S0I/8RkWZOB++p3pLaGbTvOO++T+6znFbQdR8KRaa7DA==, tarball: https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.10.1.tgz} engines: {node: '>=10'} cpu: [ia32] os: [win32] '@swc/core-win32-ia32-msvc@1.3.96': - resolution: {integrity: sha512-Far2hVFiwr+7VPCM2GxSmbh3ikTpM3pDombE+d69hkedvYHYZxtTF+2LTKl/sXtpbUnsoq7yV/32c9R/xaaWfw==} + resolution: {integrity: sha512-Far2hVFiwr+7VPCM2GxSmbh3ikTpM3pDombE+d69hkedvYHYZxtTF+2LTKl/sXtpbUnsoq7yV/32c9R/xaaWfw==, tarball: https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.96.tgz} engines: {node: '>=10'} cpu: [ia32] os: [win32] '@swc/core-win32-x64-msvc@1.10.1': - resolution: {integrity: sha512-JWobfQDbTnoqaIwPKQ3DVSywihVXlQMbDuwik/dDWlj33A8oEHcjPOGs4OqcA3RHv24i+lfCQpM3Mn4FAMfacA==} + resolution: {integrity: sha512-JWobfQDbTnoqaIwPKQ3DVSywihVXlQMbDuwik/dDWlj33A8oEHcjPOGs4OqcA3RHv24i+lfCQpM3Mn4FAMfacA==, tarball: https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.10.1.tgz} engines: {node: '>=10'} cpu: [x64] os: [win32] '@swc/core-win32-x64-msvc@1.3.96': - resolution: {integrity: sha512-4VbSAniIu0ikLf5mBX81FsljnfqjoVGleEkCQv4+zRlyZtO3FHoDPkeLVoy6WRlj7tyrRcfUJ4mDdPkbfTO14g==} + resolution: {integrity: sha512-4VbSAniIu0ikLf5mBX81FsljnfqjoVGleEkCQv4+zRlyZtO3FHoDPkeLVoy6WRlj7tyrRcfUJ4mDdPkbfTO14g==, tarball: https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.96.tgz} engines: {node: '>=10'} cpu: [x64] os: [win32] @@ -3097,25 +3097,25 @@ packages: '@tarojs/shared': 4.0.8-beta.1 '@tarojs/binding-darwin-arm64@4.0.8-beta.1': - resolution: {integrity: sha512-+uZyAnNzJS7SZDiq2dfz6CpsLfJQbvu2IkSfpvzBbUVkCx1aVBcJyd3KOfj/2XyKtmy7KL6/ErE5dCAlyZHZYQ==} + resolution: {integrity: sha512-+uZyAnNzJS7SZDiq2dfz6CpsLfJQbvu2IkSfpvzBbUVkCx1aVBcJyd3KOfj/2XyKtmy7KL6/ErE5dCAlyZHZYQ==, tarball: https://registry.npmjs.org/@tarojs/binding-darwin-arm64/-/binding-darwin-arm64-4.0.8-beta.1.tgz} engines: {node: '>= 18'} cpu: [arm64] os: [darwin] '@tarojs/binding-darwin-x64@4.0.8-beta.1': - resolution: {integrity: sha512-8PfLles6fInzsX2CFA7ER9W3IxJaCDrzg2QT0Bf9ojK1mhAkM3arPxF1cLcFUh1qy4CcE10ffuFRuLADly9ftQ==} + resolution: {integrity: sha512-8PfLles6fInzsX2CFA7ER9W3IxJaCDrzg2QT0Bf9ojK1mhAkM3arPxF1cLcFUh1qy4CcE10ffuFRuLADly9ftQ==, tarball: https://registry.npmjs.org/@tarojs/binding-darwin-x64/-/binding-darwin-x64-4.0.8-beta.1.tgz} engines: {node: '>= 18'} cpu: [x64] os: [darwin] '@tarojs/binding-linux-x64-gnu@4.0.8-beta.1': - resolution: {integrity: sha512-GOb/Y0Oio+ZWuKV/m/H8B+w/B1TfEMm7XkGUYCaMCh6k1Shib6rNTJU/pFciNnGJmzAH1vkD8/9MIK5SAB/dDQ==} + resolution: {integrity: sha512-GOb/Y0Oio+ZWuKV/m/H8B+w/B1TfEMm7XkGUYCaMCh6k1Shib6rNTJU/pFciNnGJmzAH1vkD8/9MIK5SAB/dDQ==, tarball: https://registry.npmjs.org/@tarojs/binding-linux-x64-gnu/-/binding-linux-x64-gnu-4.0.8-beta.1.tgz} engines: {node: '>= 18'} cpu: [x64] os: [linux] '@tarojs/binding-win32-x64-msvc@4.0.8-beta.1': - resolution: {integrity: sha512-+a7zei9n7lWA2HbHvNgqQ/fwhFapnuGwffeALVpNKNLDtXKXUInmuHdyhBDqMeBov4ilzL26XjZt7phar0lYuQ==} + resolution: {integrity: sha512-+a7zei9n7lWA2HbHvNgqQ/fwhFapnuGwffeALVpNKNLDtXKXUInmuHdyhBDqMeBov4ilzL26XjZt7phar0lYuQ==, tarball: https://registry.npmjs.org/@tarojs/binding-win32-x64-msvc/-/binding-win32-x64-msvc-4.0.8-beta.1.tgz} engines: {node: '>= 18'} cpu: [x64] os: [win32] @@ -3165,66 +3165,66 @@ packages: engines: {node: '>= 18'} '@tarojs/parse-css-to-stylesheet-android-arm-eabi@0.0.69': - resolution: {integrity: sha512-xfn55ehFWjbIzDTu+0QwMkCf8icC7jwAiDm2S7Cv5Og83gSzMUCb76KzEAwgTSTe0wiLrDai2HAhBftpE4V1Qw==} + resolution: {integrity: sha512-xfn55ehFWjbIzDTu+0QwMkCf8icC7jwAiDm2S7Cv5Og83gSzMUCb76KzEAwgTSTe0wiLrDai2HAhBftpE4V1Qw==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-android-arm-eabi/-/parse-css-to-stylesheet-android-arm-eabi-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm] os: [android] '@tarojs/parse-css-to-stylesheet-android-arm64@0.0.69': - resolution: {integrity: sha512-ojVo41qGp+/NUaGGXuuT2/bc0K4H1vzvindeYpUj6LkGL0gQSitdXnviYEnUFqfrMvn7bx1wKTy3uLtADqxgPQ==} + resolution: {integrity: sha512-ojVo41qGp+/NUaGGXuuT2/bc0K4H1vzvindeYpUj6LkGL0gQSitdXnviYEnUFqfrMvn7bx1wKTy3uLtADqxgPQ==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-android-arm64/-/parse-css-to-stylesheet-android-arm64-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [android] '@tarojs/parse-css-to-stylesheet-darwin-arm64@0.0.69': - resolution: {integrity: sha512-xtk3WmfYKvlTxGgxjz6DSqcKmRxXRPG+1bINvvOmcQYbOZtl9cw6X4fC/B204SEv06uC8MYaUZ0z0AbjGzZFrA==} + resolution: {integrity: sha512-xtk3WmfYKvlTxGgxjz6DSqcKmRxXRPG+1bINvvOmcQYbOZtl9cw6X4fC/B204SEv06uC8MYaUZ0z0AbjGzZFrA==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-darwin-arm64/-/parse-css-to-stylesheet-darwin-arm64-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] '@tarojs/parse-css-to-stylesheet-darwin-universal@0.0.69': - resolution: {integrity: sha512-AkXvr4bVy1a8d0xOXxhc05352ubTU2G6h4t1RFuzYJLzMBbQWAI60iHcSaCWhkuV9HUl+3UXv0NoW0NkXq19cw==} + resolution: {integrity: sha512-AkXvr4bVy1a8d0xOXxhc05352ubTU2G6h4t1RFuzYJLzMBbQWAI60iHcSaCWhkuV9HUl+3UXv0NoW0NkXq19cw==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-darwin-universal/-/parse-css-to-stylesheet-darwin-universal-0.0.69.tgz} engines: {node: '>= 10'} os: [darwin] '@tarojs/parse-css-to-stylesheet-darwin-x64@0.0.69': - resolution: {integrity: sha512-3CTu0tXFZ7aLONaIdrZibKqYUD5IyivF6wfE9CYNEbkkxZoJU29dJ2o9kfVpcxFwKq/4BuH1TKWGYCiCOSyo4g==} + resolution: {integrity: sha512-3CTu0tXFZ7aLONaIdrZibKqYUD5IyivF6wfE9CYNEbkkxZoJU29dJ2o9kfVpcxFwKq/4BuH1TKWGYCiCOSyo4g==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-darwin-x64/-/parse-css-to-stylesheet-darwin-x64-0.0.69.tgz} engines: {node: '>= 10'} cpu: [x64] os: [darwin] '@tarojs/parse-css-to-stylesheet-linux-arm-gnueabihf@0.0.69': - resolution: {integrity: sha512-LFx3R8X/JXrBeNnlJOgvOxPTaWF7kUl6NMbOUWQbIfx/opqducTVAqrRF9ev1pYlbkRoQpabls8Z21LXDuYaaw==} + resolution: {integrity: sha512-LFx3R8X/JXrBeNnlJOgvOxPTaWF7kUl6NMbOUWQbIfx/opqducTVAqrRF9ev1pYlbkRoQpabls8Z21LXDuYaaw==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-linux-arm-gnueabihf/-/parse-css-to-stylesheet-linux-arm-gnueabihf-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm] os: [linux] '@tarojs/parse-css-to-stylesheet-linux-arm64-gnu@0.0.69': - resolution: {integrity: sha512-nKlCyYz8NUVI7P8qS3j3tq49ZesGKgoXt3WH5iNPT1PEflxuSgA9T6UcPtUy0X/RolOF6p5Gd/UyhxcY2dUg+A==} + resolution: {integrity: sha512-nKlCyYz8NUVI7P8qS3j3tq49ZesGKgoXt3WH5iNPT1PEflxuSgA9T6UcPtUy0X/RolOF6p5Gd/UyhxcY2dUg+A==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-linux-arm64-gnu/-/parse-css-to-stylesheet-linux-arm64-gnu-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [linux] '@tarojs/parse-css-to-stylesheet-linux-arm64-musl@0.0.69': - resolution: {integrity: sha512-bYODGCEx1Ni4EMNuZU95IUPqVZAXsY9gIc5CPSfKQ2j167Vbeo/gskQk/uNVjmnYJ69PplgJ9npylINgLIPIrA==} + resolution: {integrity: sha512-bYODGCEx1Ni4EMNuZU95IUPqVZAXsY9gIc5CPSfKQ2j167Vbeo/gskQk/uNVjmnYJ69PplgJ9npylINgLIPIrA==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-linux-arm64-musl/-/parse-css-to-stylesheet-linux-arm64-musl-0.0.69.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [linux] '@tarojs/parse-css-to-stylesheet-linux-x64-gnu@0.0.69': - resolution: {integrity: sha512-89f03s+txGJ1c8Zc6Ib4qTAP4YhfFbVFq29XExqbC7eGvpQl5DeOtwonO5DBwMc7lA+LG4b1Q4CMXE3qodn2eA==} + resolution: {integrity: sha512-89f03s+txGJ1c8Zc6Ib4qTAP4YhfFbVFq29XExqbC7eGvpQl5DeOtwonO5DBwMc7lA+LG4b1Q4CMXE3qodn2eA==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-linux-x64-gnu/-/parse-css-to-stylesheet-linux-x64-gnu-0.0.69.tgz} engines: {node: '>= 10'} cpu: [x64] os: [linux] '@tarojs/parse-css-to-stylesheet-linux-x64-musl@0.0.69': - resolution: {integrity: sha512-vyewIf1KysXYNIJdkzc9JSPguTG9zD65Belk3H186mLR18KtsvrqNqlWnP8kKfduF4ixh6qt0F2PkKbeI9PZvg==} + resolution: {integrity: sha512-vyewIf1KysXYNIJdkzc9JSPguTG9zD65Belk3H186mLR18KtsvrqNqlWnP8kKfduF4ixh6qt0F2PkKbeI9PZvg==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-linux-x64-musl/-/parse-css-to-stylesheet-linux-x64-musl-0.0.69.tgz} engines: {node: '>= 10'} cpu: [x64] os: [linux] '@tarojs/parse-css-to-stylesheet-win32-x64-msvc@0.0.69': - resolution: {integrity: sha512-CHKlVjAiSAZTFNV8GkfXV88Jy9yyFSvKBAO3++l2KSQUBUWmPX775FbH+god2BOLf5SfAXRPd0HVAEK9qNeHXQ==} + resolution: {integrity: sha512-CHKlVjAiSAZTFNV8GkfXV88Jy9yyFSvKBAO3++l2KSQUBUWmPX775FbH+god2BOLf5SfAXRPd0HVAEK9qNeHXQ==, tarball: https://registry.npmjs.org/@tarojs/parse-css-to-stylesheet-win32-x64-msvc/-/parse-css-to-stylesheet-win32-x64-msvc-0.0.69.tgz} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -3234,60 +3234,60 @@ packages: engines: {node: '>= 10'} '@tarojs/plugin-doctor-darwin-arm64@0.0.13': - resolution: {integrity: sha512-BRqMB6jOflPIVdQEJ5vJ7j1OcEcgg65IPPY9YVNx5MnYE/SoZj6/yWvmDNc507ZEkWd4H1sJ4Jfk7eKUxm44PQ==} + resolution: {integrity: sha512-BRqMB6jOflPIVdQEJ5vJ7j1OcEcgg65IPPY9YVNx5MnYE/SoZj6/yWvmDNc507ZEkWd4H1sJ4Jfk7eKUxm44PQ==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-darwin-arm64/-/plugin-doctor-darwin-arm64-0.0.13.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] '@tarojs/plugin-doctor-darwin-universal@0.0.13': - resolution: {integrity: sha512-qIv94zgybce+Wq6/Bgy+Np+3BM2SYipuuKTg4LU3ALfJ+YxJetYDcbat9GPxulZqyvxKshYaYtusfwzCu+QWEw==} + resolution: {integrity: sha512-qIv94zgybce+Wq6/Bgy+Np+3BM2SYipuuKTg4LU3ALfJ+YxJetYDcbat9GPxulZqyvxKshYaYtusfwzCu+QWEw==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-darwin-universal/-/plugin-doctor-darwin-universal-0.0.13.tgz} engines: {node: '>= 10'} os: [darwin] '@tarojs/plugin-doctor-darwin-x64@0.0.13': - resolution: {integrity: sha512-zjx3OGlcyOTr+VoRcFmQQcsXscwNucpynlhEYS3ZlofVe9qI0LeTMb/jbMriT/W0c1b4nlVaM8sv+HKz4NKUeA==} + resolution: {integrity: sha512-zjx3OGlcyOTr+VoRcFmQQcsXscwNucpynlhEYS3ZlofVe9qI0LeTMb/jbMriT/W0c1b4nlVaM8sv+HKz4NKUeA==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-darwin-x64/-/plugin-doctor-darwin-x64-0.0.13.tgz} engines: {node: '>= 10'} cpu: [x64] os: [darwin] '@tarojs/plugin-doctor-linux-arm-gnueabihf@0.0.13': - resolution: {integrity: sha512-WkViXfZNrB7HRoDySNhm6JG1IaIBmYGWZDwz0BuhkDQPZLfCCy6v01rSo5wfHGdyLnDg6CkENBS1IrdIU9zK+A==} + resolution: {integrity: sha512-WkViXfZNrB7HRoDySNhm6JG1IaIBmYGWZDwz0BuhkDQPZLfCCy6v01rSo5wfHGdyLnDg6CkENBS1IrdIU9zK+A==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-linux-arm-gnueabihf/-/plugin-doctor-linux-arm-gnueabihf-0.0.13.tgz} engines: {node: '>= 10'} cpu: [arm] os: [linux] '@tarojs/plugin-doctor-linux-arm64-gnu@0.0.13': - resolution: {integrity: sha512-C6ZjqhyOqBcI4y+BFXYjBHBZY6441fO5YIoMv3Sc+nAV+LR1vvyGJ95JcC+Vma+sEjxRMP0IO9lvcLRIcrbrsA==} + resolution: {integrity: sha512-C6ZjqhyOqBcI4y+BFXYjBHBZY6441fO5YIoMv3Sc+nAV+LR1vvyGJ95JcC+Vma+sEjxRMP0IO9lvcLRIcrbrsA==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-linux-arm64-gnu/-/plugin-doctor-linux-arm64-gnu-0.0.13.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [linux] '@tarojs/plugin-doctor-linux-arm64-musl@0.0.13': - resolution: {integrity: sha512-V1HnFITOLgHVyQ+OCa1oPFKOtGFRtP91vlbUGfOwMA4GeOVw9g28W/hfTyucTCkfZWlrssLehgW6L2AGAMXh2w==} + resolution: {integrity: sha512-V1HnFITOLgHVyQ+OCa1oPFKOtGFRtP91vlbUGfOwMA4GeOVw9g28W/hfTyucTCkfZWlrssLehgW6L2AGAMXh2w==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-linux-arm64-musl/-/plugin-doctor-linux-arm64-musl-0.0.13.tgz} engines: {node: '>= 10'} cpu: [arm64] os: [linux] '@tarojs/plugin-doctor-linux-x64-gnu@0.0.13': - resolution: {integrity: sha512-oetfzBW60uenPBBF4/NE6Mf0Iwkw1YGqIIBiN++aVQynbWrmMzWBsW8kleZ5vN1npxI9aud9EfRU1uM37DrG2A==} + resolution: {integrity: sha512-oetfzBW60uenPBBF4/NE6Mf0Iwkw1YGqIIBiN++aVQynbWrmMzWBsW8kleZ5vN1npxI9aud9EfRU1uM37DrG2A==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-linux-x64-gnu/-/plugin-doctor-linux-x64-gnu-0.0.13.tgz} engines: {node: '>= 10'} cpu: [x64] os: [linux] '@tarojs/plugin-doctor-linux-x64-musl@0.0.13': - resolution: {integrity: sha512-OdIF/kFwwM0kQPDnpkanhvfWRaAI6EtDmpM9rQA/Lu2QcJq86w5d7X/WSN0U2xF1nialAUrfl79NyIaEzp4Fcw==} + resolution: {integrity: sha512-OdIF/kFwwM0kQPDnpkanhvfWRaAI6EtDmpM9rQA/Lu2QcJq86w5d7X/WSN0U2xF1nialAUrfl79NyIaEzp4Fcw==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-linux-x64-musl/-/plugin-doctor-linux-x64-musl-0.0.13.tgz} engines: {node: '>= 10'} cpu: [x64] os: [linux] '@tarojs/plugin-doctor-win32-ia32-msvc@0.0.13': - resolution: {integrity: sha512-nIbG2SliRhRwACLa1kNMskcfjsihp+3tZQMAxl+LoYUq6JRaWgP3vH2nHkDyZHTCheBTDtAaupqXWrYF3w+U6g==} + resolution: {integrity: sha512-nIbG2SliRhRwACLa1kNMskcfjsihp+3tZQMAxl+LoYUq6JRaWgP3vH2nHkDyZHTCheBTDtAaupqXWrYF3w+U6g==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-win32-ia32-msvc/-/plugin-doctor-win32-ia32-msvc-0.0.13.tgz} engines: {node: '>= 10'} cpu: [ia32] os: [win32] '@tarojs/plugin-doctor-win32-x64-msvc@0.0.13': - resolution: {integrity: sha512-G1mjsGzyeb4TPw7RoqOl4xPPhf5Lfp4BH9hjfBYbGM0RL5UFHmhfzvn2Icrriyk68v2GoQeHroZ2p6qAtbXdBw==} + resolution: {integrity: sha512-G1mjsGzyeb4TPw7RoqOl4xPPhf5Lfp4BH9hjfBYbGM0RL5UFHmhfzvn2Icrriyk68v2GoQeHroZ2p6qAtbXdBw==, tarball: https://registry.npmjs.org/@tarojs/plugin-doctor-win32-x64-msvc/-/plugin-doctor-win32-x64-msvc-0.0.13.tgz} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -3490,7 +3490,7 @@ packages: optional: true '@testing-library/dom@10.4.0': - resolution: {integrity: sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==} + resolution: {integrity: sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==, tarball: https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz} engines: {node: '>=18'} '@testing-library/jest-dom@6.5.0': @@ -3520,16 +3520,16 @@ packages: engines: {node: '>=10.13.0'} '@tsconfig/node10@1.0.11': - resolution: {integrity: sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==} + resolution: {integrity: sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==, tarball: https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz} '@tsconfig/node12@1.0.11': - resolution: {integrity: sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==} + resolution: {integrity: sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==, tarball: https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz} '@tsconfig/node14@1.0.3': - resolution: {integrity: sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==} + resolution: {integrity: sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==, tarball: https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz} '@tsconfig/node16@1.0.4': - resolution: {integrity: sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==} + resolution: {integrity: sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==, tarball: https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz} '@types/acorn@4.0.6': resolution: {integrity: sha512-veQTnWP+1D/xbxVrPC3zHnCZRjSrKfhbMUlEA43iMZLu7EsnTtkJklIuwrCPbOi8YkvDQAiW05VQQFvvz9oieQ==} @@ -3541,7 +3541,7 @@ packages: resolution: {integrity: sha512-ebDJ9b0e702Yr7pWgB0jzm+CX4Srzz8RcXtLJDJB+BSccqMa36uyH/zUsSYao5+BD1ytv3k3rPYCq4mAE1hsXA==} '@types/aria-query@5.0.4': - resolution: {integrity: sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==} + resolution: {integrity: sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==, tarball: https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz} '@types/babel__core@7.20.5': resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==} @@ -3804,7 +3804,7 @@ packages: resolution: {integrity: sha512-WpxBCKWPLr4xSsHgz511rFJAM+wS28w2zEO1QDNY5zM/S8ok70NNfztH0xwhqKyaK0OHCbN98LDAZuy1ctxDkA==} '@types/yauzl@2.10.3': - resolution: {integrity: sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==} + resolution: {integrity: sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==, tarball: https://registry.npmjs.org/@types/yauzl/-/yauzl-2.10.3.tgz} '@typescript-eslint/eslint-plugin@6.21.0': resolution: {integrity: sha512-oy9+hTPCUFpngkEZUSzbf9MxI65wbKFoQYsgPdILTfbUldp5ovUuphZVe4i30emU9M/kP+T64Di0mxl7dSw3MA==} @@ -4178,7 +4178,7 @@ packages: acorn: ^8 acorn-import-attributes@1.9.5: - resolution: {integrity: sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==} + resolution: {integrity: sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==, tarball: https://registry.npmjs.org/acorn-import-attributes/-/acorn-import-attributes-1.9.5.tgz} peerDependencies: acorn: ^8 @@ -4350,7 +4350,7 @@ packages: engines: {node: '>=14'} arg@4.1.3: - resolution: {integrity: sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==} + resolution: {integrity: sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==, tarball: https://registry.npmjs.org/arg/-/arg-4.1.3.tgz} arg@5.0.2: resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==} @@ -4503,7 +4503,7 @@ packages: engines: {node: '>= 4.0.0'} atob@2.1.2: - resolution: {integrity: sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==} + resolution: {integrity: sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==, tarball: https://registry.npmjs.org/atob/-/atob-2.1.2.tgz} engines: {node: '>= 4.5.0'} hasBin: true @@ -4649,7 +4649,7 @@ packages: resolution: {integrity: sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==} bare-events@2.4.2: - resolution: {integrity: sha512-qMKFd2qG/36aA4GwvKq8MxnPgCQAmBWmSyLWsJcbn8v03wvIPQ/hG1Ms8bPzndZxMDoHpxez5VOS+gC9Yi24/Q==} + resolution: {integrity: sha512-qMKFd2qG/36aA4GwvKq8MxnPgCQAmBWmSyLWsJcbn8v03wvIPQ/hG1Ms8bPzndZxMDoHpxez5VOS+gC9Yi24/Q==, tarball: https://registry.npmjs.org/bare-events/-/bare-events-2.4.2.tgz} base64-js@1.5.1: resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==} @@ -5275,7 +5275,7 @@ packages: hasBin: true create-require@1.1.1: - resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==} + resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==, tarball: https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz} cross-spawn-async@2.2.5: resolution: {integrity: sha512-snteb3aVrxYYOX9e8BabYFK9WhCDhTlw1YQktfTthBogxri4/2r9U2nQc0ffY73ZAxezDc+U8gvHAeU1wy1ubQ==} @@ -5373,7 +5373,7 @@ packages: resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==} css@3.0.0: - resolution: {integrity: sha512-DG9pFfwOrzc+hawpmqX/dHYHJG+Bsdb0klhyi1sDneOgGOXy9wQIC8hzyVp1e4NRYDBdxcylvywPkkXCHAzTyQ==} + resolution: {integrity: sha512-DG9pFfwOrzc+hawpmqX/dHYHJG+Bsdb0klhyi1sDneOgGOXy9wQIC8hzyVp1e4NRYDBdxcylvywPkkXCHAzTyQ==, tarball: https://registry.npmjs.org/css/-/css-3.0.0.tgz} cssesc@3.0.0: resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==} @@ -5474,7 +5474,7 @@ packages: optional: true debug@3.1.0: - resolution: {integrity: sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==} + resolution: {integrity: sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==, tarball: https://registry.npmjs.org/debug/-/debug-3.1.0.tgz} peerDependencies: supports-color: '*' peerDependenciesMeta: @@ -5688,7 +5688,7 @@ packages: engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0} diff@4.0.2: - resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==} + resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==, tarball: https://registry.npmjs.org/diff/-/diff-4.0.2.tgz} engines: {node: '>=0.3.1'} dingtalk-jsapi@2.15.4: @@ -5711,7 +5711,7 @@ packages: engines: {node: '>=6.0.0'} dom-accessibility-api@0.5.16: - resolution: {integrity: sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==} + resolution: {integrity: sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==, tarball: https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz} dom-accessibility-api@0.6.3: resolution: {integrity: sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==} @@ -5854,7 +5854,7 @@ packages: engines: {node: '>=18'} errno@0.1.8: - resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==} + resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==, tarball: https://registry.npmjs.org/errno/-/errno-0.1.8.tgz} hasBin: true error-ex@1.3.2: @@ -6669,7 +6669,7 @@ packages: resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==} fsevents@2.3.3: - resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==} + resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==, tarball: https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz} engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} os: [darwin] @@ -7169,7 +7169,7 @@ packages: engines: {node: '>= 4'} image-size@0.5.5: - resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==} + resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==, tarball: https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz} engines: {node: '>=0.10.0'} hasBin: true @@ -8059,7 +8059,7 @@ packages: hasBin: true less@4.2.0: - resolution: {integrity: sha512-P3b3HJDBtSzsXUl0im2L7gTO5Ubg8mEN6G8qoTS77iXxXX4Hvu4Qj540PZDvQ8V6DmX6iXo98k7Md0Cm1PrLaA==} + resolution: {integrity: sha512-P3b3HJDBtSzsXUl0im2L7gTO5Ubg8mEN6G8qoTS77iXxXX4Hvu4Qj540PZDvQ8V6DmX6iXo98k7Md0Cm1PrLaA==, tarball: https://registry.npmjs.org/less/-/less-4.2.0.tgz} engines: {node: '>=6'} hasBin: true @@ -8076,61 +8076,61 @@ packages: engines: {node: '>=10.13.0'} lightningcss-darwin-arm64@1.26.0: - resolution: {integrity: sha512-n4TIvHO1NY1ondKFYpL2ZX0bcC2y6yjXMD6JfyizgR8BCFNEeArINDzEaeqlfX9bXz73Bpz/Ow0nu+1qiDrBKg==} + resolution: {integrity: sha512-n4TIvHO1NY1ondKFYpL2ZX0bcC2y6yjXMD6JfyizgR8BCFNEeArINDzEaeqlfX9bXz73Bpz/Ow0nu+1qiDrBKg==, tarball: https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [darwin] lightningcss-darwin-x64@1.26.0: - resolution: {integrity: sha512-Rf9HuHIDi1R6/zgBkJh25SiJHF+dm9axUZW/0UoYCW1/8HV0gMI0blARhH4z+REmWiU1yYT/KyNF3h7tHyRXUg==} + resolution: {integrity: sha512-Rf9HuHIDi1R6/zgBkJh25SiJHF+dm9axUZW/0UoYCW1/8HV0gMI0blARhH4z+REmWiU1yYT/KyNF3h7tHyRXUg==, tarball: https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [x64] os: [darwin] lightningcss-freebsd-x64@1.26.0: - resolution: {integrity: sha512-C/io7POAxp6sZxFSVGezjajMlCKQ8KSwISLLGRq8xLQpQMokYrUoqYEwmIX8mLmF6C/CZPk0gFmRSzd8biWM0g==} + resolution: {integrity: sha512-C/io7POAxp6sZxFSVGezjajMlCKQ8KSwISLLGRq8xLQpQMokYrUoqYEwmIX8mLmF6C/CZPk0gFmRSzd8biWM0g==, tarball: https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [x64] os: [freebsd] lightningcss-linux-arm-gnueabihf@1.26.0: - resolution: {integrity: sha512-Aag9kqXqkyPSW+dXMgyWk66C984Nay2pY8Nws+67gHlDzV3cWh7TvFlzuaTaVFMVqdDTzN484LSK3u39zFBnzg==} + resolution: {integrity: sha512-Aag9kqXqkyPSW+dXMgyWk66C984Nay2pY8Nws+67gHlDzV3cWh7TvFlzuaTaVFMVqdDTzN484LSK3u39zFBnzg==, tarball: https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [arm] os: [linux] lightningcss-linux-arm64-gnu@1.26.0: - resolution: {integrity: sha512-iJmZM7fUyVjH+POtdiCtExG+67TtPUTer7K/5A8DIfmPfrmeGvzfRyBltGhQz13Wi15K1lf2cPYoRaRh6vcwNA==} + resolution: {integrity: sha512-iJmZM7fUyVjH+POtdiCtExG+67TtPUTer7K/5A8DIfmPfrmeGvzfRyBltGhQz13Wi15K1lf2cPYoRaRh6vcwNA==, tarball: https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] lightningcss-linux-arm64-musl@1.26.0: - resolution: {integrity: sha512-XxoEL++tTkyuvu+wq/QS8bwyTXZv2y5XYCMcWL45b8XwkiS8eEEEej9BkMGSRwxa5J4K+LDeIhLrS23CpQyfig==} + resolution: {integrity: sha512-XxoEL++tTkyuvu+wq/QS8bwyTXZv2y5XYCMcWL45b8XwkiS8eEEEej9BkMGSRwxa5J4K+LDeIhLrS23CpQyfig==, tarball: https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] lightningcss-linux-x64-gnu@1.26.0: - resolution: {integrity: sha512-1dkTfZQAYLj8MUSkd6L/+TWTG8V6Kfrzfa0T1fSlXCXQHrt1HC1/UepXHtKHDt/9yFwyoeayivxXAsApVxn6zA==} + resolution: {integrity: sha512-1dkTfZQAYLj8MUSkd6L/+TWTG8V6Kfrzfa0T1fSlXCXQHrt1HC1/UepXHtKHDt/9yFwyoeayivxXAsApVxn6zA==, tarball: https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] lightningcss-linux-x64-musl@1.26.0: - resolution: {integrity: sha512-yX3Rk9m00JGCUzuUhFEojY+jf/6zHs3XU8S8Vk+FRbnr4St7cjyMXdNjuA2LjiT8e7j8xHRCH8hyZ4H/btRE4A==} + resolution: {integrity: sha512-yX3Rk9m00JGCUzuUhFEojY+jf/6zHs3XU8S8Vk+FRbnr4St7cjyMXdNjuA2LjiT8e7j8xHRCH8hyZ4H/btRE4A==, tarball: https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] lightningcss-win32-arm64-msvc@1.26.0: - resolution: {integrity: sha512-X/597/cFnCogy9VItj/+7Tgu5VLbAtDF7KZDPdSw0MaL6FL940th1y3HiOzFIlziVvAtbo0RB3NAae1Oofr+Tw==} + resolution: {integrity: sha512-X/597/cFnCogy9VItj/+7Tgu5VLbAtDF7KZDPdSw0MaL6FL940th1y3HiOzFIlziVvAtbo0RB3NAae1Oofr+Tw==, tarball: https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [win32] lightningcss-win32-x64-msvc@1.26.0: - resolution: {integrity: sha512-pYS3EyGP3JRhfqEFYmfFDiZ9/pVNfy8jVIYtrx9TVNusVyDK3gpW1w/rbvroQ4bDJi7grdUtyrYU6V2xkY/bBw==} + resolution: {integrity: sha512-pYS3EyGP3JRhfqEFYmfFDiZ9/pVNfy8jVIYtrx9TVNusVyDK3gpW1w/rbvroQ4bDJi7grdUtyrYU6V2xkY/bBw==, tarball: https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.26.0.tgz} engines: {node: '>= 12.0.0'} cpu: [x64] os: [win32] @@ -8366,7 +8366,7 @@ packages: engines: {node: '>=12'} lz-string@1.5.0: - resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==} + resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==, tarball: https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz} hasBin: true lzutf8@0.6.3: @@ -8762,10 +8762,10 @@ packages: resolution: {integrity: sha512-o7bOfrU28MEMCBWo83nXv0ROQSBFxJcfCl4f2wTYqah64ipC5RGqLJfvWJTWhlQt2ECVwspSzM8LgvnfMo7TEQ==} miniprogram-compiler@0.2.3: - resolution: {integrity: sha512-/MfFiXTBUwYxnrTbj1hgwk1+qGkMCTL1zi8IReOq/0SPVkUxpx19E89w+ohYCELFXkMfVbD+6ejrHh3Y1u5sVg==} + resolution: {integrity: sha512-/MfFiXTBUwYxnrTbj1hgwk1+qGkMCTL1zi8IReOq/0SPVkUxpx19E89w+ohYCELFXkMfVbD+6ejrHh3Y1u5sVg==, tarball: https://registry.npmjs.org/miniprogram-compiler/-/miniprogram-compiler-0.2.3.tgz} miniprogram-exparser@2.29.1: - resolution: {integrity: sha512-f2LUVYcQ5O664nOHhrEbtR//hlqln88dRY0mIwuRncJfuXMCdK9FBk0vzNDG6EgaaeTt3iGLeFQLRHlhYktkXw==} + resolution: {integrity: sha512-f2LUVYcQ5O664nOHhrEbtR//hlqln88dRY0mIwuRncJfuXMCdK9FBk0vzNDG6EgaaeTt3iGLeFQLRHlhYktkXw==, tarball: https://registry.npmjs.org/miniprogram-exparser/-/miniprogram-exparser-2.29.1.tgz} miniprogram-simulate@1.6.1: resolution: {integrity: sha512-WO+T1A1fYZV6qW4mLNEl/+Rtdpw339mPd8q0KkyGHUFbRCIMzIHVutn2UrhUbn6UWZpkGurKwDUckNkpLhJ9QA==} @@ -8855,7 +8855,7 @@ packages: hasBin: true native-request@1.1.2: - resolution: {integrity: sha512-/etjwrK0J4Ebbcnt35VMWnfiUX/B04uwGJxyJInagxDqf2z5drSt/lsOvEMWGYunz1kaLZAFrV4NDAbOoDKvAQ==} + resolution: {integrity: sha512-/etjwrK0J4Ebbcnt35VMWnfiUX/B04uwGJxyJInagxDqf2z5drSt/lsOvEMWGYunz1kaLZAFrV4NDAbOoDKvAQ==, tarball: https://registry.npmjs.org/native-request/-/native-request-1.1.2.tgz} natural-compare@1.4.0: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} @@ -8865,7 +8865,7 @@ packages: engines: {node: '>=18'} needle@3.3.1: - resolution: {integrity: sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==} + resolution: {integrity: sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==, tarball: https://registry.npmjs.org/needle/-/needle-3.3.1.tgz} engines: {node: '>= 4.4.x'} hasBin: true @@ -9193,7 +9193,7 @@ packages: engines: {node: '>=8'} parse-node-version@1.0.1: - resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==} + resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==, tarball: https://registry.npmjs.org/parse-node-version/-/parse-node-version-1.0.1.tgz} engines: {node: '>= 0.10'} parse-passwd@1.0.0: @@ -9748,7 +9748,7 @@ packages: engines: {node: '>= 10'} pretty-format@27.5.1: - resolution: {integrity: sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==} + resolution: {integrity: sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==, tarball: https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz} engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0} pretty-format@29.7.0: @@ -10329,7 +10329,7 @@ packages: resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==} sax@1.4.1: - resolution: {integrity: sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==} + resolution: {integrity: sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==, tarball: https://registry.npmjs.org/sax/-/sax-1.4.1.tgz} saxes@6.0.0: resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==} @@ -10411,13 +10411,13 @@ packages: resolution: {integrity: sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==} seroval-plugins@1.1.1: - resolution: {integrity: sha512-qNSy1+nUj7hsCOon7AO4wdAIo9P0jrzAMp18XhiOzA6/uO5TKtP7ScozVJ8T293oRIvi5wyCHSM4TrJo/c/GJA==} + resolution: {integrity: sha512-qNSy1+nUj7hsCOon7AO4wdAIo9P0jrzAMp18XhiOzA6/uO5TKtP7ScozVJ8T293oRIvi5wyCHSM4TrJo/c/GJA==, tarball: https://registry.npmjs.org/seroval-plugins/-/seroval-plugins-1.1.1.tgz} engines: {node: '>=10'} peerDependencies: seroval: ^1.0 seroval@1.1.1: - resolution: {integrity: sha512-rqEO6FZk8mv7Hyv4UCj3FD3b6Waqft605TLfsCe/BiaylRpyyMC0b+uA5TJKawX3KzMrdi3wsLbCaLplrQmBvQ==} + resolution: {integrity: sha512-rqEO6FZk8mv7Hyv4UCj3FD3b6Waqft605TLfsCe/BiaylRpyyMC0b+uA5TJKawX3KzMrdi3wsLbCaLplrQmBvQ==, tarball: https://registry.npmjs.org/seroval/-/seroval-1.1.1.tgz} engines: {node: '>=10'} serve-index@1.9.1: @@ -10544,7 +10544,7 @@ packages: engines: {node: '>= 10.0.0', npm: '>= 3.0.0'} solid-js@1.9.3: - resolution: {integrity: sha512-5ba3taPoZGt9GY3YlsCB24kCg0Lv/rie/HTD4kG6h4daZZz7+yK02xn8Vx8dLYBc9i6Ps5JwAbEiqjmKaLB3Ag==} + resolution: {integrity: sha512-5ba3taPoZGt9GY3YlsCB24kCg0Lv/rie/HTD4kG6h4daZZz7+yK02xn8Vx8dLYBc9i6Ps5JwAbEiqjmKaLB3Ag==, tarball: https://registry.npmjs.org/solid-js/-/solid-js-1.9.3.tgz} sort-keys-length@1.0.1: resolution: {integrity: sha512-GRbEOUqCxemTAk/b32F2xa8wDTs+Z1QHOkbhJDQTvv/6G3ZkbJ+frYWsTcc7cBB3Fu4wy4XlLCuNtJuMn7Gsvw==} @@ -10570,7 +10570,7 @@ packages: engines: {node: '>=0.10.0'} source-map-resolve@0.6.0: - resolution: {integrity: sha512-KXBr9d/fO/bWo97NXsPIAW1bFSBOuCnjbNTBMO7N59hsv5i9yzRDfcYwwt0l04+VqnKC+EwzvJZIP/qkuMgR/w==} + resolution: {integrity: sha512-KXBr9d/fO/bWo97NXsPIAW1bFSBOuCnjbNTBMO7N59hsv5i9yzRDfcYwwt0l04+VqnKC+EwzvJZIP/qkuMgR/w==, tarball: https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.6.0.tgz} deprecated: See https://github.com/lydell/source-map-resolve#deprecated source-map-support@0.5.13: @@ -10733,7 +10733,7 @@ packages: engines: {node: '>=18'} string.fromcodepoint@0.2.1: - resolution: {integrity: sha512-n69H31OnxSGSZyZbgBlvYIXlrMhJQ0dQAX1js1QDhpaUH6zmU3QYlj07bCwCNlPOu3oRXIubGPl2gDGnHsiCqg==} + resolution: {integrity: sha512-n69H31OnxSGSZyZbgBlvYIXlrMhJQ0dQAX1js1QDhpaUH6zmU3QYlj07bCwCNlPOu3oRXIubGPl2gDGnHsiCqg==, tarball: https://registry.npmjs.org/string.fromcodepoint/-/string.fromcodepoint-0.2.1.tgz} string.prototype.includes@2.0.0: resolution: {integrity: sha512-E34CkBgyeqNDcrbU76cDjL5JLcVrtSdYq0MEh/B10r17pRP4ciHLwTgnuLV8Ay6cgEMLkcBkFCKyFZ43YldYzg==} @@ -10855,7 +10855,7 @@ packages: optional: true stylus@0.55.0: - resolution: {integrity: sha512-MuzIIVRSbc8XxHH7FjkvWqkIcr1BvoMZoR/oFuAJDlh7VSaNJzrB4uJ38GRQa+mWjLXODAMzeDe0xi9GYbGwnw==} + resolution: {integrity: sha512-MuzIIVRSbc8XxHH7FjkvWqkIcr1BvoMZoR/oFuAJDlh7VSaNJzrB4uJ38GRQa+mWjLXODAMzeDe0xi9GYbGwnw==, tarball: https://registry.npmjs.org/stylus/-/stylus-0.55.0.tgz} hasBin: true sucrase@3.35.0: @@ -11156,7 +11156,7 @@ packages: optional: true ts-node@10.9.2: - resolution: {integrity: sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==} + resolution: {integrity: sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==, tarball: https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz} hasBin: true peerDependencies: '@swc/core': '>=1.2.50' @@ -11337,7 +11337,7 @@ packages: resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==} unescape-js@1.1.4: - resolution: {integrity: sha512-42SD8NOQEhdYntEiUQdYq/1V/YHwr1HLwlHuTJB5InVVdOSbgI6xu8jK5q65yIzuFCfczzyDF/7hbGzVbyCw0g==} + resolution: {integrity: sha512-42SD8NOQEhdYntEiUQdYq/1V/YHwr1HLwlHuTJB5InVVdOSbgI6xu8jK5q65yIzuFCfczzyDF/7hbGzVbyCw0g==, tarball: https://registry.npmjs.org/unescape-js/-/unescape-js-1.1.4.tgz} unicode-canonical-property-names-ecmascript@2.0.0: resolution: {integrity: sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==} @@ -11483,7 +11483,7 @@ packages: hasBin: true v8-compile-cache-lib@3.0.1: - resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==} + resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==, tarball: https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz} v8-to-istanbul@9.3.0: resolution: {integrity: sha512-kiGUalWN+rgBJ/1OHZsBtU4rXZOfj/7rKQxULKlIzwzQSvMJUUNgPwJEEh7gU6xEVxC0ahoOBvN2YI8GH6FNgA==} @@ -11814,7 +11814,7 @@ packages: optional: true webpack@5.93.0: - resolution: {integrity: sha512-Y0m5oEY1LRuwly578VqluorkXbvXKh7U3rLoQCEO04M97ScRr44afGVkI0FQFsXzysk5OgFAxjZAb9rsGQVihA==} + resolution: {integrity: sha512-Y0m5oEY1LRuwly578VqluorkXbvXKh7U3rLoQCEO04M97ScRr44afGVkI0FQFsXzysk5OgFAxjZAb9rsGQVihA==, tarball: https://registry.npmjs.org/webpack/-/webpack-5.93.0.tgz} engines: {node: '>=10.13.0'} hasBin: true peerDependencies: @@ -12012,7 +12012,7 @@ packages: resolution: {integrity: sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==} yn@3.1.1: - resolution: {integrity: sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==} + resolution: {integrity: sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==, tarball: https://registry.npmjs.org/yn/-/yn-3.1.1.tgz} engines: {node: '>=6'} yocto-queue@0.1.0: @@ -12571,21 +12571,45 @@ snapshots: dependencies: '@babel/core': 7.26.0 + '@babel/plugin-syntax-async-generators@7.8.4(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-async-generators@7.8.4(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -12612,6 +12636,12 @@ snapshots: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-import-attributes@7.24.7(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-import-attributes@7.24.7(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -12628,11 +12658,23 @@ snapshots: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -12653,6 +12695,12 @@ snapshots: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-logical-assignment-operators@7.10.4(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-logical-assignment-operators@7.10.4(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -12668,16 +12716,34 @@ snapshots: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.24.8 + '@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -12693,11 +12759,23 @@ snapshots: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.24.8 + '@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 '@babel/helper-plugin-utils': 7.25.9 + '@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.25.2)': + dependencies: + '@babel/core': 7.25.2 + '@babel/helper-plugin-utils': 7.25.9 + optional: true + '@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -14815,11 +14893,11 @@ snapshots: '@nodelib/fs.scandir': 2.1.5 fastq: 1.17.1 - '@nutui/icons-react-taro@2.0.1': {} + '@nutui/icons-react-taro@3.0.1-beta.1': {} '@nutui/icons-react@1.0.5': {} - '@nutui/icons-react@2.0.1': {} + '@nutui/icons-react@3.0.0-beta.1': {} '@nutui/jdesign-icons-react-taro@1.0.6-beta.2': {} @@ -17552,6 +17630,20 @@ snapshots: b4a@1.6.6: {} + babel-jest@29.7.0(@babel/core@7.25.2): + dependencies: + '@babel/core': 7.25.2 + '@jest/transform': 29.7.0 + '@types/babel__core': 7.20.5 + babel-plugin-istanbul: 6.1.1 + babel-preset-jest: 29.6.3(@babel/core@7.25.2) + chalk: 4.1.2 + graceful-fs: 4.2.11 + slash: 3.0.0 + transitivePeerDependencies: + - supports-color + optional: true + babel-jest@29.7.0(@babel/core@7.26.0): dependencies: '@babel/core': 7.26.0 @@ -17680,6 +17772,26 @@ snapshots: '@babel/core': 7.26.0 lodash: 4.17.21 + babel-preset-current-node-syntax@1.1.0(@babel/core@7.25.2): + dependencies: + '@babel/core': 7.25.2 + '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.25.2) + '@babel/plugin-syntax-bigint': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-class-properties': 7.12.13(@babel/core@7.25.2) + '@babel/plugin-syntax-class-static-block': 7.14.5(@babel/core@7.25.2) + '@babel/plugin-syntax-import-attributes': 7.24.7(@babel/core@7.25.2) + '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.25.2) + '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.25.2) + '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.25.2) + '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.25.2) + '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.25.2) + '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.25.2) + optional: true + babel-preset-current-node-syntax@1.1.0(@babel/core@7.26.0): dependencies: '@babel/core': 7.26.0 @@ -17699,6 +17811,13 @@ snapshots: '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.26.0) '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.26.0) + babel-preset-jest@29.6.3(@babel/core@7.25.2): + dependencies: + '@babel/core': 7.25.2 + babel-plugin-jest-hoist: 29.6.3 + babel-preset-current-node-syntax: 1.1.0(@babel/core@7.25.2) + optional: true + babel-preset-jest@29.6.3(@babel/core@7.26.0): dependencies: '@babel/core': 7.26.0 @@ -21955,31 +22074,6 @@ snapshots: transitivePeerDependencies: - supports-color - jscodeshift@17.0.0(@babel/preset-env@7.26.0(@babel/core@7.26.0)): - dependencies: - '@babel/core': 7.25.2 - '@babel/parser': 7.25.4 - '@babel/plugin-transform-class-properties': 7.25.4(@babel/core@7.25.2) - '@babel/plugin-transform-modules-commonjs': 7.24.8(@babel/core@7.25.2) - '@babel/plugin-transform-nullish-coalescing-operator': 7.24.7(@babel/core@7.25.2) - '@babel/plugin-transform-optional-chaining': 7.24.8(@babel/core@7.25.2) - '@babel/plugin-transform-private-methods': 7.25.4(@babel/core@7.25.2) - '@babel/preset-flow': 7.24.7(@babel/core@7.25.2) - '@babel/preset-typescript': 7.24.7(@babel/core@7.25.2) - '@babel/register': 7.24.6(@babel/core@7.25.2) - flow-parser: 0.244.0 - graceful-fs: 4.2.11 - micromatch: 4.0.8 - neo-async: 2.6.2 - picocolors: 1.0.1 - recast: 0.23.9 - temp: 0.9.4 - write-file-atomic: 5.0.1 - optionalDependencies: - '@babel/preset-env': 7.26.0(@babel/core@7.26.0) - transitivePeerDependencies: - - supports-color - jsdoc-type-pratt-parser@4.1.0: {} jsdom@24.1.3: @@ -25759,7 +25853,7 @@ snapshots: ts-interface-checker@0.1.13: {} - ts-jest@29.2.5(@babel/core@7.26.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.26.0))(jest@29.7.0(@types/node@20.16.1)(ts-node@10.9.2(@swc/core@1.10.1(@swc/helpers@0.5.15))(@types/node@20.16.1)(typescript@5.7.2)))(typescript@5.7.2): + ts-jest@29.2.5(@babel/core@7.25.2)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.25.2))(jest@29.7.0(@types/node@20.16.1)(ts-node@10.9.2(@swc/core@1.10.1(@swc/helpers@0.5.15))(@types/node@20.16.1)(typescript@5.7.2)))(typescript@5.7.2): dependencies: bs-logger: 0.2.6 ejs: 3.1.10 @@ -25773,10 +25867,10 @@ snapshots: typescript: 5.7.2 yargs-parser: 21.1.1 optionalDependencies: - '@babel/core': 7.26.0 + '@babel/core': 7.25.2 '@jest/transform': 29.7.0 '@jest/types': 29.6.3 - babel-jest: 29.7.0(@babel/core@7.26.0) + babel-jest: 29.7.0(@babel/core@7.25.2) ts-node@10.9.2(@swc/core@1.10.1(@swc/helpers@0.5.15))(@types/node@20.16.1)(typescript@5.7.2): dependencies: diff --git a/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap b/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap index e20a581ba4..da4e2fb170 100644 --- a/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap +++ b/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap @@ -1,7 +1,7 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`Address: exist defaultIcon & selectIcon 1`] = `"
请选择地址
  • 123
    探探鱼
    182****1718
    北京市次渠镇通州区
  • 123
    探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 456
    探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; +exports[`Address: exist defaultIcon & selectIcon 1`] = `"
请选择地址
  • 123
    探探鱼
    182****1718
    北京市次渠镇通州区
  • 123
    探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 456
    探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; -exports[`Address: show custom 1`] = `"
选择地址
请选择
浙江
湖南
福建
"`; +exports[`Address: show custom 1`] = `"
选择地址
请选择
浙江
湖南
福建
"`; -exports[`Address: show exist 1`] = `"
选择地址
  • 探探鱼
    182****1718
    北京市次渠镇通州区
  • ,
    探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • ,
    探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; +exports[`Address: show exist 1`] = `"
选择地址
  • 探探鱼
    182****1718
    北京市次渠镇通州区
  • 探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; diff --git a/src/packages/audio/__test__/__snapshots__/audio.spec.tsx.snap b/src/packages/audio/__test__/__snapshots__/audio.spec.tsx.snap index f66fcf767c..f6ead158f4 100644 --- a/src/packages/audio/__test__/__snapshots__/audio.spec.tsx.snap +++ b/src/packages/audio/__test__/__snapshots__/audio.spec.tsx.snap @@ -15,11 +15,11 @@ exports[`icon type test 1`] = ` aria-labelledby="Service" class="nut-icon nut-icon-Service " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/audio/demos/h5/demo3.tsx b/src/packages/audio/demos/h5/demo3.tsx index 4450bfc567..bc81b0c8eb 100644 --- a/src/packages/audio/demos/h5/demo3.tsx +++ b/src/packages/audio/demos/h5/demo3.tsx @@ -1,17 +1,17 @@ import React, { useState } from 'react' import { Audio } from '@nutui/nutui-react' -import { PlayCircleFill, PoweroffCircleFill } from '@nutui/icons-react' +import { PlayStart, PlayStop } from '@nutui/icons-react' const Demo3 = () => { const [duration, setDuration] = useState(0) - const [voiceIcon, setVoiceIcon] = useState() + const [voiceIcon, setVoiceIcon] = useState() const audioElement = document.querySelectorAll('audio')[2] if (audioElement) { audioElement.addEventListener('playing', (e) => { - setVoiceIcon() + setVoiceIcon() }) audioElement.addEventListener('pause', (e) => { - setVoiceIcon() + setVoiceIcon() }) } return ( diff --git a/src/packages/avatar/demo.tsx b/src/packages/avatar/demo.tsx index 54a44fcf2e..31b4e54eed 100644 --- a/src/packages/avatar/demo.tsx +++ b/src/packages/avatar/demo.tsx @@ -51,7 +51,7 @@ const AvatarDemo = () => { return ( <> -
+

{translated['67f78db5']}

diff --git a/src/packages/avatarcropper/demo.tsx b/src/packages/avatarcropper/demo.tsx index 99036566b0..45d010b55f 100644 --- a/src/packages/avatarcropper/demo.tsx +++ b/src/packages/avatarcropper/demo.tsx @@ -24,7 +24,7 @@ const AvatarCropperDemo = () => { }) return ( <> -
+

{translated.basic}

diff --git a/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap b/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap index 7111d44f28..df296e7a6b 100644 --- a/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap +++ b/src/packages/backtop/__test__/__snapshots__/backtop.spec.tsx.snap @@ -16,11 +16,11 @@ exports[`backtop custom test 1`] = ` aria-labelledby="Top" class="nut-icon nut-icon-Top " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap b/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap index 35c4685cbf..5a005250b0 100644 --- a/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap +++ b/src/packages/badge/__test__/__snapshots__/badge.spec.tsx.snap @@ -10,14 +10,14 @@ exports[`should match custom icon 1`] = ` style="top: 0px; right: 0px;" > diff --git a/src/packages/badge/__test__/badge.spec.tsx b/src/packages/badge/__test__/badge.spec.tsx index 6a9919e66c..657c077ce6 100644 --- a/src/packages/badge/__test__/badge.spec.tsx +++ b/src/packages/badge/__test__/badge.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render } from '@testing-library/react' import '@testing-library/jest-dom' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' import { Badge } from '../badge' test('should match snapshot', () => { @@ -41,6 +41,6 @@ test('should match top、right: float', () => { }) test('should match custom icon', () => { - const { asFragment } = render(} />) + const { asFragment } = render(} />) expect(asFragment()).toMatchSnapshot() }) diff --git a/src/packages/badge/demos/h5/demo1.tsx b/src/packages/badge/demos/h5/demo1.tsx index f627259e76..b8fe1881fd 100644 --- a/src/packages/badge/demos/h5/demo1.tsx +++ b/src/packages/badge/demos/h5/demo1.tsx @@ -1,4 +1,4 @@ -import { Dongdong, User } from '@nutui/icons-react' +import { User } from '@nutui/icons-react' import { Avatar, Badge, Cell } from '@nutui/nutui-react' import React from 'react' @@ -19,7 +19,7 @@ const Demo1 = () => { {renderText()} - + } shape="square" /> @@ -28,7 +28,7 @@ const Demo1 = () => { {renderText()} - + } shape="square" /> @@ -39,7 +39,7 @@ const Demo1 = () => { {renderText()} - + } shape="square" /> diff --git a/src/packages/badge/demos/h5/demo4.tsx b/src/packages/badge/demos/h5/demo4.tsx index 29b41b1695..d9ba9b6a1f 100644 --- a/src/packages/badge/demos/h5/demo4.tsx +++ b/src/packages/badge/demos/h5/demo4.tsx @@ -1,17 +1,17 @@ import React from 'react' import { Badge, Avatar, Cell } from '@nutui/nutui-react' -import { User, Checklist, Link as LinkIcon, Download } from '@nutui/icons-react' +import { User, Check, Link as LinkIcon, Fabulous } from '@nutui/icons-react' const Demo4 = () => { return ( - }> + }> } shape="square" /> }> } shape="square" /> - }> + }> } shape="square" /> diff --git a/src/packages/badge/demos/taro/demo4.tsx b/src/packages/badge/demos/taro/demo4.tsx index fd4442e772..02e4649e1f 100644 --- a/src/packages/badge/demos/taro/demo4.tsx +++ b/src/packages/badge/demos/taro/demo4.tsx @@ -1,17 +1,17 @@ import React from 'react' -import { Checklist, User, Dongdong, Download } from '@nutui/icons-react-taro' +import { Check, User, Dongdong, Fabulous } from '@nutui/icons-react-taro' import { Avatar, Badge, Cell } from '@nutui/nutui-react-taro' const Demo4 = () => { return ( - }> + }> } shape="square" /> }> } shape="square" /> - }> + }> } shape="square" /> diff --git a/src/packages/button/button.scss b/src/packages/button/button.scss index 454700807b..a736beb849 100644 --- a/src/packages/button/button.scss +++ b/src/packages/button/button.scss @@ -1,6 +1,7 @@ .nut-button { position: relative; display: flex; + display: inline-block; /* #ifdef rn harmony*/ width: 80px; /* #endif */ diff --git a/src/packages/cascader/__tests__/__snapshots__/cascader.spec.tsx.snap b/src/packages/cascader/__tests__/__snapshots__/cascader.spec.tsx.snap index db50b5b19b..01a621288e 100644 --- a/src/packages/cascader/__tests__/__snapshots__/cascader.spec.tsx.snap +++ b/src/packages/cascader/__tests__/__snapshots__/cascader.spec.tsx.snap @@ -104,14 +104,14 @@ exports[`Cascader > visible true 1`] = ` 福建
@@ -134,14 +134,14 @@ exports[`Cascader > visible true 1`] = ` 福州
@@ -164,14 +164,14 @@ exports[`Cascader > visible true 1`] = ` 鼓楼区
@@ -206,14 +206,14 @@ exports[`Cascader > visible true 2`] = ` 鼓楼区
diff --git a/src/packages/cascader/cascader.taro.tsx b/src/packages/cascader/cascader.taro.tsx index 00e738a72a..39f7eb8dfc 100644 --- a/src/packages/cascader/cascader.taro.tsx +++ b/src/packages/cascader/cascader.taro.tsx @@ -8,7 +8,7 @@ import React, { useImperativeHandle, } from 'react' import classNames from 'classnames' -import { Loading, Checklist } from '@nutui/icons-react-taro' +import { Loading, Check } from '@nutui/icons-react-taro' import { ScrollView, View } from '@tarojs/components' import { Popup, PopupProps } from '@/packages/popup/popup.taro' import { Tabs } from '@/packages/tabs/tabs.taro' @@ -397,9 +397,7 @@ const InternalCascader: ForwardRefRenderFunction< return activeIcon } return ( - + ) } return null diff --git a/src/packages/cascader/cascader.tsx b/src/packages/cascader/cascader.tsx index c8cb3429b6..bb83aabc3c 100644 --- a/src/packages/cascader/cascader.tsx +++ b/src/packages/cascader/cascader.tsx @@ -8,7 +8,7 @@ import React, { useImperativeHandle, } from 'react' import classNames from 'classnames' -import { Loading, Checklist } from '@nutui/icons-react' +import { Loading, Check } from '@nutui/icons-react' import { Popup, PopupProps } from '@/packages/popup/popup' import { Tabs } from '@/packages/tabs/tabs' import Tree, { convertListToOptions } from './utils' @@ -396,9 +396,7 @@ const InternalCascader: ForwardRefRenderFunction< return activeIcon } return ( - + ) } return null diff --git a/src/packages/checkbox/__test__/__snapshots__/checkbox.spec.tsx.snap b/src/packages/checkbox/__test__/__snapshots__/checkbox.spec.tsx.snap index 43eeb2ebe9..f9fdd2bae0 100644 --- a/src/packages/checkbox/__test__/__snapshots__/checkbox.spec.tsx.snap +++ b/src/packages/checkbox/__test__/__snapshots__/checkbox.spec.tsx.snap @@ -9,11 +9,11 @@ exports[`should match snapshot 1`] = ` aria-labelledby="Checked" class="nut-icon nut-icon-Checked nut-checkbox-icon nut-checkbox-icon-checked" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/checkbox/demos/h5/demo1.tsx b/src/packages/checkbox/demos/h5/demo1.tsx index 8d5225d767..6241f700cd 100644 --- a/src/packages/checkbox/demos/h5/demo1.tsx +++ b/src/packages/checkbox/demos/h5/demo1.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' import { Cell, Checkbox } from '@nutui/nutui-react' const Demo1 = () => { @@ -31,9 +31,7 @@ const Demo1 = () => { - } + activeIcon={} className="test" label={
{ const [controlled, setControlled] = useState(false) @@ -49,25 +49,19 @@ const Demo2 = () => { onChange={(value) => setControlledGroup(value)} > - } + activeIcon={} shape="button" value="1" label={optionsDemo1[0].label} /> - } + activeIcon={} shape="button" value="2" label={optionsDemo1[1].label} /> - } + activeIcon={} shape="button" value="3" label={optionsDemo1[2].label} diff --git a/src/packages/checkbox/demos/h5/demo7.tsx b/src/packages/checkbox/demos/h5/demo7.tsx index 420fe6fd40..b9d6fb624c 100644 --- a/src/packages/checkbox/demos/h5/demo7.tsx +++ b/src/packages/checkbox/demos/h5/demo7.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Checkbox, Cell } from '@nutui/nutui-react' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' const Demo7 = () => { return ( @@ -8,8 +8,8 @@ const Demo7 = () => { } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 @@ -23,16 +23,16 @@ const Demo7 = () => { } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 diff --git a/src/packages/checkbox/demos/taro/demo1.tsx b/src/packages/checkbox/demos/taro/demo1.tsx index 996512e8b4..d788202b18 100644 --- a/src/packages/checkbox/demos/taro/demo1.tsx +++ b/src/packages/checkbox/demos/taro/demo1.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import { View } from '@tarojs/components' -import { Checklist } from '@nutui/icons-react-taro' +import { Check } from '@nutui/icons-react-taro' import { Cell, Checkbox } from '@nutui/nutui-react-taro' const Demo1 = () => { @@ -33,9 +33,7 @@ const Demo1 = () => { - } + activeIcon={} className="test" label={ { const [controlled, setControlled] = useState(false) @@ -48,25 +48,19 @@ const Demo2 = () => { onChange={(value) => setControlledGroup(value)} > - } + activeIcon={} shape="button" value="1" label={optionsDemo1[0].label} /> - } + activeIcon={} shape="button" value="2" label={optionsDemo1[1].label} /> - } + activeIcon={} shape="button" value="3" label={optionsDemo1[2].label} diff --git a/src/packages/checkbox/demos/taro/demo7.tsx b/src/packages/checkbox/demos/taro/demo7.tsx index b308cc0cfd..75c3d5de46 100644 --- a/src/packages/checkbox/demos/taro/demo7.tsx +++ b/src/packages/checkbox/demos/taro/demo7.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Checkbox, Cell } from '@nutui/nutui-react-taro' -import { Checklist } from '@nutui/icons-react-taro' +import { Check } from '@nutui/icons-react-taro' const Demo7 = () => { return ( @@ -8,8 +8,8 @@ const Demo7 = () => { } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 @@ -23,16 +23,16 @@ const Demo7 = () => { } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 } - activeIcon={} + icon={} + activeIcon={} > 自定义图标 diff --git a/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap b/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap index f84a548461..b2fb46115b 100644 --- a/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap +++ b/src/packages/collapse/__test__/__snapshots__/collapse.spec.tsx.snap @@ -34,7 +34,7 @@ exports[`should match snapshot 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -81,7 +81,7 @@ exports[`should match snapshot 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -128,7 +128,7 @@ exports[`should match snapshot 1`] = ` xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/collapse/demos/h5/demo5.tsx b/src/packages/collapse/demos/h5/demo5.tsx index e3c836e211..13045ac2bd 100644 --- a/src/packages/collapse/demos/h5/demo5.tsx +++ b/src/packages/collapse/demos/h5/demo5.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Collapse } from '@nutui/nutui-react' -import { ArrowDown, Checked } from '@nutui/icons-react' +import { ArrowDown, Star } from '@nutui/icons-react' const Demo5 = () => { return ( @@ -10,10 +10,10 @@ const Demo5 = () => { expandIcon={} rotate={90} > - }> + }> 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 - }> + }> 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 diff --git a/src/packages/collapse/demos/h5/demo6.tsx b/src/packages/collapse/demos/h5/demo6.tsx index 3f45991585..32f2d0cff4 100644 --- a/src/packages/collapse/demos/h5/demo6.tsx +++ b/src/packages/collapse/demos/h5/demo6.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Collapse } from '@nutui/nutui-react' -import { ArrowDown, Checked } from '@nutui/icons-react' +import { ArrowDown, Check } from '@nutui/icons-react' const Demo6 = () => { return ( @@ -13,7 +13,7 @@ const Demo6 = () => { alignItems: 'center', }} > - + 标题1
} @@ -29,10 +29,11 @@ const Demo6 = () => { style={{ display: 'flex', alignItems: 'center', + color: '#999', }} > - 标题2 - + 描述 +
} > diff --git a/src/packages/collapse/demos/taro/demo5.tsx b/src/packages/collapse/demos/taro/demo5.tsx index ae7c7c9182..18a9d38291 100644 --- a/src/packages/collapse/demos/taro/demo5.tsx +++ b/src/packages/collapse/demos/taro/demo5.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Collapse } from '@nutui/nutui-react-taro' -import { ArrowDown, Checked } from '@nutui/icons-react-taro' +import { ArrowDown, Star } from '@nutui/icons-react-taro' const Demo5 = () => { return ( @@ -10,10 +10,10 @@ const Demo5 = () => { expandIcon={} rotate={90} > - }> + }> 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 - }> + }> 京东“厂直优品计划”首推“政府优品馆” 3年覆盖80%镇级政府 diff --git a/src/packages/collapse/demos/taro/demo6.tsx b/src/packages/collapse/demos/taro/demo6.tsx index 20fcdefdaf..a41c9d7464 100644 --- a/src/packages/collapse/demos/taro/demo6.tsx +++ b/src/packages/collapse/demos/taro/demo6.tsx @@ -1,7 +1,7 @@ import React from 'react' import { View } from '@tarojs/components' import { Collapse } from '@nutui/nutui-react-taro' -import { ArrowDown, Checked } from '@nutui/icons-react-taro' +import { ArrowDown, Check } from '@nutui/icons-react-taro' const Demo6 = () => { return ( @@ -14,7 +14,7 @@ const Demo6 = () => { alignItems: 'center', }} > - + 标题1 } @@ -30,10 +30,11 @@ const Demo6 = () => { style={{ display: 'flex', alignItems: 'center', + color: '#999', }} > - 标题2 - + 描述2 + } > diff --git a/src/packages/countdown/demos/h5/demo9.tsx b/src/packages/countdown/demos/h5/demo9.tsx index 9ac864375e..2e4d8d84a5 100644 --- a/src/packages/countdown/demos/h5/demo9.tsx +++ b/src/packages/countdown/demos/h5/demo9.tsx @@ -1,5 +1,5 @@ import React, { useRef } from 'react' -import { Cell, CountDown, Grid, Button } from '@nutui/nutui-react' +import { Cell, CountDown, Button, Space } from '@nutui/nutui-react' interface countdownRefState { start: () => void @@ -31,23 +31,17 @@ const Demo9 = () => { ref={countDownRef} /> - - - - - - - - - - - + + + + + ) } diff --git a/src/packages/countdown/demos/taro/demo9.tsx b/src/packages/countdown/demos/taro/demo9.tsx index b3d057a529..46eae3ddc2 100644 --- a/src/packages/countdown/demos/taro/demo9.tsx +++ b/src/packages/countdown/demos/taro/demo9.tsx @@ -1,6 +1,5 @@ import React, { useRef } from 'react' -import { Cell, CountDown, Button, Grid } from '@nutui/nutui-react-taro' -import pxTransform from '@/utils/px-transform' +import { Cell, CountDown, Button, Space } from '@nutui/nutui-react-taro' interface countdownRefState { start: () => void @@ -33,23 +32,17 @@ const Demo9 = () => { /> - - - - - - - - - - - + + + + + ) } diff --git a/src/packages/grid/__test__/__snapshots__/grid.spec.tsx.snap b/src/packages/grid/__test__/__snapshots__/grid.spec.tsx.snap index 37d08bbed1..ae4e9a9fd6 100644 --- a/src/packages/grid/__test__/__snapshots__/grid.spec.tsx.snap +++ b/src/packages/grid/__test__/__snapshots__/grid.spec.tsx.snap @@ -16,17 +16,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -49,17 +43,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -82,17 +70,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -115,17 +97,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -148,17 +124,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -181,17 +151,11 @@ exports[`render with column num 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -223,17 +187,11 @@ exports[`render with custom content 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -267,17 +225,11 @@ exports[`render with custom content 1`] = ` color="#fff" role="presentation" style="color: #fff;" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -303,17 +255,11 @@ exports[`render with custom content 1`] = ` color="#fff" role="presentation" style="color: #fff;" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -348,17 +294,11 @@ exports[`render with custom content 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -388,17 +328,11 @@ exports[`should match snapshot 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -421,17 +355,11 @@ exports[`should match snapshot 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - @@ -454,17 +382,11 @@ exports[`should match snapshot 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - diff --git a/src/packages/hoverbutton/__test__/__snapshots__/hoverbutton.spec.tsx.snap b/src/packages/hoverbutton/__test__/__snapshots__/hoverbutton.spec.tsx.snap index 628e966c95..5291a9d6f4 100644 --- a/src/packages/hoverbutton/__test__/__snapshots__/hoverbutton.spec.tsx.snap +++ b/src/packages/hoverbutton/__test__/__snapshots__/hoverbutton.spec.tsx.snap @@ -18,11 +18,11 @@ exports[`child element count 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > @@ -39,11 +39,11 @@ exports[`child element count 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > @@ -60,11 +60,11 @@ exports[`child element count 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > @@ -81,11 +81,11 @@ exports[`child element count 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > @@ -122,11 +122,11 @@ exports[`emit click event 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > @@ -160,11 +160,11 @@ exports[`tabbar height 1`] = ` aria-labelledby="Cart" class="nut-icon nut-icon-Cart nut-icon" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/hoverbutton/demos/taro/demo3.tsx b/src/packages/hoverbutton/demos/taro/demo3.tsx index ad71b59799..5774a357dc 100644 --- a/src/packages/hoverbutton/demos/taro/demo3.tsx +++ b/src/packages/hoverbutton/demos/taro/demo3.tsx @@ -4,7 +4,7 @@ import React from 'react' import { HoverButton, Tabbar } from '@nutui/nutui-react-taro' import { View } from '@tarojs/components' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' import { harmonyAndRn } from '@/utils/platform-taro' const Demo3 = () => { @@ -15,7 +15,7 @@ const Demo3 = () => { } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/image/__test__/__snapshots__/image.spec.tsx.snap b/src/packages/image/__test__/__snapshots__/image.spec.tsx.snap index 0ac26bf517..64b689afa3 100644 --- a/src/packages/image/__test__/__snapshots__/image.spec.tsx.snap +++ b/src/packages/image/__test__/__snapshots__/image.spec.tsx.snap @@ -19,17 +19,11 @@ exports[`image props test 1`] = ` aria-labelledby="Image" class="nut-icon nut-icon-Image " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > - , - diff --git a/src/packages/inputnumber/inputnumber.scss b/src/packages/inputnumber/inputnumber.scss index 8942026e8a..4596983226 100644 --- a/src/packages/inputnumber/inputnumber.scss +++ b/src/packages/inputnumber/inputnumber.scss @@ -17,8 +17,8 @@ height: $inputnumber-button-height; background-color: $inputnumber-button-background-color; .nut-icon { - --nut-icon-width: 20px; - --nut-icon-height: 20px; + --nut-icon-width: 10px; + --nut-icon-height: 10px; } } diff --git a/src/packages/menu/__test__/__snapshots__/menu.spec.tsx.snap b/src/packages/menu/__test__/__snapshots__/menu.spec.tsx.snap index d2d231afa6..7bd7dd4e1d 100644 --- a/src/packages/menu/__test__/__snapshots__/menu.spec.tsx.snap +++ b/src/packages/menu/__test__/__snapshots__/menu.spec.tsx.snap @@ -25,7 +25,7 @@ exports[`should match snapshot 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -54,11 +54,11 @@ exports[`should match snapshot 1`] = ` class="nut-icon nut-icon-Check " color="" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > @@ -122,7 +122,7 @@ exports[`should match snapshot of two columns in one line 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -151,11 +151,11 @@ exports[`should match snapshot of two columns in one line 1`] = ` class="nut-icon nut-icon-Check " color="" role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 49 48" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/noticebar/__test__/__snapshots__/noticebar.spec.tsx.snap b/src/packages/noticebar/__test__/__snapshots__/noticebar.spec.tsx.snap index 528f7970bc..34cd759e0a 100644 --- a/src/packages/noticebar/__test__/__snapshots__/noticebar.spec.tsx.snap +++ b/src/packages/noticebar/__test__/__snapshots__/noticebar.spec.tsx.snap @@ -20,7 +20,7 @@ exports[`align center test 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -61,7 +61,7 @@ exports[`noticebar base test 1`] = ` xmlns="http://www.w3.org/2000/svg" > @@ -102,7 +102,7 @@ exports[`scrollable test 1`] = ` xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/numberkeyboard/_test_/__snapshots__/index.spec.tsx.snap b/src/packages/numberkeyboard/_test_/__snapshots__/index.spec.tsx.snap index e4cafb848b..ed7adfcba3 100644 --- a/src/packages/numberkeyboard/_test_/__snapshots__/index.spec.tsx.snap +++ b/src/packages/numberkeyboard/_test_/__snapshots__/index.spec.tsx.snap @@ -326,7 +326,7 @@ exports[`should match snapshot 1`] = ` xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/popover/demos/h5/demo2.tsx b/src/packages/popover/demos/h5/demo2.tsx index 40218a66ef..ae5e0a8aaa 100644 --- a/src/packages/popover/demos/h5/demo2.tsx +++ b/src/packages/popover/demos/h5/demo2.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import { Popover, Button } from '@nutui/nutui-react' -import { Home, Cart, Location, Checklist } from '@nutui/icons-react' +import { Home, Cart, Location, Check } from '@nutui/icons-react' interface List { key?: string @@ -18,7 +18,7 @@ const Demo2 = () => { name: 'option1', icon: , action: { - icon: , + icon: , onClick: (e: any) => { console.log('onclick 1') e.stopPropagation() diff --git a/src/packages/popover/demos/taro/demo2.tsx b/src/packages/popover/demos/taro/demo2.tsx index 2ecd71a32d..d0fbb68339 100644 --- a/src/packages/popover/demos/taro/demo2.tsx +++ b/src/packages/popover/demos/taro/demo2.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import { Popover, Button } from '@nutui/nutui-react-taro' -import { Home, Cart, Location, Checklist } from '@nutui/icons-react-taro' +import { Home, Cart, Location, Check } from '@nutui/icons-react-taro' interface List { key?: string @@ -18,7 +18,7 @@ const Demo2 = () => { name: 'option1', icon: , action: { - icon: , + icon: , onClick: (e: any) => { console.log('onclick 1') e.stopPropagation() diff --git a/src/packages/radio/__test__/radio.spec.tsx b/src/packages/radio/__test__/radio.spec.tsx index 05ed9a8076..0ade6dc80e 100644 --- a/src/packages/radio/__test__/radio.spec.tsx +++ b/src/packages/radio/__test__/radio.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render, fireEvent, screen } from '@testing-library/react' import '@testing-library/jest-dom' import { useState } from 'react' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' import Radio from '@/packages/radio' import RadioGroup from '@/packages/radiogroup' @@ -30,13 +30,11 @@ describe('radio', () => { test('radio custom icon', () => { const { container } = render( - } activeIcon={}> + } activeIcon={}> 自定义图标 ) - expect(container.querySelector('.nut-icon')).toHaveClass( - 'nut-icon-Checklist' - ) + expect(container.querySelector('.nut-icon')).toHaveClass('nut-icon-Check') }) test('radioGroup onChange toBeCalled', () => { diff --git a/src/packages/radio/demos/h5/demo8.tsx b/src/packages/radio/demos/h5/demo8.tsx index 83c31d6bcf..bd1b1a328e 100644 --- a/src/packages/radio/demos/h5/demo8.tsx +++ b/src/packages/radio/demos/h5/demo8.tsx @@ -1,13 +1,10 @@ import React from 'react' import { Radio } from '@nutui/nutui-react' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' const Demo8 = () => { return ( - } - activeIcon={} - > + } activeIcon={}> 自定义图标 ) diff --git a/src/packages/radio/demos/h5/demo9.tsx b/src/packages/radio/demos/h5/demo9.tsx index 9a981a2776..cc47d35742 100644 --- a/src/packages/radio/demos/h5/demo9.tsx +++ b/src/packages/radio/demos/h5/demo9.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Radio } from '@nutui/nutui-react' -import { Checklist } from '@nutui/icons-react' +import { Check } from '@nutui/icons-react' const Demo9 = () => { return ( @@ -10,15 +10,15 @@ const Demo9 = () => { style={{ width: '100%' }} > } - activeIcon={} + icon={} + activeIcon={} value="1" > 自定义图标 } - activeIcon={} + icon={} + activeIcon={} value="2" > 自定义图标 diff --git a/src/packages/radio/demos/taro/demo8.tsx b/src/packages/radio/demos/taro/demo8.tsx index 9b4d6fe3ac..a4a5e83dcd 100644 --- a/src/packages/radio/demos/taro/demo8.tsx +++ b/src/packages/radio/demos/taro/demo8.tsx @@ -1,10 +1,10 @@ import React from 'react' import { Radio } from '@nutui/nutui-react-taro' -import { Checklist } from '@nutui/icons-react-taro' +import { Check } from '@nutui/icons-react-taro' const Demo8 = () => { return ( - } activeIcon={}> + } activeIcon={}> 自定义图标 ) diff --git a/src/packages/radio/demos/taro/demo9.tsx b/src/packages/radio/demos/taro/demo9.tsx index a120f08bea..db0b402aa6 100644 --- a/src/packages/radio/demos/taro/demo9.tsx +++ b/src/packages/radio/demos/taro/demo9.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Radio } from '@nutui/nutui-react-taro' -import { Checklist } from '@nutui/icons-react-taro' +import { Check } from '@nutui/icons-react-taro' const Demo9 = () => { return ( @@ -9,18 +9,10 @@ const Demo9 = () => { labelPosition="left" style={{ width: '100%' }} > - } - activeIcon={} - value="1" - > + } activeIcon={} value="1"> 自定义图标 - } - activeIcon={} - value="2" - > + } activeIcon={} value="2"> 自定义图标 diff --git a/src/packages/rate/__test__/__snapshots__/rate.spec.tsx.snap b/src/packages/rate/__test__/__snapshots__/rate.spec.tsx.snap index 439759097b..cf42d441f7 100644 --- a/src/packages/rate/__test__/__snapshots__/rate.spec.tsx.snap +++ b/src/packages/rate/__test__/__snapshots__/rate.spec.tsx.snap @@ -15,11 +15,11 @@ exports[`size test 1`] = ` aria-labelledby="StarFill" class="nut-icon nut-icon-StarFill " role="presentation" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > diff --git a/src/packages/resultpage/__test__/__snapshots__/resultpage.spec.tsx.snap b/src/packages/resultpage/__test__/__snapshots__/resultpage.spec.tsx.snap index b5f67a5221..a387d2812e 100644 --- a/src/packages/resultpage/__test__/__snapshots__/resultpage.spec.tsx.snap +++ b/src/packages/resultpage/__test__/__snapshots__/resultpage.spec.tsx.snap @@ -14,17 +14,11 @@ exports[`should render description correctly 1`] = ` color="#0073FF" role="presentation" style="color: #0073FF;" - viewBox="0 0 1024 1024" + viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg" > - , - diff --git a/src/packages/segmented/demos/h5/demo3.tsx b/src/packages/segmented/demos/h5/demo3.tsx index e69fd135ce..aaf72223e1 100644 --- a/src/packages/segmented/demos/h5/demo3.tsx +++ b/src/packages/segmented/demos/h5/demo3.tsx @@ -1,17 +1,17 @@ import React, { useState } from 'react' import { Segmented, SegmentedItem, Cell } from '@nutui/nutui-react' -import { AfterSaleService, Apps } from '@nutui/icons-react' +import { Star } from '@nutui/icons-react' const defaultOptions: SegmentedItem[] = [ { label: 'Apps', value: 'Apps', - icon: , + icon: , }, { label: 'AfterSaleService', value: 'AfterSaleService', - icon: , + icon: , }, ] diff --git a/src/packages/segmented/demos/taro/demo3.tsx b/src/packages/segmented/demos/taro/demo3.tsx index 81ce98b049..c09e65f321 100644 --- a/src/packages/segmented/demos/taro/demo3.tsx +++ b/src/packages/segmented/demos/taro/demo3.tsx @@ -1,17 +1,17 @@ import React, { useState } from 'react' import { Segmented, SegmentedItem, Cell } from '@nutui/nutui-react-taro' -import { AfterSaleService, Apps } from '@nutui/icons-react-taro' +import { Star } from '@nutui/icons-react-taro' const defaultOptions: SegmentedItem[] = [ { label: 'Apps', value: 'Apps', - icon: , + icon: , }, { label: 'AfterSaleService', value: 'AfterSaleService', - icon: , + icon: , }, ] diff --git a/src/packages/steps/__tests__/steps.spec.tsx b/src/packages/steps/__tests__/steps.spec.tsx index 2feeb5ce86..8e0adea8a3 100644 --- a/src/packages/steps/__tests__/steps.spec.tsx +++ b/src/packages/steps/__tests__/steps.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, fireEvent } from '@testing-library/react' import '@testing-library/jest-dom' -import { Checklist, People, Service } from '@nutui/icons-react' +import { Check, Transit, Service } from '@nutui/icons-react' import { Steps } from '../steps' import Step from '../../step' import Button from '../../button' @@ -52,7 +52,7 @@ test('should render horizontal class when props direction is to be horizontal', value={2} title="进行中" description="您的订单正在配送途中" - icon={} + icon={} > 2 @@ -60,7 +60,7 @@ test('should render horizontal class when props direction is to be horizontal', value={3} title="未开始" description="收货地址为：北京市经济技术开发区科创十一街18号院京东大厦" - icon={} + icon={} > 3 @@ -73,7 +73,7 @@ test('should render horizontal class when props direction is to be horizontal', '您的订单正在配送途中' ) expect(container.querySelectorAll('.nut-icon')[2]).toHaveClass( - 'nut-icon-Checklist' + 'nut-icon-Check' ) }) diff --git a/src/packages/steps/demos/h5/demo6.tsx b/src/packages/steps/demos/h5/demo6.tsx index a1b4f0b2cb..bb12ea0df0 100644 --- a/src/packages/steps/demos/h5/demo6.tsx +++ b/src/packages/steps/demos/h5/demo6.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Steps, Step, ConfigProvider } from '@nutui/nutui-react' -import { People } from '@nutui/icons-react' +import { Transit } from '@nutui/icons-react' const customTheme = { nutuiStepsDotHeadMargin: '0 0 12px 0', @@ -28,7 +28,7 @@ const Demo6 = () => { value={2} title="进行中" icon={ - { return ( @@ -14,12 +14,12 @@ const Demo7 = () => { } + icon={} /> } + icon={} /> diff --git a/src/packages/steps/demos/taro/demo6.tsx b/src/packages/steps/demos/taro/demo6.tsx index 9585f0d8a8..dcc8565a9f 100644 --- a/src/packages/steps/demos/taro/demo6.tsx +++ b/src/packages/steps/demos/taro/demo6.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Steps, Step, ConfigProvider } from '@nutui/nutui-react-taro' -import { People } from '@nutui/icons-react-taro' +import { Transit } from '@nutui/icons-react-taro' const customTheme = { nutuiStepsDotHeadMargin: '0 0 12px 0', @@ -28,7 +28,7 @@ const Demo6 = () => { value={2} title="进行中" icon={ - { return ( @@ -14,12 +14,12 @@ const Demo7 = () => { } + icon={} /> } + icon={} /> diff --git a/src/packages/swipe/demos/h5/demo4.tsx b/src/packages/swipe/demos/h5/demo4.tsx index 7e08132865..fa12e48e95 100644 --- a/src/packages/swipe/demos/h5/demo4.tsx +++ b/src/packages/swipe/demos/h5/demo4.tsx @@ -1,5 +1,5 @@ import React, { useRef } from 'react' -import { Button, Cell, Swipe, SwipeInstance } from '@nutui/nutui-react' +import { Button, Cell, Space, Swipe, SwipeInstance } from '@nutui/nutui-react' const App = () => { const openRef = useRef(null) @@ -23,14 +23,18 @@ const App = () => { style={{ margin: 0, alignSelf: 'stretch' }} /> - - + + + + ) } diff --git a/src/packages/swipe/demos/taro/demo4.tsx b/src/packages/swipe/demos/taro/demo4.tsx index 0573a92df2..feb467353a 100644 --- a/src/packages/swipe/demos/taro/demo4.tsx +++ b/src/packages/swipe/demos/taro/demo4.tsx @@ -1,5 +1,5 @@ import React, { useRef } from 'react' -import { Button, Swipe, SwipeInstance } from '@nutui/nutui-react-taro' +import { Button, Space, Swipe, SwipeInstance } from '@nutui/nutui-react-taro' import { Text, View } from '@tarojs/components' import pxTransform from '@/utils/px-transform' @@ -36,7 +36,7 @@ const App = () => { - + - + ) } diff --git a/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap b/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap index e09c341b1f..93df4815cd 100644 --- a/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap +++ b/src/packages/tabbar/__tests__/__snapshots__/tabbar.spec.tsx.snap @@ -1,5 +1,5 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`should only render title 1`] = `"
首页
11
分类
发现
"`; +exports[`should only render title 1`] = `"
首页
11
分类
逛
"`; -exports[`should render fixed element when using bottom prop 1`] = `"
首页
分类
"`; +exports[`should render fixed element when using bottom prop 1`] = `"
首页
分类
"`; diff --git a/src/packages/tabbar/__tests__/tabbar.spec.tsx b/src/packages/tabbar/__tests__/tabbar.spec.tsx index a46550a47b..7162b6c6df 100644 --- a/src/packages/tabbar/__tests__/tabbar.spec.tsx +++ b/src/packages/tabbar/__tests__/tabbar.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render, fireEvent } from '@testing-library/react' import '@testing-library/jest-dom' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' import { Tabbar } from '../tabbar' test('should render tabbar when default', () => { @@ -11,7 +11,7 @@ test('should render tabbar when default', () => { } /> } /> - } /> + } /> } /> } /> @@ -35,7 +35,7 @@ test('should render custom color and badge when using prop', () => { value={11} /> } /> - } /> + } /> ) @@ -69,7 +69,7 @@ test('should match active tabbar by click', async () => { value={11} /> } /> - } /> + } /> ) @@ -94,7 +94,7 @@ test('should show sure emitted when click', async () => { value={11} /> } /> - } /> + } /> ) @@ -112,7 +112,7 @@ test('should only render title', async () => { - + ) diff --git a/src/packages/tabbar/demos/h5/demo1.tsx b/src/packages/tabbar/demos/h5/demo1.tsx index 5ecdebcff0..52e4e0aaff 100644 --- a/src/packages/tabbar/demos/h5/demo1.tsx +++ b/src/packages/tabbar/demos/h5/demo1.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo1 = () => ( @@ -10,7 +10,7 @@ const Demo1 = () => ( value={9} /> } dot /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/h5/demo2.tsx b/src/packages/tabbar/demos/h5/demo2.tsx index 9a2aeee00a..c4b6b30011 100644 --- a/src/packages/tabbar/demos/h5/demo2.tsx +++ b/src/packages/tabbar/demos/h5/demo2.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo2 = () => { const [activeIndex, setActiveIndex] = useState(2) @@ -15,7 +15,7 @@ const Demo2 = () => { > } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/h5/demo3.tsx b/src/packages/tabbar/demos/h5/demo3.tsx index 5b4bb77482..2d529e7a64 100644 --- a/src/packages/tabbar/demos/h5/demo3.tsx +++ b/src/packages/tabbar/demos/h5/demo3.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo3 = () => ( ( > } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/h5/demo4.tsx b/src/packages/tabbar/demos/h5/demo4.tsx index c519a4944d..689135a697 100644 --- a/src/packages/tabbar/demos/h5/demo4.tsx +++ b/src/packages/tabbar/demos/h5/demo4.tsx @@ -9,7 +9,7 @@ const Demo4 = () => ( > - + diff --git a/src/packages/tabbar/demos/h5/demo5.tsx b/src/packages/tabbar/demos/h5/demo5.tsx index 381f5ca4af..f78ec1d4e4 100644 --- a/src/packages/tabbar/demos/h5/demo5.tsx +++ b/src/packages/tabbar/demos/h5/demo5.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo5 = () => ( } value={11} /> } /> - } /> + } /> } value={110} /> } /> diff --git a/src/packages/tabbar/demos/h5/demo6.tsx b/src/packages/tabbar/demos/h5/demo6.tsx index 529e7a19e7..a072c6fbbf 100644 --- a/src/packages/tabbar/demos/h5/demo6.tsx +++ b/src/packages/tabbar/demos/h5/demo6.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo6 = () => ( } dot /> } /> - } /> + } /> } dot /> } /> diff --git a/src/packages/tabbar/demos/h5/demo7.tsx b/src/packages/tabbar/demos/h5/demo7.tsx index 92e7e94ed6..e62f4d5ef6 100644 --- a/src/packages/tabbar/demos/h5/demo7.tsx +++ b/src/packages/tabbar/demos/h5/demo7.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo7 = () => ( } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/h5/demo8.tsx b/src/packages/tabbar/demos/h5/demo8.tsx index d9f0ce1852..0f27cbcfab 100644 --- a/src/packages/tabbar/demos/h5/demo8.tsx +++ b/src/packages/tabbar/demos/h5/demo8.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Category, Find, Home } from '@nutui/icons-react' +import { Category, Hi, Home } from '@nutui/icons-react' const Demo8 = () => ( } /> } /> - } /> + } /> ) diff --git a/src/packages/tabbar/demos/h5/demo9.tsx b/src/packages/tabbar/demos/h5/demo9.tsx index bb386fe351..de4800f78d 100644 --- a/src/packages/tabbar/demos/h5/demo9.tsx +++ b/src/packages/tabbar/demos/h5/demo9.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react' const Demo9 = () => ( } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/taro/demo1.tsx b/src/packages/tabbar/demos/taro/demo1.tsx index 21abd00b1d..9b2011fa9f 100644 --- a/src/packages/tabbar/demos/taro/demo1.tsx +++ b/src/packages/tabbar/demos/taro/demo1.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo1 = () => ( ( > } value={9} /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/taro/demo2.tsx b/src/packages/tabbar/demos/taro/demo2.tsx index 1f603dd2e8..3f67fc249b 100644 --- a/src/packages/tabbar/demos/taro/demo2.tsx +++ b/src/packages/tabbar/demos/taro/demo2.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo2 = () => ( } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/taro/demo3.tsx b/src/packages/tabbar/demos/taro/demo3.tsx index d98fec74f1..ca83abc8a8 100644 --- a/src/packages/tabbar/demos/taro/demo3.tsx +++ b/src/packages/tabbar/demos/taro/demo3.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo3 = () => ( ( > } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/taro/demo4.tsx b/src/packages/tabbar/demos/taro/demo4.tsx index 677ca8aa0e..0b54da7d9b 100644 --- a/src/packages/tabbar/demos/taro/demo4.tsx +++ b/src/packages/tabbar/demos/taro/demo4.tsx @@ -9,7 +9,7 @@ const Demo4 = () => ( > - + diff --git a/src/packages/tabbar/demos/taro/demo5.tsx b/src/packages/tabbar/demos/taro/demo5.tsx index 4a8b30f39b..bccb849b86 100644 --- a/src/packages/tabbar/demos/taro/demo5.tsx +++ b/src/packages/tabbar/demos/taro/demo5.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo5 = () => ( } title="首页" value={11} /> } /> - } /> + } /> } value={110} /> } /> diff --git a/src/packages/tabbar/demos/taro/demo6.tsx b/src/packages/tabbar/demos/taro/demo6.tsx index 7c855b7fe6..4bb7683120 100644 --- a/src/packages/tabbar/demos/taro/demo6.tsx +++ b/src/packages/tabbar/demos/taro/demo6.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo6 = () => ( } dot /> } /> - } /> + } /> } dot /> } /> diff --git a/src/packages/tabbar/demos/taro/demo7.tsx b/src/packages/tabbar/demos/taro/demo7.tsx index 5855b91bc1..729320c969 100644 --- a/src/packages/tabbar/demos/taro/demo7.tsx +++ b/src/packages/tabbar/demos/taro/demo7.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo7 = () => ( } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/tabbar/demos/taro/demo8.tsx b/src/packages/tabbar/demos/taro/demo8.tsx index 5d769a89c5..6db0b54620 100644 --- a/src/packages/tabbar/demos/taro/demo8.tsx +++ b/src/packages/tabbar/demos/taro/demo8.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Category, Find, Home } from '@nutui/icons-react-taro' +import { Category, Hi, Home } from '@nutui/icons-react-taro' const Demo8 = () => ( } /> } /> - } /> + } /> ) diff --git a/src/packages/tabbar/demos/taro/demo9.tsx b/src/packages/tabbar/demos/taro/demo9.tsx index 8e080ade25..4ac817463e 100644 --- a/src/packages/tabbar/demos/taro/demo9.tsx +++ b/src/packages/tabbar/demos/taro/demo9.tsx @@ -1,12 +1,12 @@ import React from 'react' import { Tabbar } from '@nutui/nutui-react-taro' -import { Cart, Category, Find, Home, User } from '@nutui/icons-react-taro' +import { Cart, Category, Hi, Home, User } from '@nutui/icons-react-taro' const Demo9 = () => ( } /> } /> - } /> + } /> } /> } /> diff --git a/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap index 7789d2c157..9ab6b57b77 100644 --- a/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap +++ b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap @@ -1,3 +1,5 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`timeselect props test 1`] = `"
取件时间
520
521
09:00-10:0010:00-11:0011:00-12:00
"`; + +exports[`timeselect props test 2`] = `"
取件时间
520
521
09:00-10:0010:00-11:0011:00-12:00
"`; diff --git a/src/sites/doc/components/issue/issue.tsx b/src/sites/doc/components/issue/issue.tsx index 2102b55eba..1e8706217d 100644 --- a/src/sites/doc/components/issue/issue.tsx +++ b/src/sites/doc/components/issue/issue.tsx @@ -1,6 +1,6 @@ import './issue.scss' import React, { useEffect, useState } from 'react' -import { Tips, Checklist, Add } from '@nutui/icons-react' +import { Tips, Check, Add } from '@nutui/icons-react' import { useLocation } from 'react-router-dom' import { nav } from '@/config.json' @@ -51,7 +51,7 @@ export function Issue() { href={`https://github.com/jdf2e/nutui-react/issues?q=is:issue+is:closed+${componentName.name}`} target="_blank" > - + Closed
From 80bc6b3e5cf52f22586bebe8ae2efb9eb1fce1cc Mon Sep 17 00:00:00 2001 From: xiaoyatong <84436086+xiaoyatong@users.noreply.github.com> Date: Mon, 23 Dec 2024 21:05:10 +0800 Subject: [PATCH 07/19] fix: dark mode for v15 (#2883) * fix: dark * fix: dark mode --- src/packages/navbar/demo.scss | 4 - src/packages/navbar/demos/h5/demo3.tsx | 1 + src/packages/navbar/demos/taro/demo3.tsx | 3 + src/packages/tabs/tabs.scss | 2 +- src/sites/mobile/App.tsx | 2 +- src/styles/theme-dark.scss | 34 +++---- src/styles/theme-default.scss | 6 +- src/styles/variables.scss | 121 +++++++++-------------- 8 files changed, 70 insertions(+), 103 deletions(-) diff --git a/src/packages/navbar/demo.scss b/src/packages/navbar/demo.scss index b0b91c8212..b2fd4b9e8f 100644 --- a/src/packages/navbar/demo.scss +++ b/src/packages/navbar/demo.scss @@ -5,10 +5,6 @@ } } .demo { - .nut-tabs-titles { - background: transparent; - } - .nut-tabpane { display: none; } diff --git a/src/packages/navbar/demos/h5/demo3.tsx b/src/packages/navbar/demos/h5/demo3.tsx index 2cd690f644..4edb8308f5 100644 --- a/src/packages/navbar/demos/h5/demo3.tsx +++ b/src/packages/navbar/demos/h5/demo3.tsx @@ -30,6 +30,7 @@ const Demo3 = () => { }} style={{ '--nutui-tabs-titles-gap': 0, + background: 'transparent', }} > Tab 1 diff --git a/src/packages/navbar/demos/taro/demo3.tsx b/src/packages/navbar/demos/taro/demo3.tsx index 333121fb06..7e72af1beb 100644 --- a/src/packages/navbar/demos/taro/demo3.tsx +++ b/src/packages/navbar/demos/taro/demo3.tsx @@ -39,6 +39,9 @@ const Demo3 = () => { onChange={(paneKey) => { setTab1value(paneKey) }} + style={{ + background: 'transparent', + }} > Tab 1 Tab 2 diff --git a/src/packages/tabs/tabs.scss b/src/packages/tabs/tabs.scss index bc5b73e829..509bbdbdba 100644 --- a/src/packages/tabs/tabs.scss +++ b/src/packages/tabs/tabs.scss @@ -153,7 +153,7 @@ &-card { padding: 0; - background-color: $color-default-light; + // background-color: $color-default-light; .nut-tabs-titles-item { padding: 0; diff --git a/src/sites/mobile/App.tsx b/src/sites/mobile/App.tsx index 94316169a0..218b33c4c0 100644 --- a/src/sites/mobile/App.tsx +++ b/src/sites/mobile/App.tsx @@ -49,7 +49,7 @@ const darkTheme = { nutuiGray7: '#e6e6e6', nutuiBlack1: 'rgba(255, 255, 255, 0)', nutuiBlack2: 'rgba(20, 20, 20, 0.2)', - nutuiBlack3: 'rgba(20, 20, 20, 0.06)', + nutuiBlack3: 'rgba(255, 255, 255, 0.06)', nutuiBlack4: 'rgba(20, 20, 20, 0.1)', nutuiBlack5: 'rgba(20, 20, 20, 0.2)', nutuiBlack6: 'rgba(20, 20, 20, 0.3)', diff --git a/src/styles/theme-dark.scss b/src/styles/theme-dark.scss index bec04535b5..b040567411 100644 --- a/src/styles/theme-dark.scss +++ b/src/styles/theme-dark.scss @@ -37,10 +37,10 @@ page { --nutui-color-primary-specialdisabled: var(--nutui-red-3); // service color - --nutui-golden-1: #fff2e0; - --nutui-golden-2: #ffd4a3; - --nutui-golden-3: #cc8241; // todo - --nutui-golden-4: #994d00; // todo + --nutui-golden-1: #292725; + --nutui-golden-2: #4d4134; + --nutui-golden-3: #c59463; + --nutui-golden-4: #d18e54; --nutui-golden-stop-1: #fff9f0; --nutui-golden-stop-2: #ffe3c2; @@ -54,9 +54,9 @@ page { --nutui-color-service-text: var(--nutui-golden-3); // success color - --nutui-green-1: #ebfbeb; - --nutui-green-2: #00d900; - --nutui-green-3: #2aa32a; + --nutui-green-1: #1f2920; + --nutui-green-2: #32c241; + --nutui-green-3: #12b222; // success color 语义化 --nutui-color-success: var(--nutui-green-2); // 深背景 @@ -64,9 +64,9 @@ page { --nutui-color-success-pressed: var(--nutui-green-3); // 文字 // danger color - --nutui-red-1: #ffebef; - --nutui-red-2: #ff0f23; - --nutui-red-3: #ffadbe; + --nutui-red-1: #2e2526; + --nutui-red-2: #ff3344; + --nutui-red-3: #ff3344; --nutui-red-6: #ff3b3b; // danger color 语义化 @@ -74,9 +74,9 @@ page { --nutui-color-danger-light: var(--nutui-red-1); // 背景 // warning color - --nutui-yellow-1: #fff5cc; - --nutui-yellow-2: #ffbf00; - --nutui-yellow-3: #c47600; + --nutui-yellow-1: #29271f; + --nutui-yellow-2: #faaf00; + --nutui-yellow-3: #c47600; //todo // warning color 语义化 --nutui-color-warning: var(--nutui-yellow-2); // 深背景 @@ -84,8 +84,8 @@ page { --nutui-color-warning-pressed: var(--nutui-yellow-3); // 文字 // info color - --nutui-blue-1: #e5f5ff; - --nutui-blue-2: #0073ff; + --nutui-blue-1: #23292e; + --nutui-blue-2: #3385ff; // info color 语义化 --nutui-color-info: var(--nutui-blue-2); // 背景或文字，链接色 @@ -116,10 +116,10 @@ page { --nutui-black-1: rgba(255, 255, 255, 0); // 蒙层色 // 容错蒙层 - --nutui-black-2: rgba(0, 0, 0, 0.2); + --nutui-black-2: rgba(0, 0, 0, 0.1); // 线条色 // 间隔线/容错线，用于结构或信息分割 - --nutui-black-3: rgba(20, 20, 20, 0.06); + --nutui-black-3: rgba(255, 255, 255, 0.06); --nutui-black-4: rgba(20, 20, 20, 0.1); --nutui-black-5: rgba(20, 20, 20, 0.2); --nutui-black-6: rgba(20, 20, 20, 0.3); diff --git a/src/styles/theme-default.scss b/src/styles/theme-default.scss index d64bc85bd6..30a7e73b3f 100644 --- a/src/styles/theme-default.scss +++ b/src/styles/theme-default.scss @@ -38,8 +38,8 @@ page { // service color --nutui-golden-1: #fff2e0; --nutui-golden-2: #ffd4a3; - --nutui-golden-3: #cc8241; // todo - --nutui-golden-4: #994d00; // todo + --nutui-golden-3: #cc8241; + --nutui-golden-4: #994d00; --nutui-golden-stop-1: #fff9f0; --nutui-golden-stop-2: #ffe3c2; @@ -99,7 +99,7 @@ page { // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。 --nutui-gray-2: #f7f8fc; // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。 - --nutui-gray-3: #f5f6fa; + --nutui-gray-3: #f2f3f5; // 文字色 // 四级文字色，不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。 --nutui-gray-4: #c2c4cc; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index d78efc5184..58c9661fc1 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -1,29 +1,20 @@ // ---------------------------------------------------- // 主色调 // done -$color-primary: var(--nutui-color-primary, #ff0f23) !default; +$color-primary: var(--nutui-brand-6) !default; $color-primary-stop-1: var(--nutui-color-primary-stop-1, #ff475d) !default; $color-primary-stop-2: var(--nutui-color-primary-stop-2, #ff0f23) !default; $color-primary-pressed: var(--nutui-color-primary-pressed, #e53029) !default; $color-primary-disabled: var(--nutui-color-primary-disabled, #c2c4cc) !default; -$color-primary-disabled-special: var( - --nutui-color-primary-disabled-special, - #ffadbe -) !default; -$color-primary-light-pressed: var( - --nutui-color-primary-light-pressed, - #ffebf1 -) !default; +$color-primary-disabled-special: var(--nutui-brand-3) !default; +$color-primary-light-pressed: var(--nutui-brand-1) !default; $color-primary-gradient-1: linear-gradient( 135deg, $color-primary-stop-1 0%, $color-primary-stop-2 100% ) !default; -$color-primary-icon: var(--nutui-red-6, #ff3333) !default; -$color-primary-icon-disabled: var(--nutui-gray-8, #dadce0) !default; -$color-primary-specialdisabled: var( - --nutui-color-primary-specialdisabled, - #ffadbe -) !default; +$color-primary-icon: var(--nutui-red-6) !default; +$color-primary-icon-disabled: var(--nutui-gray-8) !default; +$color-primary-specialdisabled: var(--nutui-red-3) !default; // 默认色 $color-default: var(--nutui-color-default) !default; @@ -43,96 +34,66 @@ $color-info-background: var( $color-info-text: var(--nutui-color-info, #0073ff) !default; // done // 成功色 -$color-success: var(--nutui-color-success, #00d900) !default; // done -$color-success-pressed: var( - --nutui-color-success-pressed, - #2aa32a -) !default; // done +$color-success: var(--nutui-green-2) !default; // done +$color-success-pressed: var(--nutui-green-3) !default; // done $color-success-disabled: var(--nutui-color-success-disabled, #b2f0ae) !default; -$color-success-light: var( - --nutui-color-success-light, - #ebfbeb -) !default; // done -$color-success-background: var( - --nutui-color-success-background, - #00d900 -) !default; // done -$color-success-text: var( - --nutui-color-success-pressed, - #2aa32a -) !default; // done +$color-success-light: var(--nutui-green-1) !default; // done +$color-success-background: var(--nutui-green-2) !default; // done +$color-success-text: var(--nutui-green-3) !default; // done // 警告色 -$color-warning: var(--nutui-color-warning, #ffbf00) !default; // done -$color-warning-pressed: var( - --nutui-color-warning-pressed, - #c47600 -) !default; // done +$color-warning: var(--nutui-yellow-2) !default; // done +$color-warning-pressed: var(--nutui-yellow-3) !default; // done $color-warning-disabled: var(--nutui-color-warning-disabled, #fdd3b9) !default; -$color-warning-light: var( - --nutui-color-warning-light, - #fff5cc -) !default; // done -$color-warning-background: var( - --nutui-color-warning-background, - #ffbf00 -) !default; // done -$color-warning-text: var( - --nutui-color-warning-pressed, - #c47600 -) !default; // done +$color-warning-light: var(--nutui-yellow-1) !default; // done +$color-warning-background: var(--nutui-yellow-2) !default; // done +$color-warning-text: var(--nutui-yellow-3) !default; // done // 危险色 -$color-danger: var(--nutui-color-danger, #ff0f23) !default; //done +$color-danger: var(--nutui-red-2) !default; //done $color-danger-pressed: var(--nutui-color-danger-pressed) !default; $color-danger-disabled: var( --nutui-color-danger-disabled, $color-primary-disabled-special ) !default; -$color-danger-light: var(--nutui-color-danger-light, #ffebef) !default; //done +$color-danger-light: var(--nutui-red-1) !default; //done $color-danger-background: var(--nutui-color-danger-background) !default; //done -$color-danger-text: var(--nutui-color-danger, #ff0f23) !default; //done +$color-danger-text: var(--nutui-red-2) !default; //done // 背景色 -$color-background: var(--nutui-color-background, #f5f6fa) !default; //done +$color-background: var(--nutui-gray-3) !default; //done // 卡片背景色 -$color-background-overlay: var( - --nutui-color-background-overlay, - #ffffff -) !default; +$color-background-overlay: var(--nutui-gray-1) !default; // 卡片内嵌背景色 $color-background-sunken: var( --nutui-color-background-sunken, - #f7f8fc + var(--nutui-gray-2) ) !default; // 蒙层颜色 // 页面全局蒙层 -$color-mask: var(--nutui-color-mask, rgba(0, 0, 0, 0.7)) !default; +$color-mask: var(--nutui-black-10) !default; // 局部蒙层 -$color-mask-part: var(--nutui-color-mask-part, rgba(0, 0, 0, 0.4)) !default; +$color-mask-part: var(--nutui-black-7) !default; // 容错蒙层 -$color-mask-fault-toleran: var( - --nutui-color-mask-fault-toleran, - rgba(0, 0, 0, 0.02) -) !default; +$color-mask-fault-toleran: var(--nutui-black-2) !default; // 边框色 -$color-border: var(--nutui-color-border, rgba(0, 0, 0, 0.06)) !default; -$color-border-disabled: var(--nutui-color-border-disabled, #c2c4cc) !default; +$color-border: var(--nutui-black-3) !default; +$color-border-disabled: var(--nutui-gray-4) !default; // 文本色 -$color-title: var(--nutui-color-title, #1a1a1a) !default; -$color-text: var(--nutui-color-text, #505259) !default; -$color-text-help: var(--nutui-color-text-help, #888b94) !default; -$color-text-disabled: var(--nutui-color-text-disabled, #c2c4cc) !default; +$color-title: var(--nutui-gray-7) !default; +$color-text: var(--nutui-gray-6) !default; +$color-text-help: var(--nutui-gray-5) !default; +$color-text-disabled: var(--nutui-gray-4) !default; $color-text-dark: var(--nutui-white-12) !default; -$color-text-link: var(--nutui-color-info, #0073ff) !default; +$color-text-link: var(--nutui-blue-2) !default; // 与品牌色一起使用，默认为白色，不区分暗黑与明亮模式。 -$color-primary-text: var(--nutui-color-primary-text, #ffffff) !default; +$color-primary-text: #ffffff !default; $white: #ffffff !default; -$black: $color-title !default; +$black: #000000 !default; // ---- Font Family ---- $font-family: @@ -734,7 +695,7 @@ $numberkeyboard-header-close-background-color: var( ) !default; $numberkeyboard-key-background-color: var( --nutui-numberkeyboard-key-background-color, - #fff + $color-background-overlay ) !default; $numberkeyboard-key-active-background-color: var( --nutui-numberkeyboard-key-active-background-color, @@ -1828,7 +1789,10 @@ $tabs-tabpane-backgroundColor: var( ) !default; // indicator（✅） $indicator-color: var(--nutui-indicator-color, $color-primary) !default; -$indicator-dot-color: var(--nutui-indicator-dot-color, $color-border) !default; +$indicator-dot-color: var( + --nutui-indicator-dot-color, + $color-text-disabled +) !default; $indicator-dot-size: var(--nutui-indicator-dot-size, 4px) !default; $indicator-dot-active-size: var( --nutui-indicator-dot-active-size, @@ -2005,7 +1969,10 @@ $empty-padding: var(--nutui-empty-padding, 32px 40px) !default; $empty-image-size: var(--nutui-empty-image-size, 160px) !default; $empty-image-small-size: var(--nutui-empty-image-small-size, 120px) !default; $empty-title-margin-top: var(--nutui-empty-title-margin-top, 0px) !default; -$empty-background-color: var(--nutui-empty-background-color, #fff) !default; +$empty-background-color: var( + --nutui-empty-background-color, + $color-background-overlay +) !default; $empty-title-margin-bottom: var( --nutui-empty-title-margin-bottom, 12px @@ -2134,7 +2101,7 @@ $grid-item-content-padding: var( ) !default; $grid-item-content-bg-color: var( --nutui-grid-item-content-bg-color, - $white + var(--nutui-gray-1) ) !default; $grid-item-text-margin: var(--nutui-grid-item-text-margin, 8px) !default; $grid-item-text-color: var(--nutui-grid-item-text-color, $color-title) !default; From 5af510411e3b6a417bea46054a01dd1c3e29e256 Mon Sep 17 00:00:00 2001 From: "Alex.hxy" <1872591453@qq.com> Date: Mon, 23 Dec 2024 21:33:59 +0800 Subject: [PATCH 08/19] feat: infinite v14 adaption (#2841) --- src/config.json | 1 + src/packages/infiniteloading/demos/h5/demo1.tsx | 2 +- src/packages/infiniteloading/demos/h5/demo2.tsx | 8 ++++---- src/packages/infiniteloading/infiniteloading.scss | 2 +- 4 files changed, 7 insertions(+), 6 deletions(-) diff --git a/src/config.json b/src/config.json index db596b002d..448b24705b 100644 --- a/src/config.json +++ b/src/config.json @@ -799,6 +799,7 @@ "sort": 5, "show": true, "taro": true, + "v15": true, "author": "swag~jun" }, { diff --git a/src/packages/infiniteloading/demos/h5/demo1.tsx b/src/packages/infiniteloading/demos/h5/demo1.tsx index 23aeb3120f..7e0290962d 100644 --- a/src/packages/infiniteloading/demos/h5/demo1.tsx +++ b/src/packages/infiniteloading/demos/h5/demo1.tsx @@ -59,7 +59,7 @@ const Demo1 = () => { diff --git a/src/packages/infiniteloading/demos/h5/demo2.tsx b/src/packages/infiniteloading/demos/h5/demo2.tsx index a2622ae0ac..da81907edd 100644 --- a/src/packages/infiniteloading/demos/h5/demo2.tsx +++ b/src/packages/infiniteloading/demos/h5/demo2.tsx @@ -68,7 +68,7 @@ const Demo2 = () => { > 下拉刷新 @@ -83,9 +83,9 @@ const Demo2 = () => { fill="none" className="nut-infinite-bottom-tips-icons" > - - - + + + 加载中 diff --git a/src/packages/infiniteloading/infiniteloading.scss b/src/packages/infiniteloading/infiniteloading.scss index 485e2fd4bf..024ffcf563 100644 --- a/src/packages/infiniteloading/infiniteloading.scss +++ b/src/packages/infiniteloading/infiniteloading.scss @@ -33,7 +33,6 @@ justify-content: center; width: 100%; padding-top: 6px; - font-size: $font-size-s; color: $infiniteloading-color; text-align: center; @@ -41,6 +40,7 @@ display: flex; justify-content: center; align-items: center; + font-size: $font-size-xxs; &-icons { margin-right: 8px; From e8620cc44dda444e8867d5e8f2edbb9d8e6f9034 Mon Sep 17 00:00:00 2001 From: oasis <12181600+oasis-cloud@users.noreply.github.com> Date: Mon, 23 Dec 2024 21:35:32 +0800 Subject: [PATCH 09/19] feat(radio): v15 (#2879) --- src/config.json | 3 ++- src/packages/radio/radio.scss | 3 +++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/config.json b/src/config.json index 448b24705b..f6d368f463 100644 --- a/src/config.json +++ b/src/config.json @@ -610,6 +610,7 @@ "sort": 6, "show": true, "taro": true, + "v15": true, "author": "oasis" }, { @@ -740,7 +741,7 @@ "sort": 4, "show": true, "taro": true, - "v14": true, + "v15": true, "author": "lzz" }, { diff --git a/src/packages/radio/radio.scss b/src/packages/radio/radio.scss index ebd765a7dd..4471e64faa 100644 --- a/src/packages/radio/radio.scss +++ b/src/packages/radio/radio.scss @@ -39,9 +39,12 @@ &-icon { &-checked { color: $color-primary; + box-shadow: 0px 2px 4px 0px #ff0f2333; + border-radius: 50%; &.nut-radio-icon-disabled { color: $color-primary-disabled-special; + box-shadow: none; } } From ace35a528c10ca8e656a1f40b1c30906ffa1ab9d Mon Sep 17 00:00:00 2001 From: oasis <12181600+oasis-cloud@users.noreply.github.com> Date: Mon, 23 Dec 2024 21:35:54 +0800 Subject: [PATCH 10/19] feat(checkbox): v15 (#2880) --- src/config.json | 1 + src/packages/checkbox/checkbox.scss | 5 +++++ 2 files changed, 6 insertions(+) diff --git a/src/config.json b/src/config.json index f6d368f463..f47703cb35 100644 --- a/src/config.json +++ b/src/config.json @@ -481,6 +481,7 @@ "sort": 4, "show": true, "taro": true, + "v15": true, "author": "oasis" }, { diff --git a/src/packages/checkbox/checkbox.scss b/src/packages/checkbox/checkbox.scss index 4ec7292b9a..219df33a42 100644 --- a/src/packages/checkbox/checkbox.scss +++ b/src/packages/checkbox/checkbox.scss @@ -13,6 +13,8 @@ color: $color-primary; transition-duration: 0.3s; transition-property: color, border-color, background-color; + box-shadow: 0px 2px 4px 0px #ff0f2333; + border-radius: 50%; &.nut-checkbox-icon-disabled { color: $color-primary-disabled-special; @@ -31,6 +33,8 @@ &-icon-indeterminate { color: $color-primary; + box-shadow: 0px 2px 4px 0px #ff0f2333; + border-radius: 50%; &.nut-checkbox-icon-disabled { color: $color-primary-disabled-special; @@ -39,6 +43,7 @@ &-icon-disabled { color: $color-text-disabled; + box-shadow: none; } &-reverse { From 23561c4870288be207898655e2318e9797b8e07b Mon Sep 17 00:00:00 2001 From: "Alex.hxy" <1872591453@qq.com> Date: Tue, 24 Dec 2024 11:12:25 +0800 Subject: [PATCH 11/19] =?UTF-8?q?refactor(uploader):=20=E5=A4=9A=E7=AB=AF?= =?UTF-8?q?=E9=80=82=E9=85=8D=20(#2660)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- migrate-from-v2.md | 26 +- pnpm-lock.yaml | 2 +- src/config.json | 2 +- .../uploader/__tests__/uploader.spec.tsx | 174 +++++++- src/packages/uploader/demo.taro.tsx | 68 ++-- src/packages/uploader/demo.tsx | 53 +-- src/packages/uploader/demos/h5/demo1.tsx | 75 ++-- src/packages/uploader/demos/h5/demo10.tsx | 76 +++- src/packages/uploader/demos/h5/demo11.tsx | 18 - src/packages/uploader/demos/h5/demo12.tsx | 44 -- src/packages/uploader/demos/h5/demo13.tsx | 7 - src/packages/uploader/demos/h5/demo14.tsx | 30 -- src/packages/uploader/demos/h5/demo2.tsx | 62 ++- src/packages/uploader/demos/h5/demo3.tsx | 93 ++--- src/packages/uploader/demos/h5/demo4.tsx | 98 ++--- src/packages/uploader/demos/h5/demo5.tsx | 46 ++- src/packages/uploader/demos/h5/demo6.tsx | 9 +- src/packages/uploader/demos/h5/demo7.tsx | 29 +- src/packages/uploader/demos/h5/demo8.tsx | 26 +- src/packages/uploader/demos/h5/demo9.tsx | 78 ++-- src/packages/uploader/demos/taro/demo1.tsx | 72 ++-- src/packages/uploader/demos/taro/demo10.tsx | 75 +++- src/packages/uploader/demos/taro/demo11.tsx | 43 -- src/packages/uploader/demos/taro/demo12.tsx | 44 -- src/packages/uploader/demos/taro/demo13.tsx | 7 - src/packages/uploader/demos/taro/demo14.tsx | 30 -- src/packages/uploader/demos/taro/demo2.tsx | 58 ++- src/packages/uploader/demos/taro/demo3.tsx | 96 ++--- src/packages/uploader/demos/taro/demo4.tsx | 101 ++--- src/packages/uploader/demos/taro/demo5.tsx | 45 ++- src/packages/uploader/demos/taro/demo6.tsx | 9 +- src/packages/uploader/demos/taro/demo7.tsx | 34 +- src/packages/uploader/demos/taro/demo8.tsx | 22 +- src/packages/uploader/demos/taro/demo9.tsx | 62 ++- src/packages/uploader/doc.en-US.md | 213 ++++------ src/packages/uploader/doc.md | 101 ++--- src/packages/uploader/doc.taro.md | 124 ++---- src/packages/uploader/doc.zh-TW.md | 110 ++--- src/packages/uploader/file-item.taro.ts | 36 -- src/packages/uploader/file-item.ts | 36 -- src/packages/uploader/index.taro.ts | 2 +- src/packages/uploader/index.ts | 2 +- src/packages/uploader/preview.taro.tsx | 68 ++-- src/packages/uploader/preview.tsx | 50 +-- src/packages/uploader/types.ts | 27 ++ src/packages/uploader/uploader.taro.tsx | 341 ++++++---------- src/packages/uploader/uploader.tsx | 380 +++++++----------- src/packages/uploader/utils.ts | 131 ------ 48 files changed, 1422 insertions(+), 1913 deletions(-) delete mode 100644 src/packages/uploader/demos/h5/demo11.tsx delete mode 100644 src/packages/uploader/demos/h5/demo12.tsx delete mode 100644 src/packages/uploader/demos/h5/demo13.tsx delete mode 100644 src/packages/uploader/demos/h5/demo14.tsx delete mode 100644 src/packages/uploader/demos/taro/demo11.tsx delete mode 100644 src/packages/uploader/demos/taro/demo12.tsx delete mode 100644 src/packages/uploader/demos/taro/demo13.tsx delete mode 100644 src/packages/uploader/demos/taro/demo14.tsx delete mode 100644 src/packages/uploader/file-item.taro.ts delete mode 100644 src/packages/uploader/file-item.ts create mode 100644 src/packages/uploader/types.ts delete mode 100644 src/packages/uploader/utils.ts diff --git a/migrate-from-v2.md b/migrate-from-v2.md index b16fc20d68..6e386b6808 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -525,23 +525,15 @@ plugins: [ #### Uploader -- `maximize` 重命名为 `maxFileSize` -- `maximum` 重命名为 `maxCount` -- `listType ` 重命名为 `previewType` -- `isDeletable ` 重命名为 `deletable` -- `isPreview` 重命名为 ` preview` -- `defaultImg` 重命名为 ` previewUrl` -- `defaultFileList` 重命名为 ` defaultValue` -- `uploadIconTip` 重命名为 `uploadLabel`，类型变更为 `ReactNode` -- `onBeforeUpload` 重命名为 `beforeUpload` -- `onBeforeXhrUpload` 重命名为 `beforeXhrUpload` -- `onBeforeDelete` 重命名为 `beforeDelete` -- `onRemove` 重命名为 `onDelete` -- 增加 `fit`，用于图片填充模式 -- 增加 `value`，用于受控传值 -- 移除 `uploadIconSize`，可通过 icon 属性传入自定义 icon 或借助 CSS Variables 修改 icon 大小 -- `uploadIcon` 类型从 `string` 调整为 `ReactNode` -- `onChange` 参数类型从 `{fileList: FileItem[], event: any}` 调整为 `FileItem[]` +- 移除了组件内部关于ajax相关网络逻辑的处理 +- 移除了`url`、`headers`、`data`、`xhrState`、`withCredentials`、`timeout` 网络配置相关props +- 移除了`onStart`、`onProgress`、`onFailure`、`beforeXhrUpload` 触发时机函数相关props +- 新增`onOverCount`属性，文件数量超过限制时触发 +- 新增`onUploadQueueChange`属性，图片上传队列变化时触发 +- 简化`FileItem`类型的使用，除url外其他属性变为可选 +- 调整多选状态下`maxCount`属性的默认值为`Number.MAX_VALUE` +- 新增了的 `upload` 方法 +- `defaultValue` 和 `value` 的类型从 `FileType` 变更为 `FileItem` ### 操作反馈 diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 52330a57a8..9e7688eb58 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -27028,4 +27028,4 @@ snapshots: toposort: 2.0.2 type-fest: 2.19.0 - zwitch@2.0.4: {} + zwitch@2.0.4: {} \ No newline at end of file diff --git a/src/config.json b/src/config.json index f47703cb35..7976e18cb9 100644 --- a/src/config.json +++ b/src/config.json @@ -705,7 +705,7 @@ "author": "VickyYe" }, { - "version": "2.0.0", + "version": "3.0.0", "name": "Uploader", "type": "component", "tarodoc": true, diff --git a/src/packages/uploader/__tests__/uploader.spec.tsx b/src/packages/uploader/__tests__/uploader.spec.tsx index cd839c2bdd..1c810aa397 100644 --- a/src/packages/uploader/__tests__/uploader.spec.tsx +++ b/src/packages/uploader/__tests__/uploader.spec.tsx @@ -3,8 +3,9 @@ import { render, fireEvent } from '@testing-library/react' import '@testing-library/jest-dom' import { Uploader } from '../uploader' -import { FileItem } from '../file-item' +import { FileItem } from '../types' import { Preview } from '../preview' +import Button from '@/packages/button' test('should render base uploader and type', () => { const { container, getByTestId } = render( @@ -73,7 +74,6 @@ test('should render base uploader other props', () => { { test('before-delete prop return false', () => { const onDelete = vi.fn() const App = () => { - const defaultFileList: FileItem[] = [ + const fileList: FileItem[] = [ { name: '文件1.png', url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', @@ -157,7 +157,7 @@ test('before-delete prop return false', () => { return ( { return false @@ -199,8 +199,125 @@ test('before-delete prop return true', () => { expect(onDelete).toBeCalled() }) +test('should render progress', () => { + const App = () => { + const list: FileItem[] = [ + { + name: '文件444.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + percentage: 30, + }, + ] + return + } + const { container } = render() + const progressElement = container.querySelector('.nut-progress') + expect(progressElement).toBeInTheDocument() + const progressInnerElement = container.querySelector('.nut-progress-inner') + expect(progressInnerElement).toBeInTheDocument() + expect(progressInnerElement).toHaveStyle('width: 30%') + const textElement = container.querySelector('span') + expect(textElement).toHaveTextContent('文件444.png') +}) +test('simulates single file upload', () => { + const handleUpload: any = vi.fn() + const { container } = render( + handleUpload(file)} /> + ) + const file = new File(['hello'], 'hello.png', { type: 'image/png' }) + const input: any = container.querySelector('input') + + fireEvent.change(input, { target: { files: [file] } }) + + expect(handleUpload).toHaveBeenCalledTimes(1) + expect(handleUpload).toHaveBeenCalledWith(file) +}) +test('simulates single file upload fail', async () => { + const handleUpload: any = vi.fn(() => + Promise.reject(new Error('Upload failed')) + ) + const { container } = render( + handleUpload(file)} /> + ) + const file = new File(['hello'], 'hello.png', { type: 'image/png' }) + const input: any = container.querySelector('input') + + fireEvent.change(input, { target: { files: [file] } }) + + expect(handleUpload).toHaveBeenCalledTimes(1) + expect(handleUpload).toHaveBeenCalledWith(file) +}) +test('simulates multiple file upload', () => { + const handleUpload: any = vi.fn() + const handleOverCount: any = vi.fn() + const { container } = render( + handleUpload(file)} + multiple + maxCount={2} + onOverCount={handleOverCount} + /> + ) + const file1 = new File(['file1'], 'file1.txt', { type: 'text/plain' }) + const file2 = new File(['file2'], 'file2.txt', { type: 'text/plain' }) + const file3 = new File(['file3'], 'file3.txt', { type: 'text/plain' }) + const files = [file1, file2, file3] + const input: any = container.querySelector('input') + + fireEvent.change(input, { target: { files } }) + + expect(handleUpload).toHaveBeenCalledTimes(2) + expect(handleOverCount).toHaveBeenCalledTimes(1) + expect(handleOverCount).toHaveBeenCalledWith(3) +}) +test('simulates file upload when autoupload is false', () => { + const handleUpload: any = vi.fn() + const handleOverCount: any = vi.fn() + const { container } = render( + handleUpload(file)} + multiple + autoUpload={false} + maxCount={2} + onOverCount={handleOverCount} + /> + ) + const file1 = new File(['file1'], 'file1.txt', { type: 'text/plain' }) + const file2 = new File(['file2'], 'file2.txt', { type: 'text/plain' }) + const file3 = new File(['file3'], 'file3.txt', { type: 'text/plain' }) + const files = [file1, file2, file3] + const input: any = container.querySelector('input') + fireEvent.change(input, { target: { files } }) + expect(handleUpload).toHaveBeenCalledTimes(0) +}) +test('should render button', () => { + const clearUpload = vi.fn() + const submitUpload = vi.fn() + const App = () => { + return ( + <> + + + + + ) + } + const { container } = render() + const buttonElement = container.querySelector('.nut-button') + expect(buttonElement).toBeInTheDocument() + fireEvent.click(container.querySelectorAll('.nut-button-success')[0]) + expect(submitUpload).toBeCalled() + fireEvent.click(container.querySelectorAll('.nut-button-primary')[0]) + expect(clearUpload).toBeCalled() +}) test('ready file list', () => { - const list = new FileItem() + const list: any = {} list.name = '文件1.png' list.url = 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' @@ -222,7 +339,46 @@ test('ready file list', () => { const { container, getByText } = render() expect(getByText('准备上传')).toHaveTextContent('准备上传') }) - +test('type is not image and doesnot set previewurl', () => { + const list: any = {} + list.name = '文件1.png' + list.url = + 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' + list.status = 'ready' + list.message = '准备上传' + list.type = 'video' + list.uid = '12' + const App = () => { + return + } + const { container, getByText } = render() + expect( + container.querySelector('.nut-uploader-preview-img-file') + ).toBeInTheDocument() +}) +test('type is not image and set previewurl', () => { + const list: any = {} + list.name = '文件1.png' + list.url = + 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' + list.status = 'ready' + list.message = '准备上传' + list.type = 'video' + list.uid = '12' + const App = () => { + return ( + + ) + } + const { container, getByText } = render() + expect( + container.querySelector('.nut-uploader-preview-img-c') + ).toBeInTheDocument() +}) test('preview component', () => { const delFunc = vi.fn() const clickFunc = vi.fn() @@ -232,6 +388,7 @@ test('preview component', () => { status: 'success', message: '上传成功', uid: '12', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', }, ] @@ -242,7 +399,6 @@ test('preview component', () => { deletable onDeleteItem={delFunc} handleItemClick={clickFunc} - previewUrl="https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif" /> ) fireEvent.click(container.querySelectorAll('.close')[0]) @@ -260,9 +416,7 @@ test('preview component', () => { handleItemClick={clickFunc} /> ) - fireEvent.click( - container1.querySelectorAll('.nut-uploader-preview-img-file-name')[0] - ) + fireEvent.click(container1.querySelectorAll('.nut-uploader-preview-img-c')[0]) expect(clickFunc).toBeCalled() const { container: container2 } = render( diff --git a/src/packages/uploader/demo.taro.tsx b/src/packages/uploader/demo.taro.tsx index e0b442d0c9..0a0eb1a583 100644 --- a/src/packages/uploader/demo.taro.tsx +++ b/src/packages/uploader/demo.taro.tsx @@ -1,9 +1,7 @@ import React from 'react' import Taro from '@tarojs/taro' -import { ScrollView, View } from '@tarojs/components' +import { View, ScrollView } from '@tarojs/components' import { useTranslate } from '@/sites/assets/locale/taro' -import Header from '@/sites/components/header' - import Demo1 from './demos/taro/demo1' import Demo2 from './demos/taro/demo2' import Demo3 from './demos/taro/demo3' @@ -14,59 +12,46 @@ import Demo7 from './demos/taro/demo7' import Demo8 from './demos/taro/demo8' import Demo9 from './demos/taro/demo9' import Demo10 from './demos/taro/demo10' -import Demo11 from './demos/taro/demo11' -import Demo12 from './demos/taro/demo12' -import Demo13 from './demos/taro/demo13' -import Demo14 from './demos/taro/demo14' +import Header from '@/sites/components/header' const UploaderDemo = () => { const [translated] = useTranslate({ 'zh-CN': { basic: '基础用法', uploadListDefault: '基础用法-上传列表展示', - uploadDefaultProgress: '自定义上传使用默认进度条', uploadStatus: '上传状态', - camera: '直接调起摄像头（移动端生效）', - limitedQuantity: '限制上传数量5个', + limitedQuantity: '限制上传数量', limitSize: '限制上传大小（每个文件最大不超过50kb）', - videoUploader: '使用前摄像头拍摄3s视频并上传(仅支持微信小程序)', - custom: '自定义数据 FormData、headers', - uploadXhrCustom: '自定义 Taro.uploadFile 上传方式(before-xhr-upload)', + beforeUpload: '自定义上传前的处理', manualExecution: '选中文件后，通过按钮手动执行上传', disabled: '禁用状态', customDeleteIcon: '自定义删除icon', + camera: '直接调起摄像头（移动端生效）', }, 'zh-TW': { basic: '基础用法', uploadListDefault: '基础用法-上傳列表展示', - uploadDefaultProgress: '自定義上傳使用默認進度條', uploadStatus: '上傳狀態', - camera: '直接調起攝像頭（移動端生效）', - limitedQuantity: '限制上傳數量5個', - limitSize: '限制上傳大小（每個檔案最大不超過50kb）', - videoUploader: '使用前鏡頭拍攝3s影片並上傳(僅支援微信小程式)', - custom: '自定義數據 FormData、headers', - uploadXhrCustom: '自定義 Taro.uploadFile 上傳方式(before-xhr-upload)', + limitedQuantity: '限制上傳數量', + beforeUpload: '自定義上傳前的處理', + limitSize: '限制上傳大小', manualExecution: '選取檔後，通過按鈕手動執行上傳', disabled: '禁用狀態', customDeleteIcon: '自定義刪除icon', + camera: '直接調起攝像頭（移動端生效）', }, 'en-US': { basic: 'Basic usage', uploadListDefault: 'Basic usage - upload list dispaly', - uploadDefaultProgress: 'Custom upload uses default progress bar', uploadStatus: 'Upload status', - camera: 'Direct camera up (mobile)', - limitedQuantity: 'Limit the number of uploads to 5', + beforeUpload: 'Beforeupload Usage', + limitedQuantity: 'Limit the number of uploads', limitSize: 'Limit upload size (maximum 50kb per file)', - videoUploader: - 'Use the front camera to shoot 3s video and upload it (only support wechat mini program)', - custom: 'Custom data FormData, headers', - uploadXhrCustom: 'Custom xhr Taro.uploadFile method (before-xhr-upload)', manualExecution: 'After selecting Chinese, manually perform the upload via the button', disabled: 'Disabled state', customDeleteIcon: 'Custom DeleteIcon', + camera: 'Direct camera up (mobile)', }, }) @@ -74,36 +59,29 @@ const UploaderDemo = () => { <>
+ {' '} {translated.basic} - {translated.basic} - {translated.uploadStatus} + + {translated.limitedQuantity} - {translated.uploadListDefault} + {translated.limitSize} - {translated.uploadDefaultProgress} + {translated.beforeUpload} - {translated.camera} + {translated.disabled} - {translated.videoUploader} + {translated.customDeleteIcon} - {translated.limitedQuantity} + {translated.camera} - {translated.limitSize} + {translated.manualExecution} - {translated.custom} + {translated.uploadListDefault} - {translated.uploadXhrCustom} - - {translated.manualExecution} - - {translated.disabled} - -

{translated.customDeleteIcon}

- ) diff --git a/src/packages/uploader/demo.tsx b/src/packages/uploader/demo.tsx index ff55c976bf..11dd11a432 100644 --- a/src/packages/uploader/demo.tsx +++ b/src/packages/uploader/demo.tsx @@ -11,24 +11,17 @@ import Demo7 from './demos/h5/demo7' import Demo8 from './demos/h5/demo8' import Demo9 from './demos/h5/demo9' import Demo10 from './demos/h5/demo10' -import Demo11 from './demos/h5/demo11' -import Demo12 from './demos/h5/demo12' -import Demo13 from './demos/h5/demo13' -import Demo14 from './demos/h5/demo14' const UploaderDemo = () => { const [translated] = useTranslate({ 'zh-CN': { basic: '基础用法', uploadListDefault: '基础用法-上传列表展示', - uploadDefaultProgress: '自定义上传使用默认进度条', uploadStatus: '上传状态', camera: '直接调起摄像头（移动端生效）', - limitedQuantity: '限制上传数量5个', + limitedQuantity: '限制上传数量', limitSize: '限制上传大小（每个文件最大不超过50kb）', - compress: '图片压缩（在beforeupload钩子中处理）', - custom: '自定义数据 FormData、headers', - uploadXhrCustom: '自定义 xhr 上传方式(before-xhr-upload)', + beforeUpload: '自定义上传前的处理', manualExecution: '选中文件后，通过按钮手动执行上传', disabled: '禁用状态', customDeleteIcon: '自定义删除icon', @@ -36,14 +29,11 @@ const UploaderDemo = () => { 'zh-TW': { basic: '基础用法', uploadListDefault: '基础用法-上傳列表展示', - uploadDefaultProgress: '自定義上傳使用默認進度條', uploadStatus: '上傳狀態', camera: '直接調起攝像頭（移動端生效）', - limitedQuantity: '限制上傳數量5個', - limitSize: '限制上傳大小（每個檔案最大不超過50kb）', - compress: '圖片壓縮（在beforeupload鉤子中處理）', - custom: '自定義數據 FormData、headers', - uploadXhrCustom: '自定義 xhr 上傳方式(before-xhr-upload)', + limitedQuantity: '限制上傳數量', + beforeUpload: '自定義上傳前的處理', + limitSize: '限制上傳大小', manualExecution: '選取檔後，通過按鈕手動執行上傳', disabled: '禁用狀態', customDeleteIcon: '自定義刪除icon', @@ -51,14 +41,11 @@ const UploaderDemo = () => { 'en-US': { basic: 'Basic usage', uploadListDefault: 'Basic usage - upload list dispaly', - uploadDefaultProgress: 'Custom upload uses default progress bar', uploadStatus: 'Upload status', + beforeUpload: 'Beforeupload Usage', camera: 'Direct camera up (mobile)', - limitedQuantity: 'Limit the number of uploads to 5', + limitedQuantity: 'Limit the number of uploads', limitSize: 'Limit upload size (maximum 50kb per file)', - compress: 'Image compression (handled in a foreupload hook)', - custom: 'Custom data FormData, headers', - uploadXhrCustom: 'Custom xhr upload method (before-xhr-upload)', manualExecution: 'After selecting Chinese, manually perform the upload via the button', disabled: 'Disabled state', @@ -71,32 +58,24 @@ const UploaderDemo = () => {

{translated.basic}

-

{translated.basic}

-

{translated.uploadStatus}

+ +

{translated.limitedQuantity}

-

{translated.uploadListDefault}

+

{translated.limitSize}

-

{translated.uploadDefaultProgress}

+

{translated.beforeUpload}

-

{translated.camera}

+

{translated.disabled}

-

{translated.limitedQuantity}

+

{translated.customDeleteIcon}

-

{translated.limitSize}

+

{translated.camera}

-

{translated.compress}

+

{translated.manualExecution}

-

{translated.custom}

+

{translated.uploadListDefault}

-

{translated.uploadXhrCustom}

- -

{translated.manualExecution}

- -

{translated.disabled}

- -

{translated.customDeleteIcon}

-
) diff --git a/src/packages/uploader/demos/h5/demo1.tsx b/src/packages/uploader/demos/h5/demo1.tsx index ab55af17f5..96b994a1ba 100644 --- a/src/packages/uploader/demos/h5/demo1.tsx +++ b/src/packages/uploader/demos/h5/demo1.tsx @@ -1,46 +1,49 @@ -import React from 'react' -import { Uploader, Cell } from '@nutui/nutui-react' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem, Space } from '@nutui/nutui-react' import { Dongdong } from '@nutui/icons-react' const Demo1 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onStart = () => { - console.log('start触发') + const [list, setList] = useState([ + { + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + uid: 133, + status: 'uploading', + }, + ]) + + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } } - const beforeUpload = async (files: File[]) => { - const allowedTypes = ['image/png'] - const filteredFiles = Array.from(files).filter((file) => - allowedTypes.includes(file.type) - ) - return filteredFiles + async function uploadFail(file: File): Promise { + await sleep(2000) + throw new Error('Fail to upload') } return ( <> - - { - console.log('outer onChange', v) - }} - /> - - } - onStart={onStart} - style={{ marginBottom: '10px' }} - /> + + + upload(file)} + /> + upload(file)} /> + } + upload={(file: File) => uploadFail(file)} + /> + ) diff --git a/src/packages/uploader/demos/h5/demo10.tsx b/src/packages/uploader/demos/h5/demo10.tsx index 721f594f2e..56bb98d17f 100644 --- a/src/packages/uploader/demos/h5/demo10.tsx +++ b/src/packages/uploader/demos/h5/demo10.tsx @@ -1,18 +1,74 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' +import React, { useState } from 'react' +import { Loading, Star } from '@nutui/icons-react' +import { Uploader, Button, FileItem } from '@nutui/nutui-react' const Demo10 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const formData = { - custom: 'test', + const [list, setList] = useState([ + { + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + name: '文件2.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + name: '文件3.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + failIcon: , + }, + { + name: '文件444.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + percentage: 30, + }, + { + name: '文件555.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + loadingIcon: , + percentage: 80, + }, + ]) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + if (Math.random() < 0.5) { + return { + url: URL.createObjectURL(file), + } + } + throw new Error('Fail to upload') } return ( + upload={(file: File) => upload(file)} + value={list} + onChange={setList} + maxCount="10" + multiple + previewType="list" + style={{ marginBottom: 20 }} + > + + ) } export default Demo10 diff --git a/src/packages/uploader/demos/h5/demo11.tsx b/src/packages/uploader/demos/h5/demo11.tsx deleted file mode 100644 index 23d425cefc..0000000000 --- a/src/packages/uploader/demos/h5/demo11.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' - -const Demo11 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const beforeXhrUpload = (xhr: XMLHttpRequest, options: any) => { - if (options.method.toLowerCase() === 'put') { - xhr.send(options.sourceFile) - } else { - xhr.send(options.formData) - } - } - - return ( - - ) -} -export default Demo11 diff --git a/src/packages/uploader/demos/h5/demo12.tsx b/src/packages/uploader/demos/h5/demo12.tsx deleted file mode 100644 index 713bdb949a..0000000000 --- a/src/packages/uploader/demos/h5/demo12.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React, { useRef } from 'react' -import { Uploader, Button } from '@nutui/nutui-react' - -interface uploadRefState { - submit: () => void - clear: () => void -} - -const Demo12 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const uploadRef = useRef(null) - - const submitUpload = () => { - ;(uploadRef.current as uploadRefState).submit() - } - const clearUpload = () => { - ;(uploadRef.current as uploadRefState).clear() - } - return ( - <> - -
-
- - -
- - ) -} -export default Demo12 diff --git a/src/packages/uploader/demos/h5/demo13.tsx b/src/packages/uploader/demos/h5/demo13.tsx deleted file mode 100644 index 7428860a66..0000000000 --- a/src/packages/uploader/demos/h5/demo13.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' - -const Demo13 = () => { - return -} -export default Demo13 diff --git a/src/packages/uploader/demos/h5/demo14.tsx b/src/packages/uploader/demos/h5/demo14.tsx deleted file mode 100644 index 08c04fb007..0000000000 --- a/src/packages/uploader/demos/h5/demo14.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -import { Dongdong, Star } from '@nutui/icons-react' - -const Demo14 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - ] - const onDelete = (file: any, fileList: any) => { - console.log('delete事件触发', file, fileList) - } - return ( - } - deleteIcon={} - /> - ) -} -export default Demo14 diff --git a/src/packages/uploader/demos/h5/demo2.tsx b/src/packages/uploader/demos/h5/demo2.tsx index 238035ddf3..f8ac1f50e9 100644 --- a/src/packages/uploader/demos/h5/demo2.tsx +++ b/src/packages/uploader/demos/h5/demo2.tsx @@ -1,15 +1,59 @@ import React from 'react' -import { Uploader, Cell } from '@nutui/nutui-react' +import { Uploader, FileItem } from '@nutui/nutui-react' +import { Dongdong, Loading, Star } from '@nutui/icons-react' -const Demo1 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onStart = () => { - console.log('start触发') +const Demo2 = () => { + const defaultList: FileItem[] = [ + { + uid: 111, + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + uid: 222, + name: '文件2.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + uid: 333, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + }, + { + uid: 444, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + failIcon: , + }, + { + uid: 555, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + }, + { + uid: 666, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + loadingIcon: , + }, + ] + const onDelete = (file: FileItem, fileList: FileItem[]) => { + console.log('delete事件触发', file, fileList) } return ( - - - + } + maxCount={6} + /> ) } -export default Demo1 +export default Demo2 diff --git a/src/packages/uploader/demos/h5/demo3.tsx b/src/packages/uploader/demos/h5/demo3.tsx index f266988695..1e4274cbc2 100644 --- a/src/packages/uploader/demos/h5/demo3.tsx +++ b/src/packages/uploader/demos/h5/demo3.tsx @@ -1,72 +1,35 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -import { Dongdong, Loading, Star } from '@nutui/icons-react' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem, Space } from '@nutui/nutui-react' const Demo3 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '123', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'error', - message: '上传失败', - type: 'image', - uid: '124', - failIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '125', - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '126', - loadingIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '127', - loadingIcon: null, - }, - ] - const onDelete = (file: any, fileList: any) => { - console.log('delete事件触发', file, fileList) + const [list, setList] = useState([]) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } } return ( - } - /> + <> + + + upload(file)} + maxCount={5} + multiple + /> + + + ) } export default Demo3 diff --git a/src/packages/uploader/demos/h5/demo4.tsx b/src/packages/uploader/demos/h5/demo4.tsx index 6392d622c6..a89befe47d 100644 --- a/src/packages/uploader/demos/h5/demo4.tsx +++ b/src/packages/uploader/demos/h5/demo4.tsx @@ -1,75 +1,35 @@ -import React from 'react' -import { Loading, Star } from '@nutui/icons-react' -import { Uploader, Button } from '@nutui/nutui-react' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react' const Demo4 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '123', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'error', - message: '上传失败', - type: 'image', - uid: '124', - failIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '125', - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '126', - loadingIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '127', - loadingIcon: null, - }, - ] - + const [list, setList] = useState([]) + const onOversize = (files: File[]) => { + console.log('oversize 触发 文件大小不能超过 50kb', files) + } + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } + } return ( - - - + + upload(file)} + multiple + maxFileSize={1024 * 50} + onOversize={onOversize} + /> + ) } export default Demo4 diff --git a/src/packages/uploader/demos/h5/demo5.tsx b/src/packages/uploader/demos/h5/demo5.tsx index 7f788cc80f..1e0722ac27 100644 --- a/src/packages/uploader/demos/h5/demo5.tsx +++ b/src/packages/uploader/demos/h5/demo5.tsx @@ -1,27 +1,37 @@ import React, { useState } from 'react' -import { Uploader, Button, Progress } from '@nutui/nutui-react' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react' const Demo5 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const [progressPercent, setProgressPercent] = useState(0) - const onProgress = ({ event, options, percentage }: any) => { - setProgressPercent(percentage) + const [list, setList] = useState([]) + const beforeUpload = async (files: File[]) => { + const allowedTypes = ['image/png'] + const filteredFiles = Array.from(files).filter((file) => + allowedTypes.includes(file.type) + ) + return filteredFiles + } + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } } - return ( - <> - - - -
- + upload(file)} /> - + ) } export default Demo5 diff --git a/src/packages/uploader/demos/h5/demo6.tsx b/src/packages/uploader/demos/h5/demo6.tsx index 1b8b896c29..2980b6a74e 100644 --- a/src/packages/uploader/demos/h5/demo6.tsx +++ b/src/packages/uploader/demos/h5/demo6.tsx @@ -1,8 +1,11 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react' +import { Uploader, Cell } from '@nutui/nutui-react' const Demo6 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - return + return ( + + + + ) } export default Demo6 diff --git a/src/packages/uploader/demos/h5/demo7.tsx b/src/packages/uploader/demos/h5/demo7.tsx index 72c432371f..73c1b89d85 100644 --- a/src/packages/uploader/demos/h5/demo7.tsx +++ b/src/packages/uploader/demos/h5/demo7.tsx @@ -1,8 +1,31 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react' +import { Dongdong, Star } from '@nutui/icons-react' +const defaultFileList: FileItem[] = [ + { + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + message: '上传成功', + }, +] const Demo7 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - return + return ( + + } + deleteIcon={} + style={{ + marginInlineEnd: '10px', + }} + /> + } + deleteIcon={} + /> + + ) } export default Demo7 diff --git a/src/packages/uploader/demos/h5/demo8.tsx b/src/packages/uploader/demos/h5/demo8.tsx index f6cb73261c..91b9c69412 100644 --- a/src/packages/uploader/demos/h5/demo8.tsx +++ b/src/packages/uploader/demos/h5/demo8.tsx @@ -1,18 +1,24 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react' +import { Uploader, Cell } from '@nutui/nutui-react' const Demo8 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onOversize = (files: File[]) => { - console.log('oversize 触发 文件大小不能超过 50kb', files) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } } return ( - + + upload(file)} /> + ) } export default Demo8 diff --git a/src/packages/uploader/demos/h5/demo9.tsx b/src/packages/uploader/demos/h5/demo9.tsx index c993a753ea..69dcd3069c 100644 --- a/src/packages/uploader/demos/h5/demo9.tsx +++ b/src/packages/uploader/demos/h5/demo9.tsx @@ -1,45 +1,51 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react' +import React, { useRef } from 'react' +import { Uploader, Button, Cell, Space } from '@nutui/nutui-react' + +interface uploadRefState { + submit: () => void + clear: () => void +} const Demo9 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const canvastoFile = ( - canvas: HTMLCanvasElement, - type: string, - quality: number - ): Promise => { - return new Promise((resolve) => { - canvas.toBlob((blob) => resolve(blob), type, quality) + const uploadRef = useRef(null) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) }) } - const fileToDataURL = (file: Blob): Promise => { - return new Promise((resolve) => { - const reader = new FileReader() - reader.onloadend = (e) => resolve((e.target as FileReader).result) - reader.readAsDataURL(file) - }) + async function upload(file: File) { + await sleep(2000) + return { + url: URL.createObjectURL(file), + } } - const dataURLToImage = (dataURL: string): Promise => { - return new Promise((resolve) => { - const img = new Image() - img.onload = () => resolve(img) - img.src = dataURL - }) + const submitUpload = () => { + ;(uploadRef.current as uploadRefState).submit() } - const beforeUpload = async (files: File[]) => { - const canvas = document.createElement('canvas') - const context = canvas.getContext('2d') as CanvasRenderingContext2D - const base64 = await fileToDataURL(files[0]) - const img = await dataURLToImage(base64) - canvas.width = img.width - canvas.height = img.height - context.clearRect(0, 0, img.width, img.height) - context.drawImage(img, 0, 0, img.width, img.height) - const blob = (await canvastoFile(canvas, 'image/jpeg', 0.5)) as Blob - const f = await new File([blob], files[0].name, { type: files[0].type }) - return [f] + const clearUpload = () => { + ;(uploadRef.current as uploadRefState).clear() } - - return + return ( + + upload(file)} + style={{ marginBottom: 10 }} + /> + + + + + + ) } export default Demo9 diff --git a/src/packages/uploader/demos/taro/demo1.tsx b/src/packages/uploader/demos/taro/demo1.tsx index 1a0ecb831e..b094b77778 100644 --- a/src/packages/uploader/demos/taro/demo1.tsx +++ b/src/packages/uploader/demos/taro/demo1.tsx @@ -1,39 +1,51 @@ -import React from 'react' -import { Uploader, Cell } from '@nutui/nutui-react-taro' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem, Space } from '@nutui/nutui-react-taro' import { Dongdong } from '@nutui/icons-react-taro' const Demo1 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onStart = () => { - console.log('start触发') + const demoUrl = + 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' + + const [list, setList] = useState([ + { + url: demoUrl, + uid: 133, + }, + ]) + + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { url: demoUrl } } - const beforeUpload = async (files: File[]) => { - console.log('beforeUpload') - const allowedTypes = ['image/png'] - const filteredFiles = Array.from(files).filter((file) => - allowedTypes.includes(file.type) - ) - return filteredFiles + async function uploadFail(file: File): Promise { + await sleep(2000) + throw new Error('Fail to upload') } return ( - - - - } onStart={onStart} /> - + <> + + + upload(file)} + /> + upload(file)} /> + } + upload={(file: File) => uploadFail(file)} + /> + + + ) } export default Demo1 diff --git a/src/packages/uploader/demos/taro/demo10.tsx b/src/packages/uploader/demos/taro/demo10.tsx index 4048d6d886..0c5653c4b7 100644 --- a/src/packages/uploader/demos/taro/demo10.tsx +++ b/src/packages/uploader/demos/taro/demo10.tsx @@ -1,11 +1,74 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' +import React, { useState } from 'react' +import { Loading, Star } from '@nutui/icons-react' +import { Uploader, Button, FileItem } from '@nutui/nutui-react-taro' const Demo10 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const formData = { - custom: 'test', + const [list, setList] = useState([ + { + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + name: '文件2.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + name: '文件3.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + failIcon: , + }, + { + name: '文件444.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + percentage: 30, + }, + { + name: '文件555.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + loadingIcon: , + percentage: 80, + }, + ]) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) } - return + async function upload(file: File) { + await sleep(2000) + if (Math.random() < 0.5) { + return { + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + } + } + throw new Error('Fail to upload') + } + return ( + upload(file)} + value={list} + onChange={setList} + maxCount="10" + multiple + previewType="list" + style={{ marginBottom: 20 }} + > + + + ) } export default Demo10 diff --git a/src/packages/uploader/demos/taro/demo11.tsx b/src/packages/uploader/demos/taro/demo11.tsx deleted file mode 100644 index 0ceef47cd2..0000000000 --- a/src/packages/uploader/demos/taro/demo11.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' - -const Demo11 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const beforeXhrUpload = (taroUploadFile: any, options: any) => { - const uploadTask = taroUploadFile({ - url: options.url, - filePath: options.taroFilePath, - fileType: options.fileType, - header: { - 'Content-Type': 'multipart/form-data', - ...options.headers, - }, - formData: options.formData, - name: options.name, - success(response: { errMsg: any; statusCode: number; data: string }) { - if (options.xhrState === response.statusCode) { - options.onSuccess?.(response, options) - } else { - options.onFailure?.(response, options) - } - }, - fail(e: any) { - options.onFailure?.(e, options) - }, - }) - options.onStart?.(options) - uploadTask.progress( - (res: { - progress: any - totalBytesSent: any - totalBytesExpectedToSend: any - }) => { - options.onProgress?.(res, options) - } - ) - } - return ( - - ) -} -export default Demo11 diff --git a/src/packages/uploader/demos/taro/demo12.tsx b/src/packages/uploader/demos/taro/demo12.tsx deleted file mode 100644 index 7f389f2cf0..0000000000 --- a/src/packages/uploader/demos/taro/demo12.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React, { useRef } from 'react' -import { View } from '@tarojs/components' -import { Uploader, Button } from '@nutui/nutui-react-taro' - -interface uploadRefState { - submit: () => void - clear: () => void -} - -const Demo12 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const uploadRef = useRef(null) - - const submitUpload = () => { - ;(uploadRef.current as uploadRefState).submit() - } - const clearUpload = () => { - ;(uploadRef.current as uploadRefState).clear() - } - return ( - <> - - - - - - - ) -} -export default Demo12 diff --git a/src/packages/uploader/demos/taro/demo13.tsx b/src/packages/uploader/demos/taro/demo13.tsx deleted file mode 100644 index cf6a11e423..0000000000 --- a/src/packages/uploader/demos/taro/demo13.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' - -const Demo13 = () => { - return -} -export default Demo13 diff --git a/src/packages/uploader/demos/taro/demo14.tsx b/src/packages/uploader/demos/taro/demo14.tsx deleted file mode 100644 index e5b8fb09a7..0000000000 --- a/src/packages/uploader/demos/taro/demo14.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' -import { Dongdong, Star } from '@nutui/icons-react-taro' - -const Demo14 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - ] - const onDelete = (file: any, fileList: any) => { - console.log('delete事件触发', file, fileList) - } - return ( - } - deleteIcon={} - /> - ) -} -export default Demo14 diff --git a/src/packages/uploader/demos/taro/demo2.tsx b/src/packages/uploader/demos/taro/demo2.tsx index 626e885f01..764cc9d464 100644 --- a/src/packages/uploader/demos/taro/demo2.tsx +++ b/src/packages/uploader/demos/taro/demo2.tsx @@ -1,15 +1,59 @@ import React from 'react' -import { Uploader, Cell } from '@nutui/nutui-react-taro' +import { Uploader, FileItem } from '@nutui/nutui-react-taro' +import { Dongdong, Loading, Star } from '@nutui/icons-react-taro' const Demo2 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onStart = () => { - console.log('start触发') + const defaultList: FileItem[] = [ + { + uid: 111, + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + uid: 222, + name: '文件2.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'success', + message: '上传成功', + }, + { + uid: 333, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + }, + { + uid: 444, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + failIcon: , + }, + { + uid: 555, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'error', + message: '上传失败', + }, + { + uid: 666, + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + status: 'uploading', + message: '上传中...', + loadingIcon: , + }, + ] + const onDelete = (file: FileItem, fileList: FileItem[]) => { + console.log('delete事件触发', file, fileList) } return ( - - - + } + maxCount={6} + /> ) } export default Demo2 diff --git a/src/packages/uploader/demos/taro/demo3.tsx b/src/packages/uploader/demos/taro/demo3.tsx index d3f2d0d2aa..5e9e644b75 100644 --- a/src/packages/uploader/demos/taro/demo3.tsx +++ b/src/packages/uploader/demos/taro/demo3.tsx @@ -1,72 +1,38 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' -import { Dongdong, Loading, Star } from '@nutui/icons-react-taro' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem, Space } from '@nutui/nutui-react-taro' const Demo3 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '123', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'error', - message: '上传失败', - type: 'image', - uid: '124', - failIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '125', - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '126', - loadingIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '127', - loadingIcon: null, - }, - ] - const onDelete = (file: any, fileList: any) => { - console.log('delete事件触发', file, fileList) + const demoUrl = + 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' + + const [list, setList] = useState([]) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: demoUrl, + } } return ( - } - /> + <> + + + upload(file)} + maxCount={5} + multiple + /> + + + ) } export default Demo3 diff --git a/src/packages/uploader/demos/taro/demo4.tsx b/src/packages/uploader/demos/taro/demo4.tsx index 646fe4bbc1..0d3fcdf942 100644 --- a/src/packages/uploader/demos/taro/demo4.tsx +++ b/src/packages/uploader/demos/taro/demo4.tsx @@ -1,75 +1,40 @@ -import React from 'react' -import { Uploader, Button, Loading } from '@nutui/nutui-react-taro' -import { Star } from '@nutui/icons-react-taro' +import React, { useState } from 'react' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react-taro' const Demo4 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const defaultFileList: any = [ - { - name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '122', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'success', - message: '上传成功', - type: 'image', - uid: '123', - }, - { - name: '文件2.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'error', - message: '上传失败', - type: 'image', - uid: '124', - failIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '125', - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '126', - loadingIcon: , - }, - { - name: '文件3.png', - url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', - status: 'uploading', - message: '上传中...', - type: 'image', - uid: '127', - loadingIcon: null, - }, - ] + const demoUrl = + 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' + const [list, setList] = useState([]) + + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: demoUrl, + } + } + const onOversize = (files: File[]) => { + console.log('oversize触发文件大小不能超过50kb', files) + } return ( - - - + <> + + upload(file)} + maxFileSize={1024 * 50} + onOversize={onOversize} + /> + + ) } export default Demo4 diff --git a/src/packages/uploader/demos/taro/demo5.tsx b/src/packages/uploader/demos/taro/demo5.tsx index d6835ae100..82099058fe 100644 --- a/src/packages/uploader/demos/taro/demo5.tsx +++ b/src/packages/uploader/demos/taro/demo5.tsx @@ -1,26 +1,37 @@ import React, { useState } from 'react' -import { Uploader, Button, Progress } from '@nutui/nutui-react-taro' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react-taro' const Demo5 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const [progressPercent, setProgressPercent] = useState(0) - const onProgress = ({ event, options, percentage }: any) => { - setProgressPercent(percentage) + const [list, setList] = useState([]) + const beforeUpload = async (files: File[]) => { + const allowedTypes = ['image/png'] + const filteredFiles = Array.from(files).filter((file) => + allowedTypes.includes(file.type) + ) + return filteredFiles + } + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + } } return ( - <> - - - -
- + upload(file)} /> - + ) } export default Demo5 diff --git a/src/packages/uploader/demos/taro/demo6.tsx b/src/packages/uploader/demos/taro/demo6.tsx index 573b42ccf1..c1cb00343e 100644 --- a/src/packages/uploader/demos/taro/demo6.tsx +++ b/src/packages/uploader/demos/taro/demo6.tsx @@ -1,8 +1,11 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' +import { Uploader, Cell } from '@nutui/nutui-react-taro' const Demo6 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - return + return ( + + + + ) } export default Demo6 diff --git a/src/packages/uploader/demos/taro/demo7.tsx b/src/packages/uploader/demos/taro/demo7.tsx index 59ed3cb608..7dd9210a6f 100644 --- a/src/packages/uploader/demos/taro/demo7.tsx +++ b/src/packages/uploader/demos/taro/demo7.tsx @@ -1,15 +1,33 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' +import { Uploader, Cell, FileItem } from '@nutui/nutui-react-taro' +import { Dongdong, Star } from '@nutui/icons-react-taro' +const defaultFileList: FileItem[] = [ + { + name: '文件文件文件文件1文件文件文件文件1文件文件文件文件1.png', + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + message: '上传成功', + }, +] const Demo7 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' return ( - + + } + deleteIcon={} + style={{ + marginInlineEnd: '10px', + }} + maxCount={1} + /> + } + deleteIcon={} + maxCount={1} + /> + ) } export default Demo7 diff --git a/src/packages/uploader/demos/taro/demo8.tsx b/src/packages/uploader/demos/taro/demo8.tsx index 80e0dfd90b..7e432462c1 100644 --- a/src/packages/uploader/demos/taro/demo8.tsx +++ b/src/packages/uploader/demos/taro/demo8.tsx @@ -1,8 +1,24 @@ import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' +import { Cell, Uploader } from '@nutui/nutui-react-taro' const Demo8 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - return + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + } + } + return ( + + upload(file)} sourceType={['camera']} /> + + ) } export default Demo8 diff --git a/src/packages/uploader/demos/taro/demo9.tsx b/src/packages/uploader/demos/taro/demo9.tsx index 4e32e8e70f..96dd98102c 100644 --- a/src/packages/uploader/demos/taro/demo9.tsx +++ b/src/packages/uploader/demos/taro/demo9.tsx @@ -1,19 +1,57 @@ -import React from 'react' -import { Uploader } from '@nutui/nutui-react-taro' -import Taro from '@tarojs/taro' +import React, { useRef } from 'react' +import { Uploader, Button, Cell } from '@nutui/nutui-react-taro' +import { View } from '@tarojs/components' + +interface uploadRefState { + submit: () => void + clear: () => void +} const Demo9 = () => { - const uploadUrl = 'https://my-json-server.typicode.com/linrufeng/demo/posts' - const onOversize = (files: Taro.chooseImage.ImageFile[]) => { - console.log('oversize触发文件大小不能超过50kb', files) + const uploadRef = useRef(null) + function sleep(time: number) { + return new Promise((resolve) => { + setTimeout(() => { + resolve() + }, time) + }) + } + async function upload(file: File) { + await sleep(2000) + return { + url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif', + } + } + const submitUpload = () => { + ;(uploadRef.current as uploadRefState).submit() + } + const clearUpload = () => { + ;(uploadRef.current as uploadRefState).clear() } return ( - + + upload(file)} + style={{ marginBottom: 10 }} + /> + + + + + ) } export default Demo9 diff --git a/src/packages/uploader/doc.en-US.md b/src/packages/uploader/doc.en-US.md index ad5c7a2ff3..ddd803979b 100644 --- a/src/packages/uploader/doc.en-US.md +++ b/src/packages/uploader/doc.en-US.md @@ -1,14 +1,14 @@ -# Uploader +# Uploader Upload -Used to upload local pictures or files to the server. +Used to upload local images or files to the server. -## Import +## Introduction ```tsx import { Uploader } from '@nutui/nutui-react' ``` -## Demo +## Sample code ### Basic usage @@ -18,29 +18,7 @@ import { Uploader } from '@nutui/nutui-react' ::: -> When using the Uploader component to upload files, you may encounter the problem of garbled Chinese characters in the response file information. This usually happens when the client and server are inconsistent in how they handle the encoding of the file. To avoid this problem, it is recommended to ensure that the encoding format of the file read by the server is consistent with that of the client. - -```javascript -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -// Server Demo -app.post('/upload', upload.single('file'), (req, res) => { - const fileEncoding = req.headers['x-file-encoding'] || 'UTF-8' - const fileContent = iconv.decode( - Buffer.from(JSON.stringify(req.file), 'binary'), - fileEncoding - ) - res.json({ - success: true, - message: 'File uploaded successfully', - data: JSON.parse(fileContent), - }) -}) -// Client Demo -; -``` - -### Basic usage +### Upload status :::demo @@ -48,7 +26,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### upload status +### Limit the number of uploads :::demo @@ -56,7 +34,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Basic usage - upload list dispaly +### Limit upload size :::demo @@ -64,7 +42,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Custom upload uses default progress bar +### Customize pre-upload processing :::demo @@ -72,7 +50,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Direct camera up (mobile) +### Disabled state :::demo @@ -80,7 +58,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Limit the number of uploads to 5 +### Custom delete icon :::demo @@ -88,7 +66,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Limit upload size (maximum 50kb per file) +### Directly activate the camera (valid on mobile version) :::demo @@ -96,133 +74,98 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### Image compression (handled in a foreupload hook) +### Manually perform an upload with a button when a file is selected :::demo - - ::: -### Custom data FormData, headers +### Basic usage - upload list display :::demo - - -::: - -### Custom xhr upload method (before-xhr-upload) - -:::demo - - - -::: - -### After selecting Chinese, manually perform the upload via the button - -:::demo - - - -::: - -### Disabled state - -:::demo - - - -::: +:::. ## Uploader ### Props | Property | Description | Type | Default | -| --- | --- | --- | --- | -| autoUpload | Whether to upload the file immediately after selecting it, if false, you need to manually execute the ref submit method to upload | `boolean` | `true` | -| name | The name of the `input` tag `name`, the file parameter name sent to the background | `string` | `file` | -| url | The interface address of the upload server | `string` | `-` | -| defaultValue | List of uploaded files by default | `FileType[]` | `[]` | -| value | List of uploaded files | `FileType[]` | `[]` | -| preview | Whether to display the preview image after the upload is successful | `boolean` | `true` | -| previewUrl | When uploading a default image URL in a non-image ('image') format | `string` | `-` | -| deletable | Whether to display the delete button | `boolean` | `true` | -| method | The http method of upload request | `string` | `post` | -| previewType | The built-in style of the upload list, supports two basic styles picture, list | `string` | `picture` | -| capture | Capture, can be set to [camera](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture)，turn on the camera directly | `string` | `false` | -| maxFileSize | You can set the maximum upload file size (bytes) | `number` \| `string` | `Number.MAX_VALUE` | -| maxCount | File upload limit | `number` \| `string` | `1` | -| fit | image fill mode | `contain` \| `cover` \| `fill` \| `none` \| `scale-down` | `cover` | -| clearInput | Whether to clear the `input` content, set to `true` to support repeated selection and upload of the same file | `boolean` | `true` | -| accept | File types that can be accepted. See [Des](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B) | `string` | `*` | -| headers | Set request headers | `object` | `{}` | -| data | Uploading extra params or function which can return uploading extra params formData | `object` | `{}` | -| uploadIcon | Upload areaicon name | `React.ReactNode` | `-` | -| deleteIcon | Delete area icon name | `React.ReactNode` | `-` | -| uploadLabel | Upload area tip | `React.ReactNode` | `-` | -| xhrState | The success status (status) value of the interface response | `number` | `200` | -| withCredentials | Support for sending cookie credential information | `boolean` | `false` | -| multiple | Whether to support multiple file selection | `boolean` | `false` | -| disabled | Whether to disable file upload | `boolean` | `false` | -| timeout | timeout, in milliseconds | `number` \| `string` | `1000 * 30` | -| beforeUpload | The pre-upload function needs to return a `Promise` object | `(file: File[]) => Promise` | `-` | -| beforeXhrUpload | When performing an XHR upload, the custom method | `(xhr: XMLHttpRequest, options: any) => void` | `-` | -| beforeDelete | Callback when file is removed. If the return value is false, it will not be removed. Supports returning a `Promise` object, which is not removed when the `Promise` object resolves(false) or rejects | `(file: FileItem, files: FileItem[]) => boolean` | `-` | -| onStart | File upload started | `(option: UploadOptions) => void` | `-` | -| onProgress | Progress of file upload | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onOversize | Triggered when the file size exceeds the limit | `(file: File[]) => void` | `-` | -| onSuccess | uploaded successfully | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onFailure | upload failed | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onChange | Status when uploaded files change | `(files: FileItem[]) => void` | `-` | -| onDelete | The state of the file before deletion | `(file: FileItem, files: FileItem[]) => void` | `-` | -| onFileItemClick | Click trigger after the file is uploaded successfully | `(file: FileItem, index: number) => void` | `-` | - -> Note: accept, capture, and multiple are the native attributes of the browser's input tag. The mobile terminal's different models support these attributes differently, so there may be some compatibility problems under different models and WebView. +| --- | --- | --- | --- | autoUpload | Whether to upload the file immediately after selecting it. +| autoUpload | If or not the upload will be done immediately after the file is selected, if false, you need to manually execute the ref submit method to upload | `boolean` | `true` | upload | The upload method, the input parameter is the file to be uploaded. +| upload | Upload method, input is the file object to be uploaded, after asynchronous processing, return the upload result | `(file: File) => Promise` | `-` | +| name | The name of the `input` tag `name`, the name of the file parameter sent to the backend | `string` | `file` | +| defaultValue | Default list of files already uploaded | `FileItem[]` | `[]` | +| value | List of files that have been uploaded | `FileItem[]` | `-` | +| preview | Whether or not to show the preview image after a successful upload | `boolean` | `true` | +| previewUrl | Default image address when uploading non-image ('image') formats | `string` | `-` | +| deletable | Whether or not to show the delete button | `boolean` | `true` | +| method | The http method for the upload request | `string` | `post` | | previewType +| previewType | The built-in style of the uploaded list, two basic styles are supported picture, list | `string` +| capture | Picture [selection mode] ("), directly bring up the camera | `string` | `false` | maxFileSize +| maxFileSize | You can set the maximum file size (in bytes) for uploading | `number` \| `string` | `Number.MAX_VALUE` | +| maxCount | File upload count limit | `number` \| `string` | `1` | +| fit | Picture fill mode | `contain` \| `cover` \| `fill` \| `none` \| `scale-down` | `cover` | +| clearInput | If or not you want to clear the `input` content, set it to `true` to support selecting the same file to upload over and over again | `boolean` | `true` | +| accept | Allowed file types to be uploaded, [Details] (" B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B") | `string` | `*` | +| uploadIcon | uploadRegion Icon Name | `React.ReactNode` | `-` | +| deleteIcon | Delete the icon name of the region | `React.ReactNode` | `-` | +| uploadLabel | Text below the image in the upload area | `React. +| multiple | Whether to support file multi-selection |`boolean`|`false`| +| disabled | Whether to disable file uploading |`boolean`|`false`| +| beforeUpload | The beforeUpload function needs to return a`Promise`object |`(file: File[]) => Promise`|`-`| +| beforeDelete | Callback when deleting a file, does not remove it if the return value is false. Supports returning a`Promise`object, which is not removed when resolve(false) or reject |`(file: FileItem, files: FileItem[]) => boolean`|`-`| +| onOversize | Triggered when file size exceeds limit |`(file: File[]) => void`|`-`| +| onOverCount | Triggered when the number of files exceeds the limit |`(count: number) => void`|`-`| +| onChange | Triggered when the list of uploaded files changes |`(files: FileItem[]) => void`|`-`| +| onDelete | Triggered when clicked to delete a file |`(file: FileItem, files: FileItem[]) => void`|`-`| +| onFileItemClick | Triggered when a file is uploaded successfully |`(file: FileItem, index: number) => void`|`-`| +| onUploadQueueChange | Triggered when the image upload queue changes |`(tasks: FileItem[]) => void`|`-` | + +> Note: accept, capture and multiple are the native attributes of the browser input tag, the support for these attributes varies among mobile models, so there may be some compatibility issues under different models and WebViews. ### FileItem -| Property | Description | Default | -| --- | --- | --- | -| status | File status value, optional ‘ready,uploading,success,error’' | `ready` | -| uid | Unique ID of the file | `new Date().getTime().toString()` | -| name | File name | `-` | -| url | File path | `-` | -| type | File type | `image/jpeg` | -| formData | Upload the required data | `new FormData()` | +| Name | Description | Default Value | +| --- | --- | --- | status | File status value. +| status | File status value, optionally 'ready,uploading,success,error' | `ready` | +| uid | Unique identifier of the file | `-` | name | File name. +| name | File name | `-` | url | Path to file +| url | file path | `-` | uid | unique identifier for the file | `-` | name | file name | `-` | url | file path | `-` | type | file type +| type | file type | `image` | +| loadingIcon | Loading Icon | `-` | +| failIcon | failureIcon | `-` | +| percentage | upload prgress percent | `-` | ### Methods -Use ref to get Uploader instance and call instance methods. - -| Name | Description | Arguments | Return value | -| --- | --- | --- | --- | -| submit | Manual upload mode, perform upload operation | `-` | `-` | -| clear | Empty the selected file queue (this method is generally used when uploading in manual mode) | `index` | `-` | +The Uploader instance can be retrieved by ref and the instance methods called. +| MethodName | Description | Parameters | ReturnValues | +| --- | --- | --- | --- | --- | submit | Manual upload mode +| submit | Manual upload mode, performs the upload operation | `-` | `-` | +| clear | Clear the queue of selected files (this method is usually used when uploading in manual mode) | `index` | `-` | -## Theming +## Theme customization -### CSS Variables +### Style variables -The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/component/configprovider). +The component provides the following CSS variables that can be used to customize styles, see [ConfigProvider component](#/zh-CN/component/configprovider). | Name | Description | Default Value | | --- | --- | --- | | \--nutui-uploader-image-width | The width of the uploaded image | `100px` | -| \--nutui-uploader-image-height | The height of the uploaded image | `100px` | -| \--nutui-uploader-image-border | The border value of the uploaded image | `0px` | `-` | -| \--nutui-uploader-image-border-radius | Border rounded corners of uploaded images | `4px` | +| \--nutui-uploader-image-height | Height of the uploaded image | `100px` | +| \--nutui-uploader-image-border | Border value of the uploaded image | `0px` | +| \--nutui-uploader-image-border-radius | Rounded border of uploaded image | `4px` | | \--nutui-uploader-background | The background color of the uploaded image | `$color-background` | -| \--nutui-uploader-background-disabled | The background color of the disabled state of uploading images | `$color-background` | -| \--nutui-uploader-image-icon-tip-font-size | The size of the text below the image in the upload area | `12px` | -| \--nutui-uploader-image-icon-tip-color | The color of the text below the image in the upload area | `#C2C4CC` | -| \--nutui-uploader-preview-progress-background | The background color of the upload area preview progress | `rgba(0, 0, 0, 0.65)` | -| \--nutui-uploader-preview-margin-right | Upload area preview margin-right value | `10px` | -| \--nutui-uploader-preview-margin-bottom | Upload area preview margin-bottom value | `10px` | -| \--nutui-uploader-preview-tips-height | Upload a picture to preview the height under tips | `24px` | -| \--nutui-uploader-preview-tips-background | Upload image preview background color under tips | `rgba(0, 0, 0, 0.45)` | -| \--nutui-uploader-preview-tips-padding | Upload an image to preview the padding value under tips | `0 5px` | -| \--nutui-uploader-preview-close-right | The right value of the upload image close button | `0px` | -| \--nutui-uploader-preview-close-top | The top value of the upload image close button | `0px` | +| \--nutui-uploader-background-disabled | Background color for uploaded images in disabled state | `$color-background` | +| \--nutui-uploader-image-icon-tip-font-size | Text size below image in upload area | `12px` | +| \--nutui-uploader-image-icon-tip-color | Text color below image in upload area | `#BFBFBF` | +| \--nutui-uploader-preview-progress-background | The background color of the preview progress in the upload area | `rgba(0, 0, 0, 0.65)` | +| \--nutui-uploader-preview-margin-right | The value of margin-right for the preview of the upload area | `10px` | +| \--nutui-uploader-preview-margin-bottom | Upload area preview the value of margin-bottom | `10px` | +| \--nutui-uploader-preview-tips-height | Height under uploaded image preview tips | `24px` | +| \--nutui-uploader-preview-tips-background | Background color under uploaded image preview tips | `rgba(0, 0, 0, 0.45)` | +| \--nutui-uploader-preview-tips-padding | Padding value under uploaded image preview tips | `0 5px` | +| \--nutui-uploader-preview-close-right | The right value under the upload image's close button | `0px` | +| \--nutui-uploader-preview-close-top | The top value of the uploader's close button | `0px` | diff --git a/src/packages/uploader/doc.md b/src/packages/uploader/doc.md index bf943fce91..3586fe115d 100644 --- a/src/packages/uploader/doc.md +++ b/src/packages/uploader/doc.md @@ -18,30 +18,7 @@ import { Uploader } from '@nutui/nutui-react' ::: -> 在使用Uploader组件上传文件时，可能会遇到响应文件信息中文乱码的问题。这通常发生在客户端与服务器端在处理文件编码时不一致的情况下。为了避免这种问题，建议确保服务器端读取文件的编码格式与客户端保持一致。 - -```javascript -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -// Server Demo -app.post('/upload', upload.single('file'), (req, res) => { - const fileEncoding = req.headers['x-file-encoding'] || 'UTF-8' - const fileContent = iconv.decode( - Buffer.from(JSON.stringify(req.file), 'binary'), - fileEncoding - ) - res.json({ - success: true, - message: 'File uploaded successfully', - data: JSON.parse(fileContent), - }) -}) - -// Client Demo -; -``` - -### 基础用法 +### 上传状态 :::demo @@ -49,7 +26,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 上传状态 +### 限制上传数量 :::demo @@ -57,7 +34,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 基础用法-上传列表展示 +### 限制上传大小 :::demo @@ -65,7 +42,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定义上传使用默认进度条 +### 自定义上传前的处理 :::demo @@ -73,7 +50,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 直接调起摄像头（移动端生效） +### 禁用状态 :::demo @@ -81,7 +58,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上传数量5个 +### 自定义删除icon :::demo @@ -89,7 +66,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上传大小（每个文件最大不超过50kb） +### 直接调起摄像头（移动端生效） :::demo @@ -97,7 +74,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 图片压缩（在beforeupload钩子中处理） +### 选中文件后，通过按钮手动执行上传 :::demo @@ -105,7 +82,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定义数据 FormData、headers +### 基础用法-上传列表展示 :::demo @@ -113,41 +90,17 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定义 xhr 上传方式(before-xhr-upload) - -:::demo - - - -::: - -### 选中文件后，通过按钮手动执行上传 - -:::demo - - - -::: - -### 禁用状态 - -:::demo - - - -::: - ## Uploader ### Props | 字段 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | -| autoUpload | 是否在选取文件后立即进行上传，false 时需要手动执行 ref submit 方法进行上传 | `Boolean` | `true` | +| autoUpload | 是否在选取文件后立即进行上传，false 时需要手动执行 ref submit 方法进行上传 | `boolean` | `true` | +| upload | 上传方法，入参是需要被上传的文件对象，经过异步处理之后，返回上传结果 | `(file: File) => Promise` | `-` | | name | `input` 标签 `name` 的名称，发到后台的文件参数名 | `string` | `file` | -| url | 上传服务器的接口地址 | `string` | `-` | -| defaultValue | 默认已经上传的文件列表 | `FileType[]` | `[]` | -| value | 已经上传的文件列表 | `FileType[]` | `[]` | +| defaultValue | 默认已经上传的文件列表 | `FileItem[]` | `[]` | +| value | 已经上传的文件列表 | `FileItem[]` | `-` | | preview | 是否上传成功后展示预览图 | `boolean` | `true` | | previewUrl | 当上传非图片('image')格式的默认图片地址 | `string` | `-` | | deletable | 是否展示删除按钮 | `boolean` | `true` | @@ -159,27 +112,19 @@ app.post('/upload', upload.single('file'), (req, res) => { | fit | 图片填充模式 | `contain` \| `cover` \| `fill` \| `none` \| `scale-down` | `cover` | | clearInput | 是否需要清空`input`内容，设为`true`支持重复选择上传同一个文件 | `boolean` | `true` | | accept | 允许上传的文件类型，[详细说明]("https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B") | `string` | `*` | -| headers | 设置上传的请求头部 | `object` | `{}` | -| data | 附加上传的信息 formData | `object` | `{}` | | uploadIcon | 上传区域图标名称 | `React.ReactNode` | `-` | | deleteIcon | 删除区域的图标名称 | `React.ReactNode` | `-` | | uploadLabel | 上传区域图片下方文字 | `React.ReactNode` | `-` | -| xhrState | 接口响应的成功状态（status）值 | `number` | `200` | -| withCredentials | 支持发送 cookie 凭证信息 | `Boolean` | `false` | | multiple | 是否支持文件多选 | `boolean` | `false` | | disabled | 是否禁用文件上传 | `boolean` | `false` | -| timeout | 超时时间，单位为毫秒 | `number` \| `string` | `1000 * 30` | | beforeUpload | 上传前的函数需要返回一个`Promise`对象 | `(file: File[]) => Promise` | `-` | -| beforeXhrUpload | 执行 XHR 上传时，自定义方式 | `(xhr: XMLHttpRequest, options: any) => void` | `-` | | beforeDelete | 除文件时的回调，返回值为 false 时不移除。支持返回一个 `Promise` 对象，`Promise` 对象 resolve(false) 或 reject 时不移除 | `(file: FileItem, files: FileItem[]) => boolean` | `-` | -| onStart | 文件上传开始 | `(option: UploadOptions) => void` | `-` | -| onProgress | 文件上传的进度 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | | onOversize | 文件大小超过限制时触发 | `(file: File[]) => void` | `-` | -| onSuccess | 上传成功 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onFailure | 上传失败 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onChange | 上传文件改变时的状态 | `(files: FileItem[]) => void` | `-` | -| onDelete | 文件删除之前的状态 | `(file: FileItem, files: FileItem[]) => void` | `-` | +| onOverCount | 文件数量超过限制时触发 | `(count: number) => void` | `-` | +| onChange | 已上传的文件列表变化时触发 | `(files: FileItem[]) => void` | `-` | +| onDelete | 点击删除文件时触发 | `(file: FileItem, files: FileItem[]) => void` | `-` | | onFileItemClick | 文件上传成功后点击触发 | `(file: FileItem, index: number) => void` | `-` | +| onUploadQueueChange | 图片上传队列变化时触发 | `(tasks: FileItem[]) => void` | `-` | > 注意：accept、capture 和 multiple 为浏览器 input 标签的原生属性，移动端各种机型对这些属性的支持程度有所差异，因此在不同机型和 WebView 下可能出现一些兼容性问题。 @@ -187,12 +132,14 @@ app.post('/upload', upload.single('file'), (req, res) => { | 名称 | 说明 | 默认值 | | --- | --- | --- | -| status | 文件状态值，可选'ready,uploading,success,error,removed' | `ready` | -| uid | 文件的唯一标识 | `new Date().getTime().toString()` | +| status | 文件状态值，可选'ready,uploading,success,error' | `ready` | +| uid | 文件的唯一标识 | `-` | | name | 文件名称 | `-` | | url | 文件路径 | `-` | -| type | 文件类型 | `image/jpeg` | -| formData | 上传所需的data | `new FormData()` | +| type | 文件类型 | `image` | +| loadingIcon | 加载图标 | `-` | +| failIcon | 加载失败图标 | `-` | +| percentage | 上传进度条百分比 | `-` | ### Methods @@ -218,7 +165,7 @@ app.post('/upload', upload.single('file'), (req, res) => { | \--nutui-uploader-background | 上传图片的背景颜色 | `$color-background` | | \--nutui-uploader-background-disabled | 上传图片禁用状态的背景颜色 | `$color-background` | | \--nutui-uploader-image-icon-tip-font-size | 上传区域图片下方文字大小 | `12px` | -| \--nutui-uploader-image-icon-tip-color | 上传区域图片下方文字颜色 | `#C2C4CC` | +| \--nutui-uploader-image-icon-tip-color | 上传区域图片下方文字颜色 | `#BFBFBF` | | \--nutui-uploader-preview-progress-background | 上传区域预览进度的背景颜色 | `rgba(0, 0, 0, 0.65)` | | \--nutui-uploader-preview-margin-right | 上传区域预览margin-right的值 | `10px` | | \--nutui-uploader-preview-margin-bottom | 上传区域预览margin-bottom的值 | `10px` | diff --git a/src/packages/uploader/doc.taro.md b/src/packages/uploader/doc.taro.md index 9a2232ffa2..8350d415ce 100644 --- a/src/packages/uploader/doc.taro.md +++ b/src/packages/uploader/doc.taro.md @@ -18,29 +18,7 @@ import { Uploader } from '@nutui/nutui-react-taro' ::: -> 在使用Uploader组件上传文件时，可能会遇到响应文件信息中文乱码的问题。这通常发生在客户端与服务器端在处理文件编码时不一致的情况下。为了避免这种问题，建议确保服务器端读取文件的编码格式与客户端保持一致。 - -```javascript -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -// Server Demo -app.post('/upload', upload.single('file'), (req, res) => { - const fileEncoding = req.headers['x-file-encoding'] || 'UTF-8' - const fileContent = iconv.decode( - Buffer.from(JSON.stringify(req.file), 'binary'), - fileEncoding - ) - res.json({ - success: true, - message: 'File uploaded successfully', - data: JSON.parse(fileContent), - }) -}) -// Client Demo -; -``` - -### 基础用法 +### 上传状态 :::demo @@ -48,7 +26,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 上传状态 +### 限制上传数量 :::demo @@ -56,7 +34,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 基础用法-上传列表展示 +### 限制上传大小 :::demo @@ -64,7 +42,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定义上传使用默认进度条 +### 自定义上传前的处理 :::demo @@ -72,7 +50,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 直接调起摄像头（移动端生效） +### 禁用状态 :::demo @@ -80,7 +58,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 使用前摄像头拍摄3s视频并上传(仅支持微信小程序) +### 自定义删除icon :::demo @@ -88,7 +66,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上传数量5个 +### 选中文件后，通过按钮手动执行上传 :::demo @@ -96,7 +74,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上传大小（每个文件最大不超过50kb） +### 基础用法-上传列表展示 :::demo @@ -104,38 +82,6 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定义数据 FormData、headers - -:::demo - - - -::: - -### 自定义 Taro.uploadFile 上传方式(before-xhr-upload) - -:::demo - - - -::: - -### 选中文件后，通过按钮手动执行上传 - -:::demo - - - -::: - -### 禁用状态 - -:::demo - - - -::: - ## Uploader ### Props @@ -143,10 +89,10 @@ app.post('/upload', upload.single('file'), (req, res) => { | 字段 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | autoUpload | 是否在选取文件后立即进行上传，false 时需要手动执行 ref submit 方法进行上传 | `boolean` | `true` | +| upload | 上传方法，入参是需要被上传的文件对象，经过异步处理之后，返回上传结果 | `(file: File) => Promise` | `-` | | name | `input` 标签 `name` 的名称，发到后台的文件参数名 | `string` | `file` | -| url | 上传服务器的接口地址 | `string` | `-` | -| defaultValue | 默认已经上传的文件列表 | `FileType[]` | `[]` | -| value | 已经上传的文件列表 | `FileType[]` | `[]` | +| defaultValue | 默认已经上传的文件列表 | `FileItem[]` | `[]` | +| value | 已经上传的文件列表 | `FileItem[]` | `-` | | preview | 是否上传成功后展示预览图 | `boolean` | `true` | | previewUrl | 当上传非图片('image')格式的默认图片地址 | `string` | `-` | | deletable | 是否展示删除按钮 | `boolean` | `true` | @@ -155,46 +101,42 @@ app.post('/upload', upload.single('file'), (req, res) => { | maxFileSize | 可以设定最大上传文件的大小（字节） | `number` \| `string` | `Number.MAX_VALUE` | | maxCount | 文件上传数量限制 | `number` \| `string` | `1` | | fit | 图片填充模式 | `contain` \| `cover` \| `fill` \| `none` \| `scale-down` | `cover` | -| sourceType | [选择文件的来源]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['album','camera']` | -| camera`仅支持WEAPP` | 仅在 `source-type` 为 `camera` 时生效，使用前置或后置摄像头 | `String` | `back` | -| sizeType | [是否压缩所选文件]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['original','compressed']` | -| mediaType`仅支持WEAPP` | [选择文件类型]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['image', 'video', 'mix']` | -| maxDuration`仅支持WEAPP` | 拍摄视频最长拍摄时间，单位秒。时间范围为 3s 至 60s 之间。不限制相册。 | `number` | `10` | -| headers | 设置上传的请求头部 | `object` | `{}` | -| data | 附加上传的信息 formData | `object` | `{}` | -| uploadIcon | 上传区域图标名称 | `ReactNode` | `-` | +| clearInput | 是否需要清空`input`内容，设为`true`支持重复选择上传同一个文件 | `boolean` | `true` | +| uploadIcon | 上传区域图标名称 | `React.ReactNode` | `-` | | deleteIcon | 删除区域的图标名称 | `React.ReactNode` | `-` | -| uploadLabel | 上传区域图片下方文字 | `string` | `""` | -| xhrState | 接口响应的成功状态（status）值 | `number` | `200` | -| disabled | 是否禁用文件上传 | `boolean` | `false` | +| uploadLabel | 上传区域图片下方文字 | `React.ReactNode` | `-` | | multiple | 是否支持文件多选 | `boolean` | `false` | -| timeout | 超时时间，单位为毫秒 | `number` \| `string` | `1000 * 30` | +| disabled | 是否禁用文件上传 | `boolean` | `false` | | beforeUpload | 上传前的函数需要返回一个`Promise`对象 | `(file: File[]) => Promise` | `-` | -| beforeXhrUpload | 执行 XHR 上传时，自定义方式 | `(xhr: XMLHttpRequest, options: any) => void` | `-` | | beforeDelete | 除文件时的回调，返回值为 false 时不移除。支持返回一个 `Promise` 对象，`Promise` 对象 resolve(false) 或 reject 时不移除 | `(file: FileItem, files: FileItem[]) => boolean` | `-` | -| onStart | 文件上传开始 | `(option: UploadOptions) => void` | `-` | -| onProgress | 文件上传的进度 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onOversize | 文件大小超过限制时触发 | `(param: {responseText: XMLHttpRequest['responseText'];option: UploadOptions;files: FileItem[]}) => void` | `-` | -| onSuccess | 上传成功 | `(param: {responseText: XMLHttpRequest['responseText'];option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onFailure | 上传失败 | `(param: {responseText: XMLHttpRequest['responseText'];option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onChange | 上传文件改变时的状态 | `(param: FileItem[]) => void` | `-` | -| onDelete | 文件删除之前的状态 | `(file: FileItem, files: FileItem[]) => void` | `-` | +| onOversize | 文件大小超过限制时触发 | `(file: File[]) => void` | `-` | +| onOverCount | 文件数量超过限制时触发 | `(count: number) => void` | `-` | +| onChange | 已上传的文件列表变化时触发 | `(files: FileItem[]) => void` | `-` | +| onDelete | 点击删除文件时触发 | `(file: FileItem, files: FileItem[]) => void` | `-` | | onFileItemClick | 文件上传成功后点击触发 | `(file: FileItem, index: number) => void` | `-` | +| onUploadQueueChange | 图片上传队列变化时触发 | `(tasks: FileItem[]) => void` | `-` | +| sourceType | [选择文件的来源]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['album','camera']` | +| camera`仅支持WEAPP` | 仅在 `source-type` 为 `camera` 时生效，使用前置或后置摄像头 | `String` | `back` | +| sizeType | [是否压缩所选文件]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['original','compressed']` | +| mediaType`仅支持WEAPP` | [选择文件类型]("https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html") | `Array` | `['image', 'video', 'mix']` | +| maxDuration`仅支持WEAPP` | 拍摄视频最长拍摄时间，单位秒。时间范围为 3s 至 60s 之间。不限制相册。 | `number` | `10` | ### FileItem | 名称 | 说明 | 默认值 | | --- | --- | --- | -| status | 文件状态值，可选'ready,uploading,success,error,removed' | `ready` | -| uid | 文件的唯一标识 | `new Date().getTime().toString()` | +| status | 文件状态值，可选'ready,uploading,success,error' | `ready` | +| uid | 文件的唯一标识 | `-` | | name | 文件名称 | `-` | | url | 文件路径 | `-` | -| type | 文件类型 | `image/jpeg` | -| formData | 上传所需的data | `new FormData()` | +| type | 文件类型 | `image` | +| loadingIcon | 加载图标 | `-` | +| failIcon | 加载失败图标 | `-` | +| percentage | 上传进度条百分比 | `-` | ### Methods -通过 ref 可以获取到 Uploader 实例并调用实例方法 +通过ref可以获取到 Uploader 实例并调用实例方法 | 方法名 | 说明 | 参数 | 返回值 | | --- | --- | --- | --- | @@ -216,7 +158,7 @@ app.post('/upload', upload.single('file'), (req, res) => { | \--nutui-uploader-background | 上传图片的背景颜色 | `$color-background` | | \--nutui-uploader-background-disabled | 上传图片禁用状态的背景颜色 | `$color-background` | | \--nutui-uploader-image-icon-tip-font-size | 上传区域图片下方文字大小 | `12px` | -| \--nutui-uploader-image-icon-tip-color | 上传区域图片下方文字颜色 | `#C2C4CC` | +| \--nutui-uploader-image-icon-tip-color | 上传区域图片下方文字颜色 | `#BFBFBF` | | \--nutui-uploader-preview-progress-background | 上传区域预览进度的背景颜色 | `rgba(0, 0, 0, 0.65)` | | \--nutui-uploader-preview-margin-right | 上传区域预览margin-right的值 | `10px` | | \--nutui-uploader-preview-margin-bottom | 上传区域预览margin-bottom的值 | `10px` | diff --git a/src/packages/uploader/doc.zh-TW.md b/src/packages/uploader/doc.zh-TW.md index 07d2113d1f..bb3f29c96e 100644 --- a/src/packages/uploader/doc.zh-TW.md +++ b/src/packages/uploader/doc.zh-TW.md @@ -18,29 +18,7 @@ import { Uploader } from '@nutui/nutui-react' ::: -> 在使用Uploader組件上傳文件時，可能會遇到響應文件信息中文亂碼的問題。這通常發生在客戶端與服務器端在處理文件編碼時不一致的情況下。為了避免這種問題，建議確保服務器端讀取文件的編碼格式與客戶端保持一致。 - -```javascript -import React from 'react' -import { Uploader } from '@nutui/nutui-react' -// Server Demo -app.post('/upload', upload.single('file'), (req, res) => { - const fileEncoding = req.headers['x-file-encoding'] || 'UTF-8' - const fileContent = iconv.decode( - Buffer.from(JSON.stringify(req.file), 'binary'), - fileEncoding - ) - res.json({ - success: true, - message: 'File uploaded successfully', - data: JSON.parse(fileContent), - }) -}) -// Client Demo -; -``` - -### 基礎用法 +### 上傳狀態 :::demo @@ -48,7 +26,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 上傳狀態 +### 限製上傳數量 :::demo @@ -56,7 +34,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 基礎用法-上傳列表展示 +### 限製上傳大小 :::demo @@ -64,7 +42,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定義上傳使用默認進度條 +### 自定義上傳前的處理 :::demo @@ -72,7 +50,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 直接調起攝像頭（移動端生效） +### 禁用狀態 :::demo @@ -80,7 +58,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上傳數量5個 +### 自定義刪除icon :::demo @@ -88,7 +66,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 限制上傳大小（每個文件最大不超過50kb） +### 直接調起攝像頭（移動端生效） :::demo @@ -96,7 +74,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 圖片壓縮（在beforeupload鈎子中處理） +### 選中文件後，通過按鈕手動執行上傳 :::demo @@ -104,7 +82,7 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定義數據 FormData、headers +### 基礎用法-上傳列表展示 :::demo @@ -112,73 +90,41 @@ app.post('/upload', upload.single('file'), (req, res) => { ::: -### 自定義 xhr 上傳方式(before-xhr-upload) - -:::demo - - - -::: - -### 選中文件後，通過按鈕手動執行上傳 - -:::demo - - - -::: - -### 禁用狀態 - -:::demo - - - -::: - ## Uploader ### Props | 字段 | 說明 | 類型 | 默認值 | | --- | --- | --- | --- | -| autoUpload | 是否在選取文件後立即進行上傳，false 時需要手動執行 ref submit 方法進行上傳 | `Boolean` | `true` | +| autoUpload | 是否在選取文件後立即進行上傳，false 時需要手動執行 ref submit 方法進行上傳 | `boolean` | `true` | +| upload | 上傳方法，入參是需要被上傳的文件對象，經過異步處理之後，返回上傳結果 | `(file: File) => Promise` | `-` | | name | `input` 標簽 `name` 的名稱，發到後臺的文件參數名 | `string` | `file` | -| url | 上傳服務器的接口地址 | `string` | `-` | -| defaultValue | 默認已經上傳的文件列錶 | `FileType[]` | `[]` | -| value | 已經上傳的文件列錶 | `FileType[]` | `[]` | +| defaultValue | 默認已經上傳的文件列表 | `FileItem[]` | `[]` | +| value | 已經上傳的文件列表 | `FileItem[]` | `-` | | preview | 是否上傳成功後展示預覽圖 | `boolean` | `true` | | previewUrl | 當上傳非圖片('image')格式的默認圖片地址 | `string` | `-` | | deletable | 是否展示刪除按鈕 | `boolean` | `true` | | method | 上傳請求的 http method | `string` | `post` | -| previewType | 上傳列錶的內建樣式，支持兩種基本樣式 picture、list | `string` | `picture` | +| previewType | 上傳列表的內建樣式，支持兩種基本樣式 picture、list | `string` | `picture` | | capture | 圖片[選取模式](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture")，直接調起攝像頭 | `string` | `false` | | maxFileSize | 可以設定最大上傳文件的大小（字節） | `number` \| `string` | `Number.MAX_VALUE` | -| maxCount | 文件上傳數量限制 | `number` \| `string` | `1` | +| maxCount | 文件上傳數量限製 | `number` \| `string` | `1` | | fit | 圖片填充模式 | `contain` \| `cover` \| `fill` \| `none` \| `scale-down` | `cover` | | clearInput | 是否需要清空`input`內容，設為`true`支持重復選擇上傳同一個文件 | `boolean` | `true` | | accept | 允許上傳的文件類型，[詳細說明]("https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B") | `string` | `*` | -| headers | 設置上傳的請求頭部 | `object` | `{}` | -| data | 附加上傳的信息 formData | `object` | `{}` | | uploadIcon | 上傳區域圖標名稱 | `React.ReactNode` | `-` | | deleteIcon | 刪除區域的圖標名稱 | `React.ReactNode` | `-` | | uploadLabel | 上傳區域圖片下方文字 | `React.ReactNode` | `-` | -| xhrState | 接口響應的成功狀態（status）值 | `number` | `200` | -| withCredentials | 支持發送 cookie 憑證信息 | `Boolean` | `false` | | multiple | 是否支持文件多選 | `boolean` | `false` | | disabled | 是否禁用文件上傳 | `boolean` | `false` | -| timeout | 超時時間，單位為毫秒 | `number` \| `string` | `1000 * 30` | | beforeUpload | 上傳前的函數需要返回一個`Promise`對象 | `(file: File[]) => Promise` | `-` | -| beforeXhrUpload | 執行 XHR 上傳時，自定義方式 | `(xhr: XMLHttpRequest, options: any) => void` | `-` | | beforeDelete | 除文件時的回調，返回值為 false 時不移除。支持返回一個 `Promise` 對象，`Promise` 對象 resolve(false) 或 reject 時不移除 | `(file: FileItem, files: FileItem[]) => boolean` | `-` | -| onStart | 文件上傳開始 | `(option: UploadOptions) => void` | `-` | -| onProgress | 文件上傳的進度 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onOversize | 文件大小超過限制時觸發 | `(file: File[]) => void` | `-` | -| onSuccess | 上傳成功 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onFailure | 上傳失敗 | `(param: {e: ProgressEvent;option: UploadOptions;percentage: string \| number}) => void` | `-` | -| onChange | 上傳文件改變時的狀態 | `(files: FileItem[]) => void` | `-` | -| onDelete | 文件刪除之前的狀態 | `(file: FileItem, files: FileItem[]) => void` | `-` | +| onOversize | 文件大小超過限製時觸發 | `(file: File[]) => void` | `-` | +| onOverCount | 文件數量超過限製時觸發 | `(count: number) => void` | `-` | +| onChange | 已上傳的文件列表變化時觸發 | `(files: FileItem[]) => void` | `-` | +| onDelete | 點擊刪除文件時觸發 | `(file: FileItem, files: FileItem[]) => void` | `-` | | onFileItemClick | 文件上傳成功後點擊觸發 | `(file: FileItem, index: number) => void` | `-` | +| onUploadQueueChange | 圖片上傳隊列變化時觸發 | `(tasks: FileItem[]) => void` | `-` | > 註意：accept、capture 和 multiple 為瀏覽器 input 標簽的原生屬性，移動端各種機型對這些屬性的支持程度有所差異，因此在不同機型和 WebView 下可能出現一些兼容性問題。 @@ -186,23 +132,25 @@ app.post('/upload', upload.single('file'), (req, res) => { | 名稱 | 說明 | 默認值 | | --- | --- | --- | -| status | 文件狀態值，可選'ready,uploading,success,error,removed' | `ready` | -| uid | 文件的唯一標識 | `new Date().getTime().toString()` | +| status | 文件狀態值，可選'ready,uploading,success,error' | `ready` | +| uid | 文件的唯一標識 | `-` | | name | 文件名稱 | `-` | | url | 文件路徑 | `-` | -| type | 文件類型 | `image/jpeg` | -| formData | 上傳所需的data | `new FormData()` | +| type | 文件類型 | `image` | +| loadingIcon | 加載圖標 | `-` | +| failIcon | 加載失敗圖標 | `-` | +| percentage | 上傳進度條百分比 | `-` | ### Methods -通過ref可以獲取到 Uploader 實例併調用實例方法 +通過ref可以獲取到 Uploader 實例並調用實例方法 | 方法名 | 說明 | 參數 | 返回值 | | --- | --- | --- | --- | | submit | 手動上傳模式，執行上傳操作 | `-` | `-` | | clear | 清空已選擇的文件隊列（該方法一般配合在手動模式上傳時使用） | `index` | `-` | -## 主題定制 +## 主題定製 ### 樣式變量 @@ -217,7 +165,7 @@ app.post('/upload', upload.single('file'), (req, res) => { | \--nutui-uploader-background | 上傳圖片的背景顏色 | `$color-background` | | \--nutui-uploader-background-disabled | 上傳圖片禁用狀態的背景顏色 | `$color-background` | | \--nutui-uploader-image-icon-tip-font-size | 上傳區域圖片下方文字大小 | `12px` | -| \--nutui-uploader-image-icon-tip-color | 上傳區域圖片下方文字顏色 | `#C2C4CC` | +| \--nutui-uploader-image-icon-tip-color | 上傳區域圖片下方文字顏色 | `#BFBFBF` | | \--nutui-uploader-preview-progress-background | 上傳區域預覽進度的背景顏色 | `rgba(0, 0, 0, 0.65)` | | \--nutui-uploader-preview-margin-right | 上傳區域預覽margin-right的值 | `10px` | | \--nutui-uploader-preview-margin-bottom | 上傳區域預覽margin-bottom的值 | `10px` | diff --git a/src/packages/uploader/file-item.taro.ts b/src/packages/uploader/file-item.taro.ts deleted file mode 100644 index 9ea3afdebb..0000000000 --- a/src/packages/uploader/file-item.taro.ts +++ /dev/null @@ -1,36 +0,0 @@ -import { ReactNode } from 'react' - -export class FileItem { - status: FileItemStatus = 'ready' - - message = '准备中..' - - uid: string = new Date().getTime().toString() - - name?: string - - url?: string - - type?: string - - path?: string - - percentage?: string | number = 0 - - formData?: FormData = {} as FormData - - responseText?: string - - loadingIcon?: ReactNode - - failIcon?: ReactNode -} - -export type FileItemStatus = - | 'ready' - | 'uploading' - | 'success' - | 'error' - | 'removed' - -export type FileType = { [key: string]: T } diff --git a/src/packages/uploader/file-item.ts b/src/packages/uploader/file-item.ts deleted file mode 100644 index 258a17b20b..0000000000 --- a/src/packages/uploader/file-item.ts +++ /dev/null @@ -1,36 +0,0 @@ -import { ReactNode } from 'react' - -export class FileItem { - status: FileItemStatus = 'ready' - - message = '' - - uid: string = new Date().getTime().toString() - - name?: string - - url?: string - - type?: string - - path?: string - - percentage?: string | number = 0 - - formData?: FormData = {} as FormData - - responseText?: string - - loadingIcon?: ReactNode - - failIcon?: ReactNode -} - -export type FileItemStatus = - | 'ready' - | 'uploading' - | 'success' - | 'error' - | 'removed' - -export type FileType = { [key: string]: T } diff --git a/src/packages/uploader/index.taro.ts b/src/packages/uploader/index.taro.ts index 00476178b8..045b14d207 100644 --- a/src/packages/uploader/index.taro.ts +++ b/src/packages/uploader/index.taro.ts @@ -2,5 +2,5 @@ import { Uploader } from './uploader.taro' export type { UploaderProps } from './uploader.taro' -export type { FileType, FileItem, FileItemStatus } from './file-item.taro' +export type { FileType, FileItem, FileItemStatus } from './types' export default Uploader diff --git a/src/packages/uploader/index.ts b/src/packages/uploader/index.ts index d2fa73e97f..62048c5107 100644 --- a/src/packages/uploader/index.ts +++ b/src/packages/uploader/index.ts @@ -2,5 +2,5 @@ import { Uploader } from './uploader' export type { UploaderProps } from './uploader' -export type { FileType, FileItem, FileItemStatus } from './file-item' +export type { FileType, FileItem, FileItemStatus } from './types' export default Uploader diff --git a/src/packages/uploader/preview.taro.tsx b/src/packages/uploader/preview.taro.tsx index cbc7c2e476..8fe8c8f46e 100644 --- a/src/packages/uploader/preview.taro.tsx +++ b/src/packages/uploader/preview.taro.tsx @@ -5,10 +5,10 @@ import { Link as LinkIcon, Loading, } from '@nutui/icons-react-taro' -import { Image, View } from '@tarojs/components' -import Progress from '@/packages/progress/index.taro' -import { FileItem } from '@/packages/uploader/file-item.taro' -import { ERROR } from '@/packages/uploader/utils' +import { View } from '@tarojs/components' +import { FileItem } from '../uploader' +import { Image } from '@/packages/image/image.taro' +import { Progress } from '../progress/progress.taro' export const Preview: React.FunctionComponent = ({ fileList, @@ -21,7 +21,7 @@ export const Preview: React.FunctionComponent = ({ children, }) => { const renderIcon = (item: FileItem) => { - if (item.status === ERROR) { + if (item.status === 'error') { return item.failIcon || } return ( @@ -31,46 +31,55 @@ export const Preview: React.FunctionComponent = ({ return ( <> {fileList.length !== 0 && - fileList.map((item: any, index: number) => { + fileList.map((item: FileItem, index: number) => { + const { + status = 'success', + uid = index, + url, + message = '', + name = '', + type = 'image', + } = item + return ( - + {previewType === 'picture' && !children && deletable && ( onDeleteItem(item, index)} + className="close" > {deleteIcon} )} {previewType === 'picture' && !children && ( - {item.status === 'ready' ? ( + {status === 'ready' ? ( - {item.message} + {message} ) : ( - item.status !== 'success' && ( - + status !== 'success' && ( + {renderIcon(item)} - {item.message} + {message} ) )} - {item.type?.includes('image') ? ( + + {type.includes('image') ? ( <> - {item.url && ( + {url && ( handleItemClick(item, index)} /> )} @@ -80,7 +89,6 @@ export const Preview: React.FunctionComponent = ({ {previewUrl ? ( handleItemClick(item, index)} /> @@ -91,14 +99,14 @@ export const Preview: React.FunctionComponent = ({ className="nut-uploader-preview-img-file-name" > -  {item.name} +  {name} )} )} - {item.status === 'success' ? ( - {item.name} + {status === 'success' && name ? ( + {name} ) : null} )} @@ -106,11 +114,15 @@ export const Preview: React.FunctionComponent = ({ {previewType === 'list' && ( handleItemClick(item, index)} > -  {item.name} + +  {name} + {deletable && ( = ({ onClick={() => onDeleteItem(item, index)} /> )} - {item.status === 'uploading' && ( + {item.status === 'uploading' && item.percentage && ( = ({ fileList, @@ -17,7 +15,7 @@ export const Preview: React.FunctionComponent = ({ children, }) => { const renderIcon = (item: FileItem) => { - if (item.status === ERROR) { + if (item.status === 'error') { return item.failIcon || } return ( @@ -27,12 +25,18 @@ export const Preview: React.FunctionComponent = ({ return ( <> {fileList.length !== 0 && - fileList.map((item: any, index: number) => { + fileList.map((item: FileItem, index: number) => { + const { + status = 'success', + uid = index, + url, + message = '', + name = '', + type = 'image', + } = item + return ( -
+
{previewType === 'picture' && !children && deletable && (
onDeleteItem(item, index)} @@ -43,30 +47,30 @@ export const Preview: React.FunctionComponent = ({ )} {previewType === 'picture' && !children && (
- {item.status === 'ready' ? ( + {status === 'ready' ? (
- {item.message} + {message}
) : ( - item.status !== 'success' && ( + status !== 'success' && (
{renderIcon(item)}
- {item.message} + {message}
) )} - {item.type?.includes('image') ? ( + {type.includes('image') ? ( <> - {item.url && ( + {url && ( handleItemClick(item, index)} /> @@ -88,14 +92,14 @@ export const Preview: React.FunctionComponent = ({ className="nut-uploader-preview-img-file-name" > -  {item.name} +  {name}
)} )} - {item.status === 'success' ? ( -
{item.name}
+ {status === 'success' && name ? ( +
{name}
) : null}
)} @@ -103,11 +107,11 @@ export const Preview: React.FunctionComponent = ({ {previewType === 'list' && (
handleItemClick(item, index)} > -  {item.name} +  {name}
{deletable && ( = ({ /> )} - {item.status === 'uploading' && ( + {item.status === 'uploading' && item.percentage && ( = { [key: string]: T } diff --git a/src/packages/uploader/uploader.taro.tsx b/src/packages/uploader/uploader.taro.tsx index cf2521b4ab..51d82712dc 100644 --- a/src/packages/uploader/uploader.taro.tsx +++ b/src/packages/uploader/uploader.taro.tsx @@ -7,20 +7,14 @@ import React, { useEffect, } from 'react' import classNames from 'classnames' -import Taro, { - chooseImage, - uploadFile, - getEnv, - chooseMedia, -} from '@tarojs/taro' -import { View, Text } from '@tarojs/components' +import Taro, { chooseImage, getEnv, chooseMedia } from '@tarojs/taro' import { Failure, Photograph } from '@nutui/icons-react-taro' +import { View } from '@tarojs/components' import Button from '@/packages/button/index.taro' -import { ERROR, SUCCESS, UploaderTaro, UPLOADING, UploadOptions } from './utils' import { useConfig } from '@/packages/configprovider/configprovider.taro' import { funcInterceptor } from '@/utils/interceptor' import { BasicComponent, ComponentDefaults } from '@/utils/typings' -import { FileItem } from './file-item.taro' +import { FileItem } from './types' import { usePropsValue } from '@/utils/use-props-value' import { Preview } from '@/packages/uploader/preview.taro' @@ -56,7 +50,6 @@ interface TFileType { } export interface UploaderProps extends BasicComponent { - url: string maxCount: string | number sizeType: (keyof sizeType)[] sourceType: (keyof sourceType)[] @@ -75,51 +68,32 @@ export interface UploaderProps extends BasicComponent { disabled: boolean autoUpload: boolean multiple: boolean - timeout: number - data: any - method: string - xhrState: number | string - headers: any preview: boolean deletable: boolean className: string previewUrl?: string maxDuration: number style: React.CSSProperties - onStart?: (option: UploadOptions) => void onDelete?: (file: FileItem, files: FileItem[]) => void - onSuccess?: (param: { - responseText: XMLHttpRequest['responseText'] - option: UploadOptions - files: FileItem[] - }) => void - onProgress?: (param: { - e: ProgressEvent - option: UploadOptions - percentage: number | string - }) => void - onFailure?: (param: { - responseText: XMLHttpRequest['responseText'] - option: UploadOptions - files: FileItem[] - }) => void - onUpdate?: (files: FileItem[]) => void onOversize?: ( files: Taro.chooseImage.ImageFile[] | Taro.chooseMedia.ChooseMedia[] | any ) => void + onOverCount?: (count: number) => void onChange?: (files: FileItem[]) => void + upload: ( + files: Taro.chooseImage.ImageFile | Taro.chooseMedia.ChooseMedia | any + ) => Promise beforeUpload?: ( files: Taro.chooseImage.ImageFile[] | Taro.chooseMedia.ChooseMedia[] | any - ) => Promise - beforeXhrUpload?: (xhr: XMLHttpRequest, options: any) => void + ) => Promise beforeDelete?: (file: FileItem, files: FileItem[]) => boolean onFileItemClick?: (file: FileItem, index: number) => void + onUploadQueueChange?: (tasks: FileItem[]) => void } const defaultProps = { ...ComponentDefaults, - url: '', - maxCount: 1, + maxCount: Number.MAX_VALUE, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], mediaType: ['image', 'video'], @@ -135,12 +109,7 @@ const defaultProps = { autoUpload: true, multiple: false, maxFileSize: Number.MAX_VALUE, - data: {}, - headers: {}, - method: 'post', previewUrl: '', - xhrState: 200, - timeout: 1000 * 30, preview: true, deletable: true, maxDuration: 10, @@ -168,13 +137,7 @@ const InternalUploader: ForwardRefRenderFunction< fit, disabled, multiple, - url, previewUrl, - headers, - timeout, - method, - xhrState, - data, preview, deletable, maxCount, @@ -185,18 +148,15 @@ const InternalUploader: ForwardRefRenderFunction< sizeType, sourceType, maxDuration, - onStart, onDelete, onChange, onFileItemClick, - onProgress, - onSuccess, - onUpdate, - onFailure, onOversize, + onOverCount, beforeUpload, - beforeXhrUpload, + upload, beforeDelete, + onUploadQueueChange, ...restProps } = { ...defaultProps, ...props } const [fileList, setFileList] = usePropsValue({ @@ -207,24 +167,23 @@ const InternalUploader: ForwardRefRenderFunction< onChange?.(v) }, }) - const [uploadQueue, setUploadQueue] = useState[]>([]) - + const [uploadQueue, setUploadQueue] = useState([]) + const fileListRef = useRef([]) const classes = classNames(className, 'nut-uploader') - useImperativeHandle(ref, () => ({ - submit: () => { - Promise.all(uploadQueue).then((res) => { - res.forEach((i) => i.uploadTaro(uploadFile, getEnv())) - }) + submit: async () => { + await uploadAction(uploadQueue) }, clear: () => { clearUploadQueue() }, })) - const fileListRef = useRef([]) useEffect(() => { fileListRef.current = fileList }, [fileList]) + useEffect(() => { + onUploadQueueChange?.(uploadQueue) + }, [uploadQueue]) const clearUploadQueue = (index = -1) => { if (index > -1) { uploadQueue.splice(index, 1) @@ -256,7 +215,6 @@ const InternalUploader: ForwardRefRenderFunction< } } if ((getEnv() === 'WEAPP' || getEnv() === 'JD') && chooseMedia) { - // 其余端全部使用 chooseImage API chooseMedia({ count: multiple ? (maxCount as number) * 1 - fileList.length : 1, /** 文件类型 */ @@ -269,9 +227,6 @@ const InternalUploader: ForwardRefRenderFunction< sizeType, /** 仅在 sourceType 为 camera 时生效，使用前置或后置摄像头 */ camera, - fail: (res: any) => { - onFailure && onFailure(res) - }, success: onChangeMedia, }) } else { @@ -281,111 +236,55 @@ const InternalUploader: ForwardRefRenderFunction< sizeType, sourceType, success: onChangeImage, - fail: (res: any) => { - onFailure && onFailure(res) - }, }) } } - - const executeUpload = (fileItem: FileItem, index: number) => { - const uploadOption = new UploadOptions() - uploadOption.name = name - uploadOption.url = url - uploadOption.fileType = fileItem.type - uploadOption.formData = fileItem.formData - uploadOption.timeout = timeout * 1 - uploadOption.method = method - uploadOption.xhrState = xhrState - uploadOption.headers = headers - uploadOption.taroFilePath = fileItem.path - uploadOption.beforeXhrUpload = beforeXhrUpload - uploadOption.onStart = (option: UploadOptions) => { - clearUploadQueue(index) - setFileList( - fileListRef.current.map((item) => { - if (item.uid === fileItem.uid) { - item.status = 'ready' - item.message = locale.uploader.readyUpload - } - return item - }) - ) - onStart?.(option) - } - - uploadOption.onProgress = (e: any, option: UploadOptions) => { - setFileList( - fileListRef.current.map((item) => { - if (item.uid === fileItem.uid) { - item.status = UPLOADING - item.message = locale.uploader.uploading - item.percentage = e.progress - onProgress?.({ e, option, percentage: item.percentage as number }) - } - return item - }) - ) - } - - uploadOption.onSuccess = ( - responseText: XMLHttpRequest['responseText'], - option: UploadOptions - ) => { - const list = fileListRef.current.map((item) => { - if (item.uid === fileItem.uid) { - item.status = SUCCESS - item.message = locale.uploader.success - item.responseText = responseText + const uploadAction = async (tasks: FileItem[]) => { + const taskIds = tasks.map((task) => task.uid) + const list: FileItem[] = fileListRef.current.map((file: FileItem) => { + if (taskIds.includes(file.uid)) { + return { + ...file, + status: 'uploading', + message: locale.uploader.uploading, } - return item - }) - setFileList(list) - onSuccess?.({ - responseText, - option, - files: list, - }) - } - - uploadOption.onFailure = ( - responseText: XMLHttpRequest['responseText'], - option: UploadOptions - ) => { - const list = fileListRef.current.map((item) => { - if (item.uid === fileItem.uid) { - item.status = ERROR - item.message = locale.uploader.error - item.responseText = responseText + } + return file + }) + setFileList(list) + await Promise.all( + tasks.map(async (currentTask, index) => { + try { + const result = await upload(currentTask.file as File) + const list = fileListRef.current.map((item) => { + if (item.uid === currentTask.uid) { + item.status = 'success' + item.message = locale.uploader.success + item.url = result.url + } + return item + }) + setFileList(list) + } catch (e) { + const list = fileListRef.current.map((item) => { + if (item.uid === currentTask.uid) { + item.status = 'error' + item.message = locale.uploader.error + } + return item + }) + setFileList(list) + throw e } - return item }) - setFileList(list) - onFailure?.({ - responseText, - option, - files: list, - }) - } - - const task = new UploaderTaro(uploadOption) - if (autoUpload) { - task.uploadTaro(uploadFile, getEnv()) - } else { - uploadQueue.push( - new Promise((resolve, reject) => { - resolve(task) - }) - ) - setUploadQueue(uploadQueue) - } + ).catch((errs) => console.error(errs)) } - const readFile = (files: T[]) => { - files.forEach((file: T, index: number) => { + const idCountRef = useRef(0) + const readFile = async (files: T[]) => { + const tasks = files.map((file) => { let fileType = file.type const filepath = (file.tempFilePath || file.path) as string - const fileItem = new FileItem() if (file.fileType) { fileType = file.fileType } else { @@ -397,34 +296,29 @@ const InternalUploader: ForwardRefRenderFunction< fileType = 'image' } } - - fileItem.path = filepath - fileItem.name = filepath - fileItem.status = 'ready' - fileItem.type = fileType - fileItem.uid = `${fileItem.uid}_${index}` - fileItem.message = autoUpload - ? locale.uploader.readyUpload - : locale.uploader.waitingUpload - - if (getEnv() === 'WEB') { - const formData = new FormData() - for (const [key, value] of Object.entries(data)) { - formData.append(key, value as any) - } - formData.append(name, file.originalFileObj as Blob) - fileItem.name = file.originalFileObj?.name - fileItem.type = file.originalFileObj?.type - fileItem.formData = formData - } else { - fileItem.formData = data as any + const info: any = { + uid: idCountRef.current++, + status: autoUpload ? 'uploading' : 'ready', + file, + message: autoUpload + ? locale.uploader.uploading + : locale.uploader.waitingUpload, + name: getEnv() === 'WEB' ? file.originalFileObj?.name : filepath, + path: filepath, + type: getEnv() === 'WEB' ? file.originalFileObj?.type : fileType, } if (preview) { - fileItem.url = fileType === 'video' ? file.thumbTempFilePath : filepath + info.url = fileType === 'video' ? file.thumbTempFilePath : filepath } - executeUpload(fileItem, index) - setFileList([...fileList, fileItem]) + fileListRef.current = [...fileListRef.current, info] + setFileList(fileListRef.current) + return info }) + if (!autoUpload) { + setUploadQueue(tasks) + } else { + await uploadAction(tasks) + } } const filterFiles = (files: T[]) => { @@ -439,9 +333,9 @@ const InternalUploader: ForwardRefRenderFunction< return true }) oversizes.length && onOversize?.(files as any) - const currentFileLength = filterFile.length + fileList.length if (currentFileLength > maximum) { + onOverCount?.(filterFile.length) filterFile.splice(filterFile.length - (currentFileLength - maximum)) } return filterFile @@ -461,7 +355,7 @@ const InternalUploader: ForwardRefRenderFunction< }) } - const onChangeMedia = (res: Taro.chooseMedia.SuccessCallbackResult) => { + const onChangeMedia = async (res: Taro.chooseMedia.SuccessCallbackResult) => { // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片 const { tempFiles } = res const _files: Taro.chooseMedia.ChooseMedia[] = filterFiles(tempFiles) @@ -478,44 +372,60 @@ const InternalUploader: ForwardRefRenderFunction< } } - const onChangeImage = (res: Taro.chooseImage.SuccessCallbackResult) => { + const onChangeImage = async (res: Taro.chooseImage.SuccessCallbackResult) => { // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片 const { tempFiles } = res const _files: Taro.chooseImage.ImageFile[] = filterFiles(tempFiles) + let files: File[] = [] + const filesArr = new Array().slice.call(files) if (beforeUpload) { - beforeUpload(new Array().slice.call(_files)).then( - (f: Array | boolean) => { - const _files: File[] = filterFiles(new Array().slice.call(f)) - if (!_files.length) res.tempFiles = [] - readFile(_files) - } - ) - } else { - readFile(_files) + files = await beforeUpload(filesArr) } + files = filterFiles(filesArr) + readFile(_files) } const handleItemClick = (file: FileItem, index: number) => { onFileItemClick?.(file, index) } - - return ( - - {(children || previewType === 'list') && ( + const renderListUploader = () => { + return ( + previewType === 'list' && ( <> - {children || ( - - )} + {Number(maxCount) > fileList.length && ( - )} + {Number(maxCount) > fileList.length && ( )}
- )} - + ) + ) + } + return ( +
+ {renderListUploader()} - - {Number(maxCount) > fileList.length && - previewType === 'picture' && - !children && ( -
-
- {uploadIcon} - {uploadLabel} -
- - -
- )} + {renderImageUploader()}
) } export const Uploader = React.forwardRef(InternalUploader) - Uploader.displayName = 'NutUploader' diff --git a/src/packages/uploader/utils.ts b/src/packages/uploader/utils.ts deleted file mode 100644 index 8a19fe54f6..0000000000 --- a/src/packages/uploader/utils.ts +++ /dev/null @@ -1,131 +0,0 @@ -export class UploadOptions { - url = '' - - name = 'file' - - fileType? = 'image' - - formData?: FormData - - sourceFile: any - - method = 'post' - - xhrState: string | number = 200 - - timeout: number = 30 * 1000 - - headers = {} - - withCredentials = false - - onStart?: any - - taroFilePath?: string - - onProgress?: any - - onSuccess?: any - - onFailure?: any - - beforeXhrUpload?: any -} -export const UPLOADING = 'uploading' -export const SUCCESS = 'success' -export const ERROR = 'error' - -export class Utils { - options: UploadOptions - - constructor(options: UploadOptions) { - this.options = options - } - - upload() { - const { options } = this - const xhr = new XMLHttpRequest() - xhr.timeout = options.timeout - if (xhr.upload) { - xhr.upload.addEventListener( - 'progress', - (e: ProgressEvent) => { - options.onProgress?.(e, options) - }, - false - ) - xhr.onreadystatechange = () => { - if (xhr.readyState === 4) { - if (xhr.status === options.xhrState) { - options.onSuccess?.(xhr.responseText, options) - } else { - options.onFailure?.(xhr.responseText, options) - } - } - } - xhr.withCredentials = options.withCredentials - xhr.open(options.method, options.url, true) - // headers - for (const [key, value] of Object.entries(options.headers)) { - xhr.setRequestHeader(key, value as string) - } - options.onStart?.(options) - if (options.beforeXhrUpload) { - options.beforeXhrUpload(xhr, options) - } else { - xhr.send(options.formData) - } - } else { - console.warn('浏览器不支持 XMLHttpRequest') - } - } -} - -export class UploaderTaro extends Utils { - constructor(options: UploadOptions) { - super(options) - } - - uploadTaro(uploadFile: any, env: string) { - const options = this.options - if (options.beforeXhrUpload) { - options.beforeXhrUpload(uploadFile, options) - return - } - if (env === 'WEB') { - this.upload() - } else { - const uploadTask = uploadFile({ - url: options.url, - filePath: options.taroFilePath, - fileType: options.fileType, - header: { - 'Content-Type': 'multipart/form-data', - ...options.headers, - }, // - formData: options.formData, - name: options.name, - success(response: { errMsg: any; statusCode: number; data: string }) { - if (options.xhrState === response.statusCode) { - options.onSuccess?.(response, options) - } else { - options.onFailure?.(response, options) - } - }, - fail(e: any) { - options.onFailure?.(e, options) - }, - }) - options.onStart?.(options) - uploadTask.progress( - (res: { - progress: any - totalBytesSent: any - totalBytesExpectedToSend: any - }) => { - options.onProgress?.(res, options) - } - ) - } - } -} From 71f0a53592755f126ef861d9aa06701deedc0266 Mon Sep 17 00:00:00 2001 From: xiaoyatong <84436086+xiaoyatong@users.noreply.github.com> Date: Tue, 24 Dec 2024 19:00:53 +0800 Subject: [PATCH 12/19] feat: v15 popup (#2844) --- src/config.json | 1 + .../__snapshots__/address.spec.tsx.snap | 12 ++- .../address/__test__/address.spec.tsx | 43 ++++++++++ src/packages/address/address.tsx | 25 +++--- src/packages/cascader/cascader.taro.tsx | 1 - src/packages/overlay/overlay.scss | 12 +-- src/packages/popup/__tests__/popup.spec.tsx | 35 +++++++- src/packages/popup/demo.taro.tsx | 4 +- src/packages/popup/demos/h5/demo1.tsx | 21 ++--- src/packages/popup/demos/h5/demo2.tsx | 24 +++++- src/packages/popup/demos/taro/demo1.tsx | 33 +++----- src/packages/popup/demos/taro/demo2.tsx | 43 ++++++---- src/packages/popup/demos/taro/demo8.tsx | 9 ++- src/packages/popup/popup.scss | 80 ++++++------------- src/packages/popup/popup.taro.tsx | 69 ++++++++-------- src/packages/popup/popup.tsx | 67 ++++++++-------- .../__snapshots__/timeselect.spec.tsx.snap | 4 +- .../timeselect/__test__/timeselect.spec.tsx | 15 +++- src/packages/timeselect/demos/taro/demo1.tsx | 3 - src/packages/timeselect/demos/taro/demo2.tsx | 3 - src/packages/timeselect/demos/taro/demo3.tsx | 3 - src/packages/timeselect/timeselect.taro.tsx | 2 - src/packages/timeselect/timeselect.tsx | 2 - src/styles/variables.scss | 26 +++--- 24 files changed, 308 insertions(+), 229 deletions(-) diff --git a/src/config.json b/src/config.json index 7976e18cb9..57a6efe126 100644 --- a/src/config.json +++ b/src/config.json @@ -857,6 +857,7 @@ "type": "component", "show": true, "taro": true, + "v15": true, "rn": true, "desc": "弹出层容器，用于展示弹窗、信息提示等内容，支持多个弹出层叠加展示", "author": "szg2008" diff --git a/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap b/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap index da4e2fb170..3d8bb0b584 100644 --- a/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap +++ b/src/packages/address/__test__/__snapshots__/address.spec.tsx.snap @@ -1,7 +1,13 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`Address: exist defaultIcon & selectIcon 1`] = `"
请选择地址
  • 123
    探探鱼
    182****1718
    北京市次渠镇通州区
  • 123
    探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 456
    探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; +exports[`Address: exist defaultIcon & selectIcon 1`] = `"
请选择地址
  • 123
    探探鱼
    182****1718
    北京市次渠镇通州区
  • 123
    探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 456
    探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; -exports[`Address: show custom 1`] = `"
选择地址
请选择
浙江
湖南
福建
"`; +exports[`Address: show custom 1`] = `"
选择地址
请选择
浙江
湖南
福建
"`; -exports[`Address: show exist 1`] = `"
选择地址
  • 探探鱼
    182****1718
    北京市次渠镇通州区
  • 探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; +exports[`Address: show custom 2`] = `"
选择地址
请选择
浙江
湖南
福建
"`; + +exports[`Address: show custom icon 1`] = `"
选择地址
请选择
浙江
湖南
福建
"`; + +exports[`Address: show custom icon 2`] = `"
请选择地址
  • 探探鱼
    182****1718
    北京市次渠镇通州区
  • 探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
选择其他地址
"`; + +exports[`Address: show exist 1`] = `"
选择地址
  • 探探鱼
    182****1718
    北京市次渠镇通州区
  • 探探鱼
    182****1718
    钓鱼岛钓鱼岛全区
  • 探探鱼
    182****1718
    北京市大兴区科创十一街18号院京东大厦
"`; diff --git a/src/packages/address/__test__/address.spec.tsx b/src/packages/address/__test__/address.spec.tsx index bb69e02c95..ae9806b843 100644 --- a/src/packages/address/__test__/address.spec.tsx +++ b/src/packages/address/__test__/address.spec.tsx @@ -1,6 +1,7 @@ import React, { useRef } from 'react' import { fireEvent, render, waitFor } from '@testing-library/react' import '@testing-library/jest-dom' +import { Star } from '@nutui/icons-react' import { Address } from '../address' const existList = [ @@ -117,6 +118,48 @@ test('Address: show custom', async () => { expect(container.innerHTML).toMatchSnapshot() }) +test('Address: show custom', async () => { + const { container } = render( +
+ ) + expect(container.innerHTML).toMatchSnapshot() +}) + +test('Address: show custom icon', async () => { + const { container } = render( +
} + title="选择地址" + /> + ) + expect(container.innerHTML).toMatchSnapshot() +}) + +test('Address: show custom icon', async () => { + const onExistSelect = vi.fn() + const onSwitch = vi.fn() + const { container } = render( +
+ ) + expect(container.innerHTML).toMatchSnapshot() + const btn = container.querySelector('.nut-address-footer-btn') as Element + fireEvent.click(btn) + const leftIcon = container.querySelector('.nut-address-left-icon') as Element + expect(leftIcon).toBeTruthy() + fireEvent.click(leftIcon) +}) + test('Address: options disabled', async () => { const { container } = render(
) const items = container.querySelectorAll('.nut-cascader-item') diff --git a/src/packages/address/address.tsx b/src/packages/address/address.tsx index 901c982475..e7b0db7b53 100644 --- a/src/packages/address/address.tsx +++ b/src/packages/address/address.tsx @@ -121,19 +121,18 @@ export const InternalAddress: ForwardRefRenderFunction< } const renderLeftOnCustomSwitch = () => { - return ( - <> - {custom && ( -
- {React.isValidElement(backIcon) ? ( - backIcon - ) : ( - - )} -
- )} - - ) + if (custom) { + return ( +
+ {React.isValidElement(backIcon) ? ( + backIcon + ) : ( + + )} +
+ ) + } + return null } const selectedExistItem = (data: AddressList) => { diff --git a/src/packages/cascader/cascader.taro.tsx b/src/packages/cascader/cascader.taro.tsx index 39f7eb8dfc..e5a1419f18 100644 --- a/src/packages/cascader/cascader.taro.tsx +++ b/src/packages/cascader/cascader.taro.tsx @@ -481,7 +481,6 @@ const InternalCascader: ForwardRefRenderFunction< {...popupProps} visible={innerVisible} position="bottom" - style={{ overflowY: 'hidden' }} round closeIcon={closeIcon} closeable={closeable} diff --git a/src/packages/overlay/overlay.scss b/src/packages/overlay/overlay.scss index 6f4094dea2..8a53fb36f8 100644 --- a/src/packages/overlay/overlay.scss +++ b/src/packages/overlay/overlay.scss @@ -15,12 +15,6 @@ z-index: $overlay-zIndex; } -[dir='rtl'] .nut-overlay, -.nut-rtl .nut-overlay { - left: auto; - right: 0; -} - .nut-overflow-hidden { overflow: hidden !important; } @@ -67,3 +61,9 @@ animation-duration: $overlay-animation-duration; } } + +[dir='rtl'] .nut-overlay, +.nut-rtl .nut-overlay { + left: auto; + right: 0; +} diff --git a/src/packages/popup/__tests__/popup.spec.tsx b/src/packages/popup/__tests__/popup.spec.tsx index d38de739ef..9f60141578 100644 --- a/src/packages/popup/__tests__/popup.spec.tsx +++ b/src/packages/popup/__tests__/popup.spec.tsx @@ -69,6 +69,28 @@ test('pop from right', () => { expect(pop).toBeTruthy() }) +test('pop title', () => { + const { container } = render() + const title = container.querySelector('.nut-popup-title-title') as HTMLElement + expect(title).toHaveTextContent('标题') +}) + +test('pop left', () => { + const { container } = render() + const title = container.querySelector('.nut-popup-title-left') as HTMLElement + expect(title).toHaveTextContent('返回') +}) + +test('pop description', () => { + const { container } = render( + + ) + const title = container.querySelector( + '.nut-popup-title-description' + ) as HTMLElement + expect(title).toHaveTextContent('副标题') +}) + test('should render close icon when using closeable prop', () => { const { container } = render() const closeIcon = container.querySelector( @@ -84,7 +106,7 @@ test('should have "nut-popup-round" class when setting the round prop', () => { }) test('should allow to using portal prop', () => { - render() + render() expect(document.body.querySelector('.nut-popup')).toBeTruthy() }) @@ -117,7 +139,6 @@ test('event click-title-right icon and keep overlay test ', () => { const closeIcon = container.querySelector( '.nut-popup-title-right' ) as HTMLElement - const overlay = container.querySelector('.nut-overlay') as Element fireEvent.click(closeIcon) expect(onCloseIconClick).toBeCalled() const overlay2 = container.querySelector('.hidden-render') as Element @@ -140,3 +161,13 @@ test('event click-overlay test', async () => { fireEvent.click(overlay) expect(onOverlayClick).toBeCalled() }) + +test('pop destroyOnClose', () => { + const onClose = vi.fn() + const { container } = render( + + ) + const overlay = container.querySelector('.nut-overlay') as Element + fireEvent.click(overlay) + expect(onClose).toBeCalled() +}) diff --git a/src/packages/popup/demo.taro.tsx b/src/packages/popup/demo.taro.tsx index 2286295589..d4513043c3 100644 --- a/src/packages/popup/demo.taro.tsx +++ b/src/packages/popup/demo.taro.tsx @@ -77,9 +77,7 @@ const PopupDemo = () => { return ( <>
- + {translated.ce5c5446} diff --git a/src/packages/popup/demos/h5/demo1.tsx b/src/packages/popup/demos/h5/demo1.tsx index 7a3a22fc6a..c39f71b785 100644 --- a/src/packages/popup/demos/h5/demo1.tsx +++ b/src/packages/popup/demos/h5/demo1.tsx @@ -1,25 +1,28 @@ import React, { useState } from 'react' import { Popup, Cell } from '@nutui/nutui-react' -const Demo1 = () => { - const [showBasic, setShowBasic] = useState(false) +const Demo = () => { + const [showIcon, setShowIcon] = useState(false) + return ( <> { - setShowBasic(true) + setShowIcon(true) }} /> { - setShowBasic(false) + setShowIcon(false) }} /> ) } -export default Demo1 +export default Demo diff --git a/src/packages/popup/demos/h5/demo2.tsx b/src/packages/popup/demos/h5/demo2.tsx index 5dc8ffa45a..4718b46b68 100644 --- a/src/packages/popup/demos/h5/demo2.tsx +++ b/src/packages/popup/demos/h5/demo2.tsx @@ -6,6 +6,7 @@ const Demo2 = () => { const [showBottom, setShowBottom] = useState(false) const [showLeft, setShowLeft] = useState(false) const [showRight, setShowRight] = useState(false) + const [showText, setShowText] = useState(false) return ( <> @@ -33,6 +34,12 @@ const Demo2 = () => { setShowRight(true) }} /> + { + setShowText(true) + }} + /> { /> { setShowLeft(false) @@ -58,12 +64,26 @@ const Demo2 = () => { /> { setShowRight(false) }} /> + { + setShowText(false) + }} + > +
+ {Array.from({ length: 10 }) + .fill('') + .map((_, i) => ( + 正文 + ))} +
+ ) } diff --git a/src/packages/popup/demos/taro/demo1.tsx b/src/packages/popup/demos/taro/demo1.tsx index 4b714a588c..990a6ca016 100644 --- a/src/packages/popup/demos/taro/demo1.tsx +++ b/src/packages/popup/demos/taro/demo1.tsx @@ -1,35 +1,28 @@ import React, { useState } from 'react' import { Popup, Cell } from '@nutui/nutui-react-taro' -import { ScrollView, Text } from '@tarojs/components' -const Demo1 = () => { - const [showBasic, setShowBasic] = useState(false) +const Demo = () => { + const [showIcon, setShowIcon] = useState(false) + return ( <> { - setShowBasic(true) + setShowIcon(true) }} /> { - setShowBasic(false) + setShowIcon(false) }} - > - - {Array.from({ length: 1 }) - .fill('') - .map((_, i) => ( - - 正文 - - ))} - - + /> ) } -export default Demo1 +export default Demo diff --git a/src/packages/popup/demos/taro/demo2.tsx b/src/packages/popup/demos/taro/demo2.tsx index 4ac4e69b86..6a5809282a 100644 --- a/src/packages/popup/demos/taro/demo2.tsx +++ b/src/packages/popup/demos/taro/demo2.tsx @@ -1,12 +1,13 @@ import React, { useState } from 'react' import { Popup, Cell } from '@nutui/nutui-react-taro' -import { ScrollView, View } from '@tarojs/components' +import { ScrollView, Text } from '@tarojs/components' const Demo2 = () => { const [showTop, setShowTop] = useState(false) const [showBottom, setShowBottom] = useState(false) const [showLeft, setShowLeft] = useState(false) const [showRight, setShowRight] = useState(false) + const [showText, setShowText] = useState(false) return ( <> @@ -34,6 +35,12 @@ const Demo2 = () => { setShowRight(true) }} /> + { + setShowText(true) + }} + /> { { setShowBottom(false) }} lockScroll - > - - {Array.from({ length: 200 }) - .fill('') - .map((_, i) => ( - - 底部弹出-{i} - - ))} - - + /> { setShowLeft(false) @@ -70,12 +69,28 @@ const Demo2 = () => { /> { setShowRight(false) }} /> + { + setShowText(false) + }} + > + + {Array.from({ length: 10 }) + .fill('') + .map((_, i) => ( + + 正文 + + ))} + + ) } diff --git a/src/packages/popup/demos/taro/demo8.tsx b/src/packages/popup/demos/taro/demo8.tsx index 38d6895dcb..c88e32c2fe 100644 --- a/src/packages/popup/demos/taro/demo8.tsx +++ b/src/packages/popup/demos/taro/demo8.tsx @@ -13,8 +13,13 @@ const Demo8 = () => { setScrollPenetration(true) }} /> - - + + {Array.from({ length: 200 }) .fill('') .map((_, i) => ( diff --git a/src/packages/popup/popup.scss b/src/packages/popup/popup.scss index a8dfa63ed5..b0d80ee228 100644 --- a/src/packages/popup/popup.scss +++ b/src/packages/popup/popup.scss @@ -1,17 +1,10 @@ @import '../overlay/overlay.scss'; .nut-popup { - /* #ifdef rn */ - position: absolute; - /* #endif */ - /* #ifndef rn */ position: fixed; - /* #endif */ - min-height: 26%; + min-height: 46%; max-height: 100%; - overflow-y: auto; background-color: $overlay-content-bg-color; - color: $color-title; -webkit-overflow-scrolling: touch; font-size: $font-size-base; @@ -24,38 +17,45 @@ padding: $popup-title-padding; position: relative; - &-left { - position: absolute; - left: $popup-title-padding; - } - - &-title { + &-wrapper { display: flex; flex-direction: column; justify-content: center; align-items: center; + } + + &-title { + color: $color-title; font-weight: $font-weight-bold; font-size: $popup-title-font-size; + line-height: $popup-title-font-size; } &-description { - color: $color-text-help; + color: $color-text; font-size: $popup-description-font-size; font-weight: $font-weight; + &-gap { + margin-top: $popup-description-spacing; + } + } + + &-left { + position: absolute; + top: $popup-title-padding; + left: $popup-title-padding; } &-right { position: absolute; + top: $popup-title-padding; + right: $popup-title-padding; + z-index: 1; - cursor: pointer; width: $popup-icon-size; height: $popup-icon-size; - display: flex; - justify-content: center; - align-items: center; - top: $popup-title-padding; - right: $popup-title-padding; - color: $color-text-help; + color: $color-title; + cursor: pointer; &:active { opacity: 0.7; @@ -82,9 +82,8 @@ top: 50%; left: 50%; min-height: 10%; - /* #ifndef rn */ + max-width: 295px; transform: translate(-50%, -50%); - /* #endif */ &.nut-popup-round { border-radius: $popup-border-radius; @@ -93,7 +92,7 @@ &-bottom, &-top { - max-height: 83%; + max-height: 87%; } &-bottom { @@ -109,10 +108,8 @@ &-right { top: 0; right: 0; - /* #ifdef rn */ width: 100px; height: 100%; - /* #endif */ &.nut-popup-round { border-radius: $popup-border-radius 0 0 $popup-border-radius; @@ -122,10 +119,8 @@ &-left { top: 0; left: 0; - /* #ifdef rn */ width: 100px; height: 100%; - /* #endif */ &.nut-popup-round { border-radius: 0 $popup-border-radius $popup-border-radius 0; @@ -136,9 +131,6 @@ top: 0; left: 0; width: 100%; - /* #ifdef rn */ - height: 100px; - /* #endif */ &.nut-popup-round { border-radius: 0 0 $popup-border-radius $popup-border-radius; @@ -217,25 +209,19 @@ /* 从顶部滑出 */ @keyframes popup-slide-top-enter { from { - /* #ifndef rn */ transform: translate3d(0, -100%, 0); - /* #endif */ } } @keyframes popup-slide-top-exit { to { - /* #ifndef rn */ transform: translate3d(0, -100%, 0); - /* #endif */ } } &-top-enter-active, &-top-appear-active { - /* #ifndef rn */ transform: translate3d(0, 0%, 0); - /* #endif*/ animation-fill-mode: both; animation-name: popup-slide-top-enter; animation-duration: $popup-animation-duration; @@ -250,25 +236,19 @@ /* 从右侧滑出 */ @keyframes popup-slide-right-enter { from { - /* #ifndef rn */ transform: translate3d(100%, 0, 0); - /* #endif*/ } } @keyframes popup-slide-right-exit { to { - /* #ifndef rn */ transform: translate3d(100%, 0, 0); - /* #endif*/ } } &-right-enter-active, &-right-appear-active { - /* #ifndef rn */ transform: translate3d(0, 0, 0); - /* #endif*/ animation-fill-mode: both; animation-name: popup-slide-right-enter; animation-duration: $popup-animation-duration; @@ -283,25 +263,19 @@ /* 从底部滑出 */ @keyframes popup-slide-bottom-enter { from { - /* #ifndef rn */ transform: translate3d(0, 100%, 0); - /* #endif */ } } @keyframes slide-bottom-exit { to { - /* #ifndef rn */ transform: translate3d(0, 100%, 0); - /* #endif */ } } &-bottom-enter-active, &-bottom-appear-active { - /* #ifndef rn */ transform: translate(0, 0); - /* #endif */ animation-fill-mode: both; animation-name: popup-slide-bottom-enter; animation-duration: $popup-animation-duration; @@ -316,17 +290,13 @@ /* 从左侧滑出 */ @keyframes popup-slide-left-enter { from { - /* #ifndef rn */ transform: translate3d(-100%, 0, 0); - /* #endif */ } } @keyframes popup-slide-left-exit { to { - /* #ifndef rn */ transform: translate3d(-100%, 0, 0); - /* #endif */ } } @@ -398,9 +368,7 @@ &-center { left: auto; right: 50%; - /* #ifndef rn */ transform: translate(50%, -50%); - /* #endif*/ } &-bottom { diff --git a/src/packages/popup/popup.taro.tsx b/src/packages/popup/popup.taro.tsx index 07c5d61af9..836e947974 100644 --- a/src/packages/popup/popup.taro.tsx +++ b/src/packages/popup/popup.taro.tsx @@ -188,18 +188,16 @@ export const Popup: FunctionComponent< afterClose && afterClose() } - const resolveContainer = (getContainer: Teleport | undefined) => { - const container = - typeof getContainer === 'function' ? getContainer() : getContainer - return container || document.body - } - - const renderToContainer = (getContainer: Teleport, node: ReactElement) => { - if (getContainer) { - const container = resolveContainer(getContainer) - return createPortal(node, container) as ReactPortal - } - return node + const renderCloseIcon = () => { + return ( + <> + {closeable && ( + + {React.isValidElement(closeIcon) ? closeIcon : } + + )} + + ) } const renderTitle = () => { @@ -212,10 +210,16 @@ export const Popup: FunctionComponent< {left} )} {(title || description) && ( - - {title} + + {title && ( + + {title} + + )} {description && ( - + {description} )} @@ -223,24 +227,12 @@ export const Popup: FunctionComponent< )} )} - {closeable && ( - - {React.isValidElement(closeIcon) ? closeIcon : } - - )} + {renderCloseIcon()} ) } if (closeable) { - return ( - <> - {closeable && ( - - {React.isValidElement(closeIcon) ? closeIcon : } - - )} - - ) + return renderCloseIcon() } } const renderPop = () => { @@ -283,20 +275,33 @@ export const Popup: FunctionComponent< onClick={onHandleClickOverlay} /> ) : null} - <>{renderPop()} + {renderPop()} ) } useEffect(() => { - visible && open() - !visible && close() + visible ? open() : close() }, [visible]) useEffect(() => { setTransitionName(transition || `${classPrefix}-slide-${position}`) }, [position, transition]) + const resolveContainer = (getContainer: Teleport | undefined) => { + const container = + typeof getContainer === 'function' ? getContainer() : getContainer + return container || document.body + } + + const renderToContainer = (getContainer: Teleport, node: ReactElement) => { + if (getContainer) { + const container = resolveContainer(getContainer) + return createPortal(node, container) as ReactPortal + } + return node + } + return <>{renderToContainer(portal as Teleport, renderNode())} } diff --git a/src/packages/popup/popup.tsx b/src/packages/popup/popup.tsx index ca1abc71f4..06723bb723 100644 --- a/src/packages/popup/popup.tsx +++ b/src/packages/popup/popup.tsx @@ -191,18 +191,16 @@ export const Popup: FunctionComponent< afterClose && afterClose() } - const resolveContainer = (getContainer: Teleport | undefined) => { - const container = - typeof getContainer === 'function' ? getContainer() : getContainer - return container || document.body - } - - const renderToContainer = (getContainer: Teleport, node: ReactElement) => { - if (getContainer) { - const container = resolveContainer(getContainer) - return createPortal(node, container) as ReactPortal - } - return node + const renderCloseIcon = () => { + return ( + <> + {closeable && ( +
+ {React.isValidElement(closeIcon) ? closeIcon : } +
+ )} + + ) } const renderTitle = () => { @@ -215,10 +213,14 @@ export const Popup: FunctionComponent<
{left}
)} {(title || description) && ( -
- {title} +
+ {title && ( +
{title}
+ )} {description && ( -
+
{description}
)} @@ -226,24 +228,12 @@ export const Popup: FunctionComponent< )} )} - {closeable && ( -
- {React.isValidElement(closeIcon) ? closeIcon : } -
- )} + {renderCloseIcon()}
) } if (closeable) { - return ( - <> - {closeable && ( -
- {React.isValidElement(closeIcon) ? closeIcon : } -
- )} - - ) + return renderCloseIcon() } } const renderPop = () => { @@ -285,20 +275,33 @@ export const Popup: FunctionComponent< onClick={onHandleClickOverlay} /> ) : null} - <>{renderPop()} + {renderPop()} ) } useEffect(() => { - visible && open() - !visible && close() + visible ? open() : close() }, [visible]) useEffect(() => { setTransitionName(transition || `${classPrefix}-slide-${position}`) }, [position, transition]) + const resolveContainer = (getContainer: Teleport | undefined) => { + const container = + typeof getContainer === 'function' ? getContainer() : getContainer + return container || document.body + } + + const renderToContainer = (getContainer: Teleport, node: ReactElement) => { + if (getContainer) { + const container = resolveContainer(getContainer) + return createPortal(node, container) as ReactPortal + } + return node + } + return <>{renderToContainer(portal as Teleport, renderNode())} } diff --git a/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap index 9ab6b57b77..e1495fa7ec 100644 --- a/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap +++ b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap @@ -1,5 +1,3 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`timeselect props test 1`] = `"
取件时间
520
521
09:00-10:0010:00-11:0011:00-12:00
"`; - -exports[`timeselect props test 2`] = `"
取件时间
520
521
09:00-10:0010:00-11:0011:00-12:00
"`; +exports[`timeselect props test 1`] = `"
取件时间
520
521
09:00-10:0010:00-11:0011:00-12:00
"`; diff --git a/src/packages/timeselect/__test__/timeselect.spec.tsx b/src/packages/timeselect/__test__/timeselect.spec.tsx index a476128b18..05b5cf475d 100644 --- a/src/packages/timeselect/__test__/timeselect.spec.tsx +++ b/src/packages/timeselect/__test__/timeselect.spec.tsx @@ -1,5 +1,5 @@ import * as React from 'react' -import { render, waitFor } from '@testing-library/react' +import { fireEvent, render, waitFor } from '@testing-library/react' import '@testing-library/jest-dom' import ReactTestUtils from 'react-dom/test-utils' import { TimeSelect } from '../timeselect' @@ -29,14 +29,13 @@ test('timeselect props test', async () => { return } const { container } = render() - await waitFor(() => { - expect(container.outerHTML).toMatchSnapshot() - }) + expect(container.outerHTML).toMatchSnapshot() }) test('timeselect event test', async () => { const handleDateChange = vi.fn() const handleTimeChange = vi.fn() + const handleSelect = vi.fn() const App = () => { return ( { options={options} onDateChange={handleDateChange} onTimeChange={handleTimeChange} + onSelect={handleSelect} /> ) } @@ -61,5 +61,12 @@ test('timeselect event test', async () => { children: [options[0].children[0]], }, ]) + + const close = container.querySelector( + '.nut-popup-title-right-top-right' + ) as Element + fireEvent.click(close) + const overlay = container.querySelector('.nut-overlay') as HTMLElement + expect(overlay.style.display).toEqual('') }) }) diff --git a/src/packages/timeselect/demos/taro/demo1.tsx b/src/packages/timeselect/demos/taro/demo1.tsx index f5eb8291f6..80ef3b072b 100644 --- a/src/packages/timeselect/demos/taro/demo1.tsx +++ b/src/packages/timeselect/demos/taro/demo1.tsx @@ -53,9 +53,6 @@ const Demo1 = () => { { optionKey={optionKey} defaultValue={defaultValue} visible={visible} - style={{ - height: '30%', - }} onSelect={handleSelect} onDateChange={handleDateChange} onTimeChange={handleTimeChange} diff --git a/src/packages/timeselect/demos/taro/demo3.tsx b/src/packages/timeselect/demos/taro/demo3.tsx index e10c71251e..977856880b 100644 --- a/src/packages/timeselect/demos/taro/demo3.tsx +++ b/src/packages/timeselect/demos/taro/demo3.tsx @@ -53,9 +53,6 @@ const Demo3 = () => { > = ( position="bottom" title={title || locale.timeselect.pickupTime} style={{ - width: '100%', - height: '20%', ...style, }} onClose={closeFun} diff --git a/src/packages/timeselect/timeselect.tsx b/src/packages/timeselect/timeselect.tsx index a0ad3b94b8..1e6b91d674 100644 --- a/src/packages/timeselect/timeselect.tsx +++ b/src/packages/timeselect/timeselect.tsx @@ -144,8 +144,6 @@ export const TimeSelect: FunctionComponent> = ( position="bottom" title={title || locale.timeselect.pickupTime} style={{ - width: '100%', - height: '20%', ...style, }} onClose={closeFun} diff --git a/src/styles/variables.scss b/src/styles/variables.scss index 58c9661fc1..3fd4faf536 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -1018,30 +1018,28 @@ $overlay-animation-duration: var( 0.3s ) !default; //popup（✅） -$popup-border-radius: var(--nutui-popup-border-radius, 24px) !default; -$popup-icon-size: var(--nutui-popup-icon-size, $font-size-xl) !default; +$popup-border-radius: var(--nutui-popup-border-radius, $radius-xl) !default; +$popup-icon-size: var(--nutui-popup-icon-size, 20px) !default; $popup-title-padding: var(--nutui-popup-title-padding, 16px) !default; $popup-title-font-size: var( --nutui-popup-title-font-size, - $font-size-xl + $font-size-l ) !default; -$popup-description-font-size: var( - --nutui-popup-description-font-size, - $font-size-xs +$popup-title-font-weight: var( + --nutui-popup-title-font-weight, + $font-weight-bold ) !default; -$popup-title-height: var(--nutui-popup-title-height, 50px) !default; -$popup-title-border-bottom: var(--nutui-popup-title-border-bottom, 0) !default; -$popup-animation-duration: var(--nutui-popup-animation-duration, 0.3s) !default; -$popup-icon-size: var(--nutui-popup-icon-size, $font-size-xl) !default; $popup-description-font-size: var( --nutui-popup-description-font-size, - $font-size-xs + $font-size-base ) !default; -$popup-title-font-weight: var( - --nutui-popup-title-font-weight, - $font-weight-bold +$popup-description-spacing: var( + --nutui-popup-description-spacing, + $spacing-base ) !default; $popup-title-height: var(--nutui-popup-title-height, 50px) !default; +$popup-title-border-bottom: var(--nutui-popup-title-border-bottom, 0) !default; +$popup-animation-duration: var(--nutui-popup-animation-duration, 0.3s) !default; // Notify（✅） $notify-text-color: var(--nutui-notify-text-color, $white) !default; From b4a99b12dc9c888a6b45df9c3690da0a8210c0a8 Mon Sep 17 00:00:00 2001 From: songsong <353833373@qq.com> Date: Wed, 25 Dec 2024 16:49:18 +0800 Subject: [PATCH 13/19] =?UTF-8?q?fix:=20=E8=A7=A3=E5=86=B3skeleton?= =?UTF-8?q?=E5=BC=95=E5=85=A5switch=E6=8C=89=E9=92=AE=E5=B0=BA=E5=AF=B8?= =?UTF-8?q?=E8=BF=87=E5=A4=A7=20(#2886)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 解决微信小程序滚动报错问题 * fix(countup): 分隔符文字颜色支持css变量修改 * fix(switch): 修复宽度自适应问题 * fix: 修改skeleton引入switch * fix: pr修改 --- src/packages/skeleton/demos/h5/demo5.tsx | 2 +- src/packages/skeleton/demos/taro/demo5.tsx | 16 +++++++++++----- src/packages/switch/switch.scss | 2 +- 3 files changed, 13 insertions(+), 7 deletions(-) diff --git a/src/packages/skeleton/demos/h5/demo5.tsx b/src/packages/skeleton/demos/h5/demo5.tsx index d007ed1bfd..a0930586c3 100644 --- a/src/packages/skeleton/demos/h5/demo5.tsx +++ b/src/packages/skeleton/demos/h5/demo5.tsx @@ -14,7 +14,7 @@ const Demo5 = () => {
changeStatus(value, event)} - style={{ display: 'flex', marginBottom: '8px' }} + style={{ marginBottom: '8px' }} />
diff --git a/src/packages/skeleton/demos/taro/demo5.tsx b/src/packages/skeleton/demos/taro/demo5.tsx index 1bd665c329..7cf397d389 100644 --- a/src/packages/skeleton/demos/taro/demo5.tsx +++ b/src/packages/skeleton/demos/taro/demo5.tsx @@ -1,7 +1,6 @@ import { Avatar, Skeleton, Switch } from '@nutui/nutui-react-taro' import React, { useState } from 'react' import { View, Text } from '@tarojs/components' -import pxTransform from '@/utils/px-transform' const Demo5 = () => { const [checked, setChecked] = useState(false) @@ -14,10 +13,17 @@ const Demo5 = () => { } return ( - changeStatus(value, event)} - style={{ display: 'flex', marginBottom: pxTransform(8) }} - /> + + changeStatus(value, event)} + style={{ marginBottom: 8 }} + /> + Date: Thu, 26 Dec 2024 11:18:17 +0800 Subject: [PATCH 14/19] =?UTF-8?q?fix:=20=E6=9E=84=E5=BB=BA=E5=85=A8?= =?UTF-8?q?=E9=87=8F=20css=20=E6=96=87=E4=BB=B6=20(#2847)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 构建全量 css 文件 * fix: 构建全量 css 文件 --- scripts/build-taro.mjs | 93 ++++++++++++++++++++++++++++++++++-------- scripts/build.mjs | 76 ++++++++++++++++++++++++---------- 2 files changed, 130 insertions(+), 39 deletions(-) diff --git a/scripts/build-taro.mjs b/scripts/build-taro.mjs index ae4f270888..99663d74cc 100644 --- a/scripts/build-taro.mjs +++ b/scripts/build-taro.mjs @@ -213,6 +213,32 @@ async function buildUMD() { } async function buildAllCSS() { + // 拷贝styles + async function copyStyles() { + await copy( + resolve(__dirname, '../src/styles'), + resolve(__dirname, '../dist/styles') + ) + + const content = [ + `@import './styles/theme-default.scss';`, + `@import './styles/variables.scss';`, + `@import './styles/mixins/index.scss';`, + `@import './styles/animation/index.scss';`, + ] + const projectID = process.env.VITE_APP_PROJECT_ID + if (projectID) { + content[1] = `@import '../variables-${projectID}.scss';` + } + const scssFiles = await glob(['dist/es/packages/**/*.scss']) + scssFiles.forEach((file) => { + content.push( + `@import '${relativeFilePath('/dist/style.scss', '/' + file)}';` + ) + }) + dest('dist/style.scss', content.join('\n')) + } + await copyStyles() await vite.build({ logLevel: 'error', resolve: { @@ -221,7 +247,7 @@ async function buildAllCSS() { build: { emptyOutDir: false, lib: { - entry: './dist/styles/themes/default.scss', + entry: './dist/style.scss', formats: ['es'], name: 'style', fileName: 'style', @@ -230,6 +256,29 @@ async function buildAllCSS() { }) } +async function buildThemeCSS() { + await vite.build({ + logLevel: 'error', + resolve: { + alias: [{ find: '@', replacement: resolve(__dirname, '../src') }], + }, + build: { + emptyOutDir: false, + rollupOptions: { + output: [ + { + dir: 'dist/styles/themes', + assetFileNames: 'default.css', + }, + ], + }, + lib: { + entry: './dist/styles/themes/default.scss', + }, + }, + }) +} + // 拷贝styles async function copyStyles() { await copy( @@ -338,39 +387,45 @@ async function buildCSS(p) { } -console.log('clean dist') +console.time('clean dist') await deleteAsync('dist') -console.log('clean: ✅') +console.timeEnd('clean dist') await generate() -console.log('build ES Module') +console.time('build ES Module') await buildES() -console.log('build ES Module: ✅') +console.timeEnd('build ES Module') -console.log('build CommonJS') +console.time('build CommonJS') await buildCJS() -console.log('build CommonJS: ✅') +console.timeEnd('build CommonJS') -console.log('build UMD') +console.time('build UMD') await buildUMD() -console.log('build UMD: ✅') +console.timeEnd('build UMD') -console.log('Build CSS') +console.time('Build CSS') await buildCSS() -console.log('Build CSS: ✅') +console.timeEnd('Build CSS') -console.log('Copy Styles') +console.time('Copy Styles') await copyStyles() -console.log('Copy Styles: ✅') +console.timeEnd('Copy Styles') -console.log('Build All CSS') +console.time('Build All CSS') await buildAllCSS() -console.log('Build All CSS: ✅') +console.timeEnd('Build All CSS') + +console.time('Build Theme CSS') +await buildThemeCSS() +console.timeEnd('Build Theme CSS') -console.log('Build Declaration') +console.time('Build Declaration') await buildDeclaration() -console.log('Build Declaration: ✅') +console.timeEnd('Build Declaration') + +// await exportProps() await deleteAsync([ 'dist/es/packages/nutui.react.js', @@ -379,4 +434,6 @@ await deleteAsync([ 'dist/es/packages/nutui.react.scss.js', ]) -codeShift('Taro') +console.time('Build JSDoc') +codeShift() +console.timeEnd('Build JSDoc') diff --git a/scripts/build.mjs b/scripts/build.mjs index ac55a8662f..7bb0b41170 100644 --- a/scripts/build.mjs +++ b/scripts/build.mjs @@ -173,6 +173,32 @@ async function buildUMD(p) { } async function buildAllCSS() { + // 拷贝styles + async function copyStyles() { + await copy( + resolve(__dirname, '../src/styles'), + resolve(__dirname, '../dist/styles') + ) + + const content = [ + `@import './styles/theme-default.scss';`, + `@import './styles/variables.scss';`, + `@import './styles/mixins/index.scss';`, + `@import './styles/animation/index.scss';`, + ] + const projectID = process.env.VITE_APP_PROJECT_ID + if (projectID) { + content[1] = `@import '../variables-${projectID}.scss';` + } + const scssFiles = await glob(['dist/es/packages/**/*.scss']) + scssFiles.forEach((file) => { + content.push( + `@import '${relativeFilePath('/dist/style.scss', '/' + file)}';` + ) + }) + dest('dist/style.scss', content.join('\n')) + } + await copyStyles() await vite.build({ logLevel: 'error', resolve: { @@ -181,7 +207,7 @@ async function buildAllCSS() { build: { emptyOutDir: false, lib: { - entry: './dist/styles/themes/default.scss', + entry: './dist/style.scss', formats: ['es'], name: 'style', fileName: 'style', @@ -190,6 +216,29 @@ async function buildAllCSS() { }) } +async function buildThemeCSS() { + await vite.build({ + logLevel: 'error', + resolve: { + alias: [{ find: '@', replacement: resolve(__dirname, '../src') }], + }, + build: { + emptyOutDir: false, + rollupOptions: { + output: [ + { + dir: 'dist/styles/themes', + assetFileNames: 'default.css', + }, + ], + }, + lib: { + entry: './dist/styles/themes/default.scss', + }, + }, + }) +} + // 拷贝styles async function copyStyles() { await copy( @@ -218,6 +267,7 @@ async function buildCSS(p) { const cssFiles = await glob(['src/packages/**/*.scss'], { ignore: ['src/packages/**/demo.scss'], }) + const variables = await readFile( join(__dirname, '../src/styles/variables.scss') ) @@ -296,26 +346,6 @@ async function buildCSS(p) { } } -// async function exportProps() { -// const types = [] -// const a = await readFile(join(__dirname, '../src/config.json')) -// const componentsConfig = JSON.parse(a.toString()) -// componentsConfig.nav.forEach((item) => { -// item.packages.forEach((element) => { -// const { name, show, exportEmpty } = element -// if (show || exportEmpty) { -// const lowerName = name.toLowerCase() -// if (lowerName === 'icon') return -// types.push(`export * from './${lowerName}/index'`) -// } -// }) -// }) -// await appendFile( -// join(__dirname, '../dist/es/packages/nutui.react.build.d.ts'), -// types.join('\n') -// ) -// } - console.time('clean dist') await deleteAsync('dist') console.timeEnd('clean dist') @@ -346,6 +376,10 @@ console.time('Build All CSS') await buildAllCSS() console.timeEnd('Build All CSS') +console.time('Build Theme CSS') +await buildThemeCSS() +console.timeEnd('Build Theme CSS') + console.time('Build Declaration') await buildDeclaration() console.timeEnd('Build Declaration') From ccaf3b6e047f32603e522a0635fe761d3259398e Mon Sep 17 00:00:00 2001 From: oasis <12181600+oasis-cloud@users.noreply.github.com> Date: Thu, 26 Dec 2024 21:08:06 +0800 Subject: [PATCH 15/19] feat(navbar): v15 (#2881) * feat(navbar): v15 * feat(navbar): v15 - taro * feat(navbar): v15 - taro * fix: spell error * fix: review --- migrate-from-v2.md | 13 +- src/config.json | 1 + .../__snapshots__/navbar.spec.tsx.snap | 2 +- src/packages/navbar/demos/h5/demo1.tsx | 62 ++----- src/packages/navbar/demos/h5/demo2.tsx | 123 ++++++------- src/packages/navbar/demos/h5/demo3.tsx | 21 +-- src/packages/navbar/demos/taro/demo1.tsx | 114 +++++------- src/packages/navbar/demos/taro/demo2.tsx | 172 +++++++++--------- src/packages/navbar/demos/taro/demo3.tsx | 95 ++++------ src/packages/navbar/doc.en-US.md | 2 +- src/packages/navbar/doc.md | 2 +- src/packages/navbar/doc.taro.md | 2 +- src/packages/navbar/doc.zh-TW.md | 2 +- src/packages/navbar/navbar.scss | 72 ++++---- src/packages/navbar/navbar.taro.tsx | 94 ++-------- src/packages/navbar/navbar.tsx | 88 ++------- 16 files changed, 309 insertions(+), 556 deletions(-) diff --git a/migrate-from-v2.md b/migrate-from-v2.md index 6e386b6808..1e2cfc813c 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -273,16 +273,9 @@ plugins: [ #### NavBar -- `desc` 重命名为 `right`，类型修改为 `React.Node` -- 新增 `left`，左侧内容，渲染在返回区域的右侧 -- 新增 `back`，返回区域内容 -- `onClickBack` 重命名为 `onBackClick` -- 移除 `title`，通过 `children` 实现 -- 移除 `leftText` `leftShow`，通过 `back`、`left`实现 -- `safeAreaInsetTop` 重命名为 `safeArea` -- `border` 废弃 -- 移除 `onClickTitle` `onClickRight` `onClickIcon`，通过在`left`、`title`、`right`自定义事件实现，参考文档demo示例 -- +- 移除 titleAlign 属性，可通过 title 和 children 替代 +- 增加 title 属性，默认居中展示 +- 组件中出现 children ，则采取 titleAlign 的 left 方式布局 #### Pagination diff --git a/src/config.json b/src/config.json index 57a6efe126..d73b6a7108 100644 --- a/src/config.json +++ b/src/config.json @@ -331,6 +331,7 @@ "sort": 1, "show": true, "taro": true, + "v15": true, "author": "dsj" }, { diff --git a/src/packages/navbar/__test__/__snapshots__/navbar.spec.tsx.snap b/src/packages/navbar/__test__/__snapshots__/navbar.spec.tsx.snap index deea30ccb2..3559dc5741 100644 --- a/src/packages/navbar/__test__/__snapshots__/navbar.spec.tsx.snap +++ b/src/packages/navbar/__test__/__snapshots__/navbar.spec.tsx.snap @@ -1,3 +1,3 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`should render placeholder element when using placeholder prop 1`] = `"
订单详情
"`; +exports[`should render placeholder element when using placeholder prop 1`] = `"
订单详情
"`; diff --git a/src/packages/navbar/demos/h5/demo1.tsx b/src/packages/navbar/demos/h5/demo1.tsx index bf2768d318..7b7783dc7b 100644 --- a/src/packages/navbar/demos/h5/demo1.tsx +++ b/src/packages/navbar/demos/h5/demo1.tsx @@ -1,12 +1,12 @@ import React from 'react' import { NavBar, Toast } from '@nutui/nutui-react' -import { Share, More, Cart, ArrowLeft, Close } from '@nutui/icons-react' +import { ArrowLeft, Close, More, Share } from '@nutui/icons-react' const Demo1 = () => { const styles = { flexCenter: { display: 'flex', - aliginItems: 'center', + alignItems: 'center', }, title: { fontSize: '18px', @@ -18,73 +18,51 @@ const Demo1 = () => { fontWeight: 400, color: 'rgba(0,0,0, 0.5)', lineHeight: '16px', - textAlign: 'center', }, } return ( <> 返回 } - right={ - Toast.show('icon')}> - - - } + right={ Toast.show('icon')} />} onBackClick={(e) => Toast.show('返回')} - > - 订单详情 - + /> Toast.show('icon')}> - - - } + title="页面标题" + right={ Toast.show('icon')} />} onBackClick={(e) => Toast.show('返回')} - > - 订单详情 - + /> + Toast.show('标题')}> + 页面标题 + + 副标题 +
+ } right={ Toast.show('清空')}>清空} left={} back={} onBackClick={(e) => Toast.show('返回')} - > -
- Toast.show('标题')}> - 浏览记录 - - 浏览记录 -
- + /> } + title={ Toast.show('页面标题')}>页面标题} right={ <> - Toast.show('编辑')} - > - 编辑 - + Toast.show('编辑')}>编辑 Toast.show('icon')} /> } onBackClick={(e) => Toast.show('返回')} - > - Toast.show('标题')}>购物车 - Toast.show('icon')} - > - - - + /> ) } diff --git a/src/packages/navbar/demos/h5/demo2.tsx b/src/packages/navbar/demos/h5/demo2.tsx index d347e807aa..9d04f15111 100644 --- a/src/packages/navbar/demos/h5/demo2.tsx +++ b/src/packages/navbar/demos/h5/demo2.tsx @@ -1,12 +1,12 @@ import React from 'react' -import { NavBar, Toast } from '@nutui/nutui-react' -import { Share, More, Cart, ArrowLeft, Close } from '@nutui/icons-react' +import { NavBar, Toast, Space } from '@nutui/nutui-react' +import { ArrowLeft, Close, More, Share } from '@nutui/icons-react' const Demo2 = () => { const styles = { flexCenter: { display: 'flex', - aliginItems: 'center', + alignItems: 'center', }, title: { fontSize: '18px', @@ -22,72 +22,59 @@ const Demo2 = () => { } return ( <> - - - 返回 - - } - right={ - Toast.show('icon')}> - - - } - onBackClick={(e) => Toast.show('返回')} - > - 订单详情 - - Toast.show('icon')}> - - - } - onBackClick={(e) => Toast.show('返回')} - > - 订单详情 - - Toast.show('清空')}>清空} - left={} - back={} - onBackClick={(e) => Toast.show('返回')} - > -
- Toast.show('标题')}> - 浏览记录 - - 浏览记录 + +
+ + + 返回 + + } + right={ Toast.show('icon')} />} + onBackClick={(e) => Toast.show('返回')} + > + 页面标题 +
- - } - right={ - <> - Toast.show('编辑')} - > - 编辑 - - Toast.show('icon')} /> - - } - onBackClick={(e) => Toast.show('返回')} - > - Toast.show('标题')}>购物车 - Toast.show('icon')} - > - - - +
+ Toast.show('icon')} />} + onBackClick={(e) => Toast.show('返回')} + > + 页面标题 + +
+
+ Toast.show('清空')}>清空} + left={} + back={} + onBackClick={(e) => Toast.show('返回')} + > +
+ Toast.show('标题')}> + 页面标题 + + 副标题 +
+ +
+
+ } + right={ + <> + Toast.show('编辑')}>编辑 + Toast.show('icon')} /> + + } + onBackClick={(e) => Toast.show('返回')} + > + Toast.show('页面标题')}>页面标题 + +
+ ) } diff --git a/src/packages/navbar/demos/h5/demo3.tsx b/src/packages/navbar/demos/h5/demo3.tsx index 4edb8308f5..a09ff8c27e 100644 --- a/src/packages/navbar/demos/h5/demo3.tsx +++ b/src/packages/navbar/demos/h5/demo3.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' -import { NavBar, Toast, Tabs, TabPane } from '@nutui/nutui-react' -import { More, ArrowLeft } from '@nutui/icons-react' +import { NavBar, TabPane, Tabs, Toast } from '@nutui/nutui-react' +import { ArrowLeft, More } from '@nutui/icons-react' const Demo3 = () => { const [tab1value, setTab1value] = useState('0') @@ -11,12 +11,7 @@ const Demo3 = () => { back={} right={ <> - Toast.show('编辑')} - style={{ marginRight: '5px' }} - > - 编辑 - + Toast.show('编辑')}>编辑 Toast.show('icon')} /> } @@ -36,21 +31,14 @@ const Demo3 = () => { Tab 1 Tab 2 Tab 3 - Tab 4
} right={ <> - Toast.show('编辑')} - style={{ marginRight: '5px' }} - > - 编辑 - + Toast.show('编辑')}>编辑 Toast.show('icon')} /> } @@ -68,7 +56,6 @@ const Demo3 = () => { > Tab1 Tab2 - Tab3
diff --git a/src/packages/navbar/demos/taro/demo1.tsx b/src/packages/navbar/demos/taro/demo1.tsx index 26c80cb60e..2494f5967f 100644 --- a/src/packages/navbar/demos/taro/demo1.tsx +++ b/src/packages/navbar/demos/taro/demo1.tsx @@ -1,8 +1,9 @@ import React from 'react' -import { NavBar } from '@nutui/nutui-react-taro' -import { Share, More, Cart, ArrowLeft, Close } from '@nutui/icons-react-taro' import Taro from '@tarojs/taro' -import { View, Text } from '@tarojs/components' +import { View } from '@tarojs/components' +import { NavBar } from '@nutui/nutui-react-taro' +import { ArrowLeft, Close, More, Share } from '@nutui/icons-react-taro' +import { harmony } from '@/utils/platform-taro' import pxTransform from '@/utils/px-transform' const Demo1 = () => { @@ -21,101 +22,68 @@ const Demo1 = () => { fontWeight: 400, color: 'rgba(0,0,0, 0.5)', lineHeight: pxTransform(16), - textAlign: 'center', }, } return ( <> - - 返回 + + 返回 } - right={ - Taro.showToast({ title: 'icon' })} - > - - - } + right={ Taro.showToast({ title: 'icon' })} />} onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - 订单详情 - + /> Taro.showToast({ title: 'icon' })} - > - - - } + title="页面标题" + right={ Taro.showToast({ title: 'icon' })} />} onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - 订单详情 - + /> + Taro.showToast({ title: '标题' })} + > + 页面标题 + + 副标题 + + } right={ - Taro.showToast({ title: '清空' })}>清空 + Taro.showToast({ title: '清空' })}>清空 } - left={} - back={} + left={} + back={} onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - - Taro.showToast({ title: '标题' })} - > - 浏览记录 - - 浏览记录 - - + /> } + back={} + title={ + Taro.showToast({ title: '页面标题' })} + > + 页面标题 + + } right={ <> - Taro.showToast({ title: '编辑' })} > 编辑 - - Taro.showToast({ title: 'icon' })} - /> + + Taro.showToast({ title: 'icon' })} /> } onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - Taro.showToast({ title: '标题' })} - > - 购物车 - - Taro.showToast({ title: 'icon' })} - > - - - + /> ) } diff --git a/src/packages/navbar/demos/taro/demo2.tsx b/src/packages/navbar/demos/taro/demo2.tsx index 7d0b538b9c..43dbc34304 100644 --- a/src/packages/navbar/demos/taro/demo2.tsx +++ b/src/packages/navbar/demos/taro/demo2.tsx @@ -1,15 +1,16 @@ import React from 'react' -import { NavBar } from '@nutui/nutui-react-taro' -import { Share, More, Cart, ArrowLeft, Close } from '@nutui/icons-react-taro' import Taro from '@tarojs/taro' -import { View, Text } from '@tarojs/components' +import { View } from '@tarojs/components' +import { NavBar, Space } from '@nutui/nutui-react-taro' +import { ArrowLeft, Close, More, Share } from '@nutui/icons-react-taro' +import { harmony } from '@/utils/platform-taro' import pxTransform from '@/utils/px-transform' const Demo2 = () => { const styles = { flexCenter: { display: 'flex', - aliginItems: 'center', + alignItems: 'center', }, title: { fontSize: pxTransform(18), @@ -25,99 +26,88 @@ const Demo2 = () => { } return ( <> - - - 返回 - - } - right={ - Taro.showToast({ title: 'icon' })} + + + + + 返回 + + } + right={ Taro.showToast({ title: 'icon' })} />} + onBackClick={(e) => Taro.showToast({ title: '返回' })} > - - - } - onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - 订单详情 - - Taro.showToast({ title: 'icon' })} + Taro.showToast({ title: '页面标题' })} + > + 页面标题 + + + + + Taro.showToast({ title: 'icon' })} />} + onBackClick={(e) => Taro.showToast({ title: '返回' })} > - - - } - onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - 订单详情 - - Taro.showToast({ title: '清空' })}>清空 - } - left={} - back={} - onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - - Taro.showToast({ title: '标题' })} + Taro.showToast({ title: '页面标题' })} + > + 页面标题 + + + + + Taro.showToast({ title: '清空' })}> + 清空 + + } + left={} + back={} + onBackClick={(e) => Taro.showToast({ title: '返回' })} > - 浏览记录 - - 浏览记录 + + + Taro.showToast({ title: '标题' })} + > + 页面标题 + + 副标题 + + + - - } - right={ - <> - Taro.showToast({ title: '编辑' })} + + } + right={ + <> + Taro.showToast({ title: '编辑' })} + > + 编辑 + + Taro.showToast({ title: 'icon' })} /> + + } + onBackClick={(e) => Taro.showToast({ title: '返回' })} + > + Taro.showToast({ title: '页面标题' })} > - 编辑 - - Taro.showToast({ title: 'icon' })} - /> - - } - onBackClick={(e) => Taro.showToast({ title: '返回' })} - > - Taro.showToast({ title: '标题' })} - > - 购物车 - - Taro.showToast({ title: 'icon' })} - > - + 页面标题 + + - + ) } diff --git a/src/packages/navbar/demos/taro/demo3.tsx b/src/packages/navbar/demos/taro/demo3.tsx index 7e72af1beb..9cc3f34e0c 100644 --- a/src/packages/navbar/demos/taro/demo3.tsx +++ b/src/packages/navbar/demos/taro/demo3.tsx @@ -1,92 +1,63 @@ import React, { useState } from 'react' -import { NavBar, Tabs, TabPane } from '@nutui/nutui-react-taro' import Taro from '@tarojs/taro' -import { View, Text } from '@tarojs/components' +import { View } from '@tarojs/components' +import { NavBar, TabPane, Tabs } from '@nutui/nutui-react-taro' import { ArrowLeft, More } from '@nutui/icons-react-taro' -import pxTransform from '@/utils/px-transform' -import { harmonyAndRn } from '@/utils/platform-taro' const Demo3 = () => { const [tab1value, setTab1value] = useState('0') const [tab2value, setTab2value] = useState('0') - - const isRnAndHarmony = harmonyAndRn() return ( <> } + back={} right={ <> - Taro.showToast({ title: '编辑' })} - > - 编辑 - - - Taro.showToast({ title: 'icon' })} - /> + Taro.showToast({ title: '编辑' })}>编辑 + Taro.showToast({ title: 'icon' })} /> } onBackClick={(e) => Taro.showToast({ title: '返回' })} > - {isRnAndHarmony ? null : ( - { - setTab1value(paneKey) - }} - style={{ - background: 'transparent', - }} - > - Tab 1 - Tab 2 - Tab 3 - Tab 4 - - )} + { + setTab1value(paneKey) + }} + style={{ + '--nutui-tabs-titles-gap': 0, + }} + > + Tab 1 + Tab 2 + Tab 3 + - } + back={} right={ <> - Taro.showToast({ title: '编辑' })} - > - 编辑 - - Taro.showToast({ title: 'icon' })} - /> + Taro.showToast({ title: '编辑' })}>编辑 + Taro.showToast({ title: 'icon' })} /> } onBackClick={(e) => Taro.showToast({ title: '返回' })} > - {isRnAndHarmony ? null : ( - { - setTab2value(paneKey) - }} - > - Tab 1 - Tab 2 - Tab 3 - - )} + { + setTab2value(paneKey) + }} + > + Tab1 + Tab2 + diff --git a/src/packages/navbar/doc.en-US.md b/src/packages/navbar/doc.en-US.md index 9b63ed45ee..56c4aa2f15 100644 --- a/src/packages/navbar/doc.en-US.md +++ b/src/packages/navbar/doc.en-US.md @@ -43,7 +43,7 @@ import { NavBar } from '@nutui/nutui-react' | right | Right side content | `ReactNode` | `-` | | left | The left content, rendered to the right of the return area | `ReactNode` | `-` | | back | Returns the text of the area | `ReactNode` | `-` | -| titleAlign | Title align, optional value center、left | `string` | `center` | +| title | Title | `ReactNode` | `-` | | fixed | Is it fixed | `boolean` | `false` | | safeAreaInsetTop | Whether it is suitable for the safe area | `boolean` | `false` | | placeholder | When fixed to the top, whether to generate a placeholder element of equal height at the label position | `boolean` | `false` | diff --git a/src/packages/navbar/doc.md b/src/packages/navbar/doc.md index 6eee70e428..971ae1aa16 100644 --- a/src/packages/navbar/doc.md +++ b/src/packages/navbar/doc.md @@ -43,7 +43,7 @@ import { NavBar } from '@nutui/nutui-react' | right | 右侧内容 | `ReactNode` | `-` | | left | 左侧内容，渲染在返回区域的右侧 | `ReactNode` | `-` | | back | 返回区域的文字 | `ReactNode` | `-` | -| titleAlign | 标题位置,可选值center left | `string` | `center` | +| title | 标题 | `ReactNode` | `-` | | fixed | 是否固定 | `boolean` | `false` | | safeAreaInsetTop | 是否适配安全区 | `boolean` | `false` | | placeholder | 固定在顶部时，是否在标签位置生成一个等高的占位元素 | `boolean` | `false` | diff --git a/src/packages/navbar/doc.taro.md b/src/packages/navbar/doc.taro.md index 368a2ec14d..d0595763c8 100644 --- a/src/packages/navbar/doc.taro.md +++ b/src/packages/navbar/doc.taro.md @@ -43,7 +43,7 @@ import { NavBar } from '@nutui/nutui-react-taro' | right | 右侧内容 | `ReactNode` | `-` | | left | 左侧内容，渲染在返回区域的右侧 | `ReactNode` | `-` | | back | 返回区域的文字 | `ReactNode` | `-` | -| titleAlign | 标题位置,可选值center left | `string` | `center` | +| title | 标题 | `ReactNode` | `-` | | fixed | 是否固定 | `boolean` | `false` | | safeAreaInsetTop | 是否适配安全区 | `boolean` | `false` | | placeholder | 固定在顶部时，是否在标签位置生成一个等高的占位元素 | `boolean` | `false` | diff --git a/src/packages/navbar/doc.zh-TW.md b/src/packages/navbar/doc.zh-TW.md index 80759f3722..1e9108499c 100644 --- a/src/packages/navbar/doc.zh-TW.md +++ b/src/packages/navbar/doc.zh-TW.md @@ -43,7 +43,7 @@ import { NavBar } from '@nutui/nutui-react' | right | 右側內容 | `ReactNode` | `-` | | left | 左側內容，渲染在返回區域的右側 | `ReactNode` | `-` | | back | 返回區域的文字 | `ReactNode` | `-` | -| titleAlign | 標題位置,可選值center left | `string` | `center` | +| title | 標題 | `ReactNode` | `-` | | fixed | 是否固定 | `boolean` | `false` | | safeAreaInsetTop | 是否適配安全區 | `boolean` | `false` | | placeholder | 固定在頂部時，是否在標簽位置生成一個等高的佔位元素 | `boolean` | `false` | diff --git a/src/packages/navbar/navbar.scss b/src/packages/navbar/navbar.scss index 55195ae53b..1bb48f8a19 100644 --- a/src/packages/navbar/navbar.scss +++ b/src/packages/navbar/navbar.scss @@ -3,16 +3,14 @@ position: relative; display: flex; flex-direction: row; - justify-content: center; + justify-content: space-between; align-items: center; height: $navbar-height; box-sizing: border-box; - background: $navbar-background; - box-shadow: $navbar-box-shadow; font-size: $navbar-font-size; color: $navbar-color; - margin-bottom: $navbar-margin-bottom; overflow: hidden; + padding: 0 16px; &-fixed { position: fixed; @@ -32,27 +30,24 @@ padding-top: env(safe-area-inset-top); } - &-align-left { - padding-left: 14px; + &-title-wrapper { + justify-content: space-between; } &-title { - width: 50%; height: 100%; text-align: center; display: flex; + flex: 1; flex-direction: row; align-items: center; - justify-content: center; font-size: $navbar-title-font-size; font-weight: $navbar-title-font-weight; color: $navbar-title-font-color; - &-align-left { - min-width: 0; - flex: 1; - justify-content: flex-start; - padding: 0 8px; - text-align: left; + + &-center { + max-width: 129px; + justify-content: center; } } @@ -62,15 +57,12 @@ &-left, &-right { - position: absolute; - top: 0; - bottom: 0; display: flex; align-items: center; flex-direction: row; + max-width: 124px; height: 100%; cursor: pointer; - padding: 0 14px; /* #ifndef rn harmony jd h5 weapp*/ .nut-icon, .nutui-iconfont { @@ -78,18 +70,21 @@ height: 20px; font-size: 20px; } + /* #endif */ + &-maxwidth { + box-sizing: border-box; + width: calc(124px - 16px); + } } &-left { - left: 0; + padding-right: 16px; + gap: 16px; + &-rtl { - left: auto; - right: 0; - } - &-align-left { - position: static; - padding: 0; + padding-right: 0; + padding-left: 16px; } &-back { @@ -97,29 +92,26 @@ flex-direction: row; align-items: center; justify-content: center; - &-children { - margin-right: 10px; - &-rtl { - margin-right: 0; - margin-left: 10px; - } - } + gap: 16px; + } + + &-hidden { + padding-left: 0; + padding-right: 0; } } &-right { - right: 0; + padding-left: 16px; + justify-content: flex-end; + gap: 16px; + &-rtl { - right: auto; - left: 0; - } - &-align-left { - position: static; - display: inline-flex; - white-space: nowrap; + padding-right: 16px; padding-left: 0; } } + &-rtl { .nut-icon-ArrowLeft { transform: rotateY(180deg); diff --git a/src/packages/navbar/navbar.taro.tsx b/src/packages/navbar/navbar.taro.tsx index ca5952b90a..8d2988a712 100644 --- a/src/packages/navbar/navbar.taro.tsx +++ b/src/packages/navbar/navbar.taro.tsx @@ -1,18 +1,15 @@ -import React, { FunctionComponent, useEffect, useRef, useState } from 'react' +import React, { FunctionComponent } from 'react' import classNames from 'classnames' import { ITouchEvent, View } from '@tarojs/components' import { useRtl } from '@/packages/configprovider/index.taro' import { BasicComponent, ComponentDefaults } from '@/utils/typings' -import { getRectByTaro } from '@/utils/get-rect-by-taro' -import { harmonyAndRn } from '@/utils/platform-taro' -import pxTransform from '@/utils/px-transform' -import { SafeArea } from '@/packages/safearea/safearea.taro' +import SafeArea from '@/packages/safearea/index.taro' export interface NavBarProps extends BasicComponent { left: React.ReactNode back: React.ReactNode right: React.ReactNode - titleAlign: 'center' | 'left' + title: React.ReactNode fixed: boolean safeAreaInsetTop: boolean placeholder: boolean @@ -25,7 +22,6 @@ const defaultProps = { ...ComponentDefaults, left: '', right: '', - titleAlign: 'center', back: '', fixed: false, safeAreaInsetTop: false, @@ -36,7 +32,7 @@ export const NavBar: FunctionComponent> = (props) => { const { right, left, - titleAlign, + title, className, style, back, @@ -65,64 +61,20 @@ export const NavBar: FunctionComponent> = (props) => { } } - const leftRef = useRef(null) - const rightRef = useRef(null) - const wrapperRef = useRef(null) - const [contentWidth, setContentWidth] = useState('50%') - - const getNodeWidth = async (node: Element | null) => { - if (node) { - const refe = await getRectByTaro(node) - return refe.width - } - return 0 - } - - useEffect(() => { - if (titleAlign === 'left') { - return - } - if (!(back || left || right)) { - setContentWidth('100%') - } - - const init = async () => { - const leftRectWidth = await getNodeWidth(leftRef?.current) - const rightRectWidth = await getNodeWidth(rightRef?.current) - const wrapperWidth = await getNodeWidth(wrapperRef?.current) - let centerWidth = wrapperWidth / 2 - - if (leftRectWidth && rightRectWidth) { - centerWidth = - wrapperWidth - - (leftRectWidth > rightRectWidth - ? leftRectWidth * 2 - : rightRectWidth * 2) - } else { - centerWidth = wrapperWidth - leftRectWidth * 2 - rightRectWidth * 2 - } - setContentWidth(centerWidth.toFixed(2)) - } - setTimeout(() => { - init() - }, 0) - }, [left, right, back]) - const renderLeft = () => { - return back || left ? ( + return ( - {back && ( + {back ? ( > = (props) => { > {back} - )} + ) : null} {left} - ) : null + ) } const renderContent = () => { - let titleStyle = {} - if (titleAlign === 'center') { - const width = harmonyAndRn() - ? pxTransform(Number(contentWidth)) - : `${contentWidth}px` - const contentRealWidth = /%$/i.test(contentWidth) ? contentWidth : width - titleStyle = { - width: contentRealWidth, - } - } - return ( - {children} + {title || children} ) } @@ -166,10 +106,9 @@ export const NavBar: FunctionComponent> = (props) => { {right} @@ -178,7 +117,7 @@ export const NavBar: FunctionComponent> = (props) => { const renderWrapper = () => { return ( - + {renderLeft()} {renderContent()} {renderRight()} @@ -189,11 +128,12 @@ export const NavBar: FunctionComponent> = (props) => { const classes = classNames({ [`${classPrefix}-fixed`]: fixed, [`${classPrefix}-safe-area-inset-top`]: safeAreaInsetTop, - [`${classPrefix}-align-${titleAlign}`]: true, [`${classPrefix}-rtl`]: rtl, }) - const cls = classNames(classPrefix, classes, className) + const cls = classNames(classPrefix, classes, className, { + [`${classPrefix}-title-wrapper`]: title, + }) return ( <> diff --git a/src/packages/navbar/navbar.tsx b/src/packages/navbar/navbar.tsx index 962b0a1aa5..86430db137 100644 --- a/src/packages/navbar/navbar.tsx +++ b/src/packages/navbar/navbar.tsx @@ -1,15 +1,14 @@ -import React, { FunctionComponent, useEffect, useRef, useState } from 'react' +import React, { FunctionComponent } from 'react' import classNames from 'classnames' import { useRtl } from '@/packages/configprovider/index' import { BasicComponent, ComponentDefaults } from '@/utils/typings' -import { getRect } from '@/utils/use-client-rect' -import { SafeArea } from '@/packages/safearea/safearea' +import SafeArea from '@/packages/safearea' export interface NavBarProps extends BasicComponent { left: React.ReactNode back: React.ReactNode right: React.ReactNode - titleAlign: 'center' | 'left' + title: React.ReactNode fixed: boolean safeAreaInsetTop: boolean placeholder: boolean @@ -22,7 +21,6 @@ const defaultProps = { ...ComponentDefaults, left: '', right: '', - titleAlign: 'center', back: '', fixed: false, safeAreaInsetTop: false, @@ -33,7 +31,7 @@ export const NavBar: FunctionComponent> = (props) => { const { right, left, - titleAlign, + title, className, style, back, @@ -62,60 +60,20 @@ export const NavBar: FunctionComponent> = (props) => { } } - const leftRef = useRef(null) - const rightRef = useRef(null) - const wrapperRef = useRef(null) - const [contentWidth, setContentWidth] = useState('50%') - - const getNodeWidth = (node: Element | null) => { - if (node) { - const ele = getRect(node) - return ele.width - } - return 0 - } - - useEffect(() => { - if (titleAlign === 'left') { - return - } - if (!(back || left || right)) { - setContentWidth('100%') - return - } - const leftRectWidth = getNodeWidth(leftRef?.current) - const rightRectWidth = getNodeWidth(rightRef?.current) - const wrapperWidth = getNodeWidth(wrapperRef?.current) - - let centerWidth = wrapperWidth / 2 - if (leftRectWidth && rightRectWidth) { - centerWidth = - wrapperWidth - - (leftRectWidth > rightRectWidth - ? leftRectWidth * 2 - : rightRectWidth * 2) - } else { - centerWidth = wrapperWidth - leftRectWidth * 2 - rightRectWidth * 2 - } - - setContentWidth(centerWidth.toFixed(2)) - }, [left, right, back]) - const renderLeft = () => { - return back || left ? ( + return (
- {back && ( + {back ? (
> = (props) => { > {back}
- )} + ) : null} {left}
- ) : null + ) } const renderContent = () => { - let titleStyle = {} - if (titleAlign === 'center') { - const contentRealWidth = `${contentWidth}${ - /%$/i.test(contentWidth) ? '' : 'px' - }` - titleStyle = { - minWidth: contentRealWidth, - width: contentRealWidth, - } - } - return (
- {children} + {title || children}
) } @@ -159,10 +105,9 @@ export const NavBar: FunctionComponent> = (props) => {
{right}
@@ -171,7 +116,7 @@ export const NavBar: FunctionComponent> = (props) => { const renderWrapper = () => { return ( -
+
{renderLeft()} {renderContent()} {renderRight()} @@ -182,11 +127,12 @@ export const NavBar: FunctionComponent> = (props) => { const classes = classNames({ [`${classPrefix}-fixed`]: fixed, [`${classPrefix}-safe-area-inset-top`]: safeAreaInsetTop, - [`${classPrefix}-align-${titleAlign}`]: true, [`${classPrefix}-rtl`]: rtl, }) - const cls = classNames(classPrefix, classes, className) + const cls = classNames(classPrefix, classes, className, { + [`${classPrefix}-title-wrapper`]: title, + }) return ( <> From bb0685f51445b81bf1ed0caccd1a0f35df023d7d Mon Sep 17 00:00:00 2001 From: xiaoyatong <84436086+xiaoyatong@users.noreply.github.com> Date: Thu, 26 Dec 2024 21:11:52 +0800 Subject: [PATCH 16/19] feat: textarea v15 (#2887) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: textarea v15 * feat: 添加错误提示 * fix: 增加文档,去掉demo中无用代码 * fix: test * fix: cr fixed --- migrate-from-v2.md | 9 +- src/config.json | 1 + .../__snapshots__/textarea.spec.tsx.snap | 2 +- src/packages/textarea/demo.taro.tsx | 7 ++ src/packages/textarea/demo.tsx | 7 ++ src/packages/textarea/demos/h5/demo1.tsx | 25 +++-- src/packages/textarea/demos/h5/demo9.tsx | 7 ++ src/packages/textarea/demos/taro/demo1.tsx | 26 +++-- src/packages/textarea/demos/taro/demo9.tsx | 7 ++ src/packages/textarea/doc.en-US.md | 5 +- src/packages/textarea/doc.md | 7 +- src/packages/textarea/doc.taro.md | 5 +- src/packages/textarea/doc.zh-TW.md | 5 +- src/packages/textarea/textarea.scss | 59 ++++++++---- src/packages/textarea/textarea.taro.tsx | 95 ++++++++++--------- src/packages/textarea/textarea.tsx | 87 +++++++++-------- src/styles/variables.scss | 12 +-- 17 files changed, 220 insertions(+), 146 deletions(-) create mode 100644 src/packages/textarea/demos/h5/demo9.tsx create mode 100644 src/packages/textarea/demos/taro/demo9.tsx diff --git a/migrate-from-v2.md b/migrate-from-v2.md index 1e2cfc813c..5f5eb68462 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -509,12 +509,9 @@ plugins: [ #### TextArea -- `maxlength` 重命名为 `maxLength` -- `readonly` 重命名为 `readOnly` -- `limitShow` 重命名为 `showCount` -- `autosize` 重命名为 `autoSize` -- 移除 `textAlign`，可通过 `style` 传入 -- `defaultValue` 改为非受控，增加受控值 `value` +- 新增 `plain` 属性，标记为 纯文本型；该值默认为false，标记为 container 容器型； +- 新增 `status` 属性，值为 `default` | `error`，可定义输入框的状态； +- 删掉一些可使用基础样式变量，并且建议使用基础样式变量的样式变量，比如 `$textarea-font` `$textarea-limit-color` `$textarea-disabled-color` #### Uploader diff --git a/src/config.json b/src/config.json index d73b6a7108..fb1a43c937 100644 --- a/src/config.json +++ b/src/config.json @@ -703,6 +703,7 @@ "sort": 2, "show": true, "taro": true, + "v15": true, "author": "VickyYe" }, { diff --git a/src/packages/textarea/__test__/__snapshots__/textarea.spec.tsx.snap b/src/packages/textarea/__test__/__snapshots__/textarea.spec.tsx.snap index 2c174bfdb4..76f243f012 100644 --- a/src/packages/textarea/__test__/__snapshots__/textarea.spec.tsx.snap +++ b/src/packages/textarea/__test__/__snapshots__/textarea.spec.tsx.snap @@ -3,7 +3,7 @@ exports[`textarea props test 1`] = `