@tidbcloud/uikit 2.0.0-beta.21 → 2.0.0-beta.23

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 +12 -0
  2. package/dist/biz/CodeBlock/index.cjs +34 -27
  3. package/dist/biz/CodeBlock/index.js +34 -27
  4. package/dist/biz/Form/RadioGroup.cjs +1 -1
  5. package/dist/biz/Form/RadioGroup.js +1 -1
  6. package/dist/biz/PageShell/index.cjs +1 -7
  7. package/dist/biz/PageShell/index.js +1 -7
  8. package/dist/biz/TimeRangePicker/index.cjs +6 -3
  9. package/dist/biz/TimeRangePicker/index.js +6 -3
  10. package/dist/primitive/Prism/prism-theme.cjs +32 -75
  11. package/dist/primitive/Prism/prism-theme.d.cts +1 -1
  12. package/dist/primitive/Prism/prism-theme.d.ts +1 -1
  13. package/dist/primitive/Prism/prism-theme.js +32 -75
  14. package/dist/theme/theme.cjs +121 -2
  15. package/dist/theme/theme.js +121 -2
  16. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @tidbcloud/uikit
2
2
 
3
+ ## 2.0.0-beta.23
4
+
5
+ ### Minor Changes
6
+
7
+ - make PageShell back icon and CodeBlock Copy icon to subtle
8
+
9
+ ## 2.0.0-beta.22
10
+
11
+ ### Minor Changes
12
+
13
+ - Update ActionIcon/Tooltip/Modal style set Badge/Alert default to peacock color
14
+
3
15
  ## 2.0.0-beta.21
4
16
 
5
17
  ### Minor Changes
package/dist/biz/CodeBlock/index.cjs CHANGED
@@ -9,10 +9,11 @@ const Copy01 = require("../../icons/react/Copy01.cjs");
9
9
  const styles = require("../../utils/styles.cjs");
10
10
  const Prism = require("../../primitive/Prism/Prism.cjs");
11
11
  const Group = 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/Group/Group.cjs");
12
- const Tooltip = 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/Tooltip/Tooltip.cjs");
12
+ const HoverCard = 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/HoverCard/HoverCard.cjs");
13
13
  const ActionIcon = 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/ActionIcon/ActionIcon.cjs");
14
14
  const CopyButton = 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/CopyButton/CopyButton.cjs");
15
15
  const Code = 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/Code/Code.cjs");
16
+ const Tooltip = 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/Tooltip/Tooltip.cjs");
16
17
  const useLocalStorage = require("../../node_modules/.pnpm/@mantine_hooks@5.10.4_react@18.3.1/node_modules/@mantine/hooks/esm/use-local-storage/use-local-storage.cjs");
17
18
  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");
18
19
  function useFold(persistenceKey) {
@@ -88,31 +89,37 @@ const CodeBlock = ({
88
89
  }
89
90
  ),
90
91
  /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(Group.Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.carbon[8] }), children: [
91
- foldIconVisible && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Tooltip.Tooltip, { label: folded ? "Expand" : "Collapse", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
92
- ActionIcon.ActionIcon,
93
- {
94
- variant: "transparent",
95
- size: "sm",
96
- onClick: () => {
97
- const v = !folded;
98
- setFolded(v);
99
- onFoldIconClick == null ? void 0 : onFoldIconClick(v);
100
- },
101
- children: folded ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
102
- }
103
- ) }),
104
- /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CopyButton.CopyButton, { value: copyContent ?? children, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Tooltip.Tooltip, { label: copied ? "Copied" : "Copy", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
105
- ActionIcon.ActionIcon,
106
- {
107
- variant: "transparent",
108
- size: "sm",
109
- onClick: () => {
110
- copy();
111
- onCopyClick == null ? void 0 : onCopyClick();
112
- },
113
- children: copied ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Check, { size: 14 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Copy01, { size: 14, strokeWidth: 2.5 })
114
- }
115
- ) }) })
92
+ foldIconVisible && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(HoverCard.HoverCard, { withArrow: true, position: "top", children: [
93
+ /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Target, { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
94
+ ActionIcon.ActionIcon,
95
+ {
96
+ size: "sm",
97
+ variant: "subtle",
98
+ onClick: () => {
99
+ const v = !folded;
100
+ setFolded(v);
101
+ onFoldIconClick == null ? void 0 : onFoldIconClick(v);
102
+ },
103
+ children: folded ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
104
+ }
105
+ ) }),
106
+ /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Dropdown, { children: folded ? "Expand" : "Collapse" })
107
+ ] }),
108
+ /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CopyButton.CopyButton, { value: copyContent ?? children, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(HoverCard.HoverCard, { withArrow: true, position: "top", children: [
109
+ /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Target, { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
110
+ ActionIcon.ActionIcon,
111
+ {
112
+ size: "sm",
113
+ variant: "subtle",
114
+ onClick: () => {
115
+ copy();
116
+ onCopyClick == null ? void 0 : onCopyClick();
117
+ },
118
+ children: copied ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Check, { size: 14 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Copy01, { size: 14, strokeWidth: 2.5 })
119
+ }
120
+ ) }),
121
+ /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Dropdown, { children: copied ? "Copied" : "Copy" })
122
+ ] }) })
116
123
  ] })
