@tidbcloud/uikit 2.0.0-beta.92 → 2.0.0-beta.93
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/dist/biz/PageShell/index.cjs +27 -8
- package/dist/biz/PageShell/index.d.cts +0 -1
- package/dist/biz/PageShell/index.d.ts +0 -1
- package/dist/biz/PageShell/index.js +27 -8
- package/dist/biz/index.cjs +0 -1
- package/dist/biz/index.js +1 -2
- package/dist/theme/theme.cjs +4 -4
- package/dist/theme/theme.js +4 -4
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @tidbcloud/uikit
|
|
2
2
|
|
|
3
|
+
## 2.0.0-beta.93
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- feat(theme): enhance disabled state handling for buttons ( ([#350](https://github.com/tidbcloud/tidbcloud-uikit/pull/350)))
|
|
8
|
+
- feat(changelog): enhance changelog generation with pull request links ( ([#349](https://github.com/tidbcloud/tidbcloud-uikit/pull/349)))
|
|
9
|
+
- chore: update package configuration and add custom changelog generation scripts ( ([#348](https://github.com/tidbcloud/tidbcloud-uikit/pull/348)))
|
|
10
|
+
- refactor(PageShell): enhance Box component usage with clsx and mergeS… ( ([#347](https://github.com/tidbcloud/tidbcloud-uikit/pull/347)))
|
|
11
|
+
|
|
3
12
|
## 2.0.0-beta.92
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -9,23 +9,27 @@ const index$1 = require("../../icons/index.cjs");
|
|
|
9
9
|
;/* empty css */
|
|
10
10
|
;/* empty css */
|
|
11
11
|
const index = require("../../primitive/Typography/index.cjs");
|
|
12
|
-
require("clsx");
|
|
12
|
+
const clsx = require("clsx");
|
|
13
13
|
const styles = require("../../utils/styles.cjs");
|
|
14
|
-
const Group = require("../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/Group/Group.cjs");
|
|
15
14
|
const Box = require("../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/core/Box/Box.cjs");
|
|
15
|
+
const Group = require("../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/Group/Group.cjs");
|
|
16
16
|
const ActionIcon = require("../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/ActionIcon/ActionIcon.cjs");
|
|
17
17
|
const PageHeader = ({ sticky, leftSection, rightSection, children, ...restProps }) => {
|
|
18
18
|
const rightExisted = !!rightSection;
|
|
19
19
|
return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
|
|
20
20
|
Group.Group,
|
|
21
21
|
{
|
|
22
|
+
...restProps,
|
|
23
|
+
className: clsx.clsx(restProps == null ? void 0 : restProps.className, "pageshell-header"),
|
|
22
24
|
wrap: "nowrap",
|
|
23
25
|
justify: "space-between",
|
|
24
26
|
gap: "xl",
|
|
25
|
-
h: 56,
|
|
26
|
-
px: 24,
|
|
27
|
-
...restProps,
|
|
28
27
|
sx: styles.mergeSxList([
|
|
28
|
+
{
|
|
29
|
+
paddingLeft: 24,
|
|
30
|
+
paddingRight: 24,
|
|
31
|
+
marginBottom: 12
|
|
32
|
+
},
|
|
29
33
|
sticky ? (theme) => ({
|
|
30
34
|
position: "sticky",
|
|
31
35
|
zIndex: 1,
|
|
@@ -89,12 +93,27 @@ const PageShell = ({
|
|
|
89
93
|
children: title
|
|
90
94
|
}
|
|
91
95
|
),
|
|
92
|
-
/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
|
|
96
|
+
/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
|
|
97
|
+
Box.Box,
|
|
98
|
+
{
|
|
99
|
+
...bodyProps,
|
|
100
|
+
className: clsx.clsx(bodyClassName, bodyProps == null ? void 0 : bodyProps.className, "pageshell-body"),
|
|
101
|
+
sx: styles.mergeSxList([
|
|
102
|
+
{
|
|
103
|
+
paddingLeft: 24,
|
|
104
|
+
paddingRight: 24,
|
|
105
|
+
paddingBottom: 16,
|
|
106
|
+
paddingTop: headerVisible ? 0 : 16
|
|
107
|
+
},
|
|
108
|
+
bodyProps == null ? void 0 : bodyProps.sx
|
|
109
|
+
]),
|
|
110
|
+
children
|
|
111
|
+
}
|
|
112
|
+
)
|
|
93
113
|
] });
|
|
94
114
|
if (wrapped) {
|
|
95
|
-
return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Box.Box, { className,
|
|
115
|
+
return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Box.Box, { ...wrapperProps, className: clsx.clsx(className, wrapperProps == null ? void 0 : wrapperProps.className, "pageshell-wrapper"), children: page });
|
|
96
116
|
}
|
|
97
117
|
return page;
|
|
98
118
|
};
|
|
99
|
-
exports.PageHeader = PageHeader;
|
|
100
119
|
exports.PageShell = PageShell;
|
|
@@ -9,7 +9,6 @@ export interface PageHeaderProps extends GroupProps {
|
|
|
9
9
|
leftSection?: React.ReactNode;
|
|
10
10
|
rightSection?: React.ReactNode;
|
|
11
11
|
}
|
|
12
|
-
export declare const PageHeader: ({ sticky, leftSection, rightSection, children, ...restProps }: PageHeaderProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
13
12
|
/**
|
|
14
13
|
* From https://github.com/tidbcloud/dbaas-ui/blob/427559c99458ccd2e8b0d6c77ed44baa603d5ef7/src/dbaas/layouts/v4/page/PageShell.tsx#L7
|
|
15
14
|
*/
|
|
@@ -9,7 +9,6 @@ export interface PageHeaderProps extends GroupProps {
|
|
|
9
9
|
leftSection?: React.ReactNode;
|
|
10
10
|
rightSection?: React.ReactNode;
|
|
11
11
|
}
|
|
12
|
-
export declare const PageHeader: ({ sticky, leftSection, rightSection, children, ...restProps }: PageHeaderProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
13
12
|
/**
|
|
14
13
|
* From https://github.com/tidbcloud/dbaas-ui/blob/427559c99458ccd2e8b0d6c77ed44baa603d5ef7/src/dbaas/layouts/v4/page/PageShell.tsx#L7
|
|
15
14
|
*/
|
|
@@ -7,23 +7,27 @@ import { IconChevronLeft } from "../../icons/index.js";
|
|
|
7
7
|
/* empty css */
|
|
8
8
|
/* empty css */
|
|
9
9
|
import { Typography } from "../../primitive/Typography/index.js";
|
|
10
|
-
import "clsx";
|
|
10
|
+
import { clsx } from "clsx";
|
|
11
11
|
import { mergeSxList } from "../../utils/styles.js";
|
|
12
|
-
import { Group } from "../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/Group/Group.js";
|
|
13
12
|
import { Box } from "../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/core/Box/Box.js";
|
|
13
|
+
import { Group } from "../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/Group/Group.js";
|
|
14
14
|
import { ActionIcon } from "../../node_modules/.pnpm/@mantine_core@7.13.2_patch_hash_v5k5cxye7xaihpcgowhgciky7a_@mantine_hooks@7.13.2_react@18.3.1_hlfamvk7n3o6ychyvm5cyru4yu/node_modules/@mantine/core/esm/components/ActionIcon/ActionIcon.js";
|
|
15
15
|
const PageHeader = ({ sticky, leftSection, rightSection, children, ...restProps }) => {
|
|
16
16
|
const rightExisted = !!rightSection;
|
|
17
17
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
18
18
|
Group,
|
|
19
19
|
{
|
|
20
|
+
...restProps,
|
|
21
|
+
className: clsx(restProps == null ? void 0 : restProps.className, "pageshell-header"),
|
|
20
22
|
wrap: "nowrap",
|
|
21
23
|
justify: "space-between",
|
|
22
24
|
gap: "xl",
|
|
23
|
-
h: 56,
|
|
24
|
-
px: 24,
|
|
25
|
-
...restProps,
|
|
26
25
|
sx: mergeSxList([
|
|
26
|
+
{
|
|
27
|
+
paddingLeft: 24,
|
|
28
|
+
paddingRight: 24,
|
|
29
|
+
marginBottom: 12
|
|
30
|
+
},
|
|
27
31
|
sticky ? (theme) => ({
|
|
28
32
|
position: "sticky",
|
|
29
33
|
zIndex: 1,
|
|
@@ -87,14 +91,29 @@ const PageShell = ({
|
|
|
87
91
|
children: title
|
|
88
92
|
}
|
|
89
93
|
),
|
|
90
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
94
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
95
|
+
Box,
|
|
96
|
+
{
|
|
97
|
+
...bodyProps,
|
|
98
|
+
className: clsx(bodyClassName, bodyProps == null ? void 0 : bodyProps.className, "pageshell-body"),
|
|
99
|
+
sx: mergeSxList([
|
|
100
|
+
{
|
|
101
|
+
paddingLeft: 24,
|
|
102
|
+
paddingRight: 24,
|
|
103
|
+
paddingBottom: 16,
|
|
104
|
+
paddingTop: headerVisible ? 0 : 16
|
|
105
|
+
},
|
|
106
|
+
bodyProps == null ? void 0 : bodyProps.sx
|
|
107
|
+
]),
|
|
108
|
+
children
|
|
109
|
+
}
|
|
110
|
+
)
|
|
91
111
|
] });
|
|
92
112
|
if (wrapped) {
|
|
93
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { className,
|
|
113
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { ...wrapperProps, className: clsx(className, wrapperProps == null ? void 0 : wrapperProps.className, "pageshell-wrapper"), children: page });
|
|
94
114
|
}
|
|
95
115
|
return page;
|
|
96
116
|
};
|
|
97
117
|
export {
|
|
98
|
-
PageHeader,
|
|
99
118
|
PageShell
|
|
100
119
|
};
|
package/dist/biz/index.cjs
CHANGED
|
@@ -46,7 +46,6 @@ exports.LabelTooltip = index$5.LabelTooltip;
|
|
|
46
46
|
exports.Tree = index$7.Tree;
|
|
47
47
|
exports.TransferTree = index$8.TransferTree;
|
|
48
48
|
exports.PropertyCard = index$9.PropertyCard;
|
|
49
|
-
exports.PageHeader = index$a.PageHeader;
|
|
50
49
|
exports.PageShell = index$a.PageShell;
|
|
51
50
|
exports.TimeRangePicker = index$b.TimeRangePicker;
|
|
52
51
|
exports.DateTimePicker = index$c.DateTimePicker;
|
package/dist/biz/index.js
CHANGED
|
@@ -7,7 +7,7 @@ import { LabelTooltip } from "./LabelTooltip/index.js";
|
|
|
7
7
|
import { Tree } from "./Tree/index.js";
|
|
8
8
|
import { TransferTree } from "./TransferTree/index.js";
|
|
9
9
|
import { PropertyCard } from "./PropertyCard/index.js";
|
|
10
|
-
import {
|
|
10
|
+
import { PageShell } from "./PageShell/index.js";
|
|
11
11
|
import { TimeRangePicker } from "./TimeRangePicker/index.js";
|
|
12
12
|
import { DateTimePicker } from "./DateTimePicker/index.js";
|
|
13
13
|
import { validPhoneNumber } from "./PhoneInput/helper.js";
|
|
@@ -129,7 +129,6 @@ export {
|
|
|
129
129
|
Memo_MRT_TableBody,
|
|
130
130
|
Memo_MRT_TableBodyCell,
|
|
131
131
|
Memo_MRT_TableBodyRow,
|
|
132
|
-
PageHeader,
|
|
133
132
|
PageShell,
|
|
134
133
|
PhoneInput,
|
|
135
134
|
ProTable,
|
package/dist/theme/theme.cjs
CHANGED
|
@@ -200,7 +200,7 @@ const theme = createTheme.createTheme({
|
|
|
200
200
|
"&:hover": {
|
|
201
201
|
backgroundColor: bgHoverColor
|
|
202
202
|
},
|
|
203
|
-
"&:disabled": {
|
|
203
|
+
"&:disabled, &[data-disabled]": {
|
|
204
204
|
color: theme2.white,
|
|
205
205
|
backgroundColor: themeColor(theme2, color, 5)
|
|
206
206
|
}
|
|
@@ -222,7 +222,7 @@ const theme = createTheme.createTheme({
|
|
|
222
222
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
223
223
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
224
224
|
},
|
|
225
|
-
"&:disabled": {
|
|
225
|
+
"&:disabled, &[data-disabled]": {
|
|
226
226
|
color: themeColor(theme2, color, 6),
|
|
227
227
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
228
228
|
backgroundColor: themeColor(theme2, color, 2)
|
|
@@ -242,7 +242,7 @@ const theme = createTheme.createTheme({
|
|
|
242
242
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
243
243
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
244
244
|
},
|
|
245
|
-
"&:disabled": {
|
|
245
|
+
"&:disabled, &[data-disabled]": {
|
|
246
246
|
color: themeColor(theme2, color, 6),
|
|
247
247
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
248
248
|
backgroundColor: themeColor(theme2, color, 2)
|
|
@@ -260,7 +260,7 @@ const theme = createTheme.createTheme({
|
|
|
260
260
|
color: themeColor(theme2, color, fontColorShade + 1),
|
|
261
261
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
262
262
|
},
|
|
263
|
-
"&:disabled": {
|
|
263
|
+
"&:disabled, &[data-disabled]": {
|
|
264
264
|
color: themeColor(theme2, color, 6)
|
|
265
265
|
}
|
|
266
266
|
};
|
package/dist/theme/theme.js
CHANGED
|
@@ -198,7 +198,7 @@ const theme = createTheme({
|
|
|
198
198
|
"&:hover": {
|
|
199
199
|
backgroundColor: bgHoverColor
|
|
200
200
|
},
|
|
201
|
-
"&:disabled": {
|
|
201
|
+
"&:disabled, &[data-disabled]": {
|
|
202
202
|
color: theme2.white,
|
|
203
203
|
backgroundColor: themeColor(theme2, color, 5)
|
|
204
204
|
}
|
|
@@ -220,7 +220,7 @@ const theme = createTheme({
|
|
|
220
220
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
221
221
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
222
222
|
},
|
|
223
|
-
"&:disabled": {
|
|
223
|
+
"&:disabled, &[data-disabled]": {
|
|
224
224
|
color: themeColor(theme2, color, 6),
|
|
225
225
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
226
226
|
backgroundColor: themeColor(theme2, color, 2)
|
|
@@ -240,7 +240,7 @@ const theme = createTheme({
|
|
|
240
240
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
241
241
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
242
242
|
},
|
|
243
|
-
"&:disabled": {
|
|
243
|
+
"&:disabled, &[data-disabled]": {
|
|
244
244
|
color: themeColor(theme2, color, 6),
|
|
245
245
|
borderColor: themeColor(theme2, color, borderColorShade + 1),
|
|
246
246
|
backgroundColor: themeColor(theme2, color, 2)
|
|
@@ -258,7 +258,7 @@ const theme = createTheme({
|
|
|
258
258
|
color: themeColor(theme2, color, fontColorShade + 1),
|
|
259
259
|
backgroundColor: themeColor(theme2, color, bgColorShade + 1)
|
|
260
260
|
},
|
|
261
|
-
"&:disabled": {
|
|
261
|
+
"&:disabled, &[data-disabled]": {
|
|
262
262
|
color: themeColor(theme2, color, 6)
|
|
263
263
|
}
|
|
264
264
|
};
|