@dappworks/kit 0.4.74 → 0.4.75

package/dist/chunk-ONASYMZR.mjs

@@ -0,0 +1,434 @@
+import { PaginationState } from './chunk-ONVPCAMQ.mjs';
+import { DialogStore } from './chunk-OZ3JSH5J.mjs';
+import { JSONHighlight, SkeletonBox } from './chunk-WVBSQHB6.mjs';
+import { _ } from './chunk-MGU3KYGC.mjs';
+import { cn } from './chunk-6UHBBDKI.mjs';
+import { __spreadValues } from './chunk-6F7H4PAA.mjs';
+import React, { useMemo, useState, useEffect, useRef } from 'react';
+import { Table, TableHeader, TableColumn, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, TableBody, TableRow, TableCell, Pagination, Card, Divider, Spinner } from '@nextui-org/react';
+import { ChevronDown, ChevronUp, ChevronsUpDown } from 'lucide-react';
+import { observer } from 'mobx-react-lite';
+import crypto from 'crypto';
+
+var rnds8Pool = new Uint8Array(256);
+var poolPtr = rnds8Pool.length;
+function rng() {
+  if (poolPtr > rnds8Pool.length - 16) {
+    crypto.randomFillSync(rnds8Pool);
+    poolPtr = 0;
+  }
+  return rnds8Pool.slice(poolPtr, poolPtr += 16);
+}
+
+// ../../node_modules/uuid/dist/esm-node/regex.js
+var regex_default = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+
+// ../../node_modules/uuid/dist/esm-node/validate.js
+function validate(uuid) {
+  return typeof uuid === "string" && regex_default.test(uuid);
+}
+var validate_default = validate;
+
+// ../../node_modules/uuid/dist/esm-node/stringify.js
+var byteToHex = [];
+for (let i = 0; i < 256; ++i) {
+  byteToHex.push((i + 256).toString(16).substr(1));
+}
+function stringify(arr, offset = 0) {
+  const uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+  if (!validate_default(uuid)) {
+    throw TypeError("Stringified UUID is invalid");
+  }
+  return uuid;
+}
+var stringify_default = stringify;
+
+// ../../node_modules/uuid/dist/esm-node/v4.js
+function v4(options, buf, offset) {
+  options = options || {};
+  const rnds = options.random || (options.rng || rng)();
+  rnds[6] = rnds[6] & 15 | 64;
+  rnds[8] = rnds[8] & 63 | 128;
+  if (buf) {
+    offset = offset || 0;
+    for (let i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+    return buf;
+  }
+  return stringify_default(rnds);
+}
+var v4_default = v4;
+
+// components/JSONTable/index.tsx
+var JSONTable = observer((props) => {
+  const {
+    className,
+    classNames = {},
+    dataSource,
+    columnOptions,
+    headerKeys,
+    isServerPaging,
+    pagination = new PaginationState({
+      page: 1,
+      limit: 8
+    }),
+    nextuiPaginationProps = {},
+    extendedTableOptions = [],
+    rowKey = "id",
+    onRowClick,
+    rowCss,
+    asCard = false,
+    cardOptions = {
+      boxClassName: "",
+      cardClassName: "",
+      itemClassName: "",
+      showDivider: true,
+      dividerClassName: ""
+    },
+    autoScrollToTop = false,
+    emptyContent = "No Data",
+    isLoading = false,
+    loadingOptions,
+    loadingContent,
+    isHeaderSticky = false
+  } = props;
+  const { columns, sortableColumnsDefaultValue } = useMemo(() => {
+    const firstData = dataSource[0];
+    const allKeys = firstData ? Object.keys(firstData) : [];
+    const keys = headerKeys ? headerKeys : columnOptions ? allKeys.filter((key) => {
+      var _a;
+      return !((_a = columnOptions[key]) == null ? void 0 : _a.hidden);
+    }) : allKeys;
+    if (!keys.includes("$actions") && columnOptions["$actions"]) {
+      keys.push("$actions");
+    }
+    const sortableColumnsDefaultValue2 = {};
+    const columns2 = keys.map((key) => {
+      var _a, _b, _c;
+      const sortable = (_a = columnOptions == null ? void 0 : columnOptions[key]) == null ? void 0 : _a.sortable;
+      if (sortable) {
+        sortableColumnsDefaultValue2[key] = "none";
+      }
+      return {
+        key,
+        label: ((_b = columnOptions == null ? void 0 : columnOptions[key]) == null ? void 0 : _b.label) || (key === "$actions" ? "" : key),
+        render: (_c = columnOptions == null ? void 0 : columnOptions[key]) == null ? void 0 : _c.render
+      };
+    });
+    if (!headerKeys && columnOptions) {
+      columns2.sort((a, b) => {
+        var _a, _b;
+        const aOrder = ((_a = columnOptions[a.key]) == null ? void 0 : _a.order) || 0;
+        const bOrder = ((_b = columnOptions[b.key]) == null ? void 0 : _b.order) || 0;
+        return bOrder - aOrder;
+      });
+    }
+    const extendedTables = firstData ? extendedTableOptions.filter((item) => {
+      return Array.isArray(firstData[item.key]);
+    }).map((item) => {
+      const index = columns2.findIndex((c) => c.key === item.key);
+      if (index > -1) {
+        columns2.splice(index, 1);
+      }
+      const keys2 = Object.keys(item.columnOptions);
+      return {
+        key: item.key,
+        columns: keys2.map((k) => {
+          const option = item.columnOptions[k];
+          return {
+            key: k,
+            label: (option == null ? void 0 : option.label) || k,
+            render: option == null ? void 0 : option.render
+          };
+        })
+      };
+    }) : [];
+    return {
+      columns: columns2,
+      extendedTables,
+      sortableColumnsDefaultValue: sortableColumnsDefaultValue2
+    };
+  }, [dataSource, columnOptions]);
+  const [sortableColumnsMap, setSortableColumnsMap] = useState({});
+  const [sortedData, setSortedData] = useState(dataSource);
+  useEffect(() => {
+    setSortableColumnsMap(sortableColumnsDefaultValue);
+  }, [sortableColumnsDefaultValue]);
+  useEffect(() => {
+    setSortedData(dataSource);
+    if (!isServerPaging) {
+      pagination.setData({
+        total: dataSource.length
+      });
+    }
+  }, [dataSource]);
+  const data = isServerPaging ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);
+  const tableBoxElementId = useRef(autoScrollToTop ? `table-box-${v4_default().slice(0, 8)}` : void 0).current;
+  if (asCard) {
+    return /* @__PURE__ */ React.createElement(
+      CardUI,
+      {
+        className,
+        rowKey,
+        data,
+        columns,
+        columnOptions,
+        cardOptions,
+        pagination,
+        nextuiPaginationProps,
+        onRowClick,
+        tableBoxElementId
+      }
+    );
+  }
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      removeWrapper: true,
+      isHeaderSticky,
+      className: cn("relative w-full overflow-auto h-[400px]", className),
+      classNames: __spreadValues({
+        th: "font-meidum text-xs text-[#64748B] dark:text-gray-300",
+        td: "max-w-[200px] overflow-auto text-xs",
+        tr: "hover:bg-[#f6f6f9] dark:hover:bg-[#19191c] border-t-1 border-[#E2E8F0] dark:border-[#121212] first:border-t-0"
+      }, classNames),
+      id: tableBoxElementId
+    },
+    /* @__PURE__ */ React.createElement(TableHeader, { columns }, columns.map((item) => /* @__PURE__ */ React.createElement(TableColumn, { key: item.key }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React.createElement("span", null, item.label), !!sortableColumnsMap[item.key] && /* @__PURE__ */ React.createElement(
+      Dropdown,
+      {
+        showArrow: true,
+        backdrop: "opaque",
+        placement: "bottom",
+        classNames: {
+          content: "min-w-[100px] rounded-lg shadow-md border dark:border-[#3e3e3e]"
+        }
+      },
+      /* @__PURE__ */ React.createElement(DropdownTrigger, null, /* @__PURE__ */ React.createElement("button", { className: "outline-none p-0" }, sortableColumnsMap[item.key] === "desc" && /* @__PURE__ */ React.createElement(ChevronDown, { size: 14 }), sortableColumnsMap[item.key] === "asc" && /* @__PURE__ */ React.createElement(ChevronUp, { size: 14 }), sortableColumnsMap[item.key] === "none" && /* @__PURE__ */ React.createElement(ChevronsUpDown, { size: 14 }))),
+      /* @__PURE__ */ React.createElement(DropdownMenu, { variant: "flat", selectionMode: "single", selectedKeys: [sortableColumnsMap[item.key]] }, /* @__PURE__ */ React.createElement(
+        DropdownItem,
+        {
+          key: "asc",
+          onClick: () => {
+            var _a;
+            const { sortableColumns, sortedData: sortedData2 } = sortData({
+              type: "asc",
+              key: item.key,
+              sortKey: (_a = columnOptions == null ? void 0 : columnOptions[item.key]) == null ? void 0 : _a.sortKey,
+              sortableColumnsMap,
+              dataSource
+            });
+            setSortableColumnsMap(sortableColumns);
+            setSortedData(sortedData2);
+          }
+        },
+        /* @__PURE__ */ React.createElement("span", { className: "text-xs font-bold" }, "Sort ascending")
+      ), /* @__PURE__ */ React.createElement(
+        DropdownItem,
+        {
+          key: "desc",
+          onClick: () => {
+            var _a;
+            const { sortableColumns, sortedData: sortedData2 } = sortData({
+              type: "desc",
+              key: item.key,
+              sortKey: (_a = columnOptions == null ? void 0 : columnOptions[item.key]) == null ? void 0 : _a.sortKey,
+              sortableColumnsMap,
+              dataSource
+            });
+            setSortableColumnsMap(sortableColumns);
+            setSortedData(sortedData2);
+          }
+        },
+        /* @__PURE__ */ React.createElement("span", { className: "text-xs font-bold" }, "Sort descending")
+      ), /* @__PURE__ */ React.createElement(
+        DropdownItem,
+        {
+          key: "none",
+          onClick: () => {
+            var _a;
+            const { sortableColumns, sortedData: sortedData2 } = sortData({
+              type: "none",
+              key: item.key,
+              sortKey: (_a = columnOptions == null ? void 0 : columnOptions[item.key]) == null ? void 0 : _a.sortKey,
+              sortableColumnsMap,
+              dataSource
+            });
+            setSortableColumnsMap(sortableColumns);
+            setSortedData(sortedData2);
+          }
+        },
+        /* @__PURE__ */ React.createElement("span", { className: "text-xs font-bold" }, "Sort none")
+      ))
+    ))))),
+    isLoading ? /* @__PURE__ */ React.createElement(TableBody, { emptyContent: loadingContent || DefaultLoading({ loadingOptions }) }, []) : data.length > 0 ? /* @__PURE__ */ React.createElement(TableBody, null, data.map((item, index) => {
+      return /* @__PURE__ */ React.createElement(
+        TableRow,
+        {
+          key: item[rowKey] || index,
+          className: cn("", typeof rowCss === "function" ? rowCss(item) : rowCss),
+          onClick: () => {
+            onRowClick == null ? void 0 : onRowClick(item);
+          }
+        },
+        columns.map((column) => {
+          return /* @__PURE__ */ React.createElement(TableCell, { key: column.key }, column.render ? column.render(item) : renderFieldValue(item[column.key]));
+        })
+      );
+    })) : /* @__PURE__ */ React.createElement(TableBody, { emptyContent }, [])
+  ), pagination.total > pagination.limit && /* @__PURE__ */ React.createElement("div", { className: "mt-4 flex justify-center" }, /* @__PURE__ */ React.createElement(
+    Pagination,
+    __spreadValues({
+      showControls: true,
+      showShadow: true,
+      size: "sm",
+      radius: "sm",
+      color: "secondary",
+      initialPage: 1,
+      total: Math.ceil(pagination.total / pagination.limit),
+      page: pagination.page,
+      onChange: (currentPage) => {
+        pagination.setData({
+          page: currentPage
+        });
+        scrollIntoTop(tableBoxElementId);
+      }
+    }, nextuiPaginationProps)
+  )));
+});
+function renderFieldValue(v) {
+  if (typeof v == "string" || typeof v == "number") {
+    return v;
+  }
+  if (v == null) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    "p",
+    {
+      className: "cursor-pointer",
+      onClick: (e) => {
+        e.stopPropagation();
+        DialogStore.show({
+          content: /* @__PURE__ */ React.createElement(JSONHighlight, { className: "w-full lg:w-[900px]", jsonStr: JSON.stringify(v, null, 2) })
+        });
+      }
+    },
+    JSON.stringify(v).slice(0, 50) + "..."
+  );
+}
+function sortData({
+  sortKey,
+  key,
+  type,
+  sortableColumnsMap,
+  dataSource
+}) {
+  const sortableColumns = {};
+  Object.keys(sortableColumnsMap).map((k) => {
+    sortableColumns[k] = k === key ? type : "none";
+  });
+  let sortedData = dataSource;
+  if (type !== "none") {
+    const result = _.orderBy(
+      dataSource,
+      (o) => {
+        const v = _.get(o, sortKey || key);
+        if (v == null) {
+          return type === "desc" ? "" : v;
+        }
+        if (typeof v === "string") {
+          const _v = Number(v);
+          if (isNaN(_v)) {
+            return v.toLowerCase();
+          } else {
+            return _v;
+          }
+        }
+        return v;
+      },
+      type
+    );
+    sortedData = result;
+  }
+  return {
+    sortableColumns,
+    sortedData
+  };
+}
+function CardUI({
+  className,
+  data,
+  columns,
+  columnOptions,
+  rowKey,
+  cardOptions,
+  pagination,
+  nextuiPaginationProps,
+  onRowClick,
+  tableBoxElementId
+}) {
+  return /* @__PURE__ */ React.createElement("div", { className, id: tableBoxElementId }, /* @__PURE__ */ React.createElement("div", { className: cn("space-y-2", cardOptions == null ? void 0 : cardOptions.boxClassName) }, data.map((item, index) => {
+    return /* @__PURE__ */ React.createElement(
+      Card,
+      {
+        key: item[rowKey] || index,
+        className: cn("w-full shadow-none p-4", cardOptions == null ? void 0 : cardOptions.cardClassName),
+        isPressable: !!onRowClick,
+        onPress: () => {
+          onRowClick == null ? void 0 : onRowClick(item);
+        }
+      },
+      columns.map((column, i) => {
+        const option = columnOptions == null ? void 0 : columnOptions[column.key];
+        return /* @__PURE__ */ React.createElement("div", { className: "w-full", key: column.key }, /* @__PURE__ */ React.createElement("div", { className: cn("w-full", cardOptions == null ? void 0 : cardOptions.itemClassName) }, /* @__PURE__ */ React.createElement("div", { className: cn("font-meidum text-xs text-[#64748B] dark:text-gray-300", option == null ? void 0 : option.labelClassName) }, column.label), /* @__PURE__ */ React.createElement("div", { className: cn("text-xs", option == null ? void 0 : option.valueClassName) }, column.render ? column.render(item) : renderFieldValue(item[column.key]))), (cardOptions == null ? void 0 : cardOptions.showDivider) && i !== columns.length - 1 && /* @__PURE__ */ React.createElement(Divider, { className: cn("my-2", cardOptions == null ? void 0 : cardOptions.dividerClassName) }));
+      })
+    );
+  })), pagination.total > pagination.limit && /* @__PURE__ */ React.createElement("div", { className: "flex justify-center h-[30px] mt-4" }, /* @__PURE__ */ React.createElement(
+    Pagination,
+    __spreadValues({
+      showControls: true,
+      showShadow: true,
+      size: "sm",
+      radius: "sm",
+      color: "secondary",
+      initialPage: 1,
+      total: Math.ceil(pagination.total / pagination.limit),
+      page: pagination.page,
+      onChange: (currentPage) => {
+        pagination.setData({
+          page: currentPage
+        });
+        scrollIntoTop(tableBoxElementId);
+      }
+    }, nextuiPaginationProps)
+  )));
+}
+function DefaultLoading({ loadingOptions }) {
+  const type = (loadingOptions == null ? void 0 : loadingOptions.type) || "skeleton";
+  const skeletonOptions = loadingOptions == null ? void 0 : loadingOptions.skeleton;
+  const spinnerOptions = loadingOptions == null ? void 0 : loadingOptions.spinner;
+  const spinnerProps = (spinnerOptions == null ? void 0 : spinnerOptions.spinnerProps) || {};
+  if (type === "skeleton") {
+    return /* @__PURE__ */ React.createElement(SkeletonBox, { className: cn("mt-2 flex-col", skeletonOptions == null ? void 0 : skeletonOptions.boxClassName), skClassName: cn("h-[30px] rounded", skeletonOptions == null ? void 0 : skeletonOptions.skeletonClassName), line: (skeletonOptions == null ? void 0 : skeletonOptions.line) || 5 });
+  }
+  return /* @__PURE__ */ React.createElement("div", { className: cn("w-full h-[100px] flex justify-center items-center", spinnerOptions == null ? void 0 : spinnerOptions.boxClassName) }, /* @__PURE__ */ React.createElement(Spinner, __spreadValues({ size: "sm", color: "primary" }, spinnerProps)), /* @__PURE__ */ React.createElement("div", { className: cn("ml-2 text-[#64748B] text-sm", spinnerOptions == null ? void 0 : spinnerOptions.textClassName) }, (spinnerOptions == null ? void 0 : spinnerOptions.text) || "Loading..."));
+}
+async function scrollIntoTop(tableBoxElementId) {
+  await new Promise((resolve) => setTimeout(resolve, 500));
+  if (tableBoxElementId) {
+    const el = document.getElementById(tableBoxElementId);
+    if (el) {
+      const { top } = el.getBoundingClientRect();
+      window.scrollTo({
+        top: top + window.scrollY - 100,
+        behavior: "smooth"
+      });
+    }
+  }
+}
+
+export { JSONTable };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-ONASYMZR.mjs.map

