@tidbcloud/uikit 2.0.0-beta.95 → 2.0.0-beta.96

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.
Files changed (16) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/biz/PageShell/index.cjs +2 -1
  3. package/dist/biz/PageShell/index.d.cts +4 -1
  4. package/dist/biz/PageShell/index.d.ts +4 -1
  5. package/dist/biz/PageShell/index.js +2 -1
  6. package/dist/biz/Table/ProTable/helpers.cjs +3 -0
  7. package/dist/biz/Table/ProTable/helpers.js +3 -0
  8. package/dist/biz/Tree/index.cjs +1 -1
  9. package/dist/biz/Tree/index.js +1 -1
  10. package/dist/theme/colors.cjs +10 -0
  11. package/dist/theme/colors.dark.cjs +10 -0
  12. package/dist/theme/colors.dark.js +10 -0
  13. package/dist/theme/colors.js +10 -0
  14. package/dist/theme/theme.cjs +11 -1
  15. package/dist/theme/theme.js +11 -1
  16. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @tidbcloud/uikit
2
2
 
3
+ ## 2.0.0-beta.96
4
+
5
+ ### Patch Changes
6
+
7
+ - fix(Select): update Select component styles to include check icon and… ([#358](https://github.com/tidbcloud/tidbcloud-uikit/pull/358))
8
+ - fix(Tree): update background color from blue to carbon for indeterminate checkbox for improved theme consistency ([#357](https://github.com/tidbcloud/tidbcloud-uikit/pull/357))
9
+ - fix(PageShell): update PageHeader styles to set height instead of margin ([#356](https://github.com/tidbcloud/tidbcloud-uikit/pull/356))
10
+ - fix(ProTable): resizing cursor missing ([#355](https://github.com/tidbcloud/tidbcloud-uikit/pull/355))
11
+
3
12
  ## 2.0.0-beta.95
4
13
 
5
14
  ### Patch Changes
package/dist/biz/PageShell/index.cjs CHANGED
@@ -28,7 +28,7 @@ const PageHeader = ({ sticky, leftSection, rightSection, children, ...restProps
28
28
  {
29
29
  paddingLeft: 24,
30
30
  paddingRight: 24,
31
- marginBottom: 12
31
+ height: 56
32
32
  },
33
33
  sticky ? (theme) => ({
34
34
  position: "sticky",
@@ -116,4 +116,5 @@ const PageShell = ({
116
116
  }
117
117
  return page;
118
118
  };
119
+ PageShell.Header = PageHeader;
119
120
  exports.PageShell = PageShell;
package/dist/biz/PageShell/index.d.cts CHANGED
@@ -79,4 +79,7 @@ export interface PageShellProps {
79
79
  };
80
80
  children?: ReactNode;
81
81
  }
82
- export declare const PageShell: ({ className, headerClassName, bodyClassName, headerSticky, headerRightSection, headerBack, title, wrapped, wrapperProps, headerProps: { withBack, onBackClick, ...headerProps }, bodyProps, children }: PageShellProps) => import("react/jsx-runtime.js").JSX.Element;
82
+ export declare const PageShell: {
83
+ ({ className, headerClassName, bodyClassName, headerSticky, headerRightSection, headerBack, title, wrapped, wrapperProps, headerProps: { withBack, onBackClick, ...headerProps }, bodyProps, children }: PageShellProps): import("react/jsx-runtime.js").JSX.Element;
84
+ Header: ({ sticky, leftSection, rightSection, children, ...restProps }: PageHeaderProps) => import("react/jsx-runtime.js").JSX.Element;
85
+ };
package/dist/biz/PageShell/index.d.ts CHANGED
@@ -79,4 +79,7 @@ export interface PageShellProps {
79
79
  };
80
80
  children?: ReactNode;
81
81
  }
82
- export declare const PageShell: ({ className, headerClassName, bodyClassName, headerSticky, headerRightSection, headerBack, title, wrapped, wrapperProps, headerProps: { withBack, onBackClick, ...headerProps }, bodyProps, children }: PageShellProps) => import("react/jsx-runtime.js").JSX.Element;
82
+ export declare const PageShell: {
83
+ ({ className, headerClassName, bodyClassName, headerSticky, headerRightSection, headerBack, title, wrapped, wrapperProps, headerProps: { withBack, onBackClick, ...headerProps }, bodyProps, children }: PageShellProps): import("react/jsx-runtime.js").JSX.Element;
84
+ Header: ({ sticky, leftSection, rightSection, children, ...restProps }: PageHeaderProps) => import("react/jsx-runtime.js").JSX.Element;
85
+ };
package/dist/biz/PageShell/index.js CHANGED
@@ -26,7 +26,7 @@ const PageHeader = ({ sticky, leftSection, rightSection, children, ...restProps
26
26
  {
27
27
  paddingLeft: 24,
28
28
  paddingRight: 24,
29
- marginBottom: 12
29
+ height: 56
30
30
  },
31
31
  sticky ? (theme) => ({
32
32
  position: "sticky",
@@ -114,6 +114,7 @@ const PageShell = ({
114
114
  }
115
115
  return page;
116
116
  };
117
+ PageShell.Header = PageHeader;
117
118
  export {
118
119
  PageShell
119
120
  };
package/dist/biz/Table/ProTable/helpers.cjs CHANGED
@@ -153,6 +153,9 @@ function mergeProTableProps(props) {
153
153
  borderColor: "transparent",
154
154
  minWidth: 20,
155
155
  minHeight: 20
156
+ },
157
+ ".mrt-table-head-cell-resize-handle": {
158
+ marginRight: -7
156
159
  }
157
160
  }
158
161
  };
package/dist/biz/Table/ProTable/helpers.js CHANGED
@@ -151,6 +151,9 @@ function mergeProTableProps(props) {
151
151
  borderColor: "transparent",
152
152
  minWidth: 20,
153
153
  minHeight: 20
154
+ },
155
+ ".mrt-table-head-cell-resize-handle": {
156
+ marginRight: -7
154
157
  }
155
158
  }
156
159
  };
package/dist/biz/Tree/index.cjs CHANGED
@@ -174,7 +174,7 @@ const Tree = React.forwardRef((props, ref) => {
174
174
  left: "50%",
175
175
  width: 8,
176
176
  height: 8,
177
- backgroundColor: theme.colors.blue[7],
177
+ backgroundColor: theme.colors.carbon[8],
178
178
  border: 0,
179
179
  transform: "translate(-50%, -50%) scale(1)",
180
180
  opacity: 1,
package/dist/biz/Tree/index.js CHANGED
@@ -172,7 +172,7 @@ const Tree = React__default.forwardRef((props, ref) => {
172
172
  left: "50%",
173
173
  width: 8,
174
174
  height: 8,
175
- backgroundColor: theme.colors.blue[7],
175
+ backgroundColor: theme.colors.carbon[8],
176
176
  border: 0,
177
177
  transform: "translate(-50%, -50%) scale(1)",
178
178
  opacity: 1,
package/dist/theme/colors.cjs CHANGED
@@ -2,15 +2,25 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const carbon = [
4
4
  "#FFFFFF",
5
+ // 0
5
6
  "#FDFEFF",
7
+ // 1
6
8
  "#F9FAFB",
9
+ // 2
7
10
  "#EDF1F2",
11
+ // 3
8
12
  "#DCE3E5",
13
+ // 4
9
14
  "#C4CDD0",
15
+ // 5
10
16
  "#9FA9AD",
17
+ // 6
11
18
  "#6F787B",
19
+ // 7
12
20
  "#383E40",
21
+ // 8
13
22
  "#1E2426"
23
+ // 9
14
24
  ];
15
25
  const peacock = [
16
26
  "#FBFDFE",
package/dist/theme/colors.dark.cjs CHANGED
@@ -2,15 +2,25 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const carbon = [
4
4
  "#14181A",
5
+ // 0
5
6
  "#111517",
7
+ // 1
6
8
  "#1F2426",
9
+ // 2
7
10
  "#25292B",
11
+ // 3
8
12
  "#313638",
13
+ // 4
9
14
  "#43494D",
15
+ // 5
10
16
  "#50585C",
17
+ // 6
11
18
  "#79848A",
19
+ // 7
12
20
  "#ACB9BF",
21
+ // 8
13
22
  "#DAE2E5"
23
+ // 9
14
24
  ];
15
25
  const peacock = [
16
26
  "#11171A",
package/dist/theme/colors.dark.js CHANGED
@@ -1,14 +1,24 @@
1
1
  const carbon = [
2
2
  "#14181A",
3
+ // 0
3
4
  "#111517",
5
+ // 1
4
6
  "#1F2426",
7
+ // 2
5
8
  "#25292B",
9
+ // 3
6
10
  "#313638",
11
+ // 4
7
12
  "#43494D",
13
+ // 5
8
14
  "#50585C",
15
+ // 6
9
16
  "#79848A",
17
+ // 7
10
18
  "#ACB9BF",
19
+ // 8
11
20
  "#DAE2E5"
21
+ // 9
12
22
  ];
13
23
  const peacock = [
14
24
  "#11171A",
package/dist/theme/colors.js CHANGED
@@ -1,14 +1,24 @@
1
1
  const carbon = [
2
2
  "#FFFFFF",
3
+ // 0
3
4
  "#FDFEFF",
5
+ // 1
4
6
  "#F9FAFB",
7
+ // 2
5
8
  "#EDF1F2",
9
+ // 3
6
10
  "#DCE3E5",
11
+ // 4
7
12
  "#C4CDD0",
13
+ // 5
8
14
  "#9FA9AD",
15
+ // 6
9
16
  "#6F787B",
17
+ // 7
10
18
  "#383E40",
19
+ // 8
11
20
  "#1E2426"
21
+ // 9
12
22
  ];
13
23
  const peacock = [
14
24
  "#FBFDFE",
package/dist/theme/theme.cjs CHANGED
@@ -548,7 +548,8 @@ const theme = createTheme.createTheme({
548
548
  Select: {
549
549
  defaultProps: {
550
550
  size: "md",
551
- withCheckIcon: false
551
+ withCheckIcon: true,
552
+ checkIconPosition: "right"
552
553
  },
553
554
  styles: (theme2, props) => {
554
555
  return {
@@ -589,6 +590,11 @@ const theme = createTheme.createTheme({
589
590
  backgroundColor: "transparent",
590
591
  "&:hover": {
591
592
  backgroundColor: themeColor(theme2, "carbon", 3)
593
+ },
594
+ // check icon color
595
+ "& > svg": {
596
+ color: themeColor(theme2, "carbon", 9),
597
+ opacity: 1
592
598
  }
593
599
  }
594
600
  },
@@ -596,6 +602,10 @@ const theme = createTheme.createTheme({
596
602
  "& > svg": {
597
603
  color: `${themeColor(theme2, "carbon", 7)} !important`
598
604
  }
605
+ },
606
+ dropdown: {
607
+ "--popover-border-color": themeColor(theme2, "carbon", 3),
608
+ "--popover-shadow": "0px 8px 32px 0px #00000014"
599
609
  }
600
610
  };
601
611
  }
package/dist/theme/theme.js CHANGED
@@ -546,7 +546,8 @@ const theme = createTheme({
546
546
  Select: {
547
547
  defaultProps: {
548
548
  size: "md",
549
- withCheckIcon: false
549
+ withCheckIcon: true,
550
+ checkIconPosition: "right"
550
551
  },
551
552
  styles: (theme2, props) => {
552
553
  return {
@@ -587,6 +588,11 @@ const theme = createTheme({
587
588
  backgroundColor: "transparent",
588
589
  "&:hover": {
589
590
  backgroundColor: themeColor(theme2, "carbon", 3)
591
+ },
592
+ // check icon color
593
+ "& > svg": {
594
+ color: themeColor(theme2, "carbon", 9),
595
+ opacity: 1
590
596
  }
591
597
  }
592
598
  },
@@ -594,6 +600,10 @@ const theme = createTheme({
594
600
  "& > svg": {
595
601
  color: `${themeColor(theme2, "carbon", 7)} !important`
596
602
  }
603
+ },
604
+ dropdown: {
605
+ "--popover-border-color": themeColor(theme2, "carbon", 3),
606
+ "--popover-shadow": "0px 8px 32px 0px #00000014"
597
607
  }
598
608
  };
599
609
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tidbcloud/uikit",
3
- "version": "2.0.0-beta.95",
3
+ "version": "2.0.0-beta.96",
4
4
  "description": "tidbcloud uikit",
5
5
  "type": "module",
6
6
  "main": "dist/primitive/index.cjs",