117
124
  ] });
118
125
  };
@@ -140,7 +147,7 @@ const CopyText = ({ children, value, ...rest }) => {
140
147
  /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CopyButton.CopyButton, { value, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Tooltip.Tooltip, { label: copied ? "Copied" : "Copy", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
141
148
  ActionIcon.ActionIcon,
142
149
  {
143
- variant: "transparent",
150
+ variant: "subtle",
144
151
  size: "sm",
145
152
  ml: 8,
146
153
  display: "inline-block",
package/dist/biz/CodeBlock/index.js CHANGED
@@ -7,10 +7,11 @@ import IconCopy01 from "../../icons/react/Copy01.js";
7
7
  import { mergeSxList, mergeStylesList } from "../../utils/styles.js";
8
8
  import { MantinePrism } from "../../primitive/Prism/Prism.js";
9
9
  import { Group } 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/Group/Group.js";
10
- import { Tooltip } 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/Tooltip/Tooltip.js";
10
+ import { HoverCard } 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/HoverCard/HoverCard.js";
11
11
  import { ActionIcon } 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/ActionIcon/ActionIcon.js";
12
12
  import { CopyButton } 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/CopyButton/CopyButton.js";
13
13
  import { Code } 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/Code/Code.js";
14
+ import { Tooltip } 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/Tooltip/Tooltip.js";
14
15
  import { useLocalStorage } from "../../node_modules/.pnpm/@mantine_hooks@5.10.4_react@18.3.1/node_modules/@mantine/hooks/esm/use-local-storage/use-local-storage.js";
15
16
  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";
16
17
  function useFold(persistenceKey) {
@@ -86,31 +87,37 @@ const CodeBlock = ({
86
87
  }
87
88
  ),
88
89
  /* @__PURE__ */ jsxRuntimeExports.jsxs(Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.carbon[8] }), children: [
89
- foldIconVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: folded ? "Expand" : "Collapse", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
90
- ActionIcon,
91
- {
92
- variant: "transparent",
93
- size: "sm",
94
- onClick: () => {
95
- const v = !folded;
96
- setFolded(v);
97
- onFoldIconClick == null ? void 0 : onFoldIconClick(v);
98
- },
99
- children: folded ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
100
- }
101
- ) }),
102
- /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { value: copyContent ?? children, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: copied ? "Copied" : "Copy", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
103
- ActionIcon,
104
- {
105
- variant: "transparent",
106
- size: "sm",
107
- onClick: () => {
108
- copy();
109
- onCopyClick == null ? void 0 : onCopyClick();
110
- },
111
- children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconCopy01, { size: 14, strokeWidth: 2.5 })
112
- }
113
- ) }) })
90
+ foldIconVisible && /* @__PURE__ */ jsxRuntimeExports.jsxs(HoverCard, { withArrow: true, position: "top", children: [
91
+ /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Target, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
92
+ ActionIcon,
93
+ {
94
+ size: "sm",
95
+ variant: "subtle",
96
+ onClick: () => {
97
+ const v = !folded;
98
+ setFolded(v);
99
+ onFoldIconClick == null ? void 0 : onFoldIconClick(v);
100
+ },
101
+ children: folded ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
102
+ }
103
+ ) }),
104
+ /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Dropdown, { children: folded ? "Expand" : "Collapse" })
105
+ ] }),
106
+ /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { value: copyContent ?? children, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntimeExports.jsxs(HoverCard, { withArrow: true, position: "top", children: [
107
+ /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Target, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
108
+ ActionIcon,
109
+ {
110
+ size: "sm",
111
+ variant: "subtle",
112
+ onClick: () => {
113
+ copy();
114
+ onCopyClick == null ? void 0 : onCopyClick();
115
+ },
116
+ children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconCopy01, { size: 14, strokeWidth: 2.5 })
117
+ }
118
+ ) }),
119
+ /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Dropdown, { children: copied ? "Copied" : "Copy" })
120
+ ] }) })
114
121
  ] })
115
122
  ] });
116
123
  };
@@ -138,7 +145,7 @@ const CopyText = ({ children, value, ...rest }) => {
138
145
  /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { value, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: copied ? "Copied" : "Copy", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
139
146
  ActionIcon,
140
147
  {
141
- variant: "transparent",
148
+ variant: "subtle",
142
149
  size: "sm",
143
150
  ml: 8,
144
151
  display: "inline-block",
package/dist/biz/Form/RadioGroup.cjs CHANGED
@@ -6,9 +6,9 @@ const lodashEs = require("lodash-es");
6
6
  const React = require("react");
7
7
  const reactHookForm = require("react-hook-form");
8
8
  const Radio = 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/Radio/Radio.cjs");
9
- const HoverCard = 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/HoverCard/HoverCard.cjs");
10
9
  const Tooltip = 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/Tooltip/Tooltip.cjs");
11
10
  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
+ const HoverCard = 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/HoverCard/HoverCard.cjs");
12
12
  const FormRadioGroup = ({ name, rules, onChange, data, ...rest }) => {
13
13
  const { control, formState, getFieldState } = reactHookForm.useFormContext();
14
14
  const { error } = getFieldState(name, formState);
package/dist/biz/Form/RadioGroup.js CHANGED
@@ -4,9 +4,9 @@ import { omit } from "lodash-es";
4
4
  import { Fragment } from "react";
5
5
  import { useFormContext, Controller } from "react-hook-form";
6
6
  import { Radio } 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/Radio/Radio.js";
7
- import { HoverCard } 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/HoverCard/HoverCard.js";
8
7
  import { Tooltip } 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/Tooltip/Tooltip.js";
9
8
  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
+ import { HoverCard } 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/HoverCard/HoverCard.js";
10
10
  const FormRadioGroup = ({ name, rules, onChange, data, ...rest }) => {
11
11
  const { control, formState, getFieldState } = useFormContext();
12
12
  const { error } = getFieldState(name, formState);
package/dist/biz/PageShell/index.cjs CHANGED
@@ -56,13 +56,7 @@ const PageShell = ({
56
56
  const leftSection = (!!withBack || !!headerBack) && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
57
57
  ActionIcon.ActionIcon,
58
58
  {
59
- variant: "light",
60
- bg: "carbon.3",
61
- sx: (theme) => ({
62
- ":hover": {
63
- backgroundColor: theme.colors.carbon[4]
64
- }
65
- }),
59
+ variant: "default",
66
60
  onClick: () => {
67
61
  if (onBackClick) {
68
62
  onBackClick();
package/dist/biz/PageShell/index.js CHANGED
@@ -54,13 +54,7 @@ const PageShell = ({
54
54
  const leftSection = (!!withBack || !!headerBack) && /* @__PURE__ */ jsxRuntimeExports.jsx(
55
55
  ActionIcon,
56
56
  {
57
- variant: "light",
58
- bg: "carbon.3",
59
- sx: (theme) => ({
60
- ":hover": {
61
- backgroundColor: theme.colors.carbon[4]
62
- }
63
- }),
57
+ variant: "default",
64
58
  onClick: () => {
65
59
  if (onBackClick) {
66
60
  onBackClick();
package/dist/biz/TimeRangePicker/index.cjs CHANGED
@@ -60,14 +60,17 @@ const TimeRangePicker = ({
60
60
  Button.Button,
61
61
  {
62
62
  variant: "default",
63
+ bg: "carbon.0",
63
64
  styles: (theme) => ({
64
65
  root: {
65
66
  paddingLeft: "12px",
66
67
  paddingRight: "12px",
67
- borderColor: opened ? theme.colors.blue[7] : "",
68
+ borderColor: opened ? theme.colors.carbon[9] : theme.colors.carbon[4],
68
69
  "&:hover": {
69
- background: "transparent"
70
- }
70
+ backgroundColor: theme.colors.carbon[0],
71
+ borderColor: opened ? theme.colors.carbon[9] : theme.colors.carbon[4]
72
+ },
73
+ "&:active": { transform: "none" }
71
74
  },
72
75
  inner: {
73
76
  width: "100%"
package/dist/biz/TimeRangePicker/index.js CHANGED
@@ -59,14 +59,17 @@ const TimeRangePicker = ({
59
59
  Button,
60
60
  {
61
61
  variant: "default",
62
+ bg: "carbon.0",
62
63
  styles: (theme) => ({
63
64
  root: {
64
65
  paddingLeft: "12px",
65
66
  paddingRight: "12px",
66
- borderColor: opened ? theme.colors.blue[7] : "",
67
+ borderColor: opened ? theme.colors.carbon[9] : theme.colors.carbon[4],
67
68
  "&:hover": {
68
- background: "transparent"
69
- }
69
+ backgroundColor: theme.colors.carbon[0],
70
+ borderColor: opened ? theme.colors.carbon[9] : theme.colors.carbon[4]
71
+ },
72
+ "&:active": { transform: "none" }
70
73
  },
71
74
  inner: {
72
75
  width: "100%"
package/dist/primitive/Prism/prism-theme.cjs CHANGED
@@ -1,117 +1,93 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const dark = (theme) => ({
3
+ const light = (theme) => ({
4
4
  plain: {
5
- color: theme.colors.carbon[5],
6
- backgroundColor: theme.colors.carbon[8]
5
+ color: theme.colors.carbon[9],
6
+ backgroundColor: theme.fn.rgba(theme.colors.carbon[1], 0.65)
7
7
  },
8
8
  styles: [
9
+ // from sql editor
9
10
  {
10
- types: ["comment"],
11
+ types: ["comment", "meta"],
11
12
  style: {
12
- color: theme.colors.carbon[7]
13
+ color: theme.colors.green[8]
13
14
  }
14
15
  },
15
16
  {
16
- types: ["string", "inserted", "selector", "atrule"],
17
+ types: ["keyword", "strong"],
17
18
  style: {
18
- color: theme.colors.aqua[4]
19
+ color: theme.colors.sky[8]
19
20
  }
20
21
  },
21
22
  {
22
23
  types: ["number"],
23
24
  style: {
24
- color: theme.colors.peacock[4]
25
- }
26
- },
27
- {
28
- types: ["builtin", "char", "constant", "function"],
29
- style: {
30
- color: theme.colors.yellow[5]
25
+ color: theme.colors.rosy[8]
31
26
  }
32
27
  },
33
28
  {
34
- types: ["punctuation"],
29
+ types: ["string"],
35
30
  style: {
36
- color: theme.colors.carbon[6]
31
+ color: theme.colors.purple[8]
37
32
  }
38
33
  },
39
34
  {
40
35
  types: ["variable"],
41
36
  style: {
42
- color: theme.colors.carbon[6]
37
+ color: theme.colors.airy[9]
43
38
  }
44
39
  },
45
40
  {
46
- types: ["class-name", "attr-name"],
41
+ types: ["escape"],
47
42
  style: {
48
- color: theme.colors.yellow[5]
43
+ color: theme.colors.ocher[8]
49
44
  }
50
45
  },
51
46
  {
52
- types: ["tag", "deleted"],
47
+ types: ["tag"],
53
48
  style: {
54
- color: theme.colors.red[6]
49
+ color: theme.colors.aqua[8]
55
50
  }
56
51
  },
57
52
  {
58
- types: ["operator"],
53
+ types: ["heading"],
59
54
  style: {
60
- color: theme.colors.carbon[6]
55
+ color: theme.colors.blue[8]
61
56
  }
62
57
  },
63
58
  {
64
- types: ["boolean"],
59
+ types: ["quote"],
65
60
  style: {
66
- color: theme.colors.red[6]
61
+ color: theme.colors.carbon[8]
67
62
  }
68
63
  },
69
64
  {
70
- types: ["keyword"],
65
+ types: ["list"],
71
66
  style: {
72
- color: theme.colors.violet[3]
67
+ color: theme.colors.magenta[8]
73
68
  }
74
69
  },
75
70
  {
76
- types: ["doctype"],
71
+ types: ["documentMeta"],
77
72
  style: {
78
- color: theme.colors.carbon[6]
73
+ color: theme.colors.gray[8]
79
74
  }
80
75
  },
81
76
  {
82
- types: ["url"],
77
+ types: ["function"],
83
78
  style: {
84
- color: theme.colors.carbon[6]
85
- }
86
- }
87
- ]
88
- });
89
- const light = (theme) => ({
90
- plain: {
91
- color: theme.colors.carbon[9],
92
- backgroundColor: theme.fn.rgba(theme.colors.carbon[1], 0.65)
93
- },
94
- styles: [
95
- {
96
- types: ["comment"],
97
- style: {
98
- color: theme.colors.carbon[7]
99
- }
100
- },
101
- {
102
- types: ["string", "inserted"],
103
- style: {
104
- color: theme.colors.violet[9]
79
+ color: theme.colors.mauve[8]
105
80
  }
106
81
  },
107
82
  {
108
- types: ["number"],
83
+ types: ["type", "class-name"],
109
84
  style: {
110
- color: theme.colors.blue[7]
85
+ color: theme.colors.violet[8]
111
86
  }
112
87
  },
88
+ // other languages
113
89
  {
114
- types: ["builtin", "char", "constant", "function", "selector", "atrule"],
90
+ types: ["builtin", "char", "constant", "selector", "atrule"],
115
91
  style: {
116
92
  color: theme.colors.thyme[9]
117
93
  }
@@ -122,12 +98,6 @@ const light = (theme) => ({
122
98
  color: theme.colors.carbon[8]
123
99
  }
124
100
  },
125
- {
126
- types: ["variable"],
127
- style: {
128
- color: theme.colors.violet[9]
129
- }
130
- },
131
101
  {
132
102
  types: ["attr-name"],
133
103
  style: {
@@ -135,13 +105,7 @@ const light = (theme) => ({
135
105
  }
136
106
  },
137
107
  {
138
- types: ["class-name"],
139
- style: {
140
- color: theme.colors.red[9]
141
- }
142
- },
143
- {
144
- types: ["tag", "deleted"],
108
+ types: ["deleted"],
145
109
  style: {
146
110
  color: theme.colors.violet[9]
147
111
  }
@@ -158,12 +122,6 @@ const light = (theme) => ({
158
122
  color: theme.colors.red[9]
159
123
  }
160
124
  },
161
- {
162
- types: ["keyword"],
163
- style: {
164
- color: theme.colors.red[9]
165
- }
166
- },
167
125
  {
168
126
  types: ["doctype"],
169
127
  style: {
@@ -178,7 +136,6 @@ const light = (theme) => ({
178
136
  }
179
137
  ]
180
138
  });
181
- const getPrismTheme = (theme, colorScheme) => colorScheme === "dark" ? dark(theme) : light(theme);
182
- exports.dark = dark;
139
+ const getPrismTheme = (theme) => light(theme);
183
140
  exports.getPrismTheme = getPrismTheme;
184
141
  exports.light = light;
package/dist/primitive/Prism/prism-theme.d.cts CHANGED
@@ -3,4 +3,4 @@ import { PrismTheme } from 'prism-react-renderer';
3
3
 
4
4
  export declare const dark: (theme: MantineTheme) => PrismTheme;
5
5
  export declare const light: (theme: MantineTheme) => PrismTheme;
6
- export declare const getPrismTheme: (theme: MantineTheme, colorScheme: "light" | "dark") => PrismTheme;
6
+ export declare const getPrismTheme: (theme: MantineTheme) => PrismTheme;
package/dist/primitive/Prism/prism-theme.d.ts CHANGED
@@ -3,4 +3,4 @@ import { PrismTheme } from 'prism-react-renderer';
3
3
 
4
4
  export declare const dark: (theme: MantineTheme) => PrismTheme;
5
5
  export declare const light: (theme: MantineTheme) => PrismTheme;
6
- export declare const getPrismTheme: (theme: MantineTheme, colorScheme: "light" | "dark") => PrismTheme;
6
+ export declare const getPrismTheme: (theme: MantineTheme) => PrismTheme;
package/dist/primitive/Prism/prism-theme.js CHANGED
@@ -1,115 +1,91 @@
1
- const dark = (theme) => ({
1
+ const light = (theme) => ({
2
2
  plain: {
3
- color: theme.colors.carbon[5],
4
- backgroundColor: theme.colors.carbon[8]
3
+ color: theme.colors.carbon[9],
4
+ backgroundColor: theme.fn.rgba(theme.colors.carbon[1], 0.65)
5
5
  },
6
6
  styles: [
7
+ // from sql editor
7
8
  {
8
- types: ["comment"],
9
+ types: ["comment", "meta"],
9
10
  style: {
10
- color: theme.colors.carbon[7]
11
+ color: theme.colors.green[8]
11
12
  }
12
13
  },
13
14
  {
14
- types: ["string", "inserted", "selector", "atrule"],
15
+ types: ["keyword", "strong"],
15
16
  style: {
16
- color: theme.colors.aqua[4]
17
+ color: theme.colors.sky[8]
17
18
  }
18
19
  },
19
20
  {
20
21
  types: ["number"],
21
22
  style: {
22
- color: theme.colors.peacock[4]
23
- }
24
- },
25
- {
26
- types: ["builtin", "char", "constant", "function"],
27
- style: {
28
- color: theme.colors.yellow[5]
23
+ color: theme.colors.rosy[8]
29
24
  }
30
25
  },
31
26
  {
32
- types: ["punctuation"],
27
+ types: ["string"],
33
28
  style: {
34
- color: theme.colors.carbon[6]
29
+ color: theme.colors.purple[8]
35
30
  }
36
31
  },
37
32
  {
38
33
  types: ["variable"],
39
34
  style: {
40
- color: theme.colors.carbon[6]
35
+ color: theme.colors.airy[9]
41
36
  }
42
37
  },
43
38
  {
44
- types: ["class-name", "attr-name"],
39
+ types: ["escape"],
45
40
  style: {
46
- color: theme.colors.yellow[5]
41
+ color: theme.colors.ocher[8]
47
42
  }
48
43
  },
49
44
  {
50
- types: ["tag", "deleted"],
45
+ types: ["tag"],
51
46
  style: {
52
- color: theme.colors.red[6]
47
+ color: theme.colors.aqua[8]
53
48
  }
54
49
  },
55
50
  {
56
- types: ["operator"],
51
+ types: ["heading"],
57
52
  style: {
58
- color: theme.colors.carbon[6]
53
+ color: theme.colors.blue[8]
59
54
  }
60
55
  },
61
56
  {
62
- types: ["boolean"],
57
+ types: ["quote"],
63
58
  style: {
64
- color: theme.colors.red[6]
59
+ color: theme.colors.carbon[8]
65
60
  }
66
61
  },
67
62
  {
68
- types: ["keyword"],
63
+ types: ["list"],
69
64
  style: {
70
- color: theme.colors.violet[3]
65
+ color: theme.colors.magenta[8]
71
66
  }
72
67
  },
73
68
  {
74
- types: ["doctype"],
69
+ types: ["documentMeta"],
75
70
  style: {
76
- color: theme.colors.carbon[6]
71
+ color: theme.colors.gray[8]
77
72
  }
78
73
  },
79
74
  {
80
- types: ["url"],
75
+ types: ["function"],
81
76
  style: {
82
- color: theme.colors.carbon[6]
83
- }
84
- }
85
- ]
86
- });
87
- const light = (theme) => ({
88
- plain: {
89
- color: theme.colors.carbon[9],
90
- backgroundColor: theme.fn.rgba(theme.colors.carbon[1], 0.65)
91
- },
92
- styles: [
93
- {
94
- types: ["comment"],
95
- style: {
96
- color: theme.colors.carbon[7]
97
- }
98
- },
99
- {
100
- types: ["string", "inserted"],
101
- style: {
102
- color: theme.colors.violet[9]
77
+ color: theme.colors.mauve[8]
103
78
  }
104
79
  },
105
80
  {
106
- types: ["number"],
81
+ types: ["type", "class-name"],
107
82
  style: {
108
- color: theme.colors.blue[7]
83
+ color: theme.colors.violet[8]
109
84
  }
110
85
  },
86
+ // other languages
111
87
  {
112
- types: ["builtin", "char", "constant", "function", "selector", "atrule"],
88
+ types: ["builtin", "char", "constant", "selector", "atrule"],
113
89
  style: {
114
90
  color: theme.colors.thyme[9]
115
91
  }
@@ -120,12 +96,6 @@ const light = (theme) => ({
120
96
  color: theme.colors.carbon[8]
121
97
  }
122
98
  },
123
- {
124
- types: ["variable"],
125
- style: {
126
- color: theme.colors.violet[9]
127
- }
128
- },
129
99
  {
130
100
  types: ["attr-name"],
131
101
  style: {
@@ -133,13 +103,7 @@ const light = (theme) => ({
133
103
  }
134
104
  },
135
105
  {
136
- types: ["class-name"],
137
- style: {
138
- color: theme.colors.red[9]
139
- }
140
- },
141
- {
142
- types: ["tag", "deleted"],
106
+ types: ["deleted"],
143
107
  style: {
144
108
  color: theme.colors.violet[9]
145
109
  }
@@ -156,12 +120,6 @@ const light = (theme) => ({
156
120
  color: theme.colors.red[9]
157
121
  }
158
122
  },
159
- {
160
- types: ["keyword"],
161
- style: {
162
- color: theme.colors.red[9]
163
- }
164
- },
165
123
  {
166
124
  types: ["doctype"],
167
125
  style: {
@@ -176,9 +134,8 @@ const light = (theme) => ({
176
134
  }
177
135
  ]
178
136
  });
179
- const getPrismTheme = (theme, colorScheme) => colorScheme === "dark" ? dark(theme) : light(theme);
137
+ const getPrismTheme = (theme) => light(theme);
180
138
  export {
181
- dark,
182
139
  getPrismTheme,
183
140
  light
184
141
  };
package/dist/theme/theme.cjs CHANGED
@@ -410,6 +410,9 @@ const theme = {
410
410
  }
411
411
  },
412
412
  Alert: {
413
+ defaultProps: {
414
+ color: "peacock"
415
+ },
413
416
  styles: (theme2, params) => {
414
417
  return {
415
418
  root: {
@@ -516,6 +519,9 @@ const theme = {
516
519
  }
517
520
  },
518
521
  Badge: {
522
+ defaultProps: {
523
+ color: "peacock"
524
+ },
519
525
  styles(theme2, params) {
520
526
  const color = params.color ?? theme2.primaryColor;
521
527
  const mainShade = color.includes("carbon") ? 9 : 7;
@@ -640,7 +646,7 @@ const theme = {
640
646
  borderTopRightRadius: theme2.defaultRadius,
641
647
  padding: "16px 16px 16px 24px",
642
648
  margin: 0,
643
- backgroundColor: theme2.colors.carbon[2]
649
+ backgroundColor: theme2.colors.carbon[1]
644
650
  },
645
651
  title: {
646
652
  fontWeight: 700,
@@ -649,7 +655,8 @@ const theme = {
649
655
  color: theme2.colors.carbon[9]
650
656
  },
651
657
  body: {
652
- padding: 24
658
+ padding: 24,
659
+ backgroundColor: theme2.colors.carbon[0]
653
660
  }
654
661
  })
655
662
  },
@@ -794,6 +801,118 @@ const theme = {
794
801
  }
795
802
  };
796
803
  }
804
+ },
805
+ Tooltip: {
806
+ defaultProps: {
807
+ withArrow: true
808
+ },
809
+ styles(theme2) {
810
+ const styles = {
811
+ dark: {
812
+ backgroundColor: theme2.colors.carbon[8],
813
+ color: theme2.colors.carbon[1]
814
+ },
815
+ light: {
816
+ backgroundColor: theme2.colors.carbon[8],
817
+ color: theme2.colors.carbon[1]
818
+ }
819
+ };
820
+ return {
821
+ tooltip: {
822
+ ...styles[theme2.colorScheme]
823
+ }
824
+ };
825
+ }
826
+ },
827
+ ActionIcon: {
828
+ defaultProps: {
829
+ variant: "default",
830
+ color: "carbon"
831
+ },
832
+ styles(theme2, params) {
833
+ const color = params.color ?? theme2.primaryColor;
834
+ const shade = color.includes("carbon") ? 8 : 7;
835
+ const variantStyles = {
836
+ default: {
837
+ color: theme2.fn.themeColor(color, 8),
838
+ backgroundColor: theme2.fn.themeColor(color, 2),
839
+ borderColor: theme2.fn.themeColor(color, 5),
840
+ "&:hover": {
841
+ color: theme2.fn.themeColor(color, 9),
842
+ backgroundColor: theme2.fn.themeColor(color, 2),
843
+ borderColor: theme2.fn.themeColor(color, 6)
844
+ },
845
+ "&:active": {
846
+ color: theme2.fn.themeColor(color, 9),
847
+ backgroundColor: theme2.fn.themeColor(color, 4),
848
+ borderColor: theme2.fn.themeColor(color, 6)
849
+ },
850
+ "&:disabled": {
851
+ color: theme2.fn.themeColor(color, 6),
852
+ backgroundColor: theme2.fn.themeColor(color, 2),
853
+ borderColor: theme2.fn.themeColor(color, 5)
854
+ }
855
+ },
856
+ transparent: {
857
+ backgroundColor: "transparent",
858
+ color: theme2.fn.themeColor(color, shade)
859
+ },
860
+ subtle: {
861
+ backgroundColor: "transparent",
862
+ color: theme2.fn.themeColor(color, 8),
863
+ "&:hover": {
864
+ backgroundColor: theme2.fn.themeColor(color, 2)
865
+ },
866
+ "&:active": {
867
+ backgroundColor: theme2.fn.themeColor(color, 4)
868
+ },
869
+ "&:disabled": {
870
+ color: theme2.fn.themeColor(color, 6)
871
+ }
872
+ },
873
+ outline: {
874
+ backgroundColor: "transparent",
875
+ color: theme2.fn.themeColor(color, shade),
876
+ border: `1px solid ${theme2.fn.themeColor(color, 4)}`,
877
+ "&:hover": {
878
+ backgroundColor: theme2.fn.themeColor(color, 2)
879
+ }
880
+ },
881
+ filled: {
882
+ backgroundColor: theme2.fn.themeColor(color, color.includes("carbon") ? 9 : 7),
883
+ color: theme2.white
884
+ },
885
+ light: {
886
+ backgroundColor: theme2.fn.themeColor(color, 3),
887
+ color: theme2.fn.themeColor(color, 8),
888
+ "&:hover": {
889
+ backgroundColor: theme2.fn.themeColor(color, 4)
890
+ },
891
+ "&:active": {
892
+ backgroundColor: theme2.fn.themeColor(color, 5)
893
+ }
894
+ }
895
+ };
896
+ return {
897
+ root: {
898
+ ...variantStyles[params.variant]
899
+ }
900
+ };
901
+ }
902
+ },
903
+ RangeCalendar: {
904
+ styles: (theme2) => ({
905
+ day: {
906
+ "&[data-first-in-range]": {
907
+ borderTopLeftRadius: theme2.defaultRadius,
908
+ borderBottomLeftRadius: theme2.defaultRadius
909
+ },
910
+ "&[data-last-in-range]": {
911
+ borderTopRightRadius: theme2.defaultRadius,
912
+ borderBottomRightRadius: theme2.defaultRadius
913
+ }
914
+ }
915
+ })
797
916
  }
798
917
  }
799
918
  };
package/dist/theme/theme.js CHANGED
@@ -408,6 +408,9 @@ const theme = {
408
408
  }
409
409
  },
410
410
  Alert: {
411
+ defaultProps: {
412
+ color: "peacock"
413
+ },
411
414
  styles: (theme2, params) => {
412
415
  return {
413
416
  root: {
@@ -514,6 +517,9 @@ const theme = {
514
517
  }
515
518
  },
516
519
  Badge: {
520
+ defaultProps: {
521
+ color: "peacock"
522
+ },
517
523
  styles(theme2, params) {
518
524
  const color = params.color ?? theme2.primaryColor;
519
525
  const mainShade = color.includes("carbon") ? 9 : 7;
@@ -638,7 +644,7 @@ const theme = {
638
644
  borderTopRightRadius: theme2.defaultRadius,
639
645
  padding: "16px 16px 16px 24px",
640
646
  margin: 0,
641
- backgroundColor: theme2.colors.carbon[2]
647
+ backgroundColor: theme2.colors.carbon[1]
642
648
  },
643
649
  title: {
644
650
  fontWeight: 700,
@@ -647,7 +653,8 @@ const theme = {
647
653
  color: theme2.colors.carbon[9]
648
654
  },
649
655
  body: {
650
- padding: 24
656
+ padding: 24,
657
+ backgroundColor: theme2.colors.carbon[0]
651
658
  }
652
659
  })
653
660
  },
@@ -792,6 +799,118 @@ const theme = {
792
799
  }
793
800
  };
794
801
  }
802
+ },
803
+ Tooltip: {
804
+ defaultProps: {
805
+ withArrow: true
806
+ },
807
+ styles(theme2) {
808
+ const styles = {
809
+ dark: {
810
+ backgroundColor: theme2.colors.carbon[8],
811
+ color: theme2.colors.carbon[1]
812
+ },
813
+ light: {
814
+ backgroundColor: theme2.colors.carbon[8],
815
+ color: theme2.colors.carbon[1]
816
+ }
817
+ };
818
+ return {
819
+ tooltip: {
820
+ ...styles[theme2.colorScheme]
821
+ }
822
+ };
823
+ }
824
+ },
825
+ ActionIcon: {
826
+ defaultProps: {
827
+ variant: "default",
828
+ color: "carbon"
829
+ },
830
+ styles(theme2, params) {
831
+ const color = params.color ?? theme2.primaryColor;
832
+ const shade = color.includes("carbon") ? 8 : 7;
833
+ const variantStyles = {
834
+ default: {
835
+ color: theme2.fn.themeColor(color, 8),
836
+ backgroundColor: theme2.fn.themeColor(color, 2),
837
+ borderColor: theme2.fn.themeColor(color, 5),
838
+ "&:hover": {
839
+ color: theme2.fn.themeColor(color, 9),
840
+ backgroundColor: theme2.fn.themeColor(color, 2),
841
+ borderColor: theme2.fn.themeColor(color, 6)
842
+ },
843
+ "&:active": {
844
+ color: theme2.fn.themeColor(color, 9),
845
+ backgroundColor: theme2.fn.themeColor(color, 4),
846
+ borderColor: theme2.fn.themeColor(color, 6)
847
+ },
848
+ "&:disabled": {
849
+ color: theme2.fn.themeColor(color, 6),
850
+ backgroundColor: theme2.fn.themeColor(color, 2),
851
+ borderColor: theme2.fn.themeColor(color, 5)
852
+ }
853
+ },
854
+ transparent: {
855
+ backgroundColor: "transparent",
856
+ color: theme2.fn.themeColor(color, shade)
857
+ },
858
+ subtle: {
859
+ backgroundColor: "transparent",
860
+ color: theme2.fn.themeColor(color, 8),
861
+ "&:hover": {
862
+ backgroundColor: theme2.fn.themeColor(color, 2)
863
+ },
864
+ "&:active": {
865
+ backgroundColor: theme2.fn.themeColor(color, 4)
866
+ },
867
+ "&:disabled": {
868
+ color: theme2.fn.themeColor(color, 6)
869
+ }
870
+ },
871
+ outline: {
872
+ backgroundColor: "transparent",
873
+ color: theme2.fn.themeColor(color, shade),
874
+ border: `1px solid ${theme2.fn.themeColor(color, 4)}`,
875
+ "&:hover": {
876
+ backgroundColor: theme2.fn.themeColor(color, 2)
877
+ }
878
+ },
879
+ filled: {
880
+ backgroundColor: theme2.fn.themeColor(color, color.includes("carbon") ? 9 : 7),
881
+ color: theme2.white
882
+ },
883
+ light: {
884
+ backgroundColor: theme2.fn.themeColor(color, 3),
885
+ color: theme2.fn.themeColor(color, 8),
886
+ "&:hover": {
887
+ backgroundColor: theme2.fn.themeColor(color, 4)
888
+ },
889
+ "&:active": {
890
+ backgroundColor: theme2.fn.themeColor(color, 5)
891
+ }
892
+ }
893
+ };
894
+ return {
895
+ root: {
896
+ ...variantStyles[params.variant]
897
+ }
898
+ };
899
+ }
900
+ },
901
+ RangeCalendar: {
902
+ styles: (theme2) => ({
903
+ day: {
904
+ "&[data-first-in-range]": {
905
+ borderTopLeftRadius: theme2.defaultRadius,
906
+ borderBottomLeftRadius: theme2.defaultRadius
907
+ },
908
+ "&[data-last-in-range]": {
909
+ borderTopRightRadius: theme2.defaultRadius,
910
+ borderBottomRightRadius: theme2.defaultRadius
911
+ }
912
+ }
913
+ })
795
914
  }
796
915
  }
797
916
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tidbcloud/uikit",
3
- "version": "2.0.0-beta.21",
3
+ "version": "2.0.0-beta.23",
4
4
  "description": "tidbcloud uikit",
5
5
  "type": "module",
6
6
  "main": "dist/primitive/index.cjs",