@uiw/react-json-view 2.0.0-alpha.31 → 2.0.0-alpha.33

package/README.md

@@ -735,7 +735,7 @@ export default function Demo() {
       collapsed={2}
       shouldExpandNodeInitially={(isExpanded, { value, keys, level }) => {
         if (keys.length > 0 && keys[0] == "object") {
-          return true
+          return false
         }
         return isExpanded
       }}

package/cjs/comps/Copied.js

@@ -12,7 +12,7 @@ var _react = require("react");
 var _store = require("../store");
 var _Section = require("../store/Section");
 var _ShowTools = require("../store/ShowTools");
-var _types = require("../types");
+var _types = require("../types/");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["keyName", "value", "parentValue", "expandKey", "keys"],
   _excluded2 = ["as", "render"];

package/cjs/comps/KeyValues.js

@@ -18,7 +18,7 @@ var _Value = require("./Value");
 var _KeyName = require("../section/KeyName");
 var _Row = require("../section/Row");
 var _Container = require("../Container");
-var _symbol = require("../symbol");
+var _symbol = require("../symbol/");
 var _useHighlight = require("../utils/useHighlight");
 var _Copied = require("../comps/Copied");
 var _useIdCompat = require("../comps/useIdCompat");
@@ -40,11 +40,12 @@ var KeyValues = exports.KeyValues = function KeyValues(props) {
   var isMyArray = Array.isArray(value);
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isExpanded = (_expands$expandKey = expands[expandKey]) !== null && _expands$expandKey !== void 0 ? _expands$expandKey : defaultExpanded;
-  if (expands[expandKey] === undefined && shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value: value,
     keys: keys,
     level: level
-  })) {
+  });
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
     return null;
   }
   if (isExpanded) {
@@ -80,9 +81,9 @@ var KeyValues = exports.KeyValues = function KeyValues(props) {
     className: "w-rjv-wrap",
     style: style,
     children: entries.map(function (_ref9, idx) {
-      var _ref10 = (0, _slicedToArray2["default"])(_ref9, 2),
-        key = _ref10[0],
-        val = _ref10[1];
+      var _ref0 = (0, _slicedToArray2["default"])(_ref9, 2),
+        key = _ref0[0],
+        val = _ref0[1];
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(KeyValuesItem, {
         parentValue: value,
         keyName: key,

package/cjs/comps/NestedClose.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.NestedClose = void 0;
 var _store = require("../store");
 var _Expands = require("../store/Expands");
-var _symbol = require("../symbol");
+var _symbol = require("../symbol/");
 var _jsxRuntime = require("react/jsx-runtime");
 var NestedClose = exports.NestedClose = function NestedClose(props) {
   var _expands$expandKey;
@@ -24,11 +24,12 @@ var NestedClose = exports.NestedClose = function NestedClose(props) {
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isExpanded = (_expands$expandKey = expands[expandKey]) !== null && _expands$expandKey !== void 0 ? _expands$expandKey : defaultExpanded;
   var len = Object.keys(value).length;
-  if (expands[expandKey] === undefined && shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value: value,
     keys: keys,
     level: level
-  })) {
+  });
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
     return null;
   }
   if (isExpanded || len === 0) {

package/cjs/comps/NestedOpen.js

@@ -14,9 +14,9 @@ var _store = require("../store");
 var _Copied = require("./Copied");
 var _CountInfoExtra = require("../section/CountInfoExtra");
 var _CountInfo = require("../section/CountInfo");
-var _symbol = require("../symbol");
+var _symbol = require("../symbol/");
 var _Ellipsis = require("../section/Ellipsis");
-var _types = require("../types");
+var _types = require("../types/");
 var _jsxRuntime = require("react/jsx-runtime");
 var NestedOpen = exports.NestedOpen = function NestedOpen(props) {
   var _expands$expandKey;
@@ -39,13 +39,13 @@ var NestedOpen = exports.NestedOpen = function NestedOpen(props) {
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isObject = (0, _typeof2["default"])(value) === 'object';
   var isExpanded = (_expands$expandKey = expands[expandKey]) !== null && _expands$expandKey !== void 0 ? _expands$expandKey : defaultExpanded;
-  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value: value,
     keys: keys,
     level: level
   });
-  if (expands[expandKey] === undefined && shouldExpand !== undefined) {
-    isExpanded = shouldExpand;
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
+    isExpanded = !shouldExpand;
   }
   var click = function click() {
     var opt = {

package/cjs/comps/Value.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.isFloat = exports.Value = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _types = require("../types");
+var _types = require("../types/");
 var _jsxRuntime = require("react/jsx-runtime");
 var isFloat = exports.isFloat = function isFloat(n) {
   return Number(n) === n && n % 1 !== 0 || isNaN(n);

package/cjs/index.d.ts

@@ -30,7 +30,7 @@ export * from './store/Expands';
 export * from './store/ShowTools';
 export * from './store/Symbols';
 export * from './store/Types';
-export * from './symbol';
+export * from './symbol/';
 export interface JsonViewProps<T extends object> extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
     /** This property contains your input JSON */
     value?: T;

package/cjs/index.js

@@ -98,7 +98,7 @@ Object.keys(_Types).forEach(function (key) {
     }
   });
 });
-var _symbol = require("./symbol");
+var _symbol = require("./symbol/");
 Object.keys(_symbol).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;

package/cjs/types/index.js

@@ -11,7 +11,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = require("react");
 var _store = require("../store");
 var _Types = require("../store/Types");
-var _symbol = require("../symbol");
+var _symbol = require("../symbol/");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["as", "render"],
   _excluded2 = ["as", "render"],
@@ -22,10 +22,10 @@ var _excluded = ["as", "render"],
   _excluded7 = ["as", "render"],
   _excluded8 = ["as", "render"],
   _excluded9 = ["as", "render"],
+  _excluded0 = ["as", "render"],
+  _excluded1 = ["as", "render"],
   _excluded10 = ["as", "render"],
-  _excluded11 = ["as", "render"],
-  _excluded12 = ["as", "render"],
-  _excluded13 = ["as", "render"];
+  _excluded11 = ["as", "render"];
 var bigIntToString = exports.bigIntToString = function bigIntToString(bi) {
   if (bi === undefined) {
     return '0n';
@@ -385,16 +385,16 @@ var TypeUrl = exports.TypeUrl = function TypeUrl(_ref9) {
   });
 };
 TypeUrl.displayName = 'JVR.TypeUrl';
-var TypeDate = exports.TypeDate = function TypeDate(_ref10) {
-  var children = _ref10.children,
-    keyName = _ref10.keyName;
-  var _useTypesStore10 = (0, _Types.useTypesStore)(),
-    _useTypesStore10$Date = _useTypesStore10.Date,
-    CompData = _useTypesStore10$Date === void 0 ? {} : _useTypesStore10$Date,
-    displayDataTypes = _useTypesStore10.displayDataTypes;
+var TypeDate = exports.TypeDate = function TypeDate(_ref0) {
+  var children = _ref0.children,
+    keyName = _ref0.keyName;
+  var _useTypesStore0 = (0, _Types.useTypesStore)(),
+    _useTypesStore0$Date = _useTypesStore0.Date,
+    CompData = _useTypesStore0$Date === void 0 ? {} : _useTypesStore0$Date,
+    displayDataTypes = _useTypesStore0.displayDataTypes;
   var as = CompData.as,
     render = CompData.render,
-    reset = (0, _objectWithoutProperties2["default"])(CompData, _excluded10);
+    reset = (0, _objectWithoutProperties2["default"])(CompData, _excluded0);
   var Comp = as || 'span';
   var style = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, defalutStyle), CompData.style || {});
   var isRender = render && typeof render === 'function';
@@ -424,16 +424,16 @@ var TypeDate = exports.TypeDate = function TypeDate(_ref10) {
   });
 };
 TypeDate.displayName = 'JVR.TypeDate';
-var TypeUndefined = exports.TypeUndefined = function TypeUndefined(_ref11) {
-  var children = _ref11.children,
-    keyName = _ref11.keyName;
-  var _useTypesStore11 = (0, _Types.useTypesStore)(),
-    _useTypesStore11$Unde = _useTypesStore11.Undefined,
-    Undefined = _useTypesStore11$Unde === void 0 ? {} : _useTypesStore11$Unde,
-    displayDataTypes = _useTypesStore11.displayDataTypes;
+var TypeUndefined = exports.TypeUndefined = function TypeUndefined(_ref1) {
+  var children = _ref1.children,
+    keyName = _ref1.keyName;
+  var _useTypesStore1 = (0, _Types.useTypesStore)(),
+    _useTypesStore1$Undef = _useTypesStore1.Undefined,
+    Undefined = _useTypesStore1$Undef === void 0 ? {} : _useTypesStore1$Undef,
+    displayDataTypes = _useTypesStore1.displayDataTypes;
   var as = Undefined.as,
     render = Undefined.render,
-    reset = (0, _objectWithoutProperties2["default"])(Undefined, _excluded11);
+    reset = (0, _objectWithoutProperties2["default"])(Undefined, _excluded1);
   var Comp = as || 'span';
   var style = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, defalutStyle), Undefined.style || {});
   var isRender = render && typeof render === 'function';
@@ -459,16 +459,16 @@ var TypeUndefined = exports.TypeUndefined = function TypeUndefined(_ref11) {
   });
 };
 TypeUndefined.displayName = 'JVR.TypeUndefined';
-var TypeNull = exports.TypeNull = function TypeNull(_ref12) {
-  var children = _ref12.children,
-    keyName = _ref12.keyName;
-  var _useTypesStore12 = (0, _Types.useTypesStore)(),
-    _useTypesStore12$Null = _useTypesStore12.Null,
-    Null = _useTypesStore12$Null === void 0 ? {} : _useTypesStore12$Null,
-    displayDataTypes = _useTypesStore12.displayDataTypes;
+var TypeNull = exports.TypeNull = function TypeNull(_ref10) {
+  var children = _ref10.children,
+    keyName = _ref10.keyName;
+  var _useTypesStore10 = (0, _Types.useTypesStore)(),
+    _useTypesStore10$Null = _useTypesStore10.Null,
+    Null = _useTypesStore10$Null === void 0 ? {} : _useTypesStore10$Null,
+    displayDataTypes = _useTypesStore10.displayDataTypes;
   var as = Null.as,
     render = Null.render,
-    reset = (0, _objectWithoutProperties2["default"])(Null, _excluded12);
+    reset = (0, _objectWithoutProperties2["default"])(Null, _excluded10);
   var Comp = as || 'span';
   var style = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, defalutStyle), Null.style || {});
   var isRender = render && typeof render === 'function';
@@ -494,16 +494,16 @@ var TypeNull = exports.TypeNull = function TypeNull(_ref12) {
   });
 };
 TypeNull.displayName = 'JVR.TypeNull';
-var TypeNan = exports.TypeNan = function TypeNan(_ref13) {
-  var children = _ref13.children,
-    keyName = _ref13.keyName;
-  var _useTypesStore13 = (0, _Types.useTypesStore)(),
-    _useTypesStore13$Nan = _useTypesStore13.Nan,
-    Nan = _useTypesStore13$Nan === void 0 ? {} : _useTypesStore13$Nan,
-    displayDataTypes = _useTypesStore13.displayDataTypes;
+var TypeNan = exports.TypeNan = function TypeNan(_ref11) {
+  var children = _ref11.children,
+    keyName = _ref11.keyName;
+  var _useTypesStore11 = (0, _Types.useTypesStore)(),
+    _useTypesStore11$Nan = _useTypesStore11.Nan,
+    Nan = _useTypesStore11$Nan === void 0 ? {} : _useTypesStore11$Nan,
+    displayDataTypes = _useTypesStore11.displayDataTypes;
   var as = Nan.as,
     render = Nan.render,
-    reset = (0, _objectWithoutProperties2["default"])(Nan, _excluded13);
+    reset = (0, _objectWithoutProperties2["default"])(Nan, _excluded11);
   var Comp = as || 'span';
   var style = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, defalutStyle), Nan.style || {});
   var isRender = render && typeof render === 'function';

package/esm/Container.js

@@ -2,11 +2,11 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["className", "children", "parentValue", "keyid", "level", "value", "initialValue", "keys", "keyName"];
 import React, { forwardRef } from 'react';
-import { NestedClose } from './comps/NestedClose';
-import { NestedOpen } from './comps/NestedOpen';
-import { KeyValues } from './comps/KeyValues';
-import { useIdCompat } from './comps/useIdCompat';
-import { useShowToolsDispatch } from './store/ShowTools';
+import { NestedClose } from "./comps/NestedClose.js";
+import { NestedOpen } from "./comps/NestedOpen.js";
+import { KeyValues } from "./comps/KeyValues.js";
+import { useIdCompat } from "./comps/useIdCompat.js";
+import { useShowToolsDispatch } from "./store/ShowTools.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var Container = /*#__PURE__*/forwardRef((props, ref) => {
   var {

package/esm/comps/Copied.js

@@ -3,10 +3,10 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutP
 var _excluded = ["keyName", "value", "parentValue", "expandKey", "keys"],
   _excluded2 = ["as", "render"];
 import { useState } from 'react';
-import { useStore } from '../store';
-import { useSectionStore } from '../store/Section';
-import { useShowToolsStore } from '../store/ShowTools';
-import { bigIntToString } from '../types';
+import { useStore } from "../store.js";
+import { useSectionStore } from "../store/Section.js";
+import { useShowToolsStore } from "../store/ShowTools.js";
+import { bigIntToString } from "../types/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var Copied = props => {
   var {

package/esm/comps/KeyValues.js

@@ -1,16 +1,16 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { Fragment, useRef } from 'react';
-import { useStore } from '../store';
-import { useExpandsStore } from '../store/Expands';
-import { useShowToolsDispatch } from '../store/ShowTools';
-import { Value } from './Value';
-import { KeyNameComp } from '../section/KeyName';
-import { RowComp } from '../section/Row';
-import { Container } from '../Container';
-import { Quote, Colon } from '../symbol';
-import { useHighlight } from '../utils/useHighlight';
-import { Copied } from '../comps/Copied';
-import { useIdCompat } from '../comps/useIdCompat';
+import { useStore } from "../store.js";
+import { useExpandsStore } from "../store/Expands.js";
+import { useShowToolsDispatch } from "../store/ShowTools.js";
+import { Value } from "./Value.js";
+import { KeyNameComp } from "../section/KeyName.js";
+import { RowComp } from "../section/Row.js";
+import { Container } from "../Container.js";
+import { Quote, Colon } from "../symbol/index.js";
+import { useHighlight } from "../utils/useHighlight.js";
+import { Copied } from "../comps/Copied.js";
+import { useIdCompat } from "../comps/useIdCompat.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var KeyValues = props => {
   var _expands$expandKey;
@@ -30,11 +30,12 @@ export var KeyValues = props => {
   var isMyArray = Array.isArray(value);
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : defaultExpanded;
-  if (expands[expandKey] === undefined && shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value,
     keys,
     level
-  })) {
+  });
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
     return null;
   }
   if (isExpanded) {

package/esm/comps/NestedClose.js

@@ -1,6 +1,6 @@
-import { useStore } from '../store';
-import { useExpandsStore } from '../store/Expands';
-import { BracketsClose } from '../symbol';
+import { useStore } from "../store.js";
+import { useExpandsStore } from "../store/Expands.js";
+import { BracketsClose } from "../symbol/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var NestedClose = props => {
   var _expands$expandKey;
@@ -20,11 +20,12 @@ export var NestedClose = props => {
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : defaultExpanded;
   var len = Object.keys(value).length;
-  if (expands[expandKey] === undefined && shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value,
     keys,
     level
-  })) {
+  });
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
     return null;
   }
   if (isExpanded || len === 0) {

package/esm/comps/NestedOpen.js

@@ -1,13 +1,13 @@
 import _extends from "@babel/runtime/helpers/extends";
-import { KayName } from './KeyValues';
-import { useExpandsStore, useExpandsDispatch } from '../store/Expands';
-import { useStore } from '../store';
-import { Copied } from './Copied';
-import { CountInfoExtraComps } from '../section/CountInfoExtra';
-import { CountInfoComp } from '../section/CountInfo';
-import { Arrow, BracketsOpen, BracketsClose } from '../symbol';
-import { EllipsisComp } from '../section/Ellipsis';
-import { SetComp, MapComp } from '../types';
+import { KayName } from "./KeyValues.js";
+import { useExpandsStore, useExpandsDispatch } from "../store/Expands.js";
+import { useStore } from "../store.js";
+import { Copied } from "./Copied.js";
+import { CountInfoExtraComps } from "../section/CountInfoExtra.js";
+import { CountInfoComp } from "../section/CountInfo.js";
+import { Arrow, BracketsOpen, BracketsClose } from "../symbol/index.js";
+import { EllipsisComp } from "../section/Ellipsis.js";
+import { SetComp, MapComp } from "../types/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var NestedOpen = props => {
   var _expands$expandKey;
@@ -32,13 +32,13 @@ export var NestedOpen = props => {
   var defaultExpanded = typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
   var isObject = typeof value === 'object';
   var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : defaultExpanded;
-  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(isExpanded, {
+  var shouldExpand = shouldExpandNodeInitially && shouldExpandNodeInitially(!isExpanded, {
     value,
     keys,
     level
   });
-  if (expands[expandKey] === undefined && shouldExpand !== undefined) {
-    isExpanded = shouldExpand;
+  if (expands[expandKey] === undefined && shouldExpandNodeInitially && !shouldExpand) {
+    isExpanded = !shouldExpand;
   }
   var click = () => {
     var opt = {

package/esm/comps/Value.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
-import { TypeString, TypeTrue, TypeNull, TypeFalse, TypeFloat, TypeBigint, TypeInt, TypeDate, TypeUndefined, TypeNan, TypeUrl } from '../types';
+import { TypeString, TypeTrue, TypeNull, TypeFalse, TypeFloat, TypeBigint, TypeInt, TypeDate, TypeUndefined, TypeNan, TypeUrl } from "../types/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var isFloat = n => Number(n) === n && n % 1 !== 0 || isNaN(n);
 export var Value = props => {

package/esm/editor/KeyName.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutP
 var _excluded = ["children"],
   _excluded2 = ["value", "parentValue", "keyName"];
 import { useRef, useState } from 'react';
-import { useStore } from './store';
+import { useStore } from "./store.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var KeyNameRender = (_ref, _ref2) => {
   var {

package/esm/editor/index.js

@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["children", "onEdit", "editable"];
 import { forwardRef } from 'react';
-import JsonView from '../';
-import { KeyNameRender } from './KeyName';
-import { Context, Dispatch, useStoreReducer } from './store';
+import JsonView from "../index.js";
+import { KeyNameRender } from "./KeyName.js";
+import { Context, Dispatch, useStoreReducer } from "./store.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var JsonViewEditor = /*#__PURE__*/forwardRef((props, ref) => {
   var {

package/esm/index.d.ts

@@ -30,7 +30,7 @@ export * from './store/Expands';
 export * from './store/ShowTools';
 export * from './store/Symbols';
 export * from './store/Types';
-export * from './symbol';
+export * from './symbol/';
 export interface JsonViewProps<T extends object> extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
     /** This property contains your input JSON */
     value?: T;

package/esm/index.js

@@ -2,42 +2,42 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["className", "style", "value", "children", "collapsed", "shouldExpandNodeInitially", "indentWidth", "displayObjectSize", "shortenTextAfterLength", "stringEllipsis", "highlightUpdates", "enableClipboard", "displayDataTypes", "objectSortKeys", "onExpand", "onCopied"];
 import { forwardRef } from 'react';
-import { Provider } from './store';
-import { Container } from './Container';
-import { BraceLeft } from './symbol/BraceLeft';
-import { BraceRight } from './symbol/BraceRight';
-import { BracketsLeft } from './symbol/BracketsLeft';
-import { BracketsRight } from './symbol/BracketsRight';
-import { Arrow } from './symbol/Arrow';
-import { Colon } from './symbol/Colon';
-import { Quote } from './symbol/Quote';
-import { ValueQuote } from './symbol/ValueQuote';
-import { Bigint } from './types/Bigint';
-import { Date } from './types/Date';
-import { False } from './types/False';
-import { Float } from './types/Float';
-import { Int } from './types/Int';
-import { Map } from './types/Map';
-import { Nan } from './types/Nan';
-import { Null } from './types/Null';
-import { Set } from './types/Set';
-import { StringText } from './types/String';
-import { True } from './types/True';
-import { Undefined } from './types/Undefined';
-import { Url } from './types/Url';
-import { Copied } from './section/Copied';
-import { CountInfo } from './section/CountInfo';
-import { CountInfoExtra } from './section/CountInfoExtra';
-import { Ellipsis } from './section/Ellipsis';
-import { KeyName } from './section/KeyName';
-import { Row } from './section/Row';
+import { Provider } from "./store.js";
+import { Container } from "./Container.js";
+import { BraceLeft } from "./symbol/BraceLeft.js";
+import { BraceRight } from "./symbol/BraceRight.js";
+import { BracketsLeft } from "./symbol/BracketsLeft.js";
+import { BracketsRight } from "./symbol/BracketsRight.js";
+import { Arrow } from "./symbol/Arrow.js";
+import { Colon } from "./symbol/Colon.js";
+import { Quote } from "./symbol/Quote.js";
+import { ValueQuote } from "./symbol/ValueQuote.js";
+import { Bigint } from "./types/Bigint.js";
+import { Date } from "./types/Date.js";
+import { False } from "./types/False.js";
+import { Float } from "./types/Float.js";
+import { Int } from "./types/Int.js";
+import { Map } from "./types/Map.js";
+import { Nan } from "./types/Nan.js";
+import { Null } from "./types/Null.js";
+import { Set } from "./types/Set.js";
+import { StringText } from "./types/String.js";
+import { True } from "./types/True.js";
+import { Undefined } from "./types/Undefined.js";
+import { Url } from "./types/Url.js";
+import { Copied } from "./section/Copied.js";
+import { CountInfo } from "./section/CountInfo.js";
+import { CountInfoExtra } from "./section/CountInfoExtra.js";
+import { Ellipsis } from "./section/Ellipsis.js";
+import { KeyName } from "./section/KeyName.js";
+import { Row } from "./section/Row.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export * from './store';
-export * from './store/Expands';
-export * from './store/ShowTools';
-export * from './store/Symbols';
-export * from './store/Types';
-export * from './symbol';
+export * from "./store.js";
+export * from "./store/Expands.js";
+export * from "./store/ShowTools.js";
+export * from "./store/Symbols.js";
+export * from "./store/Types.js";
+export * from "./symbol/index.js";
 var JsonView = /*#__PURE__*/forwardRef((props, ref) => {
   var {
       className = '',

package/esm/section/Copied.js

@@ -1,5 +1,5 @@
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
 export var Copied = props => {
   var {
     Copied: Comp = {}

package/esm/section/CountInfo.js

@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["value", "keyName"],
   _excluded2 = ["as", "render"];
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
-import { useStore } from '../store';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
+import { useStore } from "../store.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var CountInfo = props => {
   var {

package/esm/section/CountInfoExtra.js

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["value", "keyName"],
   _excluded2 = ["as", "render"];
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var CountInfoExtra = props => {
   var {

package/esm/section/Ellipsis.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["as", "render"];
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var Ellipsis = props => {
   var {

package/esm/section/KeyName.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["as", "render"];
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var KeyName = props => {
   var {

package/esm/section/Row.js

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["children", "value", "parentValue", "keyName", "keys"],
   _excluded2 = ["as", "render", "children"];
-import { useSectionStore } from '../store/Section';
-import { useSectionRender } from '../utils/useRender';
+import { useSectionStore } from "../store/Section.js";
+import { useSectionRender } from "../utils/useRender.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var Row = props => {
   var {

package/esm/store/Symbols.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { createContext, useContext, useReducer } from 'react';
-import { TriangleArrow } from '../arrow/TriangleArrow';
+import { TriangleArrow } from "../arrow/TriangleArrow.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 var initialState = {
   Arrow: {

package/esm/store.js

@@ -1,10 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { createContext, useContext, useEffect, useReducer } from 'react';
-import { useShowTools, ShowTools } from './store/ShowTools';
-import { useExpands, Expands } from './store/Expands';
-import { useTypes, Types } from './store/Types';
-import { useSymbols, Symbols } from './store/Symbols';
-import { useSection, Section } from './store/Section';
+import { useShowTools, ShowTools } from "./store/ShowTools.js";
+import { useExpands, Expands } from "./store/Expands.js";
+import { useTypes, Types } from "./store/Types.js";
+import { useSymbols, Symbols } from "./store/Symbols.js";
+import { useSection, Section } from "./store/Section.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var initialState = {
   objectSortKeys: false,

package/esm/symbol/Arrow.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var Arrow = props => {
   var {
     Arrow: Comp = {}

package/esm/symbol/BraceLeft.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var BraceLeft = props => {
   var {
     BraceLeft: Comp = {}

package/esm/symbol/BraceRight.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var BraceRight = props => {
   var {
     BraceRight: Comp = {}

package/esm/symbol/BracketsLeft.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var BracketsLeft = props => {
   var {
     BracketsLeft: Comp = {}

package/esm/symbol/BracketsRight.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var BracketsRight = props => {
   var {
     BracketsRight: Comp = {}

package/esm/symbol/Colon.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var Colon = props => {
   var {
     Colon: Comp = {}

package/esm/symbol/Quote.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var Quote = props => {
   var {
     Quote: Comp = {}

package/esm/symbol/ValueQuote.js

@@ -1,5 +1,5 @@
-import { useSymbolsStore } from '../store/Symbols';
-import { useSymbolsRender } from '../utils/useRender';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useSymbolsRender } from "../utils/useRender.js";
 export var ValueQuote = props => {
   var {
     ValueQuote: Comp = {}

package/esm/symbol/index.js

@@ -10,8 +10,8 @@ var _excluded = ["isNumber", "value", "parentValue", "keyName", "keys"],
   _excluded7 = ["as", "render"],
   _excluded8 = ["as", "render"],
   _excluded9 = ["as", "render"];
-import { useSymbolsStore } from '../store/Symbols';
-import { useExpandsStore } from '../store/Expands';
+import { useSymbolsStore } from "../store/Symbols.js";
+import { useExpandsStore } from "../store/Expands.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var Quote = props => {
   var {

package/esm/types/Bigint.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Bigint = props => {
   var {
     Bigint: Comp = {}

package/esm/types/Date.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Date = props => {
   var {
     Date: Comp = {}

package/esm/types/False.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var False = props => {
   var {
     False: Comp = {}

package/esm/types/Float.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Float = props => {
   var {
     Float: Comp = {}

package/esm/types/Int.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Int = props => {
   var {
     Int: Comp = {}

package/esm/types/Map.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Map = props => {
   var {
     Map: Comp = {}

package/esm/types/Nan.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Nan = props => {
   var {
     Nan: Comp = {}

package/esm/types/Null.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Null = props => {
   var {
     Null: Comp = {}

package/esm/types/Set.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Set = props => {
   var {
     Set: Comp = {}

package/esm/types/String.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var StringText = props => {
   var {
     Str: Comp = {}

package/esm/types/True.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var True = props => {
   var {
     True: Comp = {}

package/esm/types/Undefined.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Undefined = props => {
   var {
     Undefined: Comp = {}

package/esm/types/Url.js

@@ -1,5 +1,5 @@
-import { useTypesStore } from '../store/Types';
-import { useTypesRender } from '../utils/useRender';
+import { useTypesStore } from "../store/Types.js";
+import { useTypesRender } from "../utils/useRender.js";
 export var Url = props => {
   var {
     Url: Comp = {}

package/esm/types/index.js

@@ -9,14 +9,14 @@ var _excluded = ["as", "render"],
   _excluded7 = ["as", "render"],
   _excluded8 = ["as", "render"],
   _excluded9 = ["as", "render"],
+  _excluded0 = ["as", "render"],
+  _excluded1 = ["as", "render"],
   _excluded10 = ["as", "render"],
-  _excluded11 = ["as", "render"],
-  _excluded12 = ["as", "render"],
-  _excluded13 = ["as", "render"];
+  _excluded11 = ["as", "render"];
 import { Fragment, useEffect, useState } from 'react';
-import { useStore } from '../store';
-import { useTypesStore } from '../store/Types';
-import { ValueQuote } from '../symbol';
+import { useStore } from "../store.js";
+import { useTypesStore } from "../store/Types.js";
+import { ValueQuote } from "../symbol/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var bigIntToString = bi => {
   if (bi === undefined) {
@@ -406,11 +406,11 @@ export var TypeUrl = _ref9 => {
   });
 };
 TypeUrl.displayName = 'JVR.TypeUrl';
-export var TypeDate = _ref10 => {
+export var TypeDate = _ref0 => {
   var {
     children,
     keyName
-  } = _ref10;
+  } = _ref0;
   var {
     Date: CompData = {},
     displayDataTypes
@@ -419,7 +419,7 @@ export var TypeDate = _ref10 => {
       as,
       render
     } = CompData,
-    reset = _objectWithoutPropertiesLoose(CompData, _excluded10);
+    reset = _objectWithoutPropertiesLoose(CompData, _excluded0);
   var Comp = as || 'span';
   var style = _extends({}, defalutStyle, CompData.style || {});
   var isRender = render && typeof render === 'function';
@@ -449,11 +449,11 @@ export var TypeDate = _ref10 => {
   });
 };
 TypeDate.displayName = 'JVR.TypeDate';
-export var TypeUndefined = _ref11 => {
+export var TypeUndefined = _ref1 => {
   var {
     children,
     keyName
-  } = _ref11;
+  } = _ref1;
   var {
     Undefined = {},
     displayDataTypes
@@ -462,7 +462,7 @@ export var TypeUndefined = _ref11 => {
       as,
       render
     } = Undefined,
-    reset = _objectWithoutPropertiesLoose(Undefined, _excluded11);
+    reset = _objectWithoutPropertiesLoose(Undefined, _excluded1);
   var Comp = as || 'span';
   var style = _extends({}, defalutStyle, Undefined.style || {});
   var isRender = render && typeof render === 'function';
@@ -488,11 +488,11 @@ export var TypeUndefined = _ref11 => {
   });
 };
 TypeUndefined.displayName = 'JVR.TypeUndefined';
-export var TypeNull = _ref12 => {
+export var TypeNull = _ref10 => {
   var {
     children,
     keyName
-  } = _ref12;
+  } = _ref10;
   var {
     Null = {},
     displayDataTypes
@@ -501,7 +501,7 @@ export var TypeNull = _ref12 => {
       as,
       render
     } = Null,
-    reset = _objectWithoutPropertiesLoose(Null, _excluded12);
+    reset = _objectWithoutPropertiesLoose(Null, _excluded10);
   var Comp = as || 'span';
   var style = _extends({}, defalutStyle, Null.style || {});
   var isRender = render && typeof render === 'function';
@@ -527,11 +527,11 @@ export var TypeNull = _ref12 => {
   });
 };
 TypeNull.displayName = 'JVR.TypeNull';
-export var TypeNan = _ref13 => {
+export var TypeNan = _ref11 => {
   var {
     children,
     keyName
-  } = _ref13;
+  } = _ref11;
   var {
     Nan = {},
     displayDataTypes
@@ -540,7 +540,7 @@ export var TypeNan = _ref13 => {
       as,
       render
     } = Nan,
-    reset = _objectWithoutPropertiesLoose(Nan, _excluded13);
+    reset = _objectWithoutPropertiesLoose(Nan, _excluded11);
   var Comp = as || 'span';
   var style = _extends({}, defalutStyle, Nan.style || {});
   var isRender = render && typeof render === 'function';

package/esm/utils/useRender.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { useEffect } from 'react';
-import { useSymbolsDispatch } from '../store/Symbols';
-import { useTypesDispatch } from '../store/Types';
-import { useSectionDispatch } from '../store/Section';
+import { useSymbolsDispatch } from "../store/Symbols.js";
+import { useTypesDispatch } from "../store/Types.js";
+import { useSectionDispatch } from "../store/Section.js";
 export function useSymbolsRender(currentProps, props, key) {
   var dispatch = useSymbolsDispatch();
   var cls = [currentProps.className, props.className].filter(Boolean).join(' ');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uiw/react-json-view",
-  "version": "2.0.0-alpha.31",
+  "version": "2.0.0-alpha.33",
   "description": "JSON viewer for react.",
   "main": "cjs/index.js",
   "module": "esm/index.js",