@tidbcloud/uikit 2.0.0-beta.3 → 2.0.0-beta.30

package/CHANGELOG.md

@@ -1,5 +1,167 @@
 # @tidbcloud/uikit
 
+## 2.0.0-beta.30
+
+### Patch Changes
+
+- Select description use carbon.7
+
+## 2.0.0-beta.29
+
+### Minor Changes
+
+- Update Button padding and font weight, TextInput description use color carbon.7
+
+## 2.0.0-beta.28
+
+### Minor Changes
+
+- Update Input/Select/PhoneInput styles
+
+## 2.0.0-beta.27
+
+### Minor Changes
+
+- Update stepper styles and set dot badge to font weight 400
+
+## 2.0.0-beta.26
+
+### Patch Changes
+
+- fix modal border radius
+
+## 2.0.0-beta.25
+
+### Patch Changes
+
+- update table border
+
+## 2.0.0-beta.24
+
+### Minor Changes
+
+- ActionIcon default to subtle, Anchor default to peacock, ProTable row hover to bg caron.3
+
+## 2.0.0-beta.23
+
+### Minor Changes
+
+- make PageShell back icon and CodeBlock Copy icon to subtle
+
+## 2.0.0-beta.22
+
+### Minor Changes
+
+- Update ActionIcon/Tooltip/Modal style set Badge/Alert default to peacock color
+
+## 2.0.0-beta.21
+
+### Minor Changes
+
+- Update Badge/Switch style and fix menu data attributes style
+
+## 2.0.0-beta.20
+
+### Minor Changes
+
+- Update badge styles
+
+## 2.0.0-beta.19
+
+### Minor Changes
+
+- Adjust theme colors in components
+
+## 2.0.0-beta.18
+
+### Minor Changes
+
+- Update Menu/Checkbox/Badge/Paper style
+
+## 2.0.0-beta.17
+
+### Patch Changes
+
+- Update Card/Paper/ProTable styles
+
+## 2.0.0-beta.16
+
+### Patch Changes
+
+- adjust color and backgroundColor for NavLink
+
+## 2.0.0-beta.15
+
+### Minor Changes
+
+- Update NavLink/SegmentedControl/Tabs style
+
+## 2.0.0-beta.14
+
+### Minor Changes
+
+- update ProTable style
+
+## 2.0.0-beta.13
+
+### Patch Changes
+
+- map gray color to carbon
+
+## 2.0.0-beta.12
+
+### Minor Changes
+
+- map gray color to carbon
+
+## 2.0.0-beta.11
+
+### Patch Changes
+
+- fix radio icon and label size mapping
+
+## 2.0.0-beta.10
+
+### Minor Changes
+
+- Update radio and radio group style
+
+## 2.0.0-beta.9
+
+### Minor Changes
+
+- Update button styles and typography colors
+
+## 2.0.0-beta.8
+
+### Minor Changes
+
+- add new theming color
+
+## 2.0.0-beta.7
+
+### Patch Changes
+
+- fix timezone props bug for TimeRangePicker component
+
+## 2.0.0-beta.6
+
+### Patch Changes
+
+- export helper functions for TimeRangePicker component
+
+## 2.0.0-beta.5
+
+### Minor Changes
+
+- add TimeRangePicker component
+
+## 2.0.0-beta.4
+
+### Patch Changes
+
+- Fix `useURLQueryState` bug
+
 ## 2.0.0-beta.3
 
 ### Patch Changes
@@ -24,6 +186,12 @@
 
 - Upgrade react-hook-form to v7
 
+## 1.18.0
+
+### Minor Changes
+
+- cd2433d: add icon: vector
+
 ## 1.17.1
 
 ### Patch Changes

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (C) 2024 by TiDB Cloud FE Team https://tiui.tidbcloud.com/
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/dist/biz/CodeBlock/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs");
+const jsxRuntime = require("../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.cjs");
 const React = require("react");
 const Check = require("../../icons/react/Check.cjs");
 const ChevronVerticalExpand = require("../../icons/react/ChevronVerticalExpand.cjs");
@@ -8,13 +8,14 @@ const ChevronVerticalShrink = require("../../icons/react/ChevronVerticalShrink.c
 const Copy01 = require("../../icons/react/Copy01.cjs");
 const styles = require("../../utils/styles.cjs");
 const Prism = require("../../primitive/Prism/Prism.cjs");
-const Group = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Group/Group.cjs");
-const Tooltip = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Tooltip/Tooltip.cjs");
-const ActionIcon = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/ActionIcon/ActionIcon.cjs");
-const CopyButton = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/CopyButton/CopyButton.cjs");
-const Code = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Code/Code.cjs");
-const useLocalStorage = require("../../node_modules/.pnpm/@mantine_hooks@5.10.4_react@18.2.0/node_modules/@mantine/hooks/esm/use-local-storage/use-local-storage.cjs");
-const Box = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Box/Box.cjs");
+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");
+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");
+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");
+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");
+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");
+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");
+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");
+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");
 function useFold(persistenceKey) {
   const foldPersistenceKey = `${persistenceKey}.codeblock.fold`;
   const [persistentFolded, setPersistentFolded] = useLocalStorage.useLocalStorage({
@@ -55,9 +56,9 @@ const CodeBlock = ({
       {
         p: "md",
         mah,
-        bg: "gray.1",
+        bg: "carbon.2",
         sx: (theme) => ({
-          border: `1px solid ${theme.colors.gray[4]}`,
+          border: `1px solid ${theme.colors.carbon[5]}`,
           borderRadius: theme.defaultRadius,
           overflow: "auto"
         }),
@@ -87,32 +88,38 @@ const CodeBlock = ({
         )
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(Group.Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.gray[7] }), children: [
-      foldIconVisible && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Tooltip.Tooltip, { label: folded ? "Expand" : "Collapse", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-        ActionIcon.ActionIcon,
-        {
-          variant: "transparent",
-          size: "sm",
-          onClick: () => {
-            const v = !folded;
-            setFolded(v);
-            onFoldIconClick == null ? void 0 : onFoldIconClick(v);
-          },
-          children: folded ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
-        }
-      ) }),
-      /* @__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(
-        ActionIcon.ActionIcon,
-        {
-          variant: "transparent",
-          size: "sm",
-          onClick: () => {
-            copy();
-            onCopyClick == null ? void 0 : onCopyClick();
-          },
-          children: copied ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Check, { size: 14 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Copy01, { size: 14, strokeWidth: 2.5 })
-        }
-      ) }) })
+    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(Group.Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.carbon[8] }), children: [
+      foldIconVisible && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(HoverCard.HoverCard, { withArrow: true, position: "top", children: [
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Target, { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+          ActionIcon.ActionIcon,
+          {
+            size: "sm",
+            variant: "subtle",
+            onClick: () => {
+              const v = !folded;
+              setFolded(v);
+              onFoldIconClick == null ? void 0 : onFoldIconClick(v);
+            },
+            children: folded ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Dropdown, { children: folded ? "Expand" : "Collapse" })
+      ] }),
+      /* @__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: [
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Target, { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+          ActionIcon.ActionIcon,
+          {
+            size: "sm",
+            variant: "subtle",
+            onClick: () => {
+              copy();
+              onCopyClick == null ? void 0 : onCopyClick();
+            },
+            children: copied ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Check, { size: 14 }) : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Copy01, { size: 14, strokeWidth: 2.5 })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(HoverCard.HoverCard.Dropdown, { children: copied ? "Copied" : "Copy" })
+      ] }) })
     ] })
   ] });
 };
@@ -120,7 +127,7 @@ const CopyText = ({ children, value, ...rest }) => {
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
     Code.Code,
     {
-      bg: "gray.2",
+      bg: "carbon.3",
       ...rest,
       p: 8,
       sx: (theme) => {
@@ -140,7 +147,7 @@ const CopyText = ({ children, value, ...rest }) => {
         /* @__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(
           ActionIcon.ActionIcon,
           {
-            variant: "transparent",
+            variant: "subtle",
             size: "sm",
             ml: 8,
             display: "inline-block",

package/dist/biz/CodeBlock/index.d.cts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BoxProps, CodeProps } from '../../primitive/index.js';
 import { PrismProps } from '../../primitive/Prism/index.js';
+
 export interface CodeBlockProps extends BoxProps {
     language?: PrismProps['language'];
     codeRender?: (content: string) => React.ReactNode;

package/dist/biz/CodeBlock/index.d.ts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BoxProps, CodeProps } from '../../primitive/index.js';
 import { PrismProps } from '../../primitive/Prism/index.js';
+
 export interface CodeBlockProps extends BoxProps {
     language?: PrismProps['language'];
     codeRender?: (content: string) => React.ReactNode;

package/dist/biz/CodeBlock/index.js

@@ -1,4 +1,4 @@
-import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
 import { useMemo, useState } from "react";
 import IconCheck from "../../icons/react/Check.js";
 import IconChevronVerticalExpand from "../../icons/react/ChevronVerticalExpand.js";
@@ -6,13 +6,14 @@ import IconChevronVerticalShrink from "../../icons/react/ChevronVerticalShrink.j
 import IconCopy01 from "../../icons/react/Copy01.js";
 import { mergeSxList, mergeStylesList } from "../../utils/styles.js";
 import { MantinePrism } from "../../primitive/Prism/Prism.js";
-import { Group } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Group/Group.js";
-import { Tooltip } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Tooltip/Tooltip.js";
-import { ActionIcon } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/ActionIcon/ActionIcon.js";
-import { CopyButton } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/CopyButton/CopyButton.js";
-import { Code } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Code/Code.js";
-import { useLocalStorage } from "../../node_modules/.pnpm/@mantine_hooks@5.10.4_react@18.2.0/node_modules/@mantine/hooks/esm/use-local-storage/use-local-storage.js";
-import { Box } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Box/Box.js";
+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";
+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";
+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";
+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";
+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";
+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";
+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";
+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";
 function useFold(persistenceKey) {
   const foldPersistenceKey = `${persistenceKey}.codeblock.fold`;
   const [persistentFolded, setPersistentFolded] = useLocalStorage({
@@ -53,9 +54,9 @@ const CodeBlock = ({
       {
         p: "md",
         mah,
-        bg: "gray.1",
+        bg: "carbon.2",
         sx: (theme) => ({
-          border: `1px solid ${theme.colors.gray[4]}`,
+          border: `1px solid ${theme.colors.carbon[5]}`,
           borderRadius: theme.defaultRadius,
           overflow: "auto"
         }),
@@ -85,32 +86,38 @@ const CodeBlock = ({
         )
       }
     ),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.gray[7] }), children: [
-      foldIconVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip, { label: folded ? "Expand" : "Collapse", withArrow: true, position: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        ActionIcon,
-        {
-          variant: "transparent",
-          size: "sm",
-          onClick: () => {
-            const v = !folded;
-            setFolded(v);
-            onFoldIconClick == null ? void 0 : onFoldIconClick(v);
-          },
-          children: folded ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
-        }
-      ) }),
-      /* @__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(
-        ActionIcon,
-        {
-          variant: "transparent",
-          size: "sm",
-          onClick: () => {
-            copy();
-            onCopyClick == null ? void 0 : onCopyClick();
-          },
-          children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconCopy01, { size: 14, strokeWidth: 2.5 })
-        }
-      ) }) })
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(Group, { spacing: 4, sx: (theme) => ({ position: "absolute", top: 16, right: 16, color: theme.colors.carbon[8] }), children: [
+      foldIconVisible && /* @__PURE__ */ jsxRuntimeExports.jsxs(HoverCard, { withArrow: true, position: "top", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Target, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          ActionIcon,
+          {
+            size: "sm",
+            variant: "subtle",
+            onClick: () => {
+              const v = !folded;
+              setFolded(v);
+              onFoldIconClick == null ? void 0 : onFoldIconClick(v);
+            },
+            children: folded ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalExpand, { size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconChevronVerticalShrink, { size: 14, strokeWidth: 2.5 })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Dropdown, { children: folded ? "Expand" : "Collapse" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(CopyButton, { value: copyContent ?? children, timeout: 2e3, children: ({ copied, copy }) => /* @__PURE__ */ jsxRuntimeExports.jsxs(HoverCard, { withArrow: true, position: "top", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Target, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          ActionIcon,
+          {
+            size: "sm",
+            variant: "subtle",
+            onClick: () => {
+              copy();
+              onCopyClick == null ? void 0 : onCopyClick();
+            },
+            children: copied ? /* @__PURE__ */ jsxRuntimeExports.jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(IconCopy01, { size: 14, strokeWidth: 2.5 })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(HoverCard.Dropdown, { children: copied ? "Copied" : "Copy" })
+      ] }) })
     ] })
   ] });
 };
@@ -118,7 +125,7 @@ const CopyText = ({ children, value, ...rest }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     Code,
     {
-      bg: "gray.2",
+      bg: "carbon.3",
       ...rest,
       p: 8,
       sx: (theme) => {
@@ -138,7 +145,7 @@ const CopyText = ({ children, value, ...rest }) => {
         /* @__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(
           ActionIcon,
           {
-            variant: "transparent",
+            variant: "subtle",
             size: "sm",
             ml: 8,
             display: "inline-block",

package/dist/biz/Dot/index.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs");
-const Box = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Box/Box.cjs");
+const jsxRuntime = require("../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.cjs");
+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");
 const Dot = ({ color, size = 8, ...rest }) => {
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
     Box.Box,
@@ -9,7 +9,7 @@ const Dot = ({ color, size = 8, ...rest }) => {
       sx: (theme) => {
         var _a;
         return {
-          backgroundColor: ((_a = theme.colors[color]) == null ? void 0 : _a[5]) ?? theme.colors.gray[5],
+          backgroundColor: ((_a = theme.colors[color]) == null ? void 0 : _a[5]) ?? theme.colors.carbon[6],
           height: size,
           width: size,
           borderRadius: "50%"

package/dist/biz/Dot/index.d.cts

@@ -1,8 +1,9 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BoxProps } from '../../primitive/index.js';
-import { Colors } from '../../theme/index.js';
+import { Color } from '../../theme/index.js';
+
 export interface DotProps extends BoxProps {
-    color: keyof typeof Colors;
+    color: Color;
     size?: number;
 }
 export declare const Dot: React.FC<DotProps>;

package/dist/biz/Dot/index.d.ts

@@ -1,8 +1,9 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BoxProps } from '../../primitive/index.js';
-import { Colors } from '../../theme/index.js';
+import { Color } from '../../theme/index.js';
+
 export interface DotProps extends BoxProps {
-    color: keyof typeof Colors;
+    color: Color;
     size?: number;
 }
 export declare const Dot: React.FC<DotProps>;

package/dist/biz/Dot/index.js

@@ -1,5 +1,5 @@
-import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
-import { Box } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Box/Box.js";
+import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+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";
 const Dot = ({ color, size = 8, ...rest }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     Box,
@@ -7,7 +7,7 @@ const Dot = ({ color, size = 8, ...rest }) => {
       sx: (theme) => {
         var _a;
         return {
-          backgroundColor: ((_a = theme.colors[color]) == null ? void 0 : _a[5]) ?? theme.colors.gray[5],
+          backgroundColor: ((_a = theme.colors[color]) == null ? void 0 : _a[5]) ?? theme.colors.carbon[6],
           height: size,
           width: size,
           borderRadius: "50%"

package/dist/biz/DotBadge/index.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs");
+const jsxRuntime = require("../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.cjs");
 const index$1 = require("../../primitive/Typography/index.cjs");
 const index = require("../Dot/index.cjs");
-const Badge = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Badge/Badge.cjs");
+const Badge = 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/Badge/Badge.cjs");
 const DotBadge = ({ color = "green", children, ...rest }) => {
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
     Badge.Badge,

package/dist/biz/DotBadge/index.d.cts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BadgeProps } from '../../primitive/index.js';
 import { DotProps } from '../Dot/index.js';
+
 export interface DotBadgeProps extends Omit<BadgeProps, 'color'> {
     color?: DotProps['color'];
 }

package/dist/biz/DotBadge/index.d.ts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { BadgeProps } from '../../primitive/index.js';
 import { DotProps } from '../Dot/index.js';
+
 export interface DotBadgeProps extends Omit<BadgeProps, 'color'> {
     color?: DotProps['color'];
 }

package/dist/biz/DotBadge/index.js

@@ -1,7 +1,7 @@
-import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
 import { Typography } from "../../primitive/Typography/index.js";
 import { Dot } from "../Dot/index.js";
-import { Badge } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Badge/Badge.js";
+import { Badge } 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/Badge/Badge.js";
 const DotBadge = ({ color = "green", children, ...rest }) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     Badge,

package/dist/biz/Form/Checkbox.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs");
+const jsxRuntime = require("../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.cjs");
 const React = require("react");
 const errorMessage = require("@hookform/error-message");
 const reactHookForm = require("react-hook-form");
-const Checkbox = require("../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Checkbox/Checkbox.cjs");
+const Checkbox = 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/Checkbox/Checkbox.cjs");
 const FormCheckbox = ({ name, rules, onChange, ...rest }) => {
   const { control, formState, getFieldState } = reactHookForm.useFormContext();
   const { error } = getFieldState(name, formState);

package/dist/biz/Form/Checkbox.d.cts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { RegisterOptions } from 'react-hook-form';
 import { CheckboxProps, CheckboxGroupProps } from '../../primitive/index.js';
+
 export interface FormCheckboxProps extends CheckboxProps {
     name: string;
     rules?: RegisterOptions;

package/dist/biz/Form/Checkbox.d.ts

@@ -1,6 +1,7 @@
-import React from 'react';
+import { default as React } from 'react';
 import { RegisterOptions } from 'react-hook-form';
 import { CheckboxProps, CheckboxGroupProps } from '../../primitive/index.js';
+
 export interface FormCheckboxProps extends CheckboxProps {
     name: string;
     rules?: RegisterOptions;

package/dist/biz/Form/Checkbox.js

@@ -1,8 +1,8 @@
-import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { j as jsxRuntimeExports } from "../../node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
 import { createElement } from "react";
 import { ErrorMessage } from "@hookform/error-message";
 import { useFormContext, Controller } from "react-hook-form";
-import { Checkbox } from "../../node_modules/.pnpm/@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Checkbox/Checkbox.js";
+import { Checkbox } 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/Checkbox/Checkbox.js";
 const FormCheckbox = ({ name, rules, onChange, ...rest }) => {
   const { control, formState, getFieldState } = useFormContext();
   const { error } = getFieldState(name, formState);