diff --git a/docs/charts/charts-CHANGELOG.md b/docs/charts/charts-CHANGELOG.md index 0403b418e..abc7b043c 100644 --- a/docs/charts/charts-CHANGELOG.md +++ b/docs/charts/charts-CHANGELOG.md @@ -8,6 +8,13 @@ group: 可视化图表 --- +## 0.2.22 + +`2024-01-18` + +- 🆕 Stat 新增 padding 属性，用于设置图表的内间距。[#412](https://github.com/oceanbase/oceanbase-design/pull/412) +- 🐞 修复 Pie 环图统计组件标题和内容 `formatter` 不生效的问题。[#413](https://github.com/oceanbase/oceanbase-design/pull/413) + ## 0.2.21 `2024-01-12` diff --git a/docs/design/design-CHANGELOG.md b/docs/design/design-CHANGELOG.md index 047d19a80..1501208ea 100644 --- a/docs/design/design-CHANGELOG.md +++ b/docs/design/design-CHANGELOG.md @@ -8,6 +8,31 @@ group: 基础组件 --- +## 0.2.37 + +`2024-01-30` + +- 🆕 新增 injectStaticFunction 属性，用于配置 message、notification 和 Modal 静态方法是否可以消费全局配置，默认开启。[#446](https://github.com/oceanbase/oceanbase-design/pull/446) +- 🐞 修复 Typography 的样式优先级，保证字体和行高默认继承父元素，便于和其他组件组合使用。[#428](https://github.com/oceanbase/oceanbase-design/pull/428) [@wdyea-ya](https://github.com/wdyea-ya) +- 🐞 修复 Table 选中行和 `hover` 行的背景色不一致的问题。[#455](https://github.com/oceanbase/oceanbase-design/pull/455) + +## 0.2.36 + +`2024-01-19` + +- 💄 ConfigProvider 内嵌的 App 组件不再创建 DOM 节点，避免增加一层 DOM 结构影响子元素的样式表现。[#431](https://github.com/oceanbase/oceanbase-design/pull/431) + +## 0.2.35 + +`2024-01-18` + +- 🆕 ConfigProvider 新增 table.selectionColumnWidth 属性，用于配置表格的展开列宽度。[#421](https://github.com/oceanbase/oceanbase-design/pull/421) +- Table + - 🐞 修复 Table 可展开时底部出现重复边框的问题。[#420](https://github.com/oceanbase/oceanbase-design/pull/420) + - 💄 优化 Table 在无间距卡片内的展示样式，包括第一列和卡片标题对齐、最后一列和卡片操作区对齐、分页器左右增加间距。[#422](https://github.com/oceanbase/oceanbase-design/pull/422) + - 💄 减小 Table 单元格的纵向内间距，以对齐设计规范。[#425](https://github.com/oceanbase/oceanbase-design/pull/425) +- 💄 Modal 去掉最大高度限制，高度超出时内容滚动改由上层控制。[#411](https://github.com/oceanbase/oceanbase-design/pull/411) + ## 0.2.34 `2024-01-12` diff --git a/docs/ui/ui-CHANGELOG.md b/docs/ui/ui-CHANGELOG.md index 5a931147c..22936df76 100644 --- a/docs/ui/ui-CHANGELOG.md +++ b/docs/ui/ui-CHANGELOG.md @@ -8,6 +8,32 @@ group: 业务组件 --- +## 0.2.38 + +`2024-01-30` + +- PageContainer + - 🐞 修复 PageContainer 页头和页脚操作区外的组件尺寸也可能被改为 large 的问题。[#443](https://github.com/oceanbase/oceanbase-design/pull/443) + - 💄 修复 PageContainer 页头和页脚操作区样式适配 Space.Compact 组件。[#454](https://github.com/oceanbase/oceanbase-design/pull/454) +- 🐞 修复 FooterToolbar 子元素外的组件尺寸被改为 large 的问题。[#447](https://github.com/oceanbase/oceanbase-design/pull/447) + +## 0.2.37 + +`2024-01-19` + +- PageContainer + - 💄 PageContainer 页头和页脚操作区的组件尺寸默认为 `large`、字体大小为 `middle`。[#432](https://github.com/oceanbase/oceanbase-design/pull/432) + - 💄 优化 PageContainer 和 Tabs 组合使用时的间距，以对齐设计规范。[#434](https://github.com/oceanbase/oceanbase-design/pull/434) +- 💄 FooterToolbar 子元素的组件尺寸默认为 `large`、字体大小默认为 `middle`。[#433](https://github.com/oceanbase/oceanbase-design/pull/433) + +## 0.2.36 + +`2024-01-18` + +- 🐞 修复 Password 组件快速输入时丢失字符和焦点跳跃的问题。[#424](https://github.com/oceanbase/oceanbase-design/pull/424) [@Vanleehao](https://github.com/Vanleehao) +- 🐞 修复 Highlight 国际化不生效的问题。[#419](https://github.com/oceanbase/oceanbase-design/pull/419) [@linhf123](https://github.com/linhf123) +- 💄 优化 PageContainer 右上角和页脚操作区中的 Input 样式，保证宽高和字体大小符合设计规范。[#426](https://github.com/oceanbase/oceanbase-design/pull/426) + ## 0.2.35 `2024-01-12` diff --git a/package.json b/package.json index 97cfd885c..330cddefa 100644 --- a/package.json +++ b/package.json @@ -59,15 +59,15 @@ "@testing-library/jest-dom": "^6.2.0", "@testing-library/react": "^14.1.0", "@testing-library/react-hooks": "^8.0.1", - "@testing-library/user-event": "^14.5.1", + "@testing-library/user-event": "^14.5.2", "@types/jest": "^29.5.10", "@types/lodash": "^4.14.202", "@types/node": "^20.10.5", "@types/react": "^18.2.47", "@umijs/fabric": "^4.0.1", - "@umijs/test": "^4.0.90", + "@umijs/test": "^4.1.0", "@vercel/analytics": "^1.1.1", - "antd": "^5.11.2", + "antd": "^5.13.2", "antd-style": "3.5.2", "antd-token-previewer": "^2.0.5", "babel-jest": "^29.7.0", @@ -98,7 +98,7 @@ "lodash": "^4.17.21", "lz-string": "^1.5.0", "mockdate": "^3.0.5", - "prettier": "^3.1.1", + "prettier": "^3.2.4", "prismjs": "^1.29.0", "rc-checkbox": "^3.1.0", "rc-drawer": "^7.0.0", @@ -120,7 +120,7 @@ "ts-jest": "^29.1.1", "ts-node": "^10.9.1", "typescript": "^5.3.3", - "vanilla-jsoneditor": "^0.21.1", + "vanilla-jsoneditor": "^0.21.2", "web-vitals": "^3.5.0", "yorkie": "^2.0.0" } diff --git a/packages/charts/package.json b/packages/charts/package.json index af2ab26a4..cd66b6fa6 100644 --- a/packages/charts/package.json +++ b/packages/charts/package.json @@ -1,6 +1,6 @@ { "name": "@oceanbase/charts", - "version": "0.2.21", + "version": "0.2.22", "description": "The Chart library for OceanBase", "homepage": "https://github.com/oceanbase/oceanbase-design/packages/charts", "repository": { diff --git a/packages/charts/src/Pie/__tests__/__snapshots__/donut.test.tsx.snap b/packages/charts/src/Pie/__tests__/__snapshots__/donut.test.tsx.snap index 7c0ca91e2..43467c8ae 100644 --- a/packages/charts/src/Pie/__tests__/__snapshots__/donut.test.tsx.snap +++ b/packages/charts/src/Pie/__tests__/__snapshots__/donut.test.tsx.snap @@ -2,102 +2,90 @@ exports[`donut floor number 1`] = `
+
- -
-
- 总数 -
-
-
-
- 21.16 -
-
+ 总数 +
+
+
+
+ 21.16
- + + +`; + +exports[`donut statistic title and content formatter 1`] = ` +
+ +
+
+ custom title +
+
- -
-
- 总数 -
-
-
-
- 21.16 -
-
+ custom content
- + `; diff --git a/packages/charts/src/Pie/__tests__/donut.test.tsx b/packages/charts/src/Pie/__tests__/donut.test.tsx index 20602032e..f98b941f2 100644 --- a/packages/charts/src/Pie/__tests__/donut.test.tsx +++ b/packages/charts/src/Pie/__tests__/donut.test.tsx @@ -1,11 +1,65 @@ import React from 'react'; import { render } from '@testing-library/react'; -import DonutFloor from '../demo/donut-floor'; +import { Pie } from '@oceanbase/charts'; +import type { PieConfig } from '@oceanbase/charts'; + +const DonutTest = (props: Partial) => { + const data = [ + { + type: '分类一', + value: 1.3, + }, + { + type: '分类二', + value: 3.38, + }, + { + type: '分类三', + value: 4.56, + }, + { + type: '分类四', + value: 5.7, + }, + { + type: '分类五', + value: 6.22, + }, + ]; + const config: PieConfig = { + data, + angleField: 'value', + colorField: 'type', + isDonut: true, + ...props, + }; + return ; +}; describe('donut', () => { it('floor number', () => { - const { container, asFragment } = render(); + const { container, asFragment } = render(); expect(container.querySelectorAll('.g2-html-annotation')?.[1].textContent).toBe('21.16'); expect(asFragment().firstChild).toMatchSnapshot(); }); + + it('statistic title and content formatter', () => { + const { container, asFragment } = render( + 'custom title', + }, + content: { + formatter: () => 'custom content', + }, + }} + /> + ); + expect(container.querySelectorAll('.g2-html-annotation')?.[0].textContent).toBe('custom title'); + expect(container.querySelectorAll('.g2-html-annotation')?.[1].textContent).toBe( + 'custom content' + ); + expect(asFragment().firstChild).toMatchSnapshot(); + }); }); diff --git a/packages/charts/src/Pie/index.tsx b/packages/charts/src/Pie/index.tsx index 67ed9f1b6..f86ee1230 100644 --- a/packages/charts/src/Pie/index.tsx +++ b/packages/charts/src/Pie/index.tsx @@ -2,7 +2,7 @@ import React, { forwardRef } from 'react'; import type { PieConfig as AntPieConfig } from '@ant-design/charts'; import { Pie as AntPie } from '@ant-design/charts'; import { formatNumber } from '@oceanbase/util'; -import { isString } from 'lodash'; +import { isFunction, toString } from 'lodash'; import { useTheme } from '../theme'; import type { Theme } from '../theme'; import { customMemo } from '../util/custom-memo'; @@ -13,7 +13,7 @@ export const measureTextSize = (text: string, font: any = {}) => { if (ctx) { // @see https://developer.mozilla.org/zh-CN/docs/Web/CSS/font ctx.font = [fontStyle, fontWeight, fontVariant, `${fontSize}px`, fontFamily].join(' '); - const metrics = ctx?.measureText(isString(text) ? text : ''); + const metrics = ctx?.measureText(toString(text) || ''); return { width: metrics.width, // ref: https://zhuanlan.zhihu.com/p/455132377 @@ -133,11 +133,16 @@ const Pie = forwardRef( // content 为空时，默认的 customHtml 才生效 ...(statistic?.title?.content === undefined ? { - customHtml: (container, view, datum) => { + customHtml: (container, view, datum, filterData) => { const { width, height } = container.getBoundingClientRect(); const d = Math.sqrt(Math.pow(width / 2, 2) + Math.pow(height / 2, 2)); // 开启 pie-statistic-active 交互时，datum[colorField] 不为空 - const text = datum ? datum[colorField] : statisticTitle; + const title = datum ? datum[colorField] : statisticTitle; + + // format title + const formatter = statistic?.title && statistic?.title?.formatter; + const text = isFunction(formatter) ? formatter(datum, filterData) : title; + return renderStatistic(d, text, { // 这里的字体大小仅用于计算文本宽高，不用于实际样式 fontSize: titleFontSize, @@ -161,9 +166,14 @@ const Pie = forwardRef( ? { customHtml: (container, view, datum, filterData) => { const { width } = container.getBoundingClientRect(); - const text = datum + const total = datum ? `${datum[angleField]}` : `${formatNumber(filterData?.reduce((a, b) => a + b[angleField], 0))}`; + + // format content + const formatter = statistic?.content && statistic?.content?.formatter; + const text = isFunction(formatter) ? formatter(datum, filterData) : `${total}`; + return renderStatistic(width, text, { // 这里的字体大小仅用于计算文本宽高，不用于实际样式 fontSize: contentFontSize, diff --git a/packages/charts/src/Score/demo/basic.tsx b/packages/charts/src/Score/demo/basic.tsx index d73f67f1e..329a3c82b 100644 --- a/packages/charts/src/Score/demo/basic.tsx +++ b/packages/charts/src/Score/demo/basic.tsx @@ -8,7 +8,7 @@ export default () => { return (
- + setSize(e.target.value)}> Large Default diff --git a/packages/charts/src/Stat/index.md b/packages/charts/src/Stat/index.md index d77aa54d5..3a46b2987 100644 --- a/packages/charts/src/Stat/index.md +++ b/packages/charts/src/Stat/index.md @@ -15,6 +15,7 @@ nav: | :---------- | :------------------- | :-------------------------------------- | :--------- | :--- | | width | 图表宽度 | number | 容器宽度 | - | | height | 图表高度 | number | 400 | - | +| padding | 图表内间距 | number | 8 | - | | title | 标题 | string | - | - | | value | 数值 | number | - | - | | prefix | 数值前缀 | string | - | - | diff --git a/packages/charts/src/Stat/index.tsx b/packages/charts/src/Stat/index.tsx index b2d889d7a..71d766333 100644 --- a/packages/charts/src/Stat/index.tsx +++ b/packages/charts/src/Stat/index.tsx @@ -14,6 +14,7 @@ import './index.less'; export interface StatConfig { width?: number; height?: number; + padding?: number; title?: string; value?: number; prefix?: string; @@ -50,6 +51,7 @@ function fontSizeReductionFactor(fontSize: number) { const Stat: React.FC = ({ width, height, + padding = 8, title, value, prefix, @@ -73,7 +75,6 @@ const Stat: React.FC = ({ height: containerHeight = 0, } = useResizeObserver(); const isFlat = containerHeight < 72; - const padding = containerHeight > 100 ? 12 : 8; const maxWidth = containerWidth - padding * 2; const maxHeight = containerHeight - padding * 2; diff --git a/packages/codemod/package.json b/packages/codemod/package.json index efe54f14e..4d499a429 100644 --- a/packages/codemod/package.json +++ b/packages/codemod/package.json @@ -1,6 +1,6 @@ { "name": "@oceanbase/codemod", - "version": "0.2.15", + "version": "0.2.16", "description": "Codemod for OceanBase Design upgrade", "keywords": [ "oceanbase", @@ -34,7 +34,7 @@ "lodash": "^4.17.21", "postcss": "^8.4.33", "postcss-less": "^6.0.0", - "prettier": "^3.1.1", + "prettier": "^3.2.4", "read-pkg-up": "^10.1.0", "semver": "^7.5.4", "update-check": "^1.5.4", diff --git a/packages/design/package.json b/packages/design/package.json index d6e0e2152..3de8f941e 100644 --- a/packages/design/package.json +++ b/packages/design/package.json @@ -1,6 +1,6 @@ { "name": "@oceanbase/design", - "version": "0.2.34", + "version": "0.2.37", "description": "The Design System of OceanBase", "keywords": [ "oceanbase", @@ -39,7 +39,7 @@ "@oceanbase/icons": "workspace:^", "@oceanbase/util": "workspace:^", "ahooks": "^2.10.14", - "antd": "^5.11.2", + "antd": "^5.13.2", "classnames": "^2.5.1", "lodash": "^4.17.21", "lottie-web": "^5.12.2", diff --git a/packages/design/src/card/index.md b/packages/design/src/card/index.md index a55b54b3d..549467386 100644 --- a/packages/design/src/card/index.md +++ b/packages/design/src/card/index.md @@ -24,6 +24,8 @@ nav: + + ## API | 参数 | 说明 | 类型 | 默认值 | 版本 | diff --git a/packages/design/src/card/index.tsx b/packages/design/src/card/index.tsx index 9084bc91a..5afe2b426 100644 --- a/packages/design/src/card/index.tsx +++ b/packages/design/src/card/index.tsx @@ -24,7 +24,16 @@ export interface CardProps extends AntCardProps { const Card = React.forwardRef( ( - { children, divided = true, tabList, prefixCls: customizePrefixCls, className, ...restProps }, + { + children, + size, + divided = true, + tabList, + prefixCls: customizePrefixCls, + bodyStyle, + className, + ...restProps + }, ref ) => { const { getPrefixCls } = useContext(ConfigProvider.ConfigContext); @@ -32,9 +41,13 @@ const Card = React.forwardRef( const tabsPrefixCls = getPrefixCls('tabs', customizePrefixCls); const { wrapSSR } = useStyle(prefixCls, tabsPrefixCls); + // card body has no padding + const noBodyPadding = [0, '0', '0px'].includes(bodyStyle?.padding); + const cardCls = classNames( { [`${prefixCls}-no-divider`]: !divided, + [`${prefixCls}-no-body-padding`]: noBodyPadding, }, className ); @@ -57,15 +70,30 @@ const Card = React.forwardRef( }); return wrapSSR( - - {children} - + + {children} + + ); } ); diff --git a/packages/design/src/card/style/index.ts b/packages/design/src/card/style/index.ts index 9c1917605..a03b4fba6 100644 --- a/packages/design/src/card/style/index.ts +++ b/packages/design/src/card/style/index.ts @@ -8,6 +8,37 @@ export type CardToken = FullToken<'Card'> & { tabsPrefixCls: string; }; +export const genTableStyle = (padding: number, token: CardToken): CSSObject => { + const { antCls } = token; + const tableComponentCls = `${antCls}-table`; + return { + [`${tableComponentCls}-wrapper`]: { + [`${tableComponentCls}`]: { + // first column should align with card title + [`${tableComponentCls}-thead > tr > th:first-child, ${tableComponentCls}-tbody > tr > td:first-child`]: + { + paddingLeft: padding, + }, + // last column should align with card extra + [`${tableComponentCls}-thead > tr > th:last-child, ${tableComponentCls}-tbody > tr > td:last-child`]: + { + paddingRight: padding, + }, + }, + [`${tableComponentCls}-pagination${antCls}-pagination`]: { + // add marginLeft for table batchOperationBar + [`${tableComponentCls}-batch-operation-bar`]: { + marginLeft: padding, + }, + // add marginRight for table pagination + [`& > li:last-child`]: { + marginRight: padding, + }, + }, + }, + }; +}; + export const genCardStyle: GenerateStyle = (token: CardToken): CSSObject => { const { componentCls, tabsComponentCls, tabsPrefixCls, padding, paddingSM, paddingLG } = token; return { @@ -51,6 +82,13 @@ export const genCardStyle: GenerateStyle = (token: CardToken): CSSObj marginBottom: 0, }, }, + // no body padding card + [`${componentCls}${componentCls}-no-body-padding`]: genTableStyle(paddingLG, token), + // no body padding small card + [`${componentCls}${componentCls}-no-body-padding${componentCls}-small`]: genTableStyle( + paddingSM, + token + ), }; }; diff --git a/packages/design/src/config-provider/__tests__/__snapshots__/prefixCls.tsx.snap b/packages/design/src/config-provider/__tests__/__snapshots__/prefixCls.tsx.snap index b0aeee9ca..eb13988cf 100644 --- a/packages/design/src/config-provider/__tests__/__snapshots__/prefixCls.tsx.snap +++ b/packages/design/src/config-provider/__tests__/__snapshots__/prefixCls.tsx.snap @@ -1,121 +1,37 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`ConfigProvider prefixCls prefixCls 1`] = ` - + + + + `; -exports[`ConfigProvider prefixCls iconPrefixCls 1`] = ` -
- - + + button -
- - - -
- - - -
-
-
+ `; diff --git a/packages/design/src/config-provider/__tests__/__snapshots__/spin.test.tsx.snap b/packages/design/src/config-provider/__tests__/__snapshots__/spin.test.tsx.snap index b85980572..8f03ef83d 100644 --- a/packages/design/src/config-provider/__tests__/__snapshots__/spin.test.tsx.snap +++ b/packages/design/src/config-provider/__tests__/__snapshots__/spin.test.tsx.snap @@ -2,49 +2,24 @@ exports[`ConfigProvider spin spin.indicator should work 1`] = `
-
-
+ class="custom-indicator ant-spin-dot" + />
`; exports[`ConfigProvider spin spin.indicator should work in nested ConfigProvider 1`] = `
-
-
-
-
-
-
-
-
-
+ class="custom-indicator-1 ant-spin-dot" + />
`; diff --git a/packages/design/src/config-provider/__tests__/__snapshots__/styleProviderProps.test.tsx.snap b/packages/design/src/config-provider/__tests__/__snapshots__/styleProviderProps.test.tsx.snap index bee5b4f54..c32130d61 100644 --- a/packages/design/src/config-provider/__tests__/__snapshots__/styleProviderProps.test.tsx.snap +++ b/packages/design/src/config-provider/__tests__/__snapshots__/styleProviderProps.test.tsx.snap @@ -1,19 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`ConfigProvider styleProviderProps ConfigProvider styleProviderProps.hashPriority 1`] = ` -
-
-
-
-
-
-
-
-
-`; +exports[`ConfigProvider styleProviderProps ConfigProvider styleProviderProps.hashPriority 1`] = `
`; diff --git a/packages/design/src/config-provider/__tests__/spin.test.tsx b/packages/design/src/config-provider/__tests__/spin.test.tsx index af56554ae..007d6430e 100644 --- a/packages/design/src/config-provider/__tests__/spin.test.tsx +++ b/packages/design/src/config-provider/__tests__/spin.test.tsx @@ -1,7 +1,6 @@ import React from 'react'; import { render } from '@testing-library/react'; -import ConfigProvider from '..'; -import Spin from '../../spin'; +import { ConfigProvider, Spin } from '@oceanbase/design'; describe('ConfigProvider spin', () => { it('spin.indicator should work', () => { diff --git a/packages/design/src/config-provider/__tests__/table.test.tsx b/packages/design/src/config-provider/__tests__/table.test.tsx new file mode 100644 index 000000000..3df8c8881 --- /dev/null +++ b/packages/design/src/config-provider/__tests__/table.test.tsx @@ -0,0 +1,35 @@ +import React, { useContext } from 'react'; +import { ConfigProvider } from '@oceanbase/design'; + +describe('ConfigProvider table', () => { + it('table.selectionColumnWidth should work', () => { + const Child1 = () => { + const { table } = useContext(ConfigProvider.ConfigContext); + expect(table?.selectionColumnWidth).toBe(undefined); + return
; + }; + const Child2 = () => { + const { table } = useContext(ConfigProvider.ConfigContext); + expect(table?.selectionColumnWidth).toBe(48); + return
; + }; + const Child3 = () => { + const { table } = useContext(ConfigProvider.ConfigContext); + expect(table?.selectionColumnWidth).toBe(48); + return
; + }; + + + + + + + + + ; + }); +}); diff --git a/packages/design/src/config-provider/demo/theme.tsx b/packages/design/src/config-provider/demo/theme.tsx index c9015bbfb..98495f50c 100644 --- a/packages/design/src/config-provider/demo/theme.tsx +++ b/packages/design/src/config-provider/demo/theme.tsx @@ -42,10 +42,10 @@ export default () => { labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} > - + - + diff --git a/packages/design/src/config-provider/index.md b/packages/design/src/config-provider/index.md index 89dc5ad2d..f63b0f209 100644 --- a/packages/design/src/config-provider/index.md +++ b/packages/design/src/config-provider/index.md @@ -7,6 +7,11 @@ nav: - 🔥 完全继承 antd [ConfigProvider](https://ant.design/components/config-provider-cn) 的能力和 API，可无缝切换。 - 🆕 默认内嵌 [App 包裹组件](https://ant.design/components/app-cn)，支持 message, notification 和 Modal 等静态方法消费 ConfigProvider 配置。 +- 🆕 新增 `table.selectionColumnWidth` 属性，用于配置表格的展开列宽度。 +- 🆕 新增 `injectStaticFunction` 属性，用于配置 `message`, `notification` 和 `Modal` 静态方法是否可以消费全局配置，默认开启。 + + + - 🆕 新增 `styleProviderProps` 属性，一般用于配置 [StyleProvider](https://github.com/ant-design/cssinjs#styleprovider) 的 `hashPriority` 和 `transformers` 属性实现样式降级，来兼容 Chrome 88 以下的低版本浏览器，详见 [antd v5 样式兼容说明](https://ant-design.antgroup.com/docs/react/compatible-style-cn)。 ## 代码演示 @@ -41,6 +46,8 @@ export default App; | 参数 | 说明 | 类型 | 默认值 | 版本 | | :-- | :-- | :-- | :-- | :-- | | spin | Spin 全局配置 | `{ indicator?: ReactNode; className?: string; style?: React.CSSProperties; }` | undefined | - | +| table | Table 全局配置 | `{ selectionColumnWidth?: width; className?: string; style?: React.CSSProperties; }` | undefined | - | +| injectStaticFunction | 用于配置 `message`, `notification` 和 `Modal` 静态方法是否可以消费全局配置 | boolean | true | - | | styleProviderProps | [StyleProvider 配置](https://github.com/ant-design/cssinjs#styleprovider)，一般用于配置 `hashPriority` 和 `transformers` 属性实现样式降级 | [StyleProviderProps](https://github.com/ant-design/cssinjs/blob/master/src/StyleContext.tsx#L88) | undefined | - | - 更多 API 详见 antd ConfigProvider 文档: https://ant.design/components/config-provider-cn diff --git a/packages/design/src/config-provider/index.tsx b/packages/design/src/config-provider/index.tsx index b016f8437..cad4bfa6b 100644 --- a/packages/design/src/config-provider/index.tsx +++ b/packages/design/src/config-provider/index.tsx @@ -33,11 +33,17 @@ export type SpinConfig = ComponentStyleConfig & { indicator?: SpinIndicator; }; +export type TableConfig = ComponentStyleConfig & { + selectionColumnWidth?: number; +}; + export interface ConfigConsumerProps extends AntConfigConsumerProps { theme?: ThemeConfig; navigate?: NavigateFunction; hideOnSinglePage?: boolean; spin?: SpinConfig; + table?: TableConfig; + builtInApp?: boolean; locale?: Locale; } @@ -49,6 +55,9 @@ export interface ConfigProviderProps extends AntConfigProviderProps { navigate?: NavigateFunction; hideOnSinglePage?: boolean; spin?: SpinConfig; + table?: TableConfig; + // inject static function to consume ConfigProvider + injectStaticFunction?: boolean; // StyleProvider props styleProviderProps?: StyleProviderProps; } @@ -65,16 +74,27 @@ const ExtendedConfigContext = React.createContext({ const { defaultSeed } = themeConfig; -const ConfigProvider = ({ +export type ConfigProviderType = React.FC & { + ExtendedConfigContext: typeof ExtendedConfigContext; +} & { + ConfigContext: React.Context; + SizeContext: typeof AntConfigProvider.SizeContext; + config: typeof AntConfigProvider.config; + useConfig: typeof AntConfigProvider.useConfig; +}; + +const ConfigProvider: ConfigProviderType = ({ children, theme, navigate, hideOnSinglePage, spin, + table, tabs, + injectStaticFunction = true, styleProviderProps, ...restProps -}: ConfigProviderProps) => { +}) => { // inherit from parent ConfigProvider const parentContext = React.useContext(AntConfigProvider.ConfigContext); const parentExtendedContext = @@ -89,6 +109,7 @@ const ConfigProvider = ({ return ( (origin >= 24 ? origin - 16 : origin), @@ -121,9 +142,9 @@ const ConfigProvider = ({ {/* Nested App component for static function of message, notification and Modal to consume ConfigProvider config */} {/* ref: https://ant.design/components/app */} - + {children} - + {injectStaticFunction && } @@ -131,8 +152,7 @@ const ConfigProvider = ({ ); }; -ConfigProvider.ConfigContext = - AntConfigProvider.ConfigContext as React.Context; +ConfigProvider.ConfigContext = AntConfigProvider.ConfigContext; ConfigProvider.ExtendedConfigContext = ExtendedConfigContext; ConfigProvider.SizeContext = AntConfigProvider.SizeContext; ConfigProvider.config = AntConfigProvider.config; diff --git a/packages/design/src/drawer/__tests__/__snapshots__/index.test.tsx.snap b/packages/design/src/drawer/__tests__/__snapshots__/index.test.tsx.snap index e3341a413..1deda45c6 100644 --- a/packages/design/src/drawer/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/design/src/drawer/__tests__/__snapshots__/index.test.tsx.snap @@ -24,55 +24,51 @@ exports[`Drawer render correctly 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
-
- Here is content of Drawer -
+ Here is content of Drawer
@@ -110,111 +106,107 @@ exports[`Drawer render with confirmLoading and okButtonProps 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
+ Here is content of Drawer +
+
- Here is content of Drawer -
-
-
- -
-
+ + OK + + +
+
+ -
+ + Cancel + +
@@ -255,61 +247,57 @@ exports[`Drawer render with custom footer 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
-
- Here is content of Drawer -
-
-
- custom footer -
+ Here is content of Drawer +
+
+
+ custom footer
@@ -348,88 +336,84 @@ exports[`Drawer render with default footer 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
+ Here is content of Drawer +
+
- Here is content of Drawer -
-
-
- -
-
+ OK + + +
+
+ -
+ + Cancel + +
@@ -470,61 +454,57 @@ exports[`Drawer render with footerExtra and custom footer 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
-
- Here is content of Drawer -
-
-
- custom footer -
+ Here is content of Drawer +
+
+
+ custom footer
@@ -563,91 +543,87 @@ exports[`Drawer render with footerExtra and default footer 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
+ Here is content of Drawer +
+
- Here is content of Drawer -
-
-
- -
-
+ OK + + +
+
+ -
+ + Cancel + +
- footer extra
+ footer extra
@@ -686,55 +662,51 @@ exports[`Drawer render with footerExtra and no footer 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
-
- Here is content of Drawer -
+ Here is content of Drawer
@@ -772,88 +744,84 @@ exports[`Drawer render with okText and cancenText 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
+ Here is content of Drawer +
+
- Here is content of Drawer -
-
-
- -
-
+ custom ok text + + +
+
+ -
+ + custom cancel text + +
@@ -894,88 +862,84 @@ exports[`Drawer render with onOk 1`] = ` role="dialog" >
-
- -
- Title -
+ + + + +
+ Title
+
+
+ Here is content of Drawer +
+
- Here is content of Drawer -
-
-
- -
-
+ OK + + +
+
+ -
+ + Cancel + +
diff --git a/packages/design/src/form/__tests__/__snapshots__/index.test.tsx.snap b/packages/design/src/form/__tests__/__snapshots__/index.test.tsx.snap index 0a9f79483..d7186a4eb 100644 --- a/packages/design/src/form/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/design/src/form/__tests__/__snapshots__/index.test.tsx.snap @@ -1,92 +1,88 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Drawer Form hideRequiredMark should be priority over ConfigProvider form.requiredMark 1`] = ` -
-
-
- -
+ Name + +
+
-
- -
+
+
+
-
- -
+ Address + +
+
-
- -
+
- -
+
+ `; -exports[`Drawer requiredMark could be changed 1`] = ` +exports[`Form requiredMark could be changed 1`] = `
@@ -118,7 +114,7 @@ exports[`Drawer requiredMark could be changed 1`] = ` > `; -exports[`Drawer requiredMark could be changed by ConfigProvider 1`] = ` -
-
-
- -
+ Name + +
+
-
- -
+
+
+
-
- -
+ Address + +
+
-
- -
+
- -
+
+ `; -exports[`Drawer requiredMark should be optional by default 1`] = ` +exports[`Form requiredMark should be optional by default 1`] = `
@@ -286,7 +278,7 @@ exports[`Drawer requiredMark should be optional by default 1`] = ` > = props => (
); -describe('Drawer', () => { +describe('Form', () => { it('requiredMark should be optional by default', () => { const { container, asFragment } = render(); expect( diff --git a/packages/design/src/list/__tests__/__snapshots__/index.test.tsx.snap b/packages/design/src/list/__tests__/__snapshots__/index.test.tsx.snap index d606abf24..86b4fae07 100644 --- a/packages/design/src/list/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/design/src/list/__tests__/__snapshots__/index.test.tsx.snap @@ -511,7 +511,7 @@ exports[`List render 1`] = ` >
{ onCancel={() => { setOpen(false); }} + bodyStyle={{ + maxHeight: 400, + overflow: 'auto', + }} >
diff --git a/packages/design/src/modal/index.md b/packages/design/src/modal/index.md index 5b7b10876..d2ee09deb 100644 --- a/packages/design/src/modal/index.md +++ b/packages/design/src/modal/index.md @@ -14,7 +14,7 @@ nav: - + diff --git a/packages/design/src/modal/style/index.ts b/packages/design/src/modal/style/index.ts index 1609bc7d0..93f57c780 100644 --- a/packages/design/src/modal/style/index.ts +++ b/packages/design/src/modal/style/index.ts @@ -26,13 +26,6 @@ export const genModalStyle: GenerateStyle = (token: ModalToken): CSS [`${componentCls}-header`]: { marginBottom: marginLG, }, - [`${componentCls}-body`]: { - maxHeight: `calc(100vh - ${top + bottom}px - ${paddingMD * 2}px - ${marginLG * 2}px - ${ - titleHeight + controlHeight - }px)`, - overflowY: 'auto', - borderRadius, - }, [`${componentCls}-footer`]: { marginTop: marginLG, }, diff --git a/packages/design/src/table/__tests__/__snapshots__/index.test.tsx.snap b/packages/design/src/table/__tests__/__snapshots__/index.test.tsx.snap index 502bd9c17..c92f173df 100644 --- a/packages/design/src/table/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/design/src/table/__tests__/__snapshots__/index.test.tsx.snap @@ -1040,7 +1040,7 @@ exports[`Table render 1`] = ` >
> = props => ( +export const TableTest: React.FC> = props => ( ); diff --git a/packages/design/src/table/demo/card-table.tsx b/packages/design/src/table/demo/card-table.tsx new file mode 100644 index 000000000..c7d4b5a34 --- /dev/null +++ b/packages/design/src/table/demo/card-table.tsx @@ -0,0 +1,111 @@ +import React, { useState } from 'react'; +import { Card, Form, Radio, Switch, Table, theme } from '@oceanbase/design'; + +const App: React.FC = () => { + const { token } = theme.useToken(); + + const [hasBorder, setHasBorder] = useState(true); + const [hasTitle, setHasTitle] = useState(true); + const [hasPadding, setHasPadding] = useState(true); + const [selectedRowKeys, setSelectedRowKeys] = useState([]); + + const columns = [ + { + title: '姓名', + dataIndex: 'name', + key: 'name', + }, + { + title: '年龄', + dataIndex: 'age', + key: 'age', + }, + { + title: '住址', + dataIndex: 'address', + key: 'address', + }, + ]; + + const dataSource = []; + for (let i = 1; i < 100; i++) { + dataSource.push({ + key: i, + name: '胡彦斌' + i, + age: 32, + address: `西湖区湖底公园${i}号`, + }); + } + + return ( +
+
+ + { + setHasBorder(value); + }} + /> + + + { + setHasTitle(value); + }} + /> + + + { + setHasPadding(value); + }} + /> + + + +
record.key} + rowSelection={{ + selectedRowKeys: selectedRowKeys, + onChange: (keys: React.Key[]) => { + setSelectedRowKeys(keys); + }, + }} + pagination={{ + pageSize: 5, + }} + /> + + + ); +}; + +export default App; diff --git a/packages/design/src/table/demo/colspan-rowspan.tsx b/packages/design/src/table/demo/colspan-rowspan.tsx new file mode 100644 index 000000000..f043a271d --- /dev/null +++ b/packages/design/src/table/demo/colspan-rowspan.tsx @@ -0,0 +1,118 @@ +import React from 'react'; +import { Table } from '@oceanbase/design'; +import type { ColumnsType } from '@oceanbase/design/es/table'; + +interface DataType { + key: string; + name: string; + age: number; + tel: string; + phone: number; + address: string; +} + +const sharedOnCell = (_: DataType, index: number) => { + if (index === 1) { + return { colSpan: 0 }; + } + + return {}; +}; + +const columns: ColumnsType = [ + { + title: 'RowHead', + dataIndex: 'key', + rowScope: 'row', + }, + { + title: 'Name', + dataIndex: 'name', + render: text => {text}, + onCell: (_, index) => ({ + colSpan: index === 1 ? 5 : 1, + }), + }, + { + title: 'Age', + dataIndex: 'age', + onCell: sharedOnCell, + }, + { + title: 'Home phone', + colSpan: 2, + dataIndex: 'tel', + onCell: (_, index) => { + if (index === 3) { + return { rowSpan: 2 }; + } + // These two are merged into above cell + if (index === 4) { + return { rowSpan: 0 }; + } + if (index === 1) { + return { colSpan: 0 }; + } + + return {}; + }, + }, + { + title: 'Phone', + colSpan: 0, + dataIndex: 'phone', + onCell: sharedOnCell, + }, + { + title: 'Address', + dataIndex: 'address', + onCell: sharedOnCell, + }, +]; + +const data: DataType[] = [ + { + key: '1', + name: 'John Brown', + age: 32, + tel: '0571-22098909', + phone: 18889898989, + address: 'New York No. 1 Lake Park', + }, + { + key: '2', + name: 'Jim Green', + tel: '0571-22098333', + phone: 18889898888, + age: 42, + address: 'London No. 1 Lake Park', + }, + { + key: '3', + name: 'Joe Black', + age: 32, + tel: '0575-22098909', + phone: 18900010002, + address: 'Sydney No. 1 Lake Park', + }, + { + key: '4', + name: 'Jim Red', + age: 18, + tel: '0575-22098909', + phone: 18900010002, + address: 'London No. 2 Lake Park', + }, + { + key: '5', + name: 'Jake White', + age: 18, + tel: '0575-22098909', + phone: 18900010002, + address: 'Dublin No. 2 Lake Park', + }, +]; + +const App: React.FC = () =>
; + +export default App; diff --git a/packages/design/src/table/demo/grouping-columns.tsx b/packages/design/src/table/demo/grouping-columns.tsx new file mode 100644 index 000000000..432018910 --- /dev/null +++ b/packages/design/src/table/demo/grouping-columns.tsx @@ -0,0 +1,125 @@ +import React from 'react'; +import { Table } from '@oceanbase/design'; +import type { ColumnsType } from '@oceanbase/design/es/table'; + +interface DataType { + key: React.Key; + name: string; + age: number; + street: string; + building: string; + number: number; + companyAddress: string; + companyName: string; + gender: string; +} + +const columns: ColumnsType = [ + { + title: 'Name', + dataIndex: 'name', + key: 'name', + width: 120, + fixed: 'left', + filters: [ + { + text: 'Joe', + value: 'Joe', + }, + { + text: 'John', + value: 'John', + }, + ], + onFilter: (value: string, record) => record.name.indexOf(value) === 0, + }, + { + title: 'Other', + children: [ + { + title: 'Age', + dataIndex: 'age', + key: 'age', + width: 150, + sorter: (a, b) => a.age - b.age, + }, + { + title: 'Address', + children: [ + { + title: 'Street', + dataIndex: 'street', + key: 'street', + width: 150, + }, + { + title: 'Block', + children: [ + { + title: 'Building', + dataIndex: 'building', + key: 'building', + width: 100, + }, + { + title: 'Door No.', + dataIndex: 'number', + key: 'number', + width: 100, + }, + ], + }, + ], + }, + ], + }, + { + title: 'Company', + children: [ + { + title: 'Company Address', + dataIndex: 'companyAddress', + key: 'companyAddress', + width: 200, + }, + { + title: 'Company Name', + dataIndex: 'companyName', + key: 'companyName', + }, + ], + }, + { + title: 'Gender', + dataIndex: 'gender', + key: 'gender', + width: 80, + fixed: 'right', + }, +]; + +const data: DataType[] = []; +for (let i = 0; i < 100; i++) { + data.push({ + key: i, + name: 'John Brown', + age: i + 1, + street: 'Lake Park', + building: 'C', + number: 2035, + companyAddress: 'Lake Street 42', + companyName: 'SoftLake Co', + gender: 'M', + }); +} + +const App: React.FC = () => ( +
+); + +export default App; diff --git a/packages/design/src/table/demo/multiple-nesting-tables.tsx b/packages/design/src/table/demo/multiple-nesting-tables.tsx index 50e9841d2..5205669ef 100644 --- a/packages/design/src/table/demo/multiple-nesting-tables.tsx +++ b/packages/design/src/table/demo/multiple-nesting-tables.tsx @@ -1,5 +1,14 @@ import React, { useState } from 'react'; -import { Badge, Button, Dropdown, Space, Table, TableColumnsType } from '@oceanbase/design'; +import { + Badge, + Button, + Dropdown, + Form, + Radio, + Space, + Table, + TableColumnsType, +} from '@oceanbase/design'; import type { SizeType } from '@oceanbase/design/es/config-provider'; import { DownOutlined } from '@oceanbase/icons'; @@ -26,9 +35,9 @@ const items = [ ]; const App: React.FC = () => { - const [selectedRowKeys, setSelectedRowKeys] = useState([]); - const [middleSelectedRowKeys, setMiddleSelectedRowKeys] = useState([]); - const [smallSelectedRowKeys, setSmallSelectedRowKeys] = useState([]); + const [size, setSize] = useState('large'); + const [selectedRowKeys, setSelectedRowKeys] = useState([]); + const expandedRowRender = (size: SizeType) => { const columns: TableColumnsType = [ { title: 'Date', dataIndex: 'date', key: 'date' }, @@ -92,7 +101,7 @@ const App: React.FC = () => { }); } - const toolOptionsRender = (size: any) => { + const toolOptionsRender = (size: SizeType) => { return [ , , @@ -100,64 +109,40 @@ const App: React.FC = () => { ]; }; - const toolSelectedContent = (selectedRowKeys: any, selectedRows: any) => { + const toolSelectedContent = (selectedRowKeys: React.Key[], selectedRows: any[]) => { return
; }; return ( <> + + + { + setSize(e.target.value); + }} + > + large + middle + small + + +
toolOptionsRender('middle')} toolSelectedContent={toolSelectedContent} - rowSelection={{ - selectedRowKeys: selectedRowKeys, - onChange: (keys: React.Key[], rows: any[]) => { - setSelectedRowKeys(keys); - }, - }} - pagination={{ - showTotal: total => `共 ${total} 条`, - }} - /> -
-
expandedRowRender('middle'), - defaultExpandedRowKeys: ['0'], - }} - dataSource={data} - size="middle" - toolOptionsRender={() => toolOptionsRender('small')} - toolSelectedContent={toolSelectedContent} - rowSelection={{ - selectedRowKeys: middleSelectedRowKeys, - onChange: (keys: React.Key[], rows: any[]) => { - setMiddleSelectedRowKeys(keys); - }, - }} - pagination={{ - showTotal: total => `共 ${total} 条`, - }} - /> -
-
expandedRowRender('small'), + expandedRowRender: () => expandedRowRender(size), defaultExpandedRowKeys: ['0'], }} - dataSource={data} - size="small" - toolOptionsRender={() => toolOptionsRender('small')} - toolSelectedContent={toolSelectedContent} rowSelection={{ - selectedRowKeys: smallSelectedRowKeys, - onChange: (keys: React.Key[], rows: any[]) => { - setSmallSelectedRowKeys(keys); + selectedRowKeys: selectedRowKeys, + onChange: (keys: React.Key[]) => { + setSelectedRowKeys(keys); }, }} pagination={{ diff --git a/packages/design/src/table/demo/nesting-tables.tsx b/packages/design/src/table/demo/nesting-tables.tsx index 950fbc46c..6d7e6a6de 100644 --- a/packages/design/src/table/demo/nesting-tables.tsx +++ b/packages/design/src/table/demo/nesting-tables.tsx @@ -1,6 +1,6 @@ -import React from 'react'; +import React, { useState } from 'react'; import type { TableColumnsType } from '@oceanbase/design'; -import { Badge, Dropdown, Space, Table } from '@oceanbase/design'; +import { Badge, Dropdown, Form, Radio, Space, Table } from '@oceanbase/design'; import type { SizeType } from '@oceanbase/design/es/config-provider'; import { DownOutlined } from '@oceanbase/icons'; @@ -27,6 +27,8 @@ const items = [ ]; const App: React.FC = () => { + const [size, setSize] = useState('large'); + const expandedRowRender = (size: SizeType) => { const columns: TableColumnsType = [ { title: 'Date', dataIndex: 'date', key: 'date' }, @@ -92,33 +94,28 @@ const App: React.FC = () => { return ( <> +
+ + { + setSize(e.target.value); + }} + > + large + middle + small + + +
expandedRowRender('large'), - defaultExpandedRowKeys: ['0'], - }} - dataSource={data} - /> -
-
expandedRowRender('middle'), - defaultExpandedRowKeys: ['0'], - }} - dataSource={data} - size="middle" - /> -
-
expandedRowRender('small'), + expandedRowRender: () => expandedRowRender(size), defaultExpandedRowKeys: ['0'], }} dataSource={data} - size="small" /> ); diff --git a/packages/design/src/table/demo/multiple-tables.tsx b/packages/design/src/table/demo/row-selection.tsx similarity index 97% rename from packages/design/src/table/demo/multiple-tables.tsx rename to packages/design/src/table/demo/row-selection.tsx index 7210ea17a..97e733d47 100644 --- a/packages/design/src/table/demo/multiple-tables.tsx +++ b/packages/design/src/table/demo/row-selection.tsx @@ -88,7 +88,7 @@ const App: React.FC = () => { toolSelectedContent={toolSelectedContent} rowSelection={{ selectedRowKeys: selectedRowKeys, - onChange: (keys: React.Key[], rows: any[]) => { + onChange: (keys: React.Key[]) => { setSelectedRowKeys(keys); }, }} diff --git a/packages/design/src/table/demo/rowspan.tsx b/packages/design/src/table/demo/rowspan.tsx new file mode 100644 index 000000000..9f1594772 --- /dev/null +++ b/packages/design/src/table/demo/rowspan.tsx @@ -0,0 +1,78 @@ +import React from 'react'; +import { Table } from '@oceanbase/design'; +import type { ColumnsType } from '@oceanbase/design/es/table'; + +interface DataType { + key: string; + name: string; + age: number; + tel: string; + phone: number; + address: string; +} + +const columns: ColumnsType = [ + { + title: 'Age', + dataIndex: 'age', + onCell: (_, index) => { + return { rowSpan: index % 2 === 0 ? 2 : 0 }; + }, + }, + { + title: 'Name', + dataIndex: 'name', + render: text => {text}, + }, + { + title: 'Home phone', + dataIndex: 'tel', + }, + { + title: 'Phone', + dataIndex: 'phone', + }, + { + title: 'Address', + dataIndex: 'address', + }, +]; + +const data: DataType[] = [ + { + key: '1', + name: 'Jim Red', + age: 18, + tel: '0575-22098909', + phone: 18900010002, + address: 'London No. 2 Lake Park', + }, + { + key: '2', + name: 'Jake White', + age: 18, + tel: '0575-22098909', + phone: 18900010002, + address: 'Dublin No. 2 Lake Park', + }, + { + key: '3', + name: 'John Brown', + age: 32, + tel: '0571-22098909', + phone: 18889898989, + address: 'New York No. 1 Lake Park', + }, + { + key: '4', + name: 'Joe Black', + age: 32, + tel: '0575-22098909', + phone: 18900010002, + address: 'Sydney No. 1 Lake Park', + }, +]; + +const App: React.FC = () =>
; + +export default App; diff --git a/packages/design/src/table/demo/tree-table.tsx b/packages/design/src/table/demo/tree-table.tsx new file mode 100644 index 000000000..7b06b9cad --- /dev/null +++ b/packages/design/src/table/demo/tree-table.tsx @@ -0,0 +1,104 @@ +import React from 'react'; +import { Table } from '@oceanbase/design'; +import type { ColumnsType } from '@oceanbase/design/es/table'; + +interface DataType { + key: React.ReactNode; + name: string; + age: number; + address: string; + children?: DataType[]; +} + +const columns: ColumnsType = [ + { + title: 'Name', + dataIndex: 'name', + key: 'name', + }, + { + title: 'Age', + dataIndex: 'age', + key: 'age', + width: '12%', + }, + { + title: 'Address', + dataIndex: 'address', + width: '30%', + key: 'address', + }, +]; + +const data: DataType[] = [ + { + key: 1, + name: 'John Brown sr.', + age: 60, + address: 'New York No. 1 Lake Park', + children: [ + { + key: 11, + name: 'John Brown', + age: 42, + address: 'New York No. 2 Lake Park', + children: [ + { + key: 111, + name: 'Joe Black', + age: 32, + address: 'Sydney No. 1 Lake Park', + }, + ], + }, + { + key: 12, + name: 'John Brown jr.', + age: 30, + address: 'New York No. 3 Lake Park', + children: [ + { + key: 121, + name: 'Jimmy Brown', + age: 16, + address: 'New York No. 3 Lake Park', + }, + ], + }, + { + key: 13, + name: 'Jim Green sr.', + age: 72, + address: 'London No. 1 Lake Park', + children: [ + { + key: 131, + name: 'Jim Green', + age: 42, + address: 'London No. 2 Lake Park', + children: [ + { + key: 1311, + name: 'Jim Green jr.', + age: 25, + address: 'London No. 3 Lake Park', + }, + { + key: 1312, + name: 'Jimmy Green sr.', + age: 18, + address: 'London No. 4 Lake Park', + }, + ], + }, + ], + }, + ], + }, +]; + +const App: React.FC = () => { + return
; +}; + +export default App; diff --git a/packages/design/src/table/demo/virtual.tsx b/packages/design/src/table/demo/virtual.tsx new file mode 100644 index 000000000..64b5ef81f --- /dev/null +++ b/packages/design/src/table/demo/virtual.tsx @@ -0,0 +1,137 @@ +import React from 'react'; +import { Space, Switch, Table, Typography } from '@oceanbase/design'; +import type { TableProps } from '@oceanbase/design'; + +interface RecordType { + id: number; + firstName: string; + lastName: string; + age: number; + address1: string; + address2: string; + address3: string; +} + +const columns: TableProps['columns'] = [ + { + title: 'ID', + dataIndex: 'id', + width: 100, + fixed: 'left', + }, + { + title: 'FistName', + dataIndex: 'firstName', + width: 120, + }, + { + title: 'LastName', + dataIndex: 'lastName', + width: 120, + }, + { + title: 'Group', + width: 120, + render: (_, record) => `Group ${Math.floor(record.id / 4)}`, + }, + { + title: 'Age', + dataIndex: 'age', + width: 100, + }, + { + title: 'Address 1', + dataIndex: 'address1', + }, + { + title: 'Address 2', + dataIndex: 'address2', + }, + { + title: 'Address 3', + dataIndex: 'address3', + }, + { + title: 'Action', + width: 150, + fixed: 'right', + render: () => ( + + Action1 + Action2 + + ), + }, +]; + +const getData = (count: number) => { + const data: RecordType[] = new Array(count).fill(null).map((_, index) => ({ + id: index, + firstName: `First_${index.toString(16)}`, + lastName: `Last_${index.toString(16)}`, + age: 25 + (index % 10), + address1: `New York No. ${index} Lake Park`, + address2: `London No. ${index} Lake Park`, + address3: `Sydney No. ${index} Lake Park`, + })); + + return data; +}; + +const App = () => { + const [bordered, setBordered] = React.useState(true); + const [expanded, setExpanded] = React.useState(false); + + const data = getData(10000); + + const expandableProps = React.useMemo['expandable']>(() => { + if (!expanded) { + return undefined; + } + return { + columnWidth: 48, + expandedRowRender: record =>

🎉 Expanded {record.address1}

, + }; + }, [expanded]); + + return ( +
+ + + setBordered(!bordered)} + checkedChildren="Bordered" + unCheckedChildren="Bordered" + /> + setExpanded(!expanded)} + checkedChildren="Expandable" + unCheckedChildren="Expandable" + /> + + +
+ + + ); +}; + +export default App; diff --git a/packages/design/src/table/index.md b/packages/design/src/table/index.md index cfae89fb5..f8b20a94a 100644 --- a/packages/design/src/table/index.md +++ b/packages/design/src/table/index.md @@ -18,7 +18,7 @@ nav: - + @@ -26,10 +26,22 @@ nav: + + + + + + + + + + + + ## API | 参数 | 说明 | 类型 | 默认值 | 版本 | diff --git a/packages/design/src/table/index.tsx b/packages/design/src/table/index.tsx index bd18ae928..89a5b0496 100644 --- a/packages/design/src/table/index.tsx +++ b/packages/design/src/table/index.tsx @@ -59,7 +59,7 @@ function Table(props: TableProps, ref: React.Ref) { }, }; - const { getPrefixCls } = useContext(ConfigProvider.ConfigContext); + const { getPrefixCls, table } = useContext(ConfigProvider.ConfigContext); const prefixCls = getPrefixCls('table', customizePrefixCls); const { wrapSSR } = useStyle(prefixCls); const tableCls = classNames( @@ -193,6 +193,7 @@ function Table(props: TableProps, ref: React.Ref) { rowSelection={ rowSelection ? { + columnWidth: table?.selectionColumnWidth, ...rowSelection, onChange: ( selectedRowKeys: React.Key[], diff --git a/packages/design/src/table/style/index.ts b/packages/design/src/table/style/index.ts index f6c763d60..154de4c8e 100644 --- a/packages/design/src/table/style/index.ts +++ b/packages/design/src/table/style/index.ts @@ -25,7 +25,6 @@ export const genTableStyle: GenerateStyle = (token: TableToken): CSS marginXS, marginSM, } = token; - const largeCellPadding = `${paddingSM}px ${padding}px`; return { // 表格通用样式 [`${componentCls}-wrapper ${componentCls}`]: { @@ -80,7 +79,7 @@ export const genTableStyle: GenerateStyle = (token: TableToken): CSS // 除内嵌子表格外，设置其他内嵌元素样式 [`& > *:not(${componentCls}-wrapper)`]: { marginTop: -marginSM, - padding: largeCellPadding, + padding: `${paddingSM}px ${padding}px`, backgroundColor: colorFillQuaternary, borderRadius: borderRadiusLG, }, @@ -126,22 +125,6 @@ export const genTableStyle: GenerateStyle = (token: TableToken): CSS }, }, - // large 表格样式 - [`${componentCls}-wrapper`]: { - [`${componentCls}:not(${componentCls}-middle):not(${componentCls}-small)`]: { - [`${componentCls}-thead > tr`]: { - ['td, th']: { - padding: largeCellPadding, - }, - }, - }, - [`${componentCls}-tbody`]: { - [`tr:not(${componentCls}-measure-row) > td`]: { - padding: largeCellPadding, - }, - }, - }, - // 去掉非展开表格的边框 [`${componentCls}-wrapper:not(${componentCls}-expandable)`]: { [`${componentCls}:not(${componentCls}-bordered)`]: { @@ -171,6 +154,12 @@ export const genTableStyle: GenerateStyle = (token: TableToken): CSS }, }, }, + // Remove pagination borderTop for expandable Table + [`${componentCls}-pagination`]: { + [`&${antCls}-pagination`]: { + borderTop: 'none', + }, + }, }, // 分页器样式 @@ -197,10 +186,10 @@ export const genTableStyle: GenerateStyle = (token: TableToken): CSS }, }, }, + // Remove pagination borderTop for bordered Table [`${componentCls}${componentCls}-bordered`]: { [`&+${componentCls}-pagination`]: { [`&${antCls}-pagination`]: { - // Remove pagination borderTop for bordered Table borderTop: 'none', }, }, diff --git a/packages/design/src/theme/compact.ts b/packages/design/src/theme/compact.ts index 392764f89..073ae790e 100644 --- a/packages/design/src/theme/compact.ts +++ b/packages/design/src/theme/compact.ts @@ -10,6 +10,11 @@ const compactTheme = { InputNumber: { handleVisible: true, }, + Table: { + cellPaddingBlock: 8, + cellPaddingBlockMD: 4, + cellPaddingBlockSM: 0, + }, }, }; diff --git a/packages/design/src/theme/default.ts b/packages/design/src/theme/default.ts index 45501f012..99a2d7e39 100644 --- a/packages/design/src/theme/default.ts +++ b/packages/design/src/theme/default.ts @@ -5,7 +5,7 @@ const defaultTheme: ThemeConfig = { token: { colorPrimaryBg: '#EAF1FF', colorPrimary: '#006AFF', - colorPrimaryBgHover: '#d6e4ff', + colorPrimaryBgHover: '#EAF1FF', colorPrimaryBorder: '#b3ccff', colorPrimaryBorderHover: '#5189FB', colorPrimaryHover: '#5189fb', @@ -77,9 +77,6 @@ const defaultTheme: ThemeConfig = { colorPrimaryActive: '#004CE6', }, components: { - Button: { - borderRadius: 6, - }, Segmented: { itemColor: '#5C6B8A', itemHoverColor: '#132039', @@ -92,6 +89,11 @@ const defaultTheme: ThemeConfig = { InputNumber: { handleVisible: true, }, + Table: { + cellPaddingBlock: 12, + cellPaddingBlockMD: 8, + cellPaddingBlockSM: 4, + }, }, }; diff --git a/packages/design/src/theme/style/compact.less b/packages/design/src/theme/style/compact.less index 9ad2f6207..e4aa3ebd2 100644 --- a/packages/design/src/theme/style/compact.less +++ b/packages/design/src/theme/style/compact.less @@ -322,7 +322,7 @@ @colorBorder: #cdd5e4; @colorBorderSecondary: #e2e8f3; @colorPrimaryBg: #eaf1ff; -@colorPrimaryBgHover: #d6e4ff; +@colorPrimaryBgHover: #eaf1ff; @colorPrimaryBorder: #b3ccff; @colorPrimaryBorderHover: #5189fb; @colorPrimaryHover: #5189fb; @@ -444,7 +444,7 @@ @controlInteractiveSize: 14; @controlItemBgHover: #f8fafe; @controlItemBgActive: #eaf1ff; -@controlItemBgActiveHover: #d6e4ff; +@controlItemBgActiveHover: #eaf1ff; @controlItemBgActiveDisabled: #e2e8f3; @controlTmpOutline: #f8fafe; @controlOutline: rgba(22, 99, 255, 0.09); diff --git a/packages/design/src/theme/style/default.less b/packages/design/src/theme/style/default.less index 7b3f52992..6fbf36b58 100644 --- a/packages/design/src/theme/style/default.less +++ b/packages/design/src/theme/style/default.less @@ -322,7 +322,7 @@ @colorBorder: #cdd5e4; @colorBorderSecondary: #e2e8f3; @colorPrimaryBg: #eaf1ff; -@colorPrimaryBgHover: #d6e4ff; +@colorPrimaryBgHover: #eaf1ff; @colorPrimaryBorder: #b3ccff; @colorPrimaryBorderHover: #5189fb; @colorPrimaryHover: #5189fb; @@ -444,7 +444,7 @@ @controlInteractiveSize: 16; @controlItemBgHover: #f8fafe; @controlItemBgActive: #eaf1ff; -@controlItemBgActiveHover: #d6e4ff; +@controlItemBgActiveHover: #eaf1ff; @controlItemBgActiveDisabled: #e2e8f3; @controlTmpOutline: #f8fafe; @controlOutline: rgba(22, 99, 255, 0.09); diff --git a/packages/design/src/tooltip/demo/mouse-follow.tsx b/packages/design/src/tooltip/demo/mouse-follow.tsx index c0d4d63b0..250c651db 100644 --- a/packages/design/src/tooltip/demo/mouse-follow.tsx +++ b/packages/design/src/tooltip/demo/mouse-follow.tsx @@ -7,7 +7,7 @@ const App: React.FC = () => { return (
- + { diff --git a/packages/design/src/typography/style/index.ts b/packages/design/src/typography/style/index.ts index 0c3c459bb..b8ff9bc11 100644 --- a/packages/design/src/typography/style/index.ts +++ b/packages/design/src/typography/style/index.ts @@ -10,10 +10,14 @@ export const genTypographyStyle: GenerateStyle = ( const { componentCls } = token; return { - [`${componentCls}`]: { - // inherit color and lineHeight from parent instead of fixed colorText + // inherit color and lineHeight from parent instead of fixed colorText + [`span${componentCls}`]: { + lineHeight: 'inherit', color: 'inherit', + }, + [`div${componentCls}`]: { lineHeight: 'inherit', + color: 'inherit', }, }; }; diff --git a/packages/ui/package.json b/packages/ui/package.json index 6ba5ff2a7..7d4e04134 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -1,6 +1,6 @@ { "name": "@oceanbase/ui", - "version": "0.2.35", + "version": "0.2.38", "description": "The UI library based on OceanBase Design", "keywords": [ "oceanbase", diff --git a/packages/ui/src/FooterToolbar/index.tsx b/packages/ui/src/FooterToolbar/index.tsx index f26f2c6bc..4236553b5 100644 --- a/packages/ui/src/FooterToolbar/index.tsx +++ b/packages/ui/src/FooterToolbar/index.tsx @@ -1,7 +1,7 @@ import React, { useContext } from 'react'; import { FooterToolbar as AntFooterToolbar } from '@ant-design/pro-components'; import type { FooterToolbarProps as AntFooterToolbarProps } from '@ant-design/pro-layout/es/components/FooterToolbar'; -import { ConfigProvider } from '@oceanbase/design'; +import { ConfigProvider, theme } from '@oceanbase/design'; import useStyle from './style'; export type FooterToolbarProps = AntFooterToolbarProps; diff --git a/packages/ui/src/FooterToolbar/style/index.ts b/packages/ui/src/FooterToolbar/style/index.ts index f1cc86cb5..96cdd1a67 100644 --- a/packages/ui/src/FooterToolbar/style/index.ts +++ b/packages/ui/src/FooterToolbar/style/index.ts @@ -1,15 +1,143 @@ import type { CSSObject } from '@ant-design/cssinjs'; import type { FooterToolBarToken } from '@ant-design/pro-layout/es/components/FooterToolbar/style'; -import type { GenerateStyle } from '@oceanbase/design/es/theme'; +import type { FullToken, GenerateStyle } from '@oceanbase/design/es/theme'; import { genComponentStyleHook } from '../../_util/genComponentStyleHook'; +export const genCompactStyle = (componentCls: string, subComponentCls: string = ''): CSSObject => { + return { + [`&${componentCls}-compact-item:not(${componentCls}-compact-last-item)${componentCls}-compact-first-item ${subComponentCls}`]: + { + borderStartEndRadius: 0, + borderEndEndRadius: 0, + }, + [`&${componentCls}-compact-item:not(${componentCls}-compact-first-item):not(${componentCls}-compact-last-item) ${subComponentCls}`]: + { + borderRadius: 0, + }, + [`&${componentCls}-compact-item:not(${componentCls}-compact-first-item)${componentCls}-compact-last-item ${subComponentCls}`]: + { + borderStartStartRadius: 0, + borderEndStartRadius: 0, + }, + }; +}; + +export const genOperationStyle = (token: FullToken): CSSObject => { + const { + antCls, + iconCls, + fontSize, + lineWidth, + borderRadiusLG, + controlHeight, + controlHeightSM, + controlHeightLG, + } = token; + const height = controlHeightLG; + const lineHeight = `${controlHeightLG}px`; + + return { + // Button + [`${antCls}-btn`]: { + // limit min width for icon button + minWidth: controlHeightLG, + height, + fontSize, + borderRadius: borderRadiusLG, + // Button in Space.Compact + ...genCompactStyle(`${antCls}-btn`), + }, + // Radio.Button + [`${antCls}-radio-group`]: { + [`${antCls}-radio-button-wrapper`]: { + height, + lineHeight: `${height - lineWidth * 2}px`, + fontSize, + [`&:first-child`]: { + borderStartStartRadius: borderRadiusLG, + borderEndStartRadius: borderRadiusLG, + }, + [`&:last-child`]: { + borderStartEndRadius: borderRadiusLG, + borderEndEndRadius: borderRadiusLG, + }, + }, + }, + // Select + [`${antCls}-select`]: { + height, + fontSize, + // Select in Space.Compact + ...genCompactStyle(`${antCls}-select`, `${antCls}-select-selector`), + [`${antCls}-select-selector`]: { + borderRadius: borderRadiusLG, + }, + [`${antCls}-select-selection-item`]: { + fontSize, + }, + }, + // Input + [`${antCls}-input-wrapper`]: { + fontSize, + [`${iconCls}`]: { + fontSize, + }, + [`${antCls}-input-affix-wrapper`]: { + borderStartEndRadius: 0, + borderEndEndRadius: 0, + }, + }, + [`${antCls}-input-affix-wrapper`]: { + height, + borderRadius: borderRadiusLG, + [`&:not(${antCls}-input-affix-wrapper-lg)`]: { + lineHeight: `${controlHeight - lineWidth * 2}px`, + }, + // avoid to conflict with `${antCls}-input-affix-wrapper` height + [`${antCls}-input`]: { + height: `${controlHeight - lineWidth * 2}px`, + }, + [`${antCls}-input-lg`]: { + height: controlHeightSM, + }, + [`${antCls}-input-sm`]: { + height: `${controlHeightLG - lineWidth * 2}px`, + }, + }, + [`${antCls}-input`]: { + height, + fontSize, + borderRadius: borderRadiusLG, + // Input in Space.Compact + ...genCompactStyle(`${antCls}-input`), + }, + [`${antCls}-input-search-button`]: { + height, + lineHeight, + borderStartEndRadius: borderRadiusLG, + borderEndEndRadius: borderRadiusLG, + }, + [`${antCls}-input-group-addon`]: { + fontSize, + borderStartEndRadius: borderRadiusLG, + borderEndEndRadius: borderRadiusLG, + }, + // set large DatePicker, TimePicker and RangePicker style + [`${antCls}-picker`]: { + height, + borderRadius: borderRadiusLG, + ...genCompactStyle(`${antCls}-picker`), + [`${antCls}-picker-input>input`]: { + fontSize, + }, + }, + }; +}; + export const genFooterToolbarStyle: GenerateStyle = ( token: FooterToolBarToken ): CSSObject => { - const { antCls, componentCls, colorBgBase, borderRadius, boxShadowSecondary, controlHeightLG } = - token; - const height = controlHeightLG; - const lineHeight = `${controlHeightLG}px`; + const { componentCls, colorBgBase, borderRadius, boxShadowSecondary, controlHeightLG } = token; return { [`${componentCls}`]: { @@ -18,15 +146,7 @@ export const genFooterToolbarStyle: GenerateStyle = ( borderRadius: borderRadius, boxShadow: boxShadowSecondary, borderBlockStart: 'none', - // 设置底部操作栏的组件高度 - [`${antCls}-btn:not(${antCls}-input-search-button)`]: { - minWidth: 68, - height, - }, - [`${antCls}-radio-button-wrapper`]: { - height, - lineHeight, - }, + ...genOperationStyle(token), }, }; }; diff --git a/packages/ui/src/Highlight/index.tsx b/packages/ui/src/Highlight/index.tsx index 8a72f4539..2eed0cf02 100644 --- a/packages/ui/src/Highlight/index.tsx +++ b/packages/ui/src/Highlight/index.tsx @@ -160,7 +160,6 @@ const Highlight: React.FC = props => { language, locale, } = props; - const prefixCls = getPrefix('highlight'); const themeClass = theme === THEME_DARK ? `${prefixCls}-dark` : `${prefixCls}-light`; @@ -323,9 +322,7 @@ const HighlightWrapper: HighlightWrapperProps = (props: HighlightProps) => { HighlightWrapper.Diff = DiffView; -// export default HighlightWrapper; - export default LocaleWrapper({ - componentName: 'HighlightWrapper', + componentName: 'Highlight', defaultLocale: zhCN, })(HighlightWrapper); diff --git a/packages/ui/src/PageContainer/__tests__/__snapshots__/index.test.tsx.snap b/packages/ui/src/PageContainer/__tests__/__snapshots__/index.test.tsx.snap new file mode 100644 index 000000000..36eb2bc28 --- /dev/null +++ b/packages/ui/src/PageContainer/__tests__/__snapshots__/index.test.tsx.snap @@ -0,0 +1,1026 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`PageContainer basic 1`] = ` +
+
+ +
+
+ + 页面标题 + + +
+
+ + + +
+
+ +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+
+
+
+
+ + + + + + + + + + + + +
+
+ + 创建人 + + + + 曲丽丽 + + +
+ 		+
+ + 电话号码 + + + + 1810000000 + + +
+ 		+
+ + 地址 + + + + 浙江省杭州市西湖区工专路 + + +
+
+
+ + 关联表单 + + + + + 421421 + + + +
+ 		+
+ + 创建时间 + + + + 2017-01-10 + + +
+ 		+
+ + 备注 + + + + 这是备注 + + +
+
+
+
+
+
+
+
+`; + +exports[`PageContainer extra and footer 1`] = ` +
+
+ +
+
+ + 页面标题 + + +
+
+ + + +
+
+ +
+ +
+
+
+
+ + + + + + +
+
+
+
+
+
+ +
+
+ + + + + +
+
+ +
+
+ + + + + +
+
+
+
+
+ + + + + + +
+
+
+
+ + + + + + + + + + + + + + + + + +
+
+
+
+ + + + + large + +
+ +
+
+
+
+ + + +
+
+
+ +
+
+ +
+
+ +
+
+
+
+
+
+
+ + + + + + + + + + + + + +
+
+ + 创建人 + + + + 曲丽丽 + + +
+ 		+
+ + 电话号码 + + + + 1810000000 + + +
+ 		+
+ + 地址 + + + + 浙江省杭州市西湖区工专路 + + +
+
+
+ + 关联表单 + + + + + 421421 + + + +
+ 		+
+ + 创建时间 + + + + 2017-01-10 + + +
+ 		+
+ + 备注 + + + + 这是备注 + + +
+
+
+
+
+
+
+
+`; diff --git a/packages/ui/src/PageContainer/__tests__/index.test.tsx b/packages/ui/src/PageContainer/__tests__/index.test.tsx new file mode 100644 index 000000000..6d762dcb2 --- /dev/null +++ b/packages/ui/src/PageContainer/__tests__/index.test.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import { render } from '@testing-library/react'; +import BasicDemo from '../demo/basic'; +import ExtraAndFooterDemo from '../demo/extra-footer'; + +describe('PageContainer', () => { + it('basic', () => { + const { asFragment } = render(); + expect(asFragment().firstChild).toMatchSnapshot(); + }); + + it('extra and footer', () => { + const { asFragment } = render(); + expect(asFragment().firstChild).toMatchSnapshot(); + }); +}); diff --git a/packages/ui/src/PageContainer/demo/basic.tsx b/packages/ui/src/PageContainer/demo/basic.tsx index 4289d0689..f60f581a7 100644 --- a/packages/ui/src/PageContainer/demo/basic.tsx +++ b/packages/ui/src/PageContainer/demo/basic.tsx @@ -2,9 +2,9 @@ * iframe: 600 */ import React, { useState } from 'react'; -import { EllipsisOutlined } from '@oceanbase/icons'; -import { Button, Descriptions, Dropdown, Radio, message } from '@oceanbase/design'; +import { Button, Descriptions, Dropdown, message } from '@oceanbase/design'; import { PageContainer } from '@oceanbase/ui'; +import { EllipsisOutlined } from '@oceanbase/icons'; export default () => { const [loading, setLoading] = useState(false); @@ -20,6 +20,7 @@ export default () => { setLoading(false); message.success('刷新成功'); }); + return promise; }; return ( { ], }, extra: [ - - 选项 1 - 选项 2 - , - , - , + , { ], }} > - , diff --git a/packages/ui/src/PageContainer/demo/complete.tsx b/packages/ui/src/PageContainer/demo/complete.tsx index 5f1a542ff..be52c4738 100644 --- a/packages/ui/src/PageContainer/demo/complete.tsx +++ b/packages/ui/src/PageContainer/demo/complete.tsx @@ -1,5 +1,5 @@ import { EllipsisOutlined } from '@oceanbase/icons'; -import { Button, Card, Descriptions, Dropdown, message, Radio, Table } from '@oceanbase/design'; +import { Button, Card, Descriptions, Dropdown, Modal, message, Table } from '@oceanbase/design'; import { PageContainer } from '@oceanbase/ui'; import React, { useState } from 'react'; @@ -17,6 +17,7 @@ export default () => { setLoading(false); message.success('刷新成功'); }); + return promise; }; const dataSource = [ @@ -127,12 +128,24 @@ export default () => { ], }, extra: [ - - 选项 1 - 选项 2 - , - , - , + , { ], }} > - , diff --git a/packages/ui/src/PageContainer/demo/extra-footer.tsx b/packages/ui/src/PageContainer/demo/extra-footer.tsx new file mode 100644 index 000000000..dad2569a2 --- /dev/null +++ b/packages/ui/src/PageContainer/demo/extra-footer.tsx @@ -0,0 +1,172 @@ +/** + * iframe: 600 + */ +import React, { useState } from 'react'; +import { + Button, + DatePicker, + Descriptions, + Dropdown, + Input, + Radio, + Select, + Space, + TimePicker, + message, +} from '@oceanbase/design'; +import { PageContainer, Ranger } from '@oceanbase/ui'; +import { SizeType } from '@oceanbase/design/es/config-provider'; +import { EllipsisOutlined, LikeOutlined, CommentOutlined, StarOutlined } from '@oceanbase/icons'; + +export default () => { + const [loading, setLoading] = useState(false); + const [size, setSize] = useState('large'); + const [inputType, setInputType] = useState('search'); + + const mockRequest = () => { + const promise = new Promise(resolve => { + setTimeout(() => { + resolve(); + }, 1000); + }); + setLoading(true); + promise.then(() => { + setLoading(false); + message.success('刷新成功'); + }); + }; + const InputComponent = inputType === 'search' ? Input.Search : Input; + + return ( + { + mockRequest(); + }, + }, + breadcrumb: { + items: [ + { + href: '', + title: '一级页面', + }, + { + href: '', + title: '二级页面', + }, + { + title: '当前页面', + }, + ], + }, + extra: [ + , + , + , + , + + + , + + + + , + + , + , + ]} + > + + 曲丽丽 + 1810000000 + 浙江省杭州市西湖区工专路 + + 421421 + + 2017-01-10 + 这是备注 + + + ); +}; diff --git a/packages/ui/src/PageContainer/demo/header-less.tsx b/packages/ui/src/PageContainer/demo/header-less.tsx index 3563a36a6..36d3ce898 100644 --- a/packages/ui/src/PageContainer/demo/header-less.tsx +++ b/packages/ui/src/PageContainer/demo/header-less.tsx @@ -84,7 +84,7 @@ export default () => { }, ]; return ( - + { + const [loading, setLoading] = useState(false); + + const mockRequest = () => { + const promise = new Promise(resolve => { + setTimeout(() => { + resolve(); + }, 1000); + }); + setLoading(true); + promise.then(() => { + setLoading(false); + message.success('刷新成功'); + }); + }; + return ( + { + mockRequest(); + }, + }, + breadcrumb: { + items: [ + { + href: '', + title: '一级页面', + }, + { + href: '', + title: '二级页面', + }, + { + title: '当前页面', + }, + ], + }, + extra: [ + , + , + + + , + ], + }} + footer={[, ]} + > + + + ); +}; diff --git a/packages/ui/src/PageContainer/index.md b/packages/ui/src/PageContainer/index.md index f87d79cff..940ff7765 100644 --- a/packages/ui/src/PageContainer/index.md +++ b/packages/ui/src/PageContainer/index.md @@ -13,9 +13,13 @@ nav: ## 代码演示 - + - + + + + + diff --git a/packages/ui/src/PageContainer/style/index.ts b/packages/ui/src/PageContainer/style/index.ts index 6f3223529..567fb9726 100644 --- a/packages/ui/src/PageContainer/style/index.ts +++ b/packages/ui/src/PageContainer/style/index.ts @@ -2,7 +2,7 @@ import type { CSSObject } from '@ant-design/cssinjs'; import type { PageContainerToken } from '@ant-design/pro-layout/es/components/PageContainer/style'; import type { GenerateStyle } from '@oceanbase/design/es/theme'; import { genComponentStyleHook } from '../../_util/genComponentStyleHook'; -import { genFooterToolbarStyle } from '../../FooterToolbar/style'; +import { genOperationStyle, genFooterToolbarStyle } from '../../FooterToolbar/style'; export const genPageContainerStyle: GenerateStyle = ( token: PageContainerToken @@ -12,9 +12,6 @@ export const genPageContainerStyle: GenerateStyle = ( proComponentsCls, componentCls, colorBgLayout, - colorBgBase, - borderRadius, - boxShadowSecondary, fontSizeHeading3, controlHeightLG, padding, @@ -50,18 +47,8 @@ export const genPageContainerStyle: GenerateStyle = ( height, lineHeight, marginBlock: 0, - // 设置页容器右上角的组件高度 - [`${antCls}-btn:not(${antCls}-input-search-button)`]: { - minWidth: controlHeightLG, - height, - }, - [`${antCls}-radio-button-wrapper`]: { - height, - lineHeight, - }, - [`${antCls}-input-wrapper`]: { - lineHeight, - }, + // extra operation style + ...genOperationStyle(token), }, [`${antCls}-page-header-footer`]: { marginBlockStart: 0, @@ -71,6 +58,11 @@ export const genPageContainerStyle: GenerateStyle = ( paddingInline: paddingLG, paddingBlockStart: 0, paddingBlockEnd: paddingLG, + // set top tabs style when it is PageContainer's first child + [`& > ${antCls}-tabs-top:not(${antCls}-tabs-card):first-child`]: { + // equal to page header paddingBlockEnd + marginTop: -padding, + }, }, // remove paddingBlockStart for page header without breadcrumb [`${antCls}-page-header:not(${antCls}-page-header-has-breadcrumb)`]: { diff --git a/packages/ui/src/Password/index.tsx b/packages/ui/src/Password/index.tsx index 0d1ae7d23..17e962eaa 100644 --- a/packages/ui/src/Password/index.tsx +++ b/packages/ui/src/Password/index.tsx @@ -85,21 +85,7 @@ const Password: React.FC = ({ setIsValidating(false); setFieldError(newFieldError); onValidate?.(newFieldError.length === 0); - // 先触发 onValidate，再异步触发 onChange，以便在 antd3 Form 的类组件场景下，校验规则 validator 能获取到最新的 passed 值。 - const startPos = inputRef?.current?.input?.selectionStart; - const endPos = inputRef.current.input.selectionEnd; - setTimeout(() => { - onChange?.(newValue); - }, 0); - /*** - * TODO 快速编辑时会发生焦点移至末尾的问题 - * 解决方案1 去除 onChange 的异步处理 但是会引起antd3 Form 不兼容的问题 - * 解决方案2 手动设置光标位置，由于onChange 异步处理，光标设置需要延后设置 - * */ - setTimeout(() => { - // 设置光标位置 - inputRef.current.setSelectionRange(startPos, endPos, newValue); - }, 3); + onChange?.(newValue); }; // 根据正则表达式获取符合要求的随机密码 diff --git a/packages/ui/src/Ranger/index.less b/packages/ui/src/Ranger/index.less index ccabb44fc..fa3b0195d 100644 --- a/packages/ui/src/Ranger/index.less +++ b/packages/ui/src/Ranger/index.less @@ -42,8 +42,8 @@ margin-right: -1px; .@{prefixCls}-select-selector { - border-top-right-radius: 0; - border-bottom-right-radius: 0; + border-top-right-radius: 0 !important; + border-bottom-right-radius: 0 !important; &:hover { z-index: 1; diff --git a/packages/ui/src/locale/en-US.ts b/packages/ui/src/locale/en-US.ts index bb8de05c0..c9a5e6718 100644 --- a/packages/ui/src/locale/en-US.ts +++ b/packages/ui/src/locale/en-US.ts @@ -6,6 +6,7 @@ import Dialog from '../Dialog/locale/en-US'; import DocDialog from '../DocDialog/locale/en-US'; import FullscreenBox from '../FullscreenBox/locale/en-US'; import GraphToolbar from '../GraphToolbar/locale/en-US'; +import Highlight from '../Highlight/locale/en-US'; import Login from '../Login/locale/en-US'; import PageContainer from '../PageContainer/locale/en-US'; import Password from '../Password/locale/en-US'; @@ -30,6 +31,7 @@ export default { Dialog, SideTip, DocDialog, + Highlight, FullscreenBox, BatchOperationBar, } as Locale; diff --git a/packages/ui/src/locale/zh-TW.ts b/packages/ui/src/locale/zh-TW.ts index 8b65e24b9..53087e5d8 100644 --- a/packages/ui/src/locale/zh-TW.ts +++ b/packages/ui/src/locale/zh-TW.ts @@ -4,6 +4,7 @@ import BatchOperationBar from '../BatchOperationBar/locale/zh-TW'; import Dialog from '../Dialog/locale/zh-TW'; import DocDialog from '../DocDialog/locale/zh-TW'; import GraphToolbar from '../GraphToolbar/locale/zh-TW'; +import Highlight from '../Highlight/locale/zh-TW'; import Login from '../Login/locale/zh-TW'; import PageContainer from '../PageContainer/locale/zh-TW'; import { default as Boundary, default as Password } from '../Password/locale/zh-TW'; @@ -25,6 +26,7 @@ export default { Password, Boundary, Dialog, + Highlight, DocDialog, BatchOperationBar, } as Locale; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4906c3724..fc2f48826 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -62,8 +62,8 @@ importers: specifier: ^8.0.1 version: 8.0.1(@types/react@18.2.47)(react-dom@18.2.0)(react@18.2.0) '@testing-library/user-event': - specifier: ^14.5.1 - version: 14.5.1(@testing-library/dom@9.3.3) + specifier: ^14.5.2 + version: 14.5.2(@testing-library/dom@9.3.3) '@types/jest': specifier: ^29.5.10 version: 29.5.11 @@ -80,20 +80,20 @@ importers: specifier: ^4.0.1 version: 4.0.1(jest@29.7.0)(postcss@8.4.33) '@umijs/test': - specifier: ^4.0.90 - version: 4.0.90(@babel/core@7.23.6) + specifier: ^4.1.0 + version: 4.1.0(@babel/core@7.23.6) '@vercel/analytics': specifier: ^1.1.1 version: 1.1.1 antd: - specifier: ^5.11.2 - version: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + specifier: ^5.13.2 + version: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) antd-style: specifier: 3.5.2 - version: 3.5.2(@types/react@18.2.47)(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + version: 3.5.2(@types/react@18.2.47)(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) antd-token-previewer: specifier: ^2.0.5 - version: 2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.12.5)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) + version: 2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.13.2)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) babel-jest: specifier: ^29.7.0 version: 29.7.0(@babel/core@7.23.6) @@ -111,7 +111,7 @@ importers: version: 1.11.10 dumi: specifier: ^2.2.16 - version: 2.2.16(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.1.1)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0) + version: 2.2.16(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.2.4)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0) eslint-plugin-jest: specifier: ^27.6.1 version: 27.6.1(@typescript-eslint/eslint-plugin@5.62.0)(eslint@8.56.0)(jest@29.7.0)(typescript@5.3.3) @@ -179,8 +179,8 @@ importers: specifier: ^3.0.5 version: 3.0.5 prettier: - specifier: ^3.1.1 - version: 3.1.1 + specifier: ^3.2.4 + version: 3.2.4 prismjs: specifier: ^1.29.0 version: 1.29.0 @@ -245,8 +245,8 @@ importers: specifier: ^5.3.3 version: 5.3.3 vanilla-jsoneditor: - specifier: ^0.21.1 - version: 0.21.1(@lezer/common@1.2.0) + specifier: ^0.21.2 + version: 0.21.2(@lezer/common@1.2.0) web-vitals: specifier: ^3.5.0 version: 3.5.0 @@ -324,8 +324,8 @@ importers: specifier: ^6.0.0 version: 6.0.0(postcss@8.4.33) prettier: - specifier: ^3.1.1 - version: 3.1.1 + specifier: ^3.2.4 + version: 3.2.4 read-pkg-up: specifier: ^10.1.0 version: 10.1.0 @@ -367,8 +367,8 @@ importers: specifier: ^2.10.14 version: 2.10.14(react@18.2.0) antd: - specifier: ^5.11.2 - version: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + specifier: ^5.13.2 + version: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: specifier: ^2.5.1 version: 2.5.1 @@ -402,7 +402,7 @@ importers: version: 7.23.6(@babel/core@7.23.6) antd-token-previewer: specifier: ^2.0.5 - version: 2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.12.5)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) + version: 2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.13.2)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) rc-select: specifier: ^14.10.0 version: 14.10.0(react-dom@18.2.0)(react@18.2.0) @@ -435,10 +435,10 @@ importers: version: 1.18.2(react-dom@18.2.0)(react@18.2.0) '@ant-design/pro-components': specifier: ^2.6.43 - version: 2.6.43(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + version: 2.6.43(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) '@ant-design/pro-layout': specifier: ^7.17.16 - version: 7.17.16(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + version: 7.17.16(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@oceanbase/design': specifier: workspace:^ version: link:../design @@ -777,7 +777,7 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /@ant-design/pro-card@2.5.27(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-card@2.5.27(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-KHsX/VD5jsVKxUU/szFPayD2FhdVQ2lob7BlAG03Pn8GG2F9hEPk3vHM5WWyn0w+11g4XmvTlujeNxFeaQQV6Q==, @@ -787,10 +787,10 @@ packages: react: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 omit.js: 2.0.2 rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) @@ -800,7 +800,7 @@ packages: - react-dom dev: false - /@ant-design/pro-components@2.6.43(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-components@2.6.43(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-l/xy4dRaS3IXU8urq6btyHD+YeRrSgYVW/L0VaeK79Mllk2i4cKVcxPkV2/EcM9tjsnScS1bUFYvtc2RU4qsig==, @@ -810,18 +810,18 @@ packages: react: '>=17.0.0' react-dom: '>=17.0.0' dependencies: - '@ant-design/pro-card': 2.5.27(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-descriptions': 2.5.27(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-field': 2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-form': 2.23.1(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-layout': 7.17.16(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-list': 2.5.42(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-skeleton': 2.1.10(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-table': 3.13.11(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-card': 2.5.27(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-descriptions': 2.5.27(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-field': 2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-form': 2.23.1(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-layout': 7.17.16(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-list': 2.5.42(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-skeleton': 2.1.10(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-table': 3.13.11(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) transitivePeerDependencies: @@ -829,7 +829,7 @@ packages: - rc-field-form dev: false - /@ant-design/pro-descriptions@2.5.27(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-descriptions@2.5.27(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-H1KEtDSPuuie3v8vnE9T2nSuAU9KPBHosUlN4Iyf4jWOBLmOKJ9n0RGmM496wMPPwei2BxVZVl4a9qczTvdGsA==, @@ -838,12 +838,12 @@ packages: antd: ^4.24.15 || ^5.11.2 react: '>=17.0.0' dependencies: - '@ant-design/pro-field': 2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-form': 2.23.1(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-skeleton': 2.1.10(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-field': 2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-form': 2.23.1(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-skeleton': 2.1.10(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) rc-resize-observer: 0.2.6(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 @@ -853,7 +853,7 @@ packages: - react-dom dev: false - /@ant-design/pro-field@2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-field@2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-G4p8hVBA+D2HiscWMPi3eQt/8nyq9Ylqm270LEpxPcFFPXMTKDda/iDI+ZwBktWEd9FjBsfe0iyq6iIheuDXvw==, @@ -863,11 +863,11 @@ packages: react: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@chenshuai2144/sketch-color': 1.0.9(react@18.2.0) - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 dayjs: 1.11.10 lodash.tonumber: 4.0.3 @@ -879,7 +879,7 @@ packages: - react-dom dev: false - /@ant-design/pro-form@2.23.1(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-form@2.23.1(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-ia4obGA/AmjSm74Fg2fyd+4AI1VyM9Dpu6VYiiAvkO8ZxfyhDzAT1V9zHSCzU9M7Pu/G2hw/8bhovwy5waVtFg==, @@ -895,13 +895,13 @@ packages: optional: true dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-field': 2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-field': 2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@chenshuai2144/sketch-color': 1.0.9(react@18.2.0) '@umijs/use-params': 1.0.9(react@18.2.0) - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 dayjs: 1.11.10 lodash.merge: 4.6.2 @@ -913,7 +913,7 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /@ant-design/pro-layout@7.17.16(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-layout@7.17.16(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-nBQbAJEUkGqQNBqT30FcbcNXHepxySj/O7est1+2iXPXeVeyQYLHBJXcdvCrUrMty6ev3loG8K+6L3DXQkJ/5Q==, @@ -924,12 +924,12 @@ packages: react-dom: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@umijs/route-utils': 4.0.1 '@umijs/use-params': 1.0.9(react@18.2.0) - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 lodash.merge: 4.6.2 omit.js: 2.0.2 @@ -942,7 +942,7 @@ packages: warning: 4.0.3 dev: false - /@ant-design/pro-list@2.5.42(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-list@2.5.42(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-wuWQ6+gv9fPY3H6QfXNuaXy+3WjaBvGDIyc3larC3dzkLuuGL6gFZUC3M38srwzXmVHxTEHcGHH4zamraGNFCg==, @@ -953,12 +953,12 @@ packages: react-dom: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-card': 2.5.27(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-field': 2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-table': 3.13.11(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-card': 2.5.27(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-field': 2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-table': 3.13.11(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 dayjs: 1.11.10 rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) @@ -970,7 +970,7 @@ packages: - rc-field-form dev: false - /@ant-design/pro-provider@2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-provider@2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-ZVmzY2cq4nUvgmAlfgyCAaSZYV2l3n/upIQPXPj8sYcT+N/Pt1CeSVkkgW6By3EqokF6apWdIFU7hZMK2rNhrg==, @@ -983,14 +983,14 @@ packages: '@ant-design/cssinjs': 1.18.2(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@ctrl/tinycolor': 3.6.1 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) swr: 2.2.4(react@18.2.0) dev: false - /@ant-design/pro-skeleton@2.1.10(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-skeleton@2.1.10(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-mrT0lqrwdcAKGWsh8CIiPBnVCwQOg8pNNLUeuVg3zpaKxw6lloUgkrqapmYANHLByamsbrmKNXhR9/OdMOerJw==, @@ -1001,12 +1001,12 @@ packages: react-dom: '>=17.0.0' dependencies: '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) dev: false - /@ant-design/pro-table@3.13.11(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-table@3.13.11(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-H8vIApenqscN6zTvtN5SX70WOy9JTCAFwYmQrVHNGQxyrsGZC89AltNdQIw/9JpwOjGYR03icrs7SZAnrmZTag==, @@ -1018,17 +1018,17 @@ packages: react-dom: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-card': 2.5.27(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-field': 2.14.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-form': 2.23.1(antd@5.12.5)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-utils': 2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-card': 2.5.27(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-field': 2.14.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-form': 2.23.1(antd@5.13.2)(rc-field-form@1.41.0)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-utils': 2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@dnd-kit/core': 6.1.0(react-dom@18.2.0)(react@18.2.0) '@dnd-kit/modifiers': 6.0.1(@dnd-kit/core@6.1.0)(react@18.2.0) '@dnd-kit/sortable': 7.0.2(@dnd-kit/core@6.1.0)(react@18.2.0) '@dnd-kit/utilities': 3.2.2(react@18.2.0) - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 dayjs: 1.11.10 omit.js: 2.0.2 @@ -1041,7 +1041,7 @@ packages: - '@types/lodash.merge' dev: false - /@ant-design/pro-utils@2.15.2(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /@ant-design/pro-utils@2.15.2(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-kzMT658CGrQqoihKPlZhbnRioovwMhM59vqqVXuT6A+IuyxJhs5pxN73C6sN2+ZoeYCo/Gewnfn9v1/2vHU2Zg==, @@ -1052,9 +1052,9 @@ packages: react-dom: '>=17.0.0' dependencies: '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) - '@ant-design/pro-provider': 2.13.5(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0) + '@ant-design/pro-provider': 2.13.5(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 dayjs: 1.11.10 lodash.merge: 4.6.2 @@ -6633,7 +6633,7 @@ packages: '@octokit/request-error': 3.0.3 '@octokit/types': 9.3.2 is-plain-object: 5.0.0 - node-fetch: 2.6.7 + node-fetch: 2.7.0 universal-user-agent: 6.0.1 transitivePeerDependencies: - encoding @@ -6749,10 +6749,10 @@ packages: react: 18.2.0 dev: true - /@rc-component/color-picker@1.4.1(react-dom@18.2.0)(react@18.2.0): + /@rc-component/color-picker@1.5.1(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-vh5EWqnsayZa/JwUznqDaPJz39jznx/YDbyBuVJntv735tKXKwEUZZb2jYEldOg+NKWZwtALjGMrNeGBmqFoEw==, + integrity: sha512-onyAFhWKXuG4P162xE+7IgaJkPkwM94XlOYnQuu69XdXWMfxpeFi6tpJBsieIMV7EnyLV5J3lDzdLiFeK0iEBA==, } peerDependencies: react: '>=16.9.0' @@ -6820,10 +6820,10 @@ packages: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - /@rc-component/tour@1.11.1(react-dom@18.2.0)(react@18.2.0): + /@rc-component/tour@1.12.3(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-c9Lw3/oVinj5D64Rsp8aDLOXcgdViE+hq7bj0Qoo8fTuQEh9sSpUw5OZcum943JkjeIE4hLcc5FD4a5ANtMJ4w==, + integrity: sha512-U4mf1FiUxGCwrX4ed8op77Y8VKur+8Y/61ylxtqGbcSoh1EBC7bWd/DkLu0ClTUrKZInqEi1FL7YgFtnT90vHA==, } engines: { node: '>=8.x' } peerDependencies: @@ -7665,10 +7665,10 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: true - /@testing-library/user-event@14.5.1(@testing-library/dom@9.3.3): + /@testing-library/user-event@14.5.2(@testing-library/dom@9.3.3): resolution: { - integrity: sha512-UCcUKrUYGj7ClomOo2SpNVvx4/fkd/2BbIHDCle8A0ax+P3bU7yJwDBDrS6ZwdTMARWTGODX1hEsCcO+7beJjg==, + integrity: sha512-YAh82Wh4TIrxYLmfGcixwD18oIjyC1pFQC2Y01F2lzV2HTMiYrI0nze0FD0ocB//CKS/7jIUgae+adPqxK5yCQ==, } engines: { node: '>=12', npm: '>=6' } peerDependencies: @@ -9033,6 +9033,21 @@ packages: - supports-color dev: true + /@umijs/bundler-utils@4.1.0: + resolution: + { + integrity: sha512-FmZuoTDNdiBbMsxbKYv8PWix1lgn6huv6Y6jpTx/nyUpKYHg92JFluiIKb5vR2OTOJpStcvQRp3DbOMP+4L9fg==, + } + dependencies: + '@umijs/utils': 4.1.0 + esbuild: 0.17.19 + regenerate: 1.4.2 + regenerate-unicode-properties: 10.1.1 + spdy: 4.0.2 + transitivePeerDependencies: + - supports-color + dev: true + /@umijs/bundler-vite@4.0.90(@types/node@20.10.5)(postcss@8.4.33)(sass@1.69.5): resolution: { @@ -9629,6 +9644,25 @@ packages: - supports-color dev: true + /@umijs/test@4.1.0(@babel/core@7.23.6): + resolution: + { + integrity: sha512-GMcK+dQZ8WmRIFgC39+GkY6YssTtqFElpwcBpqgcYumIwJBsKAVKIy8sCAR8FdttZKj8RRY4/nAd8L+l0xZE6A==, + } + dependencies: + '@babel/plugin-transform-modules-commonjs': 7.23.3(@babel/core@7.23.6) + '@jest/types': 27.5.1 + '@umijs/bundler-utils': 4.1.0 + '@umijs/utils': 4.1.0 + babel-jest: 29.7.0(@babel/core@7.23.6) + esbuild: 0.17.19 + identity-obj-proxy: 3.0.0 + isomorphic-unfetch: 4.0.2 + transitivePeerDependencies: + - '@babel/core' + - supports-color + dev: true + /@umijs/ui@3.0.1: resolution: { @@ -9657,6 +9691,16 @@ packages: pino: 7.11.0 dev: true + /@umijs/utils@4.1.0: + resolution: + { + integrity: sha512-rBGosE12ceUXIvBmmkJ6bDoCP8106VzMLnjlR31ZfFgos9L/GT6xW4clBURW7ddXFbZvOkvjsb4rmCbhOwUHYQ==, + } + dependencies: + chokidar: 3.5.3 + pino: 7.11.0 + dev: true + /@umijs/zod2ts@4.0.90: resolution: { @@ -10341,7 +10385,7 @@ packages: } engines: { node: '>=12' } - /antd-style@3.5.2(@types/react@18.2.47)(antd@5.12.5)(react-dom@18.2.0)(react@18.2.0): + /antd-style@3.5.2(@types/react@18.2.47)(antd@5.13.2)(react-dom@18.2.0)(react@18.2.0): resolution: { integrity: sha512-DnISjaD4M37wbKvMVkkx4XetCOvTnmTrmSgETQADzQPRn9PNb0FuLE6djS9SFJgjR9XqNIytn0ano0UBgwgpvA==, @@ -10358,7 +10402,7 @@ packages: '@emotion/serialize': 1.1.3 '@emotion/server': 11.11.0(@emotion/css@11.11.2) '@emotion/utils': 1.2.1 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 use-merge-value: 1.2.0(react@18.2.0) transitivePeerDependencies: @@ -10366,7 +10410,7 @@ packages: - react-dom dev: true - /antd-token-previewer@2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.12.5)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): + /antd-token-previewer@2.0.5(@babel/core@7.23.6)(@types/react@18.2.47)(antd@5.13.2)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0): resolution: { integrity: sha512-AIxkqI6nd1VJSNsd77tp1UhBQ0K0YdRcWan6E2aG9RTvapZf8hhwcDL/YVJaPaS/4V3iFeOtD2z12BMseemshg==, @@ -10382,7 +10426,7 @@ packages: '@arvinxu/layout-kit': 1.4.0(@babel/core@7.23.6)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0) '@babel/runtime': 7.23.6 '@ctrl/tinycolor': 3.6.1 - antd: 5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) + antd: 5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 @@ -10454,10 +10498,10 @@ packages: scroll-into-view-if-needed: 2.2.31 dev: false - /antd@5.12.5(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0): + /antd@5.13.2(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-m9r9VhTmANS4kdBwHcxI4QWIGoZh3LspXNb2SxoezRSUZ9RUFpf+gO0AjPx8EPeO/nLKsHAoCSLza9r041bAgw==, + integrity: sha512-P+N8gc0NOPy2WqJj/57Ey3dZUmb7nEUwAM+CIJaR5SOEjZnhEtMGRJSt+3lnhJ3MNRR39aR6NYkRVp2mYfphiA==, } peerDependencies: react: '>=16.9.0' @@ -10467,47 +10511,46 @@ packages: '@ant-design/cssinjs': 1.18.2(react-dom@18.2.0)(react@18.2.0) '@ant-design/icons': 5.2.6(react-dom@18.2.0)(react@18.2.0) '@ant-design/react-slick': 1.0.2(react@18.2.0) - '@babel/runtime': 7.23.6 '@ctrl/tinycolor': 3.6.1 - '@rc-component/color-picker': 1.4.1(react-dom@18.2.0)(react@18.2.0) + '@rc-component/color-picker': 1.5.1(react-dom@18.2.0)(react@18.2.0) '@rc-component/mutate-observer': 1.1.0(react-dom@18.2.0)(react@18.2.0) - '@rc-component/tour': 1.11.1(react-dom@18.2.0)(react@18.2.0) + '@rc-component/tour': 1.12.3(react-dom@18.2.0)(react@18.2.0) '@rc-component/trigger': 1.18.2(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 copy-to-clipboard: 3.3.3 dayjs: 1.11.10 qrcode.react: 3.1.0(react@18.2.0) - rc-cascader: 3.20.0(react-dom@18.2.0)(react@18.2.0) + rc-cascader: 3.21.2(react-dom@18.2.0)(react@18.2.0) rc-checkbox: 3.1.0(react-dom@18.2.0)(react@18.2.0) rc-collapse: 3.7.2(react-dom@18.2.0)(react@18.2.0) rc-dialog: 9.3.4(react-dom@18.2.0)(react@18.2.0) - rc-drawer: 6.5.2(react-dom@18.2.0)(react@18.2.0) + rc-drawer: 7.0.0(react-dom@18.2.0)(react@18.2.0) rc-dropdown: 4.1.0(react-dom@18.2.0)(react@18.2.0) rc-field-form: 1.41.0(react-dom@18.2.0)(react@18.2.0) rc-image: 7.5.1(react-dom@18.2.0)(react@18.2.0) - rc-input: 1.3.11(react-dom@18.2.0)(react@18.2.0) - rc-input-number: 8.4.0(react-dom@18.2.0)(react@18.2.0) - rc-mentions: 2.9.1(react-dom@18.2.0)(react@18.2.0) + rc-input: 1.4.3(react-dom@18.2.0)(react@18.2.0) + rc-input-number: 8.6.1(react-dom@18.2.0)(react@18.2.0) + rc-mentions: 2.10.1(react-dom@18.2.0)(react@18.2.0) rc-menu: 9.12.4(react-dom@18.2.0)(react@18.2.0) rc-motion: 2.9.0(react-dom@18.2.0)(react@18.2.0) rc-notification: 5.3.0(react-dom@18.2.0)(react@18.2.0) - rc-pagination: 4.0.3(react-dom@18.2.0)(react@18.2.0) + rc-pagination: 4.0.4(react-dom@18.2.0)(react@18.2.0) rc-picker: 3.14.6(dayjs@1.11.10)(moment@2.30.1)(react-dom@18.2.0)(react@18.2.0) rc-progress: 3.5.1(react-dom@18.2.0)(react@18.2.0) rc-rate: 2.12.0(react-dom@18.2.0)(react@18.2.0) rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) rc-segmented: 2.2.2(react-dom@18.2.0)(react@18.2.0) - rc-select: 14.10.0(react-dom@18.2.0)(react@18.2.0) + rc-select: 14.11.0(react-dom@18.2.0)(react@18.2.0) rc-slider: 10.5.0(react-dom@18.2.0)(react@18.2.0) rc-steps: 6.0.1(react-dom@18.2.0)(react@18.2.0) rc-switch: 4.1.0(react-dom@18.2.0)(react@18.2.0) - rc-table: 7.36.1(react-dom@18.2.0)(react@18.2.0) - rc-tabs: 12.14.1(react-dom@18.2.0)(react@18.2.0) - rc-textarea: 1.5.3(react-dom@18.2.0)(react@18.2.0) + rc-table: 7.37.0(react-dom@18.2.0)(react@18.2.0) + rc-tabs: 14.0.0(react-dom@18.2.0)(react@18.2.0) + rc-textarea: 1.6.3(react-dom@18.2.0)(react@18.2.0) rc-tooltip: 6.1.3(react-dom@18.2.0)(react@18.2.0) rc-tree: 5.8.2(react-dom@18.2.0)(react@18.2.0) - rc-tree-select: 5.15.0(react-dom@18.2.0)(react@18.2.0) - rc-upload: 4.3.6(react-dom@18.2.0)(react@18.2.0) + rc-tree-select: 5.17.0(react-dom@18.2.0)(react@18.2.0) + rc-upload: 4.5.2(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -14664,7 +14707,7 @@ packages: } dev: true - /dumi@2.2.16(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.1.1)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0): + /dumi@2.2.16(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.2.4)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0): resolution: { integrity: sha512-r2x/CY0fR8/YZOwEnG4JsLEpn8jOg94Qyd1u+7pRD9SCx7dF9It+GwkGbdNEsyenGsO/ZU9wD+Kz7KO+HU7/EA==, @@ -14731,7 +14774,7 @@ packages: remark-rehype: 10.1.0 sass: 1.69.5 sitemap: 7.1.1 - umi: 4.0.90(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.1.1)(react-dom@18.2.0)(react@18.2.0)(sass@1.69.5)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0) + umi: 4.0.90(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.2.4)(react-dom@18.2.0)(react@18.2.0)(sass@1.69.5)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0) unified: 10.1.2 unist-util-visit: 4.1.2 unist-util-visit-parents: 5.1.3 @@ -21288,10 +21331,10 @@ packages: engines: { '0': node >= 0.2.0 } dev: true - /jsonrepair@3.5.0: + /jsonrepair@3.5.1: resolution: { - integrity: sha512-SavvDsUP9Xnqo2MoC6Wl6zNyX3f+I5199hRbXBtAITyP2NTPyAgyx5xM0bgcIljRjzsIvOBANbgfWe8XXlyeLA==, + integrity: sha512-F0VxiEj1j7m1OAVUVy6fFYk5s8tthF61J7tjYtEACw1DeNQqKmZF6dPddduxc7Tc5IrLqKTdLAwUNTmrqqg+hw==, } hasBin: true dev: true @@ -26697,7 +26740,7 @@ packages: typescript: 5.3.3 dev: true - /prettier-plugin-organize-imports@3.2.4(prettier@3.1.1)(typescript@5.3.3): + /prettier-plugin-organize-imports@3.2.4(prettier@3.2.4)(typescript@5.3.3): resolution: { integrity: sha512-6m8WBhIp0dfwu0SkgfOxJqh+HpdyfqSSLfKKRZSFbDuEQXDDndb8fTpRWkUrX/uBenkex3MgnVk0J3b3Y5byog==, @@ -26713,7 +26756,7 @@ packages: '@volar/vue-typescript': optional: true dependencies: - prettier: 3.1.1 + prettier: 3.2.4 typescript: 5.3.3 dev: true @@ -26732,7 +26775,7 @@ packages: sort-package-json: 1.57.0 dev: true - /prettier-plugin-packagejson@2.4.3(prettier@3.1.1): + /prettier-plugin-packagejson@2.4.3(prettier@3.2.4): resolution: { integrity: sha512-kPeeviJiwy0BgOSk7No8NmzzXfW4R9FYWni6ziA5zc1kGVVrKnBzMZdu2TUhI+I7h8/5Htt3vARYOk7KKJTTNQ==, @@ -26743,7 +26786,7 @@ packages: prettier: optional: true dependencies: - prettier: 3.1.1 + prettier: 3.2.4 sort-package-json: 2.4.1 synckit: 0.8.5 dev: true @@ -26771,10 +26814,10 @@ packages: hasBin: true dev: true - /prettier@3.1.1: + /prettier@3.2.4: resolution: { - integrity: sha512-22UbSzg8luF4UuZtzgiUOfcGM8s4tjBv6dJRT7j275NXsy2jb4aJa4NNveul5x4eqlF1wuhuR2RElK71RvmVaw==, + integrity: sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==, } engines: { node: '>=14' } hasBin: true @@ -27344,10 +27387,10 @@ packages: resize-observer-polyfill: 1.5.1 dev: false - /rc-cascader@3.20.0(react-dom@18.2.0)(react@18.2.0): + /rc-cascader@3.21.2(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-lkT9EEwOcYdjZ/jvhLoXGzprK1sijT3/Tp4BLxQQcHDZkkOzzwYQC9HgmKoJz0K7CukMfgvO9KqHeBdgE+pELw==, + integrity: sha512-J7GozpgsLaOtzfIHFJFuh4oFY0ePb1w10twqK6is3pAkqHkca/PsokbDr822KIRZ8/CK8CqevxohuPDVZ1RO/A==, } peerDependencies: react: '>=16.9.0' @@ -27356,7 +27399,7 @@ packages: '@babel/runtime': 7.23.6 array-tree-filter: 2.1.0 classnames: 2.5.1 - rc-select: 14.10.0(react-dom@18.2.0)(react@18.2.0) + rc-select: 14.11.0(react-dom@18.2.0)(react@18.2.0) rc-tree: 5.8.2(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 @@ -27499,23 +27542,6 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /rc-drawer@6.5.2(react-dom@18.2.0)(react@18.2.0): - resolution: - { - integrity: sha512-QckxAnQNdhh4vtmKN0ZwDf3iakO83W9eZcSKWYYTDv4qcD2fHhRAZJJ/OE6v2ZlQ2kSqCJX5gYssF4HJFvsEPQ==, - } - peerDependencies: - react: '>=16.9.0' - react-dom: '>=16.9.0' - dependencies: - '@babel/runtime': 7.23.6 - '@rc-component/portal': 1.1.2(react-dom@18.2.0)(react@18.2.0) - classnames: 2.5.1 - rc-motion: 2.9.0(react-dom@18.2.0)(react@18.2.0) - rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) - react: 18.2.0 - react-dom: 18.2.0(react@18.2.0) - /rc-drawer@7.0.0(react-dom@18.2.0)(react@18.2.0): resolution: { @@ -27532,7 +27558,6 @@ packages: rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - dev: true /rc-dropdown@3.6.2(react-dom@18.2.0)(react@18.2.0): resolution: @@ -27685,10 +27710,10 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /rc-input-number@8.4.0(react-dom@18.2.0)(react@18.2.0): + /rc-input-number@8.6.1(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-B6rziPOLRmeP7kcS5qbdC5hXvvDHYKV4vUxmahevYx2E6crS2bRi0xLDjhJ0E1HtOWo8rTmaE2EBJAkTCZOLdA==, + integrity: sha512-gaAMUKtUKLktJ3Yx93tjgYY1M0HunnoqzPEqkb9//Ydup4DcG0TFL9yHBA3pgVdNIt5f0UWyHCgFBj//JxeD6A==, } peerDependencies: react: '>=16.9.0' @@ -27697,7 +27722,7 @@ packages: '@babel/runtime': 7.23.6 '@rc-component/mini-decimal': 1.1.0 classnames: 2.5.1 - rc-input: 1.3.11(react-dom@18.2.0)(react@18.2.0) + rc-input: 1.4.3(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -27718,10 +27743,10 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /rc-input@1.3.11(react-dom@18.2.0)(react@18.2.0): + /rc-input@1.4.3(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-jhH7QP5rILanSHCGSUkdoFE5DEtpv8FIseYhuYkOZzUBeiVAiwM3q26YqZ6xBB0QFEZ/yUAgms4xW4iuub3xFQ==, + integrity: sha512-aHyQUAIRmTlOnvk5EcNqEpJ+XMtfMpYRAJayIlJfsvvH9cAKUWboh4egm23vgMA7E+c/qm4BZcnrDcA960GC1w==, } peerDependencies: react: '>=16.0.0' @@ -27752,10 +27777,10 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /rc-mentions@2.9.1(react-dom@18.2.0)(react@18.2.0): + /rc-mentions@2.10.1(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-cZuElWr/5Ws0PXx1uxobxfYh4mqUw2FitfabR62YnWgm+WAfDyXZXqZg5DxXW+M1cgVvntrQgDDd9LrihrXzew==, + integrity: sha512-72qsEcr/7su+a07ndJ1j8rI9n0Ka/ngWOLYnWMMv0p2mi/5zPwPrEDTt6Uqpe8FWjWhueDJx/vzunL6IdKDYMg==, } peerDependencies: react: '>=16.9.0' @@ -27764,9 +27789,9 @@ packages: '@babel/runtime': 7.23.6 '@rc-component/trigger': 1.18.2(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 - rc-input: 1.3.11(react-dom@18.2.0)(react@18.2.0) + rc-input: 1.4.3(react-dom@18.2.0)(react@18.2.0) rc-menu: 9.12.4(react-dom@18.2.0)(react@18.2.0) - rc-textarea: 1.5.3(react-dom@18.2.0)(react@18.2.0) + rc-textarea: 1.6.3(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -27889,10 +27914,10 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /rc-pagination@4.0.3(react-dom@18.2.0)(react@18.2.0): + /rc-pagination@4.0.4(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-s1MNwyU83AgycikYckRdpmkN+4ZZuul0E0YdDp7dMgcjg/d2fak767ZIbLP4Q5YPPla7NDorfVFTvGQAPj6jXA==, + integrity: sha512-GGrLT4NgG6wgJpT/hHIpL9nELv27A1XbSZzECIuQBQTVSf4xGKxWr6I/jhpRPauYEWEbWVw22ObG6tJQqwJqWQ==, } peerDependencies: react: '>=16.9.0' @@ -28128,6 +28153,27 @@ packages: rc-virtual-list: 3.11.3(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) + dev: true + + /rc-select@14.11.0(react-dom@18.2.0)(react@18.2.0): + resolution: + { + integrity: sha512-8J8G/7duaGjFiTXCBLWfh5P+KDWyA3KTlZDfV3xj/asMPqB2cmxfM+lH50wRiPIRsCQ6EbkCFBccPuaje3DHIg==, + } + engines: { node: '>=8.x' } + peerDependencies: + react: '*' + react-dom: '*' + dependencies: + '@babel/runtime': 7.23.6 + '@rc-component/trigger': 1.18.2(react-dom@18.2.0)(react@18.2.0) + classnames: 2.5.1 + rc-motion: 2.9.0(react-dom@18.2.0)(react@18.2.0) + rc-overflow: 1.3.2(react-dom@18.2.0)(react@18.2.0) + rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) + rc-virtual-list: 3.11.3(react-dom@18.2.0)(react@18.2.0) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) /rc-slider@10.0.1(react-dom@18.2.0)(react@18.2.0): resolution: @@ -28264,11 +28310,12 @@ packages: rc-virtual-list: 3.11.3(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) + dev: true - /rc-tabs@12.14.1(react-dom@18.2.0)(react@18.2.0): + /rc-table@7.37.0(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-1xlE7JQNYxD5RwBsM7jf2xSdUrkmTSDFLFEm2gqAgnsRlOGydEzXXNAVTOT6QcgM1G/gCm+AgG+FYPUGb4Hs4g==, + integrity: sha512-hEB17ktLRVfVmdo+U8MjGr+PuIgdQ8Cxj/N5lwMvP/Az7TOrQxwTMLVEDoj207tyPYLTWifHIF9EJREWwyk67g==, } engines: { node: '>=8.x' } peerDependencies: @@ -28276,12 +28323,11 @@ packages: react-dom: '>=16.9.0' dependencies: '@babel/runtime': 7.23.6 + '@rc-component/context': 1.4.0(react-dom@18.2.0)(react@18.2.0) classnames: 2.5.1 - rc-dropdown: 4.1.0(react-dom@18.2.0)(react@18.2.0) - rc-menu: 9.12.4(react-dom@18.2.0)(react@18.2.0) - rc-motion: 2.9.0(react-dom@18.2.0)(react@18.2.0) rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) + rc-virtual-list: 3.11.3(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -28327,6 +28373,26 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false + /rc-tabs@14.0.0(react-dom@18.2.0)(react@18.2.0): + resolution: + { + integrity: sha512-lp1YWkaPnjlyhOZCPrAWxK6/P6nMGX/BAZcAC3nuVwKz0Byfp+vNnQKK8BRCP2g/fzu+SeB5dm9aUigRu3tRkQ==, + } + engines: { node: '>=8.x' } + peerDependencies: + react: '>=16.9.0' + react-dom: '>=16.9.0' + dependencies: + '@babel/runtime': 7.23.6 + classnames: 2.5.1 + rc-dropdown: 4.1.0(react-dom@18.2.0)(react@18.2.0) + rc-menu: 9.12.4(react-dom@18.2.0)(react@18.2.0) + rc-motion: 2.9.0(react-dom@18.2.0)(react@18.2.0) + rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) + rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + /rc-textarea@0.4.7(react-dom@18.2.0)(react@18.2.0): resolution: { @@ -28345,10 +28411,10 @@ packages: shallowequal: 1.1.0 dev: false - /rc-textarea@1.5.3(react-dom@18.2.0)(react@18.2.0): + /rc-textarea@1.6.3(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-oH682ghHx++stFNYrosPRBfwsypywrTXpaD0/5Z8MPkUOnyOQUaY9ueL9tMu6BP1LfsuYQ1VLpg5OtshViLNgA==, + integrity: sha512-8k7+8Y2GJ/cQLiClFMg8kUXOOdvcFQrnGeSchOvI2ZMIVvX5a3zQpLxoODL0HTrvU63fPkRmMuqaEcOF9dQemA==, } peerDependencies: react: '>=16.9.0' @@ -28356,7 +28422,7 @@ packages: dependencies: '@babel/runtime': 7.23.6 classnames: 2.5.1 - rc-input: 1.3.11(react-dom@18.2.0)(react@18.2.0) + rc-input: 1.4.3(react-dom@18.2.0)(react@18.2.0) rc-resize-observer: 1.4.0(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 @@ -28393,10 +28459,10 @@ packages: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - /rc-tree-select@5.15.0(react-dom@18.2.0)(react@18.2.0): + /rc-tree-select@5.17.0(react-dom@18.2.0)(react@18.2.0): resolution: { - integrity: sha512-YJHfdO6azFnR0/JuNBZLDptGE4/RGfVeHAafUIYcm2T3RBkL1O8aVqiHvwIyLzdK59ry0NLrByd+3TkfpRM+9Q==, + integrity: sha512-7sRGafswBhf7n6IuHyCEFCildwQIgyKiV8zfYyUoWfZEFdhuk7lCH+DN0aHt+oJrdiY9+6Io/LDXloGe01O8XQ==, } peerDependencies: react: '*' @@ -28404,7 +28470,7 @@ packages: dependencies: '@babel/runtime': 7.23.6 classnames: 2.5.1 - rc-select: 14.10.0(react-dom@18.2.0)(react@18.2.0) + rc-select: 14.11.0(react-dom@18.2.0)(react@18.2.0) rc-tree: 5.8.2(react-dom@18.2.0)(react@18.2.0) rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 @@ -28498,6 +28564,22 @@ packages: rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) + dev: false + + /rc-upload@4.5.2(react-dom@18.2.0)(react@18.2.0): + resolution: + { + integrity: sha512-QO3ne77DwnAPKFn0bA5qJM81QBjQi0e0NHdkvpFyY73Bea2NfITiotqJqVjHgeYPOJu5lLVR32TNGP084aSoXA==, + } + peerDependencies: + react: '>=16.9.0' + react-dom: '>=16.9.0' + dependencies: + '@babel/runtime': 7.23.6 + classnames: 2.5.1 + rc-util: 5.38.1(react-dom@18.2.0)(react@18.2.0) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) /rc-util@4.21.1: resolution: @@ -30281,6 +30363,19 @@ packages: source-map-js: 1.0.2 dev: true + /sass@1.69.7: + resolution: + { + integrity: sha512-rzj2soDeZ8wtE2egyLXgOOHQvaC2iosZrkF6v3EUG+tBwEvhqUCzm0VP3k9gHF9LXbSrRhT5SksoI56Iw8NPnQ==, + } + engines: { node: '>=14.0.0' } + hasBin: true + dependencies: + chokidar: 3.5.3 + immutable: 4.3.4 + source-map-js: 1.0.2 + dev: true + /sax@1.2.4: resolution: { @@ -33384,7 +33479,7 @@ packages: dev: false optional: true - /umi@4.0.90(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.1.1)(react-dom@18.2.0)(react@18.2.0)(sass@1.69.5)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0): + /umi@4.0.90(@babel/core@7.23.6)(@types/node@20.10.5)(@types/react@18.2.47)(eslint@8.56.0)(jest@29.7.0)(prettier@3.2.4)(react-dom@18.2.0)(react@18.2.0)(sass@1.69.5)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0): resolution: { integrity: sha512-jgTiJv4fnHTC2a1hwM+dXmkyKoaZaDTqiJv2w4welDJUfpP+uyhR0zcDXwLuu9KTaUUlGxbIW0fGAeM//fxZ+Q==, @@ -33402,8 +33497,8 @@ packages: '@umijs/server': 4.0.90 '@umijs/test': 4.0.90(@babel/core@7.23.6) '@umijs/utils': 4.0.90 - prettier-plugin-organize-imports: 3.2.4(prettier@3.1.1)(typescript@5.3.3) - prettier-plugin-packagejson: 2.4.3(prettier@3.1.1) + prettier-plugin-organize-imports: 3.2.4(prettier@3.2.4)(typescript@5.3.3) + prettier-plugin-packagejson: 2.4.3(prettier@3.2.4) transitivePeerDependencies: - '@babel/core' - '@types/node' @@ -34146,10 +34241,10 @@ packages: } dev: true - /vanilla-jsoneditor@0.21.1(@lezer/common@1.2.0): + /vanilla-jsoneditor@0.21.2(@lezer/common@1.2.0): resolution: { - integrity: sha512-+bWUtsPk5TAJSao6y+zCqDFVviZyvyFHLmw82kriS3iabh/DX27Ws0GcEzK9eW98cXfKxi/N3ppBKZGimhW4RA==, + integrity: sha512-9zHg0h2Ns+8zn8qSfe8WuhsggDHjrXgNn4GdKwMMCWCKxCZTPAiKHnBSE1Gu/pqNhUb8uJxGbXbxRywUy90XKg==, } dependencies: '@codemirror/autocomplete': 6.11.1(@codemirror/language@6.10.0)(@codemirror/state@6.4.0)(@codemirror/view@6.23.0)(@lezer/common@1.2.0) @@ -34162,6 +34257,7 @@ packages: '@codemirror/view': 6.23.0 '@fortawesome/free-regular-svg-icons': 6.5.1 '@fortawesome/free-solid-svg-icons': 6.5.1 + '@lezer/highlight': 1.2.0 '@replit/codemirror-indentation-markers': 6.5.0(@codemirror/language@6.10.0)(@codemirror/state@6.4.0)(@codemirror/view@6.23.0) ajv: 8.12.0 codemirror-wrapped-line-indent: 1.0.0(@codemirror/language@6.10.0)(@codemirror/state@6.4.0)(@codemirror/view@6.23.0) @@ -34169,11 +34265,11 @@ packages: immutable-json-patch: 6.0.0 jmespath: 0.16.0 json-source-map: 0.6.1 - jsonrepair: 3.5.0 + jsonrepair: 3.5.1 lodash-es: 4.17.21 memoize-one: 6.0.0 natural-compare-lite: 1.4.0 - sass: 1.69.5 + sass: 1.69.7 svelte: 4.2.8 vanilla-picker: 2.12.2 transitivePeerDependencies: