@oceanbase/ui 0.4.20 → 0.4.21

package/lib/FullscreenBox/index.js

@@ -40,6 +40,7 @@ var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
 var import_util = require("../_util");
 var import_zh_CN = __toESM(require("./locale/zh-CN"));
 var import_index = require("./index.less");
+var import_jsx_runtime = require("react/jsx-runtime");
 var prefix = (0, import_util.getPrefix)("fullscreen-box");
 var FullscreenBox = import_react.default.forwardRef(
   ({ style, header, className, defaultMode, children, onChange }, ref) => {
@@ -90,7 +91,7 @@ var FullscreenBox = import_react.default.forwardRef(
         changeFullscreen(fullscreen);
       }
     }));
-    const icon = innerFullscreen ? /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenExitOutlined, { className: `${prefix}-header-icon`, onClick: toggleFullscreen }) : /* @__PURE__ */ import_react.default.createElement(import_icons.FullscreenOutlined, { className: `${prefix}-header-icon`, onClick: toggleFullscreen });
+    const icon = innerFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FullscreenExitOutlined, { className: `${prefix}-header-icon`, onClick: toggleFullscreen }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FullscreenOutlined, { className: `${prefix}-header-icon`, onClick: toggleFullscreen });
     if (innerFullscreen) {
       document.body.classList.add(`${prefix}-body-overflow-hidden`);
     } else {
@@ -106,19 +107,27 @@ var FullscreenBox = import_react.default.forwardRef(
     } else {
       const title = isStringHeader ? header : isComplexHeader && header.title;
       const extra = isComplexHeader && header.extra;
-      headerContent = /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-header`, "data-testid": "header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-header-left` }, icon, title && /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefix}-header-title ` }, title)), isComplexHeader && extra && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-header-extra` }, extra));
+      headerContent = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `${prefix}-header`, "data-testid": "header", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `${prefix}-header-left`, children: [
+          icon,
+          title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `${prefix}-header-title `, children: title })
+        ] }),
+        isComplexHeader && extra && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `${prefix}-header-extra`, children: extra })
+      ] });
     }
-    return /* @__PURE__ */ import_react.default.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "div",
       {
         ref: containerRef,
         style,
         className: (0, import_classnames.default)(prefix, className, {
           [`${prefix}-fullscreen`]: innerFullscreen
-        })
-      },
-      headerContent,
-      children
+        }),
+        children: [
+          headerContent,
+          children
+        ]
+      }
     );
   }
 );

package/lib/FullscreenBox/locale/ja-JP.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/lib/FullscreenBox/locale/ja-JP.js

@@ -0,0 +1,25 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/FullscreenBox/locale/ja-JP.ts
+var ja_JP_exports = {};
+__export(ja_JP_exports, {
+  default: () => ja_JP_default
+});
+module.exports = __toCommonJS(ja_JP_exports);
+var ja_JP_default = {};

package/lib/GraphToolbar/index.js

@@ -37,13 +37,14 @@ var import_icons = require("@oceanbase/icons");
 var import_util = require("@oceanbase/util");
 var import_design = require("@oceanbase/design");
 var import_lodash = require("lodash");
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
 var import_util2 = require("../_util");
 var import_zh_CN = __toESM(require("./locale/zh-CN"));
 var import_graph_fit_view_icon = __toESM(require("../assets/graph_fit_view_icon.svg"));
 var import_graph_reset_icon = __toESM(require("../assets/graph_reset_icon.svg"));
 var import_index = require("./index.less");
+var import_jsx_runtime = require("react/jsx-runtime");
 function getCenterPointByGraph(graph) {
   const group = graph == null ? void 0 : graph.get("group");
   if (group) {
@@ -79,70 +80,81 @@ var GraphToolbar = ({
       }, 16)
     );
   }, [graph]);
-  return /* @__PURE__ */ import_react.default.createElement(import_design.Space, { size: 16, className: `${prefix} ${`${prefix}-${mode}`} ${className}` }, showFullscreen && /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.fullscreen }, /* @__PURE__ */ import_react.default.createElement(
-    import_icons.FullscreenOutlined,
-    {
-      className: "pointable",
-      onClick: () => {
-        if (onFullscreen) {
-          onFullscreen();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design.Space, { size: 16, className: `${prefix} ${`${prefix}-${mode}`} ${className}`, children: [
+    showFullscreen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.fullscreen, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_icons.FullscreenOutlined,
+      {
+        className: "pointable",
+        onClick: () => {
+          if (onFullscreen) {
+            onFullscreen();
+          }
         }
       }
-    }
-  )), /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefix}-zoom-wrapper` }, /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.shrink }, /* @__PURE__ */ import_react.default.createElement(
-    import_icons.MinusOutlined,
-    {
-      className: zoom >= 0.3 ? `${prefix}-pointable` : `${prefix}-disabled`,
-      onClick: () => {
-        if (zoom >= 0.3) {
-          const newZoom = zoom - 0.1;
-          setZoom(newZoom);
-          graph == null ? void 0 : graph.zoomTo(newZoom, getCenterPointByGraph(graph));
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: `${prefix}-zoom-wrapper`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.shrink, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_icons.MinusOutlined,
+        {
+          className: zoom >= 0.3 ? `${prefix}-pointable` : `${prefix}-disabled`,
+          onClick: () => {
+            if (zoom >= 0.3) {
+              const newZoom = zoom - 0.1;
+              setZoom(newZoom);
+              graph == null ? void 0 : graph.zoomTo(newZoom, getCenterPointByGraph(graph));
+            }
+          }
         }
-      }
-    }
-  )), (0, import_util.toPercent)(zoom), /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.enlarge }, /* @__PURE__ */ import_react.default.createElement(
-    import_icons.PlusOutlined,
-    {
-      className: zoom <= 0.9 ? `${prefix}-pointable` : `${prefix}-disabled`,
-      onClick: () => {
-        if (zoom <= 0.9) {
-          const newZoom = zoom + 0.1;
-          setZoom(newZoom);
-          graph == null ? void 0 : graph.zoomTo(newZoom, getCenterPointByGraph(graph));
+      ) }),
+      (0, import_util.toPercent)(zoom),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.enlarge, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_icons.PlusOutlined,
+        {
+          className: zoom <= 0.9 ? `${prefix}-pointable` : `${prefix}-disabled`,
+          onClick: () => {
+            if (zoom <= 0.9) {
+              const newZoom = zoom + 0.1;
+              setZoom(newZoom);
+              graph == null ? void 0 : graph.zoomTo(newZoom, getCenterPointByGraph(graph));
+            }
+          }
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.reset, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "img",
+      {
+        src: import_graph_reset_icon.default,
+        alt: "",
+        className: `${prefix}-pointable`,
+        onClick: () => {
+          setZoom(1);
+          graph == null ? void 0 : graph.zoomTo(1, getCenterPointByGraph(graph));
         }
       }
-    }
-  ))), /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.reset }, /* @__PURE__ */ import_react.default.createElement(
-    "img",
-    {
-      src: import_graph_reset_icon.default,
-      alt: "",
-      className: `${prefix}-pointable`,
-      onClick: () => {
-        setZoom(1);
-        graph == null ? void 0 : graph.zoomTo(1, getCenterPointByGraph(graph));
-      }
-    }
-  )), /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.fitView }, /* @__PURE__ */ import_react.default.createElement(
-    "img",
-    {
-      src: import_graph_fit_view_icon.default,
-      alt: "",
-      className: `${prefix}-pointable`,
-      onClick: () => {
-        graph == null ? void 0 : graph.fitView();
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.fitView, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "img",
+      {
+        src: import_graph_fit_view_icon.default,
+        alt: "",
+        className: `${prefix}-pointable`,
+        onClick: () => {
+          graph == null ? void 0 : graph.fitView();
+        }
       }
-    }
-  )), onReload && /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(import_design.Divider, { type: "vertical", className: `${prefix}-divider` })), onReload && /* @__PURE__ */ import_react.default.createElement(import_design.Tooltip, { title: locale.refresh }, /* @__PURE__ */ import_react.default.createElement("span", null, /* @__PURE__ */ import_react.default.createElement(
-    import_icons.SyncOutlined,
-    {
-      className: `${prefix}-pointable`,
-      onClick: () => {
-        onReload();
+    ) }),
+    onReload && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Divider, { type: "vertical", className: `${prefix}-divider` }) }),
+    onReload && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Tooltip, { title: locale.refresh, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_icons.SyncOutlined,
+      {
+        className: `${prefix}-pointable`,
+        onClick: () => {
+          onReload();
+        }
       }
-    }
-  ))));
+    ) }) })
+  ] });
 };
 var GraphToolbar_default = (0, import_LocaleWrapper.default)({
   componentName: "GraphToolbar",

package/lib/GraphToolbar/locale/ja-JP.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    fullscreen: string;
+    shrink: string;
+    enlarge: string;
+    reset: string;
+    fitView: string;
+    refresh: string;
+};
+export default _default;

package/lib/GraphToolbar/locale/ja-JP.js

@@ -0,0 +1,32 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/GraphToolbar/locale/ja-JP.ts
+var ja_JP_exports = {};
+__export(ja_JP_exports, {
+  default: () => ja_JP_default
+});
+module.exports = __toCommonJS(ja_JP_exports);
+var ja_JP_default = {
+  fullscreen: "フルスクリーン",
+  shrink: "縮小",
+  enlarge: "拡大",
+  reset: "元の比率を表示",
+  fitView: "キャンバスに合わせる",
+  refresh: "更新"
+};

package/lib/Highlight/DiffView/DiffCells.js

@@ -33,7 +33,7 @@ __export(DiffCells_exports, {
 });
 module.exports = __toCommonJS(DiffCells_exports);
 var import_classnames = __toESM(require("classnames"));
-var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 function DiffCells({
   diffPrefixCls,
   data,
@@ -58,13 +58,20 @@ function DiffCells({
   if (rowIndex !== void 0) {
     rowIndex += rowOffset;
   }
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("td", { className: (0, import_classnames.default)(`${diffPrefixCls}-index`, mergedClassName, hashId) }, rowIndex), /* @__PURE__ */ React.createElement("td", { className: (0, import_classnames.default)(`${diffPrefixCls}-mark`, mergedClassName, hashId) }, add && "+", remove && "-"), /* @__PURE__ */ React.createElement(
-    "td",
-    {
-      onMouseDown,
-      style: { width, userSelect: lock ? "none" : void 0 },
-      className: (0, import_classnames.default)(`${diffPrefixCls}-code`, mergedClassName, hashId),
-      dangerouslySetInnerHTML: { __html: (data == null ? void 0 : data.value) ?? (emptyText || "") }
-    }
-  ));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { className: (0, import_classnames.default)(`${diffPrefixCls}-index`, mergedClassName, hashId), children: rowIndex }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("td", { className: (0, import_classnames.default)(`${diffPrefixCls}-mark`, mergedClassName, hashId), children: [
+      add && "+",
+      remove && "-"
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "td",
+      {
+        onMouseDown,
+        style: { width, userSelect: lock ? "none" : void 0 },
+        className: (0, import_classnames.default)(`${diffPrefixCls}-code`, mergedClassName, hashId),
+        dangerouslySetInnerHTML: { __html: (data == null ? void 0 : data.value) ?? (emptyText || "") }
+      }
+    )
+  ] });
 }

package/lib/Highlight/DiffView/index.js

@@ -42,6 +42,7 @@ var import_util = require("../../_util");
 var import_useKeyDownCopyEvent = require("../useKeyDownCopyEvent");
 var import_DiffCells = __toESM(require("./DiffCells"));
 var import__2 = require("../index.less");
+var import_jsx_runtime = require("react/jsx-runtime");
 var MAX_MERGE_TIMES = 1e4;
 var EMPTY_TEXT = `<span class="hljs-comment">// 没有数据</span>`;
 function getHighlightRows(language, code) {
@@ -221,7 +222,7 @@ var DiffView = ({
   }, [diffData]);
   let viewRows;
   if (!report) {
-    viewRows = /* @__PURE__ */ import_react.default.createElement("tr", null, /* @__PURE__ */ import_react.default.createElement(
+    viewRows = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_DiffCells.default,
       {
         width: "100%",
@@ -232,34 +233,37 @@ var DiffView = ({
           type: "keep"
         }
       }
-    ));
+    ) });
   } else if (split) {
-    viewRows = mergedData.rows.map(({ source: src, target: tgt }, index) => /* @__PURE__ */ import_react.default.createElement("tr", { key: index }, /* @__PURE__ */ import_react.default.createElement(
-      import_DiffCells.default,
-      {
-        width: "50%",
-        diffPrefixCls,
-        data: src,
-        emptyText: index === 0 && mergedData.sourceEmpty && EMPTY_TEXT,
-        onMouseDown: onSourceMouseDown,
-        lock: selectable !== "source",
-        rowOffset: rowOffsetSrc
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(
-      import_DiffCells.default,
-      {
-        width: "50%",
-        diffPrefixCls,
-        data: tgt,
-        emptyText: index === 0 && mergedData.targetEmpty && EMPTY_TEXT,
-        onMouseDown: onTargetMouseDown,
-        lock: selectable !== "target",
-        rowOffset: rowOffsetTgt
-      }
-    )));
+    viewRows = mergedData.rows.map(({ source: src, target: tgt }, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tr", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_DiffCells.default,
+        {
+          width: "50%",
+          diffPrefixCls,
+          data: src,
+          emptyText: index === 0 && mergedData.sourceEmpty && EMPTY_TEXT,
+          onMouseDown: onSourceMouseDown,
+          lock: selectable !== "source",
+          rowOffset: rowOffsetSrc
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_DiffCells.default,
+        {
+          width: "50%",
+          diffPrefixCls,
+          data: tgt,
+          emptyText: index === 0 && mergedData.targetEmpty && EMPTY_TEXT,
+          onMouseDown: onTargetMouseDown,
+          lock: selectable !== "target",
+          rowOffset: rowOffsetTgt
+        }
+      )
+    ] }, index));
   } else {
     viewRows = diffData.sourceRows.map((src, index) => {
-      return /* @__PURE__ */ import_react.default.createElement("tr", { key: index }, /* @__PURE__ */ import_react.default.createElement(
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_DiffCells.default,
         {
           width: "100%",
@@ -267,12 +271,12 @@ var DiffView = ({
           data: src ?? diffData.targetRows[index],
           rowOffset: rowOffsetTgt
         }
-      ));
+      ) }, index);
     });
   }
   const codeRef = import_react.default.useRef();
   (0, import_useKeyDownCopyEvent.useKeyDownCopyEvent)(codeRef);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       style: {
@@ -289,9 +293,9 @@ var DiffView = ({
           [`${diffPrefixCls}-split`]: split
         },
         className
-      )
-    },
-    /* @__PURE__ */ import_react.default.createElement("table", null, /* @__PURE__ */ import_react.default.createElement("tbody", null, viewRows))
+      ),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("table", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tbody", { children: viewRows }) })
+    }
   );
 };
 var DiffView_default = DiffView;

package/lib/Highlight/HighlightCell.js

@@ -33,7 +33,7 @@ __export(HighlightCell_exports, {
 });
 module.exports = __toCommonJS(HighlightCell_exports);
 var import_classnames = __toESM(require("classnames"));
-var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 function HighlightCell({
   prefixCls,
   theme,
@@ -46,13 +46,16 @@ function HighlightCell({
   hashId
 }) {
   const rowIndex = data == null ? void 0 : data.index;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, lineNumber ? /* @__PURE__ */ React.createElement("td", { className: (0, import_classnames.default)(`${prefixCls}-${theme}-index`, `${prefixCls}-index`, hashId) }, rowIndex) : null, /* @__PURE__ */ React.createElement(
-    "td",
-    {
-      onMouseDown,
-      style: { width, userSelect: lock ? "none" : void 0 },
-      className: (0, import_classnames.default)(`${prefixCls}-content`, hashId),
-      dangerouslySetInnerHTML: { __html: (data == null ? void 0 : data.value) ?? (emptyText || "") }
-    }
-  ));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    lineNumber ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { className: (0, import_classnames.default)(`${prefixCls}-${theme}-index`, `${prefixCls}-index`, hashId), children: rowIndex }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "td",
+      {
+        onMouseDown,
+        style: { width, userSelect: lock ? "none" : void 0 },
+        className: (0, import_classnames.default)(`${prefixCls}-content`, hashId),
+        dangerouslySetInnerHTML: { __html: (data == null ? void 0 : data.value) ?? (emptyText || "") }
+      }
+    )
+  ] });
 }

package/lib/Highlight/JsonView.js

@@ -33,12 +33,13 @@ __export(JsonView_exports, {
 });
 module.exports = __toCommonJS(JsonView_exports);
 var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_react_json_view = __toESM(require("react-json-view"));
 var import_util = require("../_util");
 var import__ = require(".");
 var import_useKeyDownCopyEvent = require("./useKeyDownCopyEvent");
 var import_index = require("./index.less");
+var import_jsx_runtime = require("react/jsx-runtime");
 var JsonView_default = ({
   json,
   theme,
@@ -53,7 +54,7 @@ var JsonView_default = ({
   const isDarkTheme = theme === import__.THEME_DARK;
   const codeRef = (0, import_react.useRef)();
   (0, import_useKeyDownCopyEvent.useKeyDownCopyEvent)(codeRef);
-  return /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       style,
@@ -66,18 +67,18 @@ var JsonView_default = ({
           [`${prefixCls}-light`]: !isDarkTheme
         },
         className
+      ),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_react_json_view.default,
+        {
+          enableClipboard: copyable && onCopyChange,
+          src: json,
+          theme: isDarkTheme ? "ocean" : void 0,
+          displayDataTypes: false,
+          style: { height },
+          name: false
+        }
       )
-    },
-    /* @__PURE__ */ import_react.default.createElement(
-      import_react_json_view.default,
-      {
-        enableClipboard: copyable && onCopyChange,
-        src: json,
-        theme: isDarkTheme ? "ocean" : void 0,
-        displayDataTypes: false,
-        style: { height },
-        name: false
-      }
-    )
+    }
   );
 };