package/dist/chunk-ONASYMZR.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/JSONTable/index.tsx","../../../node_modules/uuid/dist/esm-node/rng.js","../../../node_modules/uuid/dist/esm-node/regex.js","../../../node_modules/uuid/dist/esm-node/validate.js","../../../node_modules/uuid/dist/esm-node/stringify.js","../../../node_modules/uuid/dist/esm-node/v4.js"],"names":["sortableColumnsDefaultValue","columns","keys","sortedData"],"mappings":"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","sourcesContent":["\"use client\";\n\nimport React, { useEffect, useMemo, useRef, useState } from \"react\";\nimport {\n  Card,\n  Divider,\n  Dropdown,\n  DropdownItem,\n  DropdownMenu,\n  DropdownTrigger,\n  Pagination as NextuiPagination,\n  PaginationProps,\n  SlotsToClasses,\n  Spinner,\n  SpinnerProps,\n  Table,\n  TableBody,\n  TableCell,\n  TableColumn,\n  TableHeader,\n  TableRow,\n  TableSlots,\n} from '@nextui-org/react';\nimport { ChevronDown, ChevronUp, ChevronsUpDown } from \"lucide-react\";\nimport { observer } from \"mobx-react-lite\";\nimport { PaginationState } from \"../../store/standard/PaginationState\";\nimport { DialogStore } from \"../../module/Dialog\";\nimport JSONHighlight from \"../Common/JSONHighlight\";\nimport { SkeletonBox } from \"../Common/SkeletonBox\";\nimport { _ } from \"../../lib/lodash\";\nimport { cn } from \"../../lib/utils\";\nimport { v4 as uuid } from 'uuid';\n\nexport type HeaderKeys<T extends Record<string, any>> = Array<keyof T | '$actions'>;\n\nexport type ColumnOptions<T extends Record<string, any>> = {\n  [key in keyof T]?: {\n    label?: React.ReactNode;\n    hidden?: boolean;\n    sortable?: boolean;\n    sortKey?: string;\n    order?: number;\n    render?: (item: T) => any;\n    labelClassName?: string;\n    valueClassName?: string;\n  };\n} & {\n  $actions?: {\n    label?: React.ReactNode;\n    hidden?: boolean;\n    sortable?: boolean;\n    sortKey?: string;\n    order?: number;\n    render?: (item: T) => any;\n    labelClassName?: string;\n    valueClassName?: string;\n  };\n};\n\nexport type Column<T extends Record<string, any>> = {\n  key: string;\n  label: React.ReactNode;\n  render?: (item: T) => any;\n};\n\nexport type ExtendedTable<U> = {\n  key: string;\n  columns: Column<U>[];\n};\n\nexport type CardOptions = {\n  boxClassName?: string;\n  cardClassName?: string;\n  itemClassName?: string;\n  showDivider?: boolean;\n  dividerClassName?: string;\n};\n\ntype LoadingOptions = {\n  type?: 'skeleton' | 'spinner';\n  skeleton?: {\n    boxClassName?: string;\n    skeletonClassName?: string;\n    line?: number;\n  };\n  spinner?: {\n    boxClassName?: string;\n    spinnerProps?: SpinnerProps;\n    text?: string;\n    textClassName?: string;\n  };\n};\n\nexport interface JSONTableProps<T extends Record<string, any>> {\n  className?: string;\n  classNames?: SlotsToClasses<TableSlots>;\n  rowKey?: keyof T;\n  dataSource: T[];\n  headerKeys?: HeaderKeys<T>;\n  columnOptions?: ColumnOptions<T>;\n  isServerPaging?: boolean;\n  pagination?: PaginationState;\n  nextuiPaginationProps?: PaginationProps | {};\n  onRowClick?: (item: T) => void;\n  rowCss?: string | ((item: T) => string | undefined);\n  asCard?: boolean;\n  cardOptions?: CardOptions;\n  autoScrollToTop?: boolean;\n  emptyContent?: React.ReactNode;\n  isLoading?: boolean;\n  loadingOptions?: LoadingOptions;\n  loadingContent?: React.ReactNode;\n  isHeaderSticky?: boolean;\n  extendedTableOptions?: {\n    key: keyof T;\n    columnOptions: ColumnOptions<any>;\n  }[];\n}\n\nexport const JSONTable = observer(<T extends Record<string, any>>(props: JSONTableProps<T>) => {\n  const {\n    className,\n    classNames = {},\n    dataSource,\n    columnOptions,\n    headerKeys,\n    isServerPaging,\n    pagination = new PaginationState({\n      page: 1,\n      limit: 8,\n    }),\n    nextuiPaginationProps = {},\n    extendedTableOptions = [],\n    rowKey = 'id',\n    onRowClick,\n    rowCss,\n    asCard = false,\n    cardOptions = {\n      boxClassName: '',\n      cardClassName: '',\n      itemClassName: '',\n      showDivider: true,\n      dividerClassName: '',\n    },\n    autoScrollToTop = false,\n    emptyContent = 'No Data',\n    isLoading = false,\n    loadingOptions,\n    loadingContent,\n    isHeaderSticky = false,\n  } = props;\n\n  const { columns, sortableColumnsDefaultValue } = useMemo(() => {\n    const firstData = dataSource[0];\n\n    const allKeys = firstData ? Object.keys(firstData) : [];\n    const keys = headerKeys ? headerKeys : columnOptions ? allKeys.filter((key) => !columnOptions[key]?.hidden) : allKeys;\n    if (!keys.includes('$actions') && columnOptions['$actions']) {\n      keys.push('$actions');\n    }\n\n    const sortableColumnsDefaultValue: { [k: string]: 'asc' | 'desc' | 'none' } = {};\n\n    const columns: Column<T>[] = keys.map((key: string) => {\n      const sortable = columnOptions?.[key]?.sortable;\n      if (sortable) {\n        sortableColumnsDefaultValue[key] = 'none';\n      }\n      return {\n        key,\n        label: columnOptions?.[key]?.label || (key === '$actions' ? '' : key),\n        render: columnOptions?.[key]?.render,\n      };\n    });\n\n    if (!headerKeys && columnOptions) {\n      columns.sort((a, b) => {\n        const aOrder = columnOptions[a.key]?.order || 0;\n        const bOrder = columnOptions[b.key]?.order || 0;\n        return bOrder - aOrder;\n      });\n    }\n\n    const extendedTables = firstData\n      ? extendedTableOptions\n        .filter((item) => {\n          return Array.isArray(firstData[item.key]);\n        })\n        .map((item) => {\n          const index = columns.findIndex((c) => c.key === item.key);\n          if (index > -1) {\n            columns.splice(index, 1);\n          }\n          const keys = Object.keys(item.columnOptions);\n          return {\n            key: item.key as string,\n            columns: keys.map((k) => {\n              const option = item.columnOptions[k];\n              return {\n                key: k,\n                label: option?.label || k,\n                render: option?.render,\n              };\n            }),\n          };\n        })\n      : [];\n\n    return {\n      columns,\n      extendedTables,\n      sortableColumnsDefaultValue,\n    };\n  }, [dataSource, columnOptions]);\n\n  const [sortableColumnsMap, setSortableColumnsMap] = useState<{ [k: string]: 'asc' | 'desc' | 'none' }>({});\n  const [sortedData, setSortedData] = useState<T[]>(dataSource);\n\n  useEffect(() => {\n    setSortableColumnsMap(sortableColumnsDefaultValue);\n  }, [sortableColumnsDefaultValue]);\n\n  useEffect(() => {\n    setSortedData(dataSource);\n    if (!isServerPaging) {\n      pagination.setData({\n        total: dataSource.length,\n      });\n    }\n  }, [dataSource]);\n\n  const data = isServerPaging ? sortedData : sortedData.slice(pagination.offset, pagination.offset + pagination.limit);\n\n  const tableBoxElementId = useRef(autoScrollToTop ? `table-box-${uuid().slice(0, 8)}` : undefined).current;\n\n  if (asCard) {\n    return (\n      <CardUI\n        className={className}\n        rowKey={rowKey}\n        data={data}\n        columns={columns}\n        columnOptions={columnOptions}\n        cardOptions={cardOptions}\n        pagination={pagination}\n        nextuiPaginationProps={nextuiPaginationProps}\n        onRowClick={onRowClick}\n        tableBoxElementId={tableBoxElementId}\n      />\n    );\n  }\n\n  return (\n    <>\n      <Table\n        removeWrapper\n        isHeaderSticky={isHeaderSticky}\n        className={cn('relative w-full overflow-auto h-[400px]', className)}\n        classNames={{\n          th: 'font-meidum text-xs text-[#64748B] dark:text-gray-300',\n          td: 'max-w-[200px] overflow-auto text-xs',\n          tr: 'hover:bg-[#f6f6f9] dark:hover:bg-[#19191c] border-t-1 border-[#E2E8F0] dark:border-[#121212] first:border-t-0',\n          ...classNames,\n        }}\n        id={tableBoxElementId}\n      >\n        <TableHeader columns={columns}>\n          {columns.map((item) => (\n            <TableColumn key={item.key}>\n              <div className=\"flex items-center\">\n                <span>{item.label}</span>\n                {!!sortableColumnsMap[item.key] && (\n                  <Dropdown\n                    showArrow\n                    backdrop=\"opaque\"\n                    placement=\"bottom\"\n                    classNames={{\n                      content: 'min-w-[100px] rounded-lg shadow-md border dark:border-[#3e3e3e]',\n                    }}\n                  >\n                    <DropdownTrigger>\n                      <button className=\"outline-none p-0\">\n                        {sortableColumnsMap[item.key] === 'desc' && <ChevronDown size={14} />}\n                        {sortableColumnsMap[item.key] === 'asc' && <ChevronUp size={14} />}\n                        {sortableColumnsMap[item.key] === 'none' && <ChevronsUpDown size={14} />}\n                      </button>\n                    </DropdownTrigger>\n                    <DropdownMenu variant=\"flat\" selectionMode=\"single\" selectedKeys={[sortableColumnsMap[item.key]]}>\n                      <DropdownItem\n                        key=\"asc\"\n                        onClick={() => {\n                          const { sortableColumns, sortedData } = sortData({\n                            type: 'asc',\n                            key: item.key,\n                            sortKey: columnOptions?.[item.key]?.sortKey,\n                            sortableColumnsMap,\n                            dataSource,\n                          });\n                          setSortableColumnsMap(sortableColumns);\n                          setSortedData(sortedData);\n                        }}\n                      >\n                        <span className=\"text-xs font-bold\">Sort ascending</span>\n                      </DropdownItem>\n                      <DropdownItem\n                        key=\"desc\"\n                        onClick={() => {\n                          const { sortableColumns, sortedData } = sortData({\n                            type: 'desc',\n                            key: item.key,\n                            sortKey: columnOptions?.[item.key]?.sortKey,\n                            sortableColumnsMap,\n                            dataSource,\n                          });\n                          setSortableColumnsMap(sortableColumns);\n                          setSortedData(sortedData);\n                        }}\n                      >\n                        <span className=\"text-xs font-bold\">Sort descending</span>\n                      </DropdownItem>\n                      <DropdownItem\n                        key=\"none\"\n                        onClick={() => {\n                          const { sortableColumns, sortedData } = sortData({\n                            type: 'none',\n                            key: item.key,\n                            sortKey: columnOptions?.[item.key]?.sortKey,\n                            sortableColumnsMap,\n                            dataSource,\n                          });\n                          setSortableColumnsMap(sortableColumns);\n                          setSortedData(sortedData);\n                        }}\n                      >\n                        <span className=\"text-xs font-bold\">Sort none</span>\n                      </DropdownItem>\n                    </DropdownMenu>\n                  </Dropdown>\n                )}\n              </div>\n            </TableColumn>\n          ))}\n        </TableHeader>\n        {isLoading ? (\n          <TableBody emptyContent={loadingContent || DefaultLoading({ loadingOptions })}>{[]}</TableBody>\n        ) : data.length > 0 ? (\n          <TableBody>\n            {data.map((item, index) => {\n              return (\n                <TableRow\n                  key={item[rowKey] || index}\n                  className={cn('', typeof rowCss === 'function' ? rowCss(item) : rowCss)}\n                  onClick={() => {\n                    onRowClick?.(item);\n                  }}\n                >\n                  {columns.map((column) => {\n                    return <TableCell key={column.key}>{column.render ? column.render(item) : renderFieldValue(item[column.key])}</TableCell>;\n                  })}\n                </TableRow>\n              );\n            })}\n          </TableBody>\n        ) : (\n          <TableBody emptyContent={emptyContent}>{[]}</TableBody>\n        )}\n      </Table>\n      {pagination.total > pagination.limit && (\n        <div className=\"mt-4 flex justify-center\">\n          <NextuiPagination\n            showControls\n            showShadow\n            size=\"sm\"\n            radius=\"sm\"\n            color=\"secondary\"\n            initialPage={1}\n            total={Math.ceil(pagination.total / pagination.limit)}\n            page={pagination.page}\n            onChange={(currentPage) => {\n              pagination.setData({\n                page: currentPage,\n              });\n              scrollIntoTop(tableBoxElementId);\n            }}\n            {...nextuiPaginationProps}\n          />\n        </div>\n      )}\n    </>\n  );\n});\n\nfunction renderFieldValue(v: any) {\n  if (typeof v == 'string' || typeof v == 'number') {\n    return v;\n  }\n  if (v == null) {\n    return null;\n  }\n  return (\n    <p\n      className=\"cursor-pointer\"\n      onClick={(e) => {\n        e.stopPropagation();\n        DialogStore.show({\n          content: <JSONHighlight className=\"w-full lg:w-[900px]\" jsonStr={JSON.stringify(v, null, 2)} />,\n        });\n      }}\n    >\n      {JSON.stringify(v).slice(0, 50) + '...'}\n    </p>\n  );\n}\n\nfunction sortData<T>({\n  sortKey,\n  key,\n  type,\n  sortableColumnsMap,\n  dataSource,\n}: {\n  sortKey: string;\n  key: string;\n  type: 'asc' | 'desc' | 'none';\n  sortableColumnsMap: {\n    [k: string]: 'asc' | 'desc' | 'none';\n  };\n  dataSource: T[];\n}) {\n  const sortableColumns: { [k: string]: 'asc' | 'desc' | 'none' } = {};\n  Object.keys(sortableColumnsMap).map((k) => {\n    sortableColumns[k] = k === key ? type : 'none';\n  });\n  let sortedData = dataSource;\n  if (type !== 'none') {\n    const result = _.orderBy(\n      dataSource,\n      (o) => {\n        const v = _.get(o, sortKey || key);\n        if (v == null) {\n          return type === 'desc' ? '' : v;\n        }\n        if (typeof v === 'string') {\n          const _v = Number(v);\n          if (isNaN(_v)) {\n            return v.toLowerCase();\n          } else {\n            return _v;\n          }\n        }\n        return v;\n      },\n      type,\n    );\n    sortedData = result;\n  }\n  return {\n    sortableColumns,\n    sortedData,\n  };\n}\n\nexport default JSONTable;\n\nfunction CardUI<T>({\n  className,\n  data,\n  columns,\n  columnOptions,\n  rowKey,\n  cardOptions,\n  pagination,\n  nextuiPaginationProps,\n  onRowClick,\n  tableBoxElementId,\n}: {\n  className?: string;\n  data: T[];\n  columns: Column<T>[];\n  columnOptions?: ColumnOptions<T>;\n  rowKey: string | number | symbol;\n  cardOptions?: CardOptions;\n  pagination: PaginationState;\n  nextuiPaginationProps: PaginationProps | {};\n  onRowClick?: (item: T) => void;\n  tableBoxElementId?: string;\n}) {\n  return (\n    <div className={className} id={tableBoxElementId}>\n      <div className={cn('space-y-2', cardOptions?.boxClassName)}>\n        {data.map((item, index) => {\n          return (\n            <Card\n              key={item[rowKey] || index}\n              className={cn('w-full shadow-none p-4', cardOptions?.cardClassName)}\n              isPressable={!!onRowClick}\n              onPress={() => {\n                onRowClick?.(item);\n              }}\n            >\n              {columns.map((column, i) => {\n                const option = columnOptions?.[column.key];\n                return (\n                  <div className=\"w-full\" key={column.key}>\n                    <div className={cn('w-full', cardOptions?.itemClassName)}>\n                      <div className={cn('font-meidum text-xs text-[#64748B] dark:text-gray-300', option?.labelClassName)}>{column.label}</div>\n                      <div className={cn('text-xs', option?.valueClassName)}>{column.render ? column.render(item) : renderFieldValue(item[column.key])}</div>\n                    </div>\n                    {cardOptions?.showDivider && i !== columns.length - 1 && <Divider className={cn('my-2', cardOptions?.dividerClassName)} />}\n                  </div>\n                );\n              })}\n            </Card>\n          );\n        })}\n      </div>\n      {pagination.total > pagination.limit && (\n        <div className=\"flex justify-center h-[30px] mt-4\">\n          <NextuiPagination\n            showControls\n            showShadow\n            size=\"sm\"\n            radius=\"sm\"\n            color=\"secondary\"\n            initialPage={1}\n            total={Math.ceil(pagination.total / pagination.limit)}\n            page={pagination.page}\n            onChange={(currentPage) => {\n              pagination.setData({\n                page: currentPage,\n              });\n              scrollIntoTop(tableBoxElementId);\n            }}\n            {...nextuiPaginationProps}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction DefaultLoading({ loadingOptions }: { loadingOptions?: LoadingOptions }) {\n  const type = loadingOptions?.type || 'skeleton';\n  const skeletonOptions = loadingOptions?.skeleton;\n  const spinnerOptions = loadingOptions?.spinner;\n  const spinnerProps = spinnerOptions?.spinnerProps || {};\n\n  if (type === 'skeleton') {\n    return <SkeletonBox className={cn('mt-2 flex-col', skeletonOptions?.boxClassName)} skClassName={cn('h-[30px] rounded', skeletonOptions?.skeletonClassName)} line={skeletonOptions?.line || 5} />;\n  }\n\n  return (\n    <div className={cn('w-full h-[100px] flex justify-center items-center', spinnerOptions?.boxClassName)}>\n      <Spinner size=\"sm\" color=\"primary\" {...spinnerProps} />\n      <div className={cn('ml-2 text-[#64748B] text-sm', spinnerOptions?.textClassName)}>{spinnerOptions?.text || 'Loading...'}</div>\n    </div>\n  );\n}\n\nasync function scrollIntoTop(tableBoxElementId?: string) {\n  await new Promise((resolve) => setTimeout(resolve, 500));\n  if (tableBoxElementId) {\n    const el = document.getElementById(tableBoxElementId);\n    if (el) {\n      const { top } = el.getBoundingClientRect();\n      window.scrollTo({\n        top: top + window.scrollY - 100,\n        behavior: 'smooth',\n      });\n    }\n  }\n}\n\nfunction CollapseBody<T>({\n  data,\n  rowKey,\n  columns,\n  extendedTables,\n  rowCss,\n}: {\n  data: T[];\n  rowKey: string | number | symbol;\n  columns: Column<T>[];\n  extendedTables: ExtendedTable<any>[];\n  rowCss?: string | ((item: T) => string | undefined);\n}) {\n  return (\n    <TableBody>\n      {data.map((item, index) => {\n        return <CollapseBodyRow key={item[rowKey] || index} item={item} columns={columns} extendedTables={extendedTables} rowCss={rowCss} />;\n      })}\n    </TableBody>\n  );\n}\n\nfunction CollapseBodyRow<T>({ item, columns, extendedTables, rowCss }: { item: T; columns: Column<T>[]; extendedTables: ExtendedTable<any>[]; rowCss?: string | ((item: T) => string | undefined) }) {\n  const [isOpen, setIsOpen] = useState(false);\n  const rows = [\n    <TableRow\n      className={cn('text-xs cursor-pointer hover:bg-[#f6f6f9] dark:hover:bg-[#19191c]', typeof rowCss === 'function' ? rowCss(item) : rowCss)}\n      onClick={(e: any) => {\n        const { nodeName } = e.target;\n        if (nodeName === 'TD' || nodeName === 'svg') {\n          setIsOpen((v) => !v);\n        }\n      }}\n    >\n      {columns.map((column) => {\n        return (\n          <TableCell key={column.key} className=\"max-w-[200px] overflow-auto\">\n            {column.render ? column.render(item) : renderFieldValue(item[column.key])}\n          </TableCell>\n        );\n      })}\n    </TableRow>,\n    <TableRow className={cn(isOpen ? 'table-row' : 'hidden')}>\n      <TableCell colSpan={columns.length}>\n        {extendedTables.map((ex) => {\n          const exColumns = ex.columns;\n          const exRow = item[ex.key];\n          return (\n            <Table className=\"mt-[10px]\" key={ex.key}>\n              <TableHeader>\n                {exColumns.map((exC) => {\n                  return (\n                    <TableColumn key={exC.key} className=\"text-xs text-[#64748B] dark:text-gray-300\">\n                      {exC.label}\n                    </TableColumn>\n                  );\n                })}\n              </TableHeader>\n              <TableBody>\n                {exRow.map((exItem) => (\n                  <TableRow className=\"text-xs hover:bg-[#f6f6f9] dark:hover:bg-[#19191c]\" key={exItem.key}>\n                    {exColumns.map((exC) => {\n                      return (\n                        <TableCell key={exC.key} className=\"max-w-[200px] overflow-auto\">\n                          {exC.render\n                            ? exC.render({\n                              ...exItem,\n                              $parent: item,\n                            })\n                            : renderFieldValue(exItem[exC.key])}\n                        </TableCell>\n                      );\n                    })}\n                  </TableRow>\n                ))}\n              </TableBody>\n            </Table>\n          );\n        })}\n      </TableCell>\n    </TableRow>,\n  ];\n  return rows.map((row) => row);\n}\n","import crypto from 'crypto';\nconst rnds8Pool = new Uint8Array(256); // # of random values to pre-allocate\n\nlet poolPtr = rnds8Pool.length;\nexport default function rng() {\n  if (poolPtr > rnds8Pool.length - 16) {\n    crypto.randomFillSync(rnds8Pool);\n    poolPtr = 0;\n  }\n\n  return rnds8Pool.slice(poolPtr, poolPtr += 16);\n}","export default /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;","import REGEX from './regex.js';\n\nfunction validate(uuid) {\n  return typeof uuid === 'string' && REGEX.test(uuid);\n}\n\nexport default validate;","import validate from './validate.js';\n/**\n * Convert array of 16 byte values to UUID string format of the form:\n * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX\n */\n\nconst byteToHex = [];\n\nfor (let i = 0; i < 256; ++i) {\n  byteToHex.push((i + 0x100).toString(16).substr(1));\n}\n\nfunction stringify(arr, offset = 0) {\n  // Note: Be careful editing this code!  It's been tuned for performance\n  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434\n  const uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one\n  // of the following:\n  // - One or more input array values don't map to a hex octet (leading to\n  // \"undefined\" in the uuid)\n  // - Invalid input values for the RFC `version` or `variant` fields\n\n  if (!validate(uuid)) {\n    throw TypeError('Stringified UUID is invalid');\n  }\n\n  return uuid;\n}\n\nexport default stringify;","import rng from './rng.js';\nimport stringify from './stringify.js';\n\nfunction v4(options, buf, offset) {\n  options = options || {};\n  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`\n\n  rnds[6] = rnds[6] & 0x0f | 0x40;\n  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided\n\n  if (buf) {\n    offset = offset || 0;\n\n    for (let i = 0; i < 16; ++i) {\n      buf[offset + i] = rnds[i];\n    }\n\n    return buf;\n  }\n\n  return stringify(rnds);\n}\n\nexport default v4;"]}

package/dist/dev.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../components/ui/sheet.tsx","../module/Devtool/devtool.tsx","../components/JSONEditor/index.tsx"],"names":["React","initialJson","diff","result"],"mappings":"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","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\nconst SheetPortal = ({ className, ...props }: SheetPrimitive.DialogPortalProps) => <SheetPrimitive.Portal className={cn(className)} {...props} />;\nSheetPortal.displayName = SheetPrimitive.Portal.displayName;\n\nconst SheetOverlay = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Overlay>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay className={cn(\"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\", className)} {...props} ref={ref} />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\", {\n  variants: {\n    side: {\n      top: \"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n      bottom: \"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n      left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n      right: \"inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n    },\n  },\n  defaultVariants: {\n    side: \"right\",\n  },\n});\n\nconst SheetClose = ({ className, ...props }: SheetPrimitive.DialogCloseProps) => (\n  <SheetPrimitive.Close className={cn(\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\", className)} {...props}>\n    <X className=\"h-4 w-4\" />\n    <span className=\"sr-only\">Close</span>\n  </SheetPrimitive.Close>\n);\nSheetClose.displayName = \"Close\";\n\ninterface SheetContentProps extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> {}\n\nconst SheetContent = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Content>, SheetContentProps & { showOverlay?: boolean; open?: boolean }>(({ side = \"right\", className, children, showOverlay = false, open, ...props }, ref) => {\n  return (\n    <SheetPortal>\n      {showOverlay && <SheetOverlay />}\n      <div ref={ref} data-state={open ? \"open\" : \"closed\"} className={cn(sheetVariants({ side }), className)} {...props}>\n        {children}\n      </div>\n    </SheetPortal>\n  );\n});\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => <div className={cn(\"flex flex-col space-y-2 text-center sm:text-left\", className)} {...props} />;\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => <div className={cn(\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\", className)} {...props} />;\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Title>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>>(({ className, ...props }, ref) => <SheetPrimitive.Title ref={ref} className={cn(\"text-lg font-semibold text-foreground\", className)} {...props} />);\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Description>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description ref={ref} className={cn(\"text-sm text-muted-foreground\", className)} {...props} />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, SheetClose };\n","import { Sheet, SheetClose, SheetContent } from \"../../components/ui/sheet\";\nimport { Tabs, Tab } from \"@nextui-org/react\";\nimport { cn } from \"../../lib/utils\";\nimport { RootStore } from \"../../store/root\";\nimport { PromiseState } from \"../../store/standard/PromiseState\";\nimport { Store } from \"../../store/standard/base\";\nimport { Wrench } from \"lucide-react\";\nimport { observer, useLocalObservable } from \"mobx-react-lite\";\nimport { toJS } from \"mobx\";\nimport { helper } from \"../../lib/helper\";\nimport EventEmitter from \"events\";\nimport { useMemo } from \"react\";\nimport React from \"react\";\nimport { JSONEditor } from \"../../components/JSONEditor\"\n\nfunction filterState(obj) {\n  if (obj.toJSON) {\n    return obj.toJSON()\n  }\n\n  if (typeof obj !== \"object\" || obj === null) {\n    return obj;\n  }\n\n  if (Array.isArray(obj)) {\n    return obj.map(filterState);\n  }\n\n  const filteredObj = {};\n\n  for (const [key, value] of Object.entries(obj)) {\n    try {\n      if (\n        ![\"sid\", \"disabled\", \"autoObservable\", \"promiseState\", \"autoAsyncable\", \"stype\"].includes(key) &&\n        // !(value instanceof PromiseState) &&\n        !(value instanceof EventEmitter) &&\n        !value?.hasOwnProperty(\"$$typeof\")\n      ) {\n        filteredObj[key] = filterState(value);\n      }\n    } catch (error) {\n      console.error(error);\n      return obj;\n    }\n  }\n\n  return filteredObj;\n}\n\nexport class DevTool implements Store {\n  sid = \"DevTool\";\n  stype = \"Plugin\"\n  provider = ({ rootStore }: { rootStore: RootStore }) => <DevToolProvider rootStore={rootStore} />;\n  disabled?: boolean = false;\n  autoObservable?: boolean = true;\n  isOpen = false;\n\n  panels: Store[\"pannel\"][] = [\n    {\n      title: \"Store\",\n      render: observer(({ rootStore }: { rootStore: RootStore }) => {\n        const state = useLocalObservable<{\n          curStore: Store;\n          curPromiseStateList: { name: string; promiseState: PromiseState<any, any> }[];\n        }>(() => ({\n          //@ts-ignore\n          curStore: null,\n          curPromiseStateList: [],\n        }));\n        const initialJson = useMemo(() => {\n          //@ts-ignore\n          if (state.curStore?.toJSON) return JSON.stringify(state.curStore?.toJSON(), null, 2);\n          const filteredData = filterState(state.curStore || {});\n          return JSON.stringify(toJS(filteredData), null, 2);\n        }, [state.curStore]);\n        return (\n          <div className=\"flex flex-col md:flex-row text-sm\">\n            <div>\n              <Tabs\n                size=\"sm\"\n                radius=\"none\"\n                variant=\"underlined\"\n                items={[{ title: \"Store\", value: \"Store\" }, { title: \"Plugin\", value: \"Plugin\" }]}\n              >\n                {(item) => {\n                  const stores = Object.values(rootStore.instance).filter(i => i.stype == item.value && i.sid).sort((a, b) => a.sid.length - b.sid.length);\n                  return (\n                    <Tab key={item.title} title={item.title} >\n                      <div>\n                        <div className=\"w-full md:w-[300px] space-y-1 pr-2 overflow-auto\">\n                          {stores.map((store) => {\n                            return (\n                              <div\n                                key={store?.sid}\n                                className={cn(\"px-2 rounded-md hover:bg-green-600 hover:text-white cursor-pointer\", { \"bg-green-600 text-white\": state.curStore?.sid === store.sid })}\n                                onClick={() => {\n                                  state.curStore = store;\n                                }}\n                              >\n                                {store.sid}\n                              </div>\n                            );\n                          })}\n                        </div>\n                      </div>\n                    </Tab>\n                  )\n                }}\n              </Tabs>\n            </div>\n\n            <div className=\"mt-4 w-full overflow-auto md:mt-0\">\n              <JSONEditor\n                className={\"h-full\"}\n                height={450}\n                initialJson={initialJson}\n                onChange={(data) => {\n                  console.log(\"onChange\", data);\n                  helper.deepMerge(state.curStore, data);\n                }}\n              />\n              {/* <PromiseStateDebug promiseStateList={state.curPromiseStateList} /> */}\n            </div>\n          </div>\n        );\n      }),\n    },\n  ];\n\n  onNewStore({ rootStore }: { rootStore: RootStore }) {\n    Object.values(rootStore.instance).forEach((store) => {\n      if (store.devtools?.started) return;\n      if (store.devtools?.panels) {\n        store.devtools.started = true;\n        this.panels = [...this.panels, ...store.devtools?.panels];\n      }\n    });\n  }\n\n  constructor(args: Partial<DevTool> = {}) {\n    Object.assign(this, args);\n  }\n}\n\n// const PromiseStateDebug = ({ promiseStateList }: { promiseStateList: { name: string; promiseState: PromiseState<any, any> }[] }) => {\n//   if (promiseStateList.length === 0) return null;\n//   return (\n//     <>\n//       <div className=\"mt-6 mb-2 pt-2 border-t-[1px] font-bold dark:border-gray-600\">Debug PromiseState</div>\n//       <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4\">\n//         {promiseStateList.map((item, index) => {\n//           const formData = item.promiseState.debug.input;\n//           return (\n//             <Card className=\"p-2 dark:border-gray-800\" key={index}>\n//               <div className=\"font-bold text-xs\">{item.name}</div>\n//               <JSONSchemaForm\n//                 formState={getFormState({\n//                   data: formData,\n//                   onSubmit: (data) => {\n//                     item.promiseState.call(data);\n//                   },\n//                 })}\n//               />\n//             </Card>\n//           );\n//         })}\n//       </div>\n//     </>\n//   );\n// };\n\nexport const DevToolProvider = observer(({ rootStore }: { rootStore: RootStore }) => {\n  const devTool = rootStore.get(DevTool);\n  const minSheetHeight = 500;\n  const store = useLocalObservable(() => ({\n    sheetHeight: minSheetHeight,\n  }));\n  return (\n    <>\n      <div className=\"fixed right-4 bottom-4 z-10\">\n        <div\n          className=\"p-1 rounded-sm bg-gray-300 hover:bg-gray-400 dark:bg-gray-600 dark:hover:bg-gray-500 cursor-pointer\"\n          onClick={() => {\n            devTool.isOpen = true;\n          }}\n        >\n          <Wrench size={20} />\n        </div>\n      </div>\n      <Sheet open={devTool.isOpen}>\n        <SheetContent\n          open={devTool.isOpen}\n          side=\"bottom\"\n          className=\"p-0 outline-none bg-card dark:border-none\"\n          style={{\n            height: store.sheetHeight,\n          }}\n        >\n          <div className=\"absolute top-0 left-0 h-[32px] w-full bg-gray-100 dark:bg-gray-800\"></div>\n          <SheetClose\n            className=\"top-2 right-2\"\n            onClick={() => {\n              devTool.isOpen = false;\n            }}\n          />\n          <div\n            className=\"absolute top-[-8px] left-0 w-full h-[10px] cursor-row-resize\"\n            onMouseDown={(e) => {\n              const startH = store.sheetHeight;\n              const startPageY = e.pageY;\n              const onMouseMove = (mouseMoveEvent: MouseEvent) => {\n                const diff = startPageY - mouseMoveEvent.pageY;\n                const h = startH + diff;\n                if (h > minSheetHeight && h < window.innerHeight) {\n                  store.sheetHeight = h;\n                }\n              };\n              const onMouseUp = () => {\n                document.body.removeEventListener(\"mousemove\", onMouseMove);\n              };\n              document.body.addEventListener(\"mousemove\", onMouseMove);\n              document.body.addEventListener(\"mouseup\", onMouseUp, { once: true });\n            }}\n          />\n          <Tabs\n            className='w-full'\n            size=\"sm\"\n            radius=\"none\"\n            items={devTool.panels}\n          >\n            {(panel) => {\n              const Component = panel.render || (() => null);\n              return (\n                <Tab key={panel.title} title={panel.title}>\n                  <div className=\"p-0\" style={{ height: `calc(${store.sheetHeight}px - 50px)` }}>\n                    <Component rootStore={rootStore} />\n                  </div>\n                </Tab>\n              )\n            }}\n          </Tabs>\n        </SheetContent>\n      </Sheet>\n    </>\n  );\n});\n","\"use client\";\n\nimport React, { useRef } from \"react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport { _ } from \"../../lib/lodash\";\nimport * as jsonpatch from \"fast-json-patch\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from '@nextui-org/react';\n\nexport const JSONEditor = ({ className, height = \"100%\", initialJson, onChange, onSubmit }: { className?: string; height?: string | number; initialJson: string; onChange?: (value: Record<string, any>) => void; onSubmit?: (value: Record<string, any>) => void }) => {\n  const valueRef = useRef<string>(initialJson);\n  const changeValueRef = useRef(\n    _.debounce((initialJson: string, currentJson: string) => {\n      if (onChange) {\n        try {\n          const tree1 = JSON.parse(initialJson);\n          const tree2 = JSON.parse(currentJson);\n          const diff = jsonpatch.compare(tree1, tree2);\n          // @ts-ignore\n          const applyDiff = (diff) => {\n            const result = {};\n            for (const change of diff) {\n              const { op, path, value } = change;\n              // @ts-ignore\n              const keys = path.split(\"/\").filter((key) => key !== \"\");\n              let current = result;\n              for (let i = 0; i < keys.length - 1; i++) {\n                const key = keys[i];\n                // @ts-ignore\n                if (!current[key]) {\n                  // @ts-ignore\n                  current[key] = {};\n                }\n                // @ts-ignore\n                current = current[key];\n              }\n              let lastKey = keys[keys.length - 1];\n              lastKey = lastKey.replace('~1', '/');\n              if (op === \"replace\") {\n                // @ts-ignore\n                current[lastKey] = value;\n              }\n              if (op === \"add\") {\n                // @ts-ignore\n                current[lastKey] = value;\n              }\n            }\n            return result;\n          };\n          const result = applyDiff(diff);\n          if (Object.keys(result).length > 0) {\n            onChange(result);\n          }\n        } catch (error) {\n          console.error(error);\n        }\n      }\n    }, 1000)\n  );\n\n  return (\n    <div className={cn(\"relative w-full\", className)}>\n      <MonacoEditor\n        options={{\n          minimap: {\n            enabled: false,\n          },\n        }}\n        height={height}\n        theme=\"vs-dark\"\n        language=\"json\"\n        value={initialJson}\n        onChange={(v) => {\n          changeValueRef.current?.(initialJson, v);\n          // @ts-ignore\n          valueRef.current = v;\n        }}\n      />\n      {onSubmit && (\n        <Button\n          className=\"z-50 absolute bottom-[50px] right-[20px]\"\n          color='primary'\n          size='sm'\n          onClick={() => {\n            try {\n              const json = JSON.parse(valueRef.current);\n              onSubmit(json);\n            } catch (error) {\n              console.error(error);\n            }\n          }}>\n          Submit\n        </Button>\n      )}\n    </div>\n  );\n};\n\n"]}
+{"version":3,"sources":["../components/ui/sheet.tsx","../module/Devtool/devtool.tsx","../components/JSONEditor/index.tsx"],"names":["React","initialJson","diff","result"],"mappings":"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","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\n// @ts-ignore\nconst SheetPortal = ({ className, ...props }: SheetPrimitive.DialogPortalProps) => <SheetPrimitive.Portal className={cn(className)} {...props} />;\nSheetPortal.displayName = SheetPrimitive.Portal.displayName;\n\nconst SheetOverlay = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Overlay>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay className={cn(\"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\", className)} {...props} ref={ref} />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\", {\n  variants: {\n    side: {\n      top: \"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n      bottom: \"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n      left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n      right: \"inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n    },\n  },\n  defaultVariants: {\n    side: \"right\",\n  },\n});\n\nconst SheetClose = ({ className, ...props }: SheetPrimitive.DialogCloseProps) => (\n  <SheetPrimitive.Close className={cn(\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\", className)} {...props}>\n    <X className=\"h-4 w-4\" />\n    <span className=\"sr-only\">Close</span>\n  </SheetPrimitive.Close>\n);\nSheetClose.displayName = \"Close\";\n\ninterface SheetContentProps extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> { }\n\nconst SheetContent = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Content>, SheetContentProps & { showOverlay?: boolean; open?: boolean }>(({ side = \"right\", className, children, showOverlay = false, open, ...props }, ref) => {\n  return (\n    <SheetPortal>\n      {showOverlay && <SheetOverlay />}\n      <div ref={ref} data-state={open ? \"open\" : \"closed\"} className={cn(sheetVariants({ side }), className)} {...props}>\n        {children}\n      </div>\n    </SheetPortal>\n  );\n});\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => <div className={cn(\"flex flex-col space-y-2 text-center sm:text-left\", className)} {...props} />;\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => <div className={cn(\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\", className)} {...props} />;\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Title>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>>(({ className, ...props }, ref) => <SheetPrimitive.Title ref={ref} className={cn(\"text-lg font-semibold text-foreground\", className)} {...props} />);\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Description>, React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description ref={ref} className={cn(\"text-sm text-muted-foreground\", className)} {...props} />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetFooter, SheetTitle, SheetDescription, SheetClose };\n","import { Sheet, SheetClose, SheetContent } from \"../../components/ui/sheet\";\nimport { Tabs, Tab } from \"@nextui-org/react\";\nimport { cn } from \"../../lib/utils\";\nimport { RootStore } from \"../../store/root\";\nimport { PromiseState } from \"../../store/standard/PromiseState\";\nimport { Store } from \"../../store/standard/base\";\nimport { Wrench } from \"lucide-react\";\nimport { observer, useLocalObservable } from \"mobx-react-lite\";\nimport { toJS } from \"mobx\";\nimport { helper } from \"../../lib/helper\";\nimport EventEmitter from \"events\";\nimport { useMemo } from \"react\";\nimport React from \"react\";\nimport { JSONEditor } from \"../../components/JSONEditor\"\n\nfunction filterState(obj) {\n  if (obj.toJSON) {\n    return obj.toJSON()\n  }\n\n  if (typeof obj !== \"object\" || obj === null) {\n    return obj;\n  }\n\n  if (Array.isArray(obj)) {\n    return obj.map(filterState);\n  }\n\n  const filteredObj = {};\n\n  for (const [key, value] of Object.entries(obj)) {\n    try {\n      if (\n        ![\"sid\", \"disabled\", \"autoObservable\", \"promiseState\", \"autoAsyncable\", \"stype\"].includes(key) &&\n        // !(value instanceof PromiseState) &&\n        !(value instanceof EventEmitter) &&\n        !value?.hasOwnProperty(\"$$typeof\")\n      ) {\n        filteredObj[key] = filterState(value);\n      }\n    } catch (error) {\n      console.error(error);\n      return obj;\n    }\n  }\n\n  return filteredObj;\n}\n\nexport class DevTool implements Store {\n  sid = \"DevTool\";\n  stype = \"Plugin\"\n  provider = ({ rootStore }: { rootStore: RootStore }) => <DevToolProvider rootStore={rootStore} />;\n  disabled?: boolean = false;\n  autoObservable?: boolean = true;\n  isOpen = false;\n\n  panels: Store[\"pannel\"][] = [\n    {\n      title: \"Store\",\n      render: observer(({ rootStore }: { rootStore: RootStore }) => {\n        const state = useLocalObservable<{\n          curStore: Store;\n          curPromiseStateList: { name: string; promiseState: PromiseState<any, any> }[];\n        }>(() => ({\n          //@ts-ignore\n          curStore: null,\n          curPromiseStateList: [],\n        }));\n        const initialJson = useMemo(() => {\n          //@ts-ignore\n          if (state.curStore?.toJSON) return JSON.stringify(state.curStore?.toJSON(), null, 2);\n          const filteredData = filterState(state.curStore || {});\n          return JSON.stringify(toJS(filteredData), null, 2);\n        }, [state.curStore]);\n        return (\n          <div className=\"flex flex-col md:flex-row text-sm\">\n            <div>\n              <Tabs\n                size=\"sm\"\n                radius=\"none\"\n                variant=\"underlined\"\n                items={[{ title: \"Store\", value: \"Store\" }, { title: \"Plugin\", value: \"Plugin\" }]}\n              >\n                {(item) => {\n                  const stores = Object.values(rootStore.instance).filter(i => i.stype == item.value && i.sid).sort((a, b) => a.sid.length - b.sid.length);\n                  return (\n                    <Tab key={item.title} title={item.title} >\n                      <div>\n                        <div className=\"w-full md:w-[300px] space-y-1 pr-2 overflow-auto\">\n                          {stores.map((store) => {\n                            return (\n                              <div\n                                key={store?.sid}\n                                className={cn(\"px-2 rounded-md hover:bg-green-600 hover:text-white cursor-pointer\", { \"bg-green-600 text-white\": state.curStore?.sid === store.sid })}\n                                onClick={() => {\n                                  state.curStore = store;\n                                }}\n                              >\n                                {store.sid}\n                              </div>\n                            );\n                          })}\n                        </div>\n                      </div>\n                    </Tab>\n                  )\n                }}\n              </Tabs>\n            </div>\n\n            <div className=\"mt-4 w-full overflow-auto md:mt-0\">\n              <JSONEditor\n                className={\"h-full\"}\n                height={450}\n                initialJson={initialJson}\n                onChange={(data) => {\n                  console.log(\"onChange\", data);\n                  helper.deepMerge(state.curStore, data);\n                }}\n              />\n              {/* <PromiseStateDebug promiseStateList={state.curPromiseStateList} /> */}\n            </div>\n          </div>\n        );\n      }),\n    },\n  ];\n\n  onNewStore({ rootStore }: { rootStore: RootStore }) {\n    Object.values(rootStore.instance).forEach((store) => {\n      if (store.devtools?.started) return;\n      if (store.devtools?.panels) {\n        store.devtools.started = true;\n        this.panels = [...this.panels, ...store.devtools?.panels];\n      }\n    });\n  }\n\n  constructor(args: Partial<DevTool> = {}) {\n    Object.assign(this, args);\n  }\n}\n\n// const PromiseStateDebug = ({ promiseStateList }: { promiseStateList: { name: string; promiseState: PromiseState<any, any> }[] }) => {\n//   if (promiseStateList.length === 0) return null;\n//   return (\n//     <>\n//       <div className=\"mt-6 mb-2 pt-2 border-t-[1px] font-bold dark:border-gray-600\">Debug PromiseState</div>\n//       <div className=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4\">\n//         {promiseStateList.map((item, index) => {\n//           const formData = item.promiseState.debug.input;\n//           return (\n//             <Card className=\"p-2 dark:border-gray-800\" key={index}>\n//               <div className=\"font-bold text-xs\">{item.name}</div>\n//               <JSONSchemaForm\n//                 formState={getFormState({\n//                   data: formData,\n//                   onSubmit: (data) => {\n//                     item.promiseState.call(data);\n//                   },\n//                 })}\n//               />\n//             </Card>\n//           );\n//         })}\n//       </div>\n//     </>\n//   );\n// };\n\nexport const DevToolProvider = observer(({ rootStore }: { rootStore: RootStore }) => {\n  const devTool = rootStore.get(DevTool);\n  const minSheetHeight = 500;\n  const store = useLocalObservable(() => ({\n    sheetHeight: minSheetHeight,\n  }));\n  return (\n    <>\n      <div className=\"fixed right-4 bottom-4 z-10\">\n        <div\n          className=\"p-1 rounded-sm bg-gray-300 hover:bg-gray-400 dark:bg-gray-600 dark:hover:bg-gray-500 cursor-pointer\"\n          onClick={() => {\n            devTool.isOpen = true;\n          }}\n        >\n          <Wrench size={20} />\n        </div>\n      </div>\n      <Sheet open={devTool.isOpen}>\n        <SheetContent\n          open={devTool.isOpen}\n          side=\"bottom\"\n          className=\"p-0 outline-none bg-card dark:border-none\"\n          style={{\n            height: store.sheetHeight,\n          }}\n        >\n          <div className=\"absolute top-0 left-0 h-[32px] w-full bg-gray-100 dark:bg-gray-800\"></div>\n          <SheetClose\n            className=\"top-2 right-2\"\n            onClick={() => {\n              devTool.isOpen = false;\n            }}\n          />\n          <div\n            className=\"absolute top-[-8px] left-0 w-full h-[10px] cursor-row-resize\"\n            onMouseDown={(e) => {\n              const startH = store.sheetHeight;\n              const startPageY = e.pageY;\n              const onMouseMove = (mouseMoveEvent: MouseEvent) => {\n                const diff = startPageY - mouseMoveEvent.pageY;\n                const h = startH + diff;\n                if (h > minSheetHeight && h < window.innerHeight) {\n                  store.sheetHeight = h;\n                }\n              };\n              const onMouseUp = () => {\n                document.body.removeEventListener(\"mousemove\", onMouseMove);\n              };\n              document.body.addEventListener(\"mousemove\", onMouseMove);\n              document.body.addEventListener(\"mouseup\", onMouseUp, { once: true });\n            }}\n          />\n          <Tabs\n            className='w-full'\n            size=\"sm\"\n            radius=\"none\"\n            items={devTool.panels}\n          >\n            {(panel) => {\n              const Component = panel.render || (() => null);\n              return (\n                <Tab key={panel.title} title={panel.title}>\n                  <div className=\"p-0\" style={{ height: `calc(${store.sheetHeight}px - 50px)` }}>\n                    <Component rootStore={rootStore} />\n                  </div>\n                </Tab>\n              )\n            }}\n          </Tabs>\n        </SheetContent>\n      </Sheet>\n    </>\n  );\n});\n","\"use client\";\n\nimport React, { useRef } from \"react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport { _ } from \"../../lib/lodash\";\nimport * as jsonpatch from \"fast-json-patch\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from '@nextui-org/react';\n\nexport const JSONEditor = ({ className, height = \"100%\", initialJson, onChange, onSubmit }: { className?: string; height?: string | number; initialJson: string; onChange?: (value: Record<string, any>) => void; onSubmit?: (value: Record<string, any>) => void }) => {\n  const valueRef = useRef<string>(initialJson);\n  const changeValueRef = useRef(\n    _.debounce((initialJson: string, currentJson: string) => {\n      if (onChange) {\n        try {\n          const tree1 = JSON.parse(initialJson);\n          const tree2 = JSON.parse(currentJson);\n          const diff = jsonpatch.compare(tree1, tree2);\n          // @ts-ignore\n          const applyDiff = (diff) => {\n            const result = {};\n            for (const change of diff) {\n              const { op, path, value } = change;\n              // @ts-ignore\n              const keys = path.split(\"/\").filter((key) => key !== \"\");\n              let current = result;\n              for (let i = 0; i < keys.length - 1; i++) {\n                const key = keys[i];\n                // @ts-ignore\n                if (!current[key]) {\n                  // @ts-ignore\n                  current[key] = {};\n                }\n                // @ts-ignore\n                current = current[key];\n              }\n              let lastKey = keys[keys.length - 1];\n              lastKey = lastKey.replace('~1', '/');\n              if (op === \"replace\") {\n                // @ts-ignore\n                current[lastKey] = value;\n              }\n              if (op === \"add\") {\n                // @ts-ignore\n                current[lastKey] = value;\n              }\n            }\n            return result;\n          };\n          const result = applyDiff(diff);\n          if (Object.keys(result).length > 0) {\n            onChange(result);\n          }\n        } catch (error) {\n          console.error(error);\n        }\n      }\n    }, 1000)\n  );\n\n  return (\n    <div className={cn(\"relative w-full\", className)}>\n      <MonacoEditor\n        options={{\n          minimap: {\n            enabled: false,\n          },\n        }}\n        height={height}\n        theme=\"vs-dark\"\n        language=\"json\"\n        value={initialJson}\n        onChange={(v) => {\n          changeValueRef.current?.(initialJson, v);\n          // @ts-ignore\n          valueRef.current = v;\n        }}\n      />\n      {onSubmit && (\n        <Button\n          className=\"z-50 absolute bottom-[50px] right-[20px]\"\n          color='primary'\n          size='sm'\n          onClick={() => {\n            try {\n              const json = JSON.parse(valueRef.current);\n              onSubmit(json);\n            } catch (error) {\n              console.error(error);\n            }\n          }}>\n          Submit\n        </Button>\n      )}\n    </div>\n  );\n};\n\n"]}