@tidbcloud/uikit 2.0.0-beta.13 → 2.0.0-beta.14

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 CHANGED
@@ -1,5 +1,11 @@
1
1
  # @tidbcloud/uikit
2
2
 
3
+ ## 2.0.0-beta.14
4
+
5
+ ### Minor Changes
6
+
7
+ - update ProTable style
8
+
3
9
  ## 2.0.0-beta.13
4
10
 
5
11
  ### Patch Changes
@@ -7,6 +7,7 @@ const ArrowUp = require("../../../icons/react/ArrowUp.cjs");
7
7
  const SwitchVertical02 = require("../../../icons/react/SwitchVertical02.cjs");
8
8
  const TablePagination = require("../TablePagination.cjs");
9
9
  const helpers = require("./helpers.cjs");
10
+ const MantineProvider = require("../../../node_modules/.pnpm/@mantine_styles@5.10.4_@emotion_react@11.13.0_react-dom@18.3.1_react@18.3.1/node_modules/@mantine/styles/esm/theme/MantineProvider.cjs");
10
11
  const Box = require("../../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.13.0_@mantine_ho_u2jurujayhgo5kjqawpkatsdsi/node_modules/@mantine/core/esm/Box/Box.cjs");
11
12
  const ProTable = ({
12
13
  mantineTableProps = {},
@@ -28,13 +29,14 @@ const ProTable = ({
28
29
  state,
29
30
  ...rest
30
31
  }) => {
32
+ const theme = MantineProvider.useMantineTheme();
31
33
  const mPaperProps = helpers.mergeMProps(
32
34
  {
33
35
  shadow: "none",
34
36
  withBorder,
35
- sx: (theme) => ({
37
+ sx: (theme2) => ({
36
38
  backgroundColor: "inherit",
37
- borderRadius: withBorder ? theme.defaultRadius : 0,
39
+ borderRadius: withBorder ? theme2.defaultRadius : 0,
38
40
  overflow: "hidden",
39
41
  transition: "none",
40
42
  "& ::-webkit-scrollbar": enableStickyHeader ? {
@@ -55,18 +57,23 @@ const ProTable = ({
55
57
  color: "inherit",
56
58
  thead: {
57
59
  tr: {
58
- boxShadow: "none"
60
+ boxShadow: "none",
61
+ th: {
62
+ color: theme.colors.carbon[7],
63
+ backgroundColor: theme.colors.carbon[1],
64
+ fontWeight: 500
65
+ }
59
66
  }
60
67
  },
61
- "thead th": {
62
- backgroundColor: "inherit"
63
- },
64
- tr: {
65
- transition: "none",
66
- backgroundColor: "inherit",
67
- ":last-of-type": {
68
- td: {
69
- borderBottom: "none"
68
+ tbody: {
69
+ tr: {
70
+ transition: "none",
71
+ backgroundColor: theme.colors.carbon[0],
72
+ color: theme.colors.carbon[8],
73
+ ":last-of-type": {
74
+ td: {
75
+ borderBottom: "none"
76
+ }
70
77
  }
71
78
  }
72
79
  }
@@ -89,11 +96,11 @@ const ProTable = ({
89
96
  }, mantineTableBodyProps);
90
97
  const mBottomToolbarProps = helpers.mergeMProps(
91
98
  {
92
- sx: (theme) => ({
99
+ sx: (theme2) => ({
93
100
  backgroundColor: "inherit",
94
101
  transition: "none",
95
- borderBottomLeftRadius: withBorder ? theme.defaultRadius : void 0,
96
- borderBottomRightRadius: withBorder ? theme.defaultRadius : void 0
102
+ borderBottomLeftRadius: withBorder ? theme2.defaultRadius : void 0,
103
+ borderBottomRightRadius: withBorder ? theme2.defaultRadius : void 0
97
104
  })
98
105
  },
99
106
  mantineBottomToolbarProps
@@ -5,6 +5,7 @@ import IconArrowUp from "../../../icons/react/ArrowUp.js";
5
5
  import IconSwitchVertical02 from "../../../icons/react/SwitchVertical02.js";
6
6
  import { TablePagination } from "../TablePagination.js";
7
7
  import { mergeMProps } from "./helpers.js";
8
+ import { useMantineTheme } from "../../../node_modules/.pnpm/@mantine_styles@5.10.4_@emotion_react@11.13.0_react-dom@18.3.1_react@18.3.1/node_modules/@mantine/styles/esm/theme/MantineProvider.js";
8
9
  import { Box } from "../../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.13.0_@mantine_ho_u2jurujayhgo5kjqawpkatsdsi/node_modules/@mantine/core/esm/Box/Box.js";
9
10
  const ProTable = ({
10
11
  mantineTableProps = {},
@@ -26,13 +27,14 @@ const ProTable = ({
26
27
  state,
27
28
  ...rest
28
29
  }) => {
30
+ const theme = useMantineTheme();
29
31
  const mPaperProps = mergeMProps(
30
32
  {
31
33
  shadow: "none",
32
34
  withBorder,
33
- sx: (theme) => ({
35
+ sx: (theme2) => ({
34
36
  backgroundColor: "inherit",
35
- borderRadius: withBorder ? theme.defaultRadius : 0,
37
+ borderRadius: withBorder ? theme2.defaultRadius : 0,
36
38
  overflow: "hidden",
37
39
  transition: "none",
38
40
  "& ::-webkit-scrollbar": enableStickyHeader ? {
@@ -53,18 +55,23 @@ const ProTable = ({
53
55
  color: "inherit",
54
56
  thead: {
55
57
  tr: {
56
- boxShadow: "none"
58
+ boxShadow: "none",
59
+ th: {
60
+ color: theme.colors.carbon[7],
61
+ backgroundColor: theme.colors.carbon[1],
62
+ fontWeight: 500
63
+ }
57
64
  }
58
65
  },
59
- "thead th": {
60
- backgroundColor: "inherit"
61
- },
62
- tr: {
63
- transition: "none",
64
- backgroundColor: "inherit",
65
- ":last-of-type": {
66
- td: {
67
- borderBottom: "none"
66
+ tbody: {
67
+ tr: {
68
+ transition: "none",
69
+ backgroundColor: theme.colors.carbon[0],
70
+ color: theme.colors.carbon[8],
71
+ ":last-of-type": {
72
+ td: {
73
+ borderBottom: "none"
74
+ }
68
75
  }
69
76
  }
70
77
  }
@@ -87,11 +94,11 @@ const ProTable = ({
87
94
  }, mantineTableBodyProps);
88
95
  const mBottomToolbarProps = mergeMProps(
89
96
  {
90
- sx: (theme) => ({
97
+ sx: (theme2) => ({
91
98
  backgroundColor: "inherit",
92
99
  transition: "none",
93
- borderBottomLeftRadius: withBorder ? theme.defaultRadius : void 0,
94
- borderBottomRightRadius: withBorder ? theme.defaultRadius : void 0
100
+ borderBottomLeftRadius: withBorder ? theme2.defaultRadius : void 0,
101
+ borderBottomRightRadius: withBorder ? theme2.defaultRadius : void 0
95
102
  })
96
103
  },
97
104
  mantineBottomToolbarProps
@@ -549,7 +549,7 @@ const theme = {
549
549
  },
550
550
  styles: (theme2, params) => ({
551
551
  root: {
552
- backgroundColor: theme2.colorScheme === "dark" ? theme2.colors.carbon[1] : theme2.white,
552
+ backgroundColor: theme2.colors.carbon[0],
553
553
  border: params.withBorder ? `1px solid ${theme2.colors.carbon[3]}` : void 0
554
554
  }
555
555
  })
@@ -547,7 +547,7 @@ const theme = {
547
547
  },
548
548
  styles: (theme2, params) => ({
549
549
  root: {
550
- backgroundColor: theme2.colorScheme === "dark" ? theme2.colors.carbon[1] : theme2.white,
550
+ backgroundColor: theme2.colors.carbon[0],
551
551
  border: params.withBorder ? `1px solid ${theme2.colors.carbon[3]}` : void 0
552
552
  }
553
553
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tidbcloud/uikit",
3
- "version": "2.0.0-beta.13",
3
+ "version": "2.0.0-beta.14",
4
4
  "description": "tidbcloud uikit",
5
5
  "type": "module",
6
6
  "main": "dist/primitive/index.cjs",