@uiw/react-json-view 2.0.0-alpha.6 → 2.0.0-alpha.8

package/README.md

@@ -324,13 +324,13 @@ export default function Demo() {
       }}
     >
       <JsonView.String
-        render={({ children, ...reset }, { type }) => {
-          const isImg = /^https?.*\.(jpg|png)$/i.test(children)
+        render={({ children, ...reset }, { type, value, keyName }) => {
+          const isImg = /^https?.*\.(jpg|png)$/i.test(value)
           if (type === 'type' && isImg) {
             return <span />
           }
           if (type === 'value' && isImg) {
-            return <img {...reset} height="26" src={children} />
+            return <img {...reset} height="26" src={value} />
           }
         }}
       />

package/cjs/Container.js

@@ -16,7 +16,7 @@ var _KeyValues = require("./comps/KeyValues");
 var _ShowTools = require("./store/ShowTools");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["className", "children", "parentValue", "keyid", "level", "value", "initialValue", "keyName"];
-var Container = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+var Container = exports.Container = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$className = props.className,
     className = _props$className === void 0 ? '' : _props$className,
     children = props.children,
@@ -60,5 +60,4 @@ var Container = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     })]
   }));
 });
-exports.Container = Container;
 Container.displayName = 'JVR.Container';

package/cjs/comps/Copied.js

@@ -15,7 +15,7 @@ var _Section = require("../store/Section");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["keyName", "value", "expandKey"],
   _excluded2 = ["as", "render"];
-var Copied = function Copied(props) {
+var Copied = exports.Copied = function Copied(props) {
   var keyName = props.keyName,
     value = props.value,
     expandKey = props.expandKey,
@@ -35,18 +35,21 @@ var Copied = function Copied(props) {
   if (enableClipboard === false || !isShowTools) return null;
   var click = function click(event) {
     event.stopPropagation();
-    var copyText = JSON.stringify(value, function (key, value) {
-      if (typeof value === 'bigint') {
-        return value.toString();
-      }
-      return value;
-    }, 2);
-    if (typeof value === 'number' && value === Infinity) copyText = 'Infinity';
-    if (typeof value === 'number' && isNaN(value)) copyText = 'NaN';
-    if (typeof value === 'bigint') copyText = value + 'n';
+    var copyText = '';
+    if (typeof value === 'number' && value === Infinity) {
+      copyText = 'Infinity';
+    } else if (typeof value === 'number' && isNaN(value)) {
+      copyText = 'NaN';
+    } else if (typeof value === 'bigint') {
+      copyText = value + 'n';
+    } else if (value instanceof Date) {
+      copyText = value.toLocaleString();
+    } else {
+      copyText = JSON.stringify(value, null, 2);
+    }
+    onCopied && onCopied(copyText, value);
+    setCopied(true);
     navigator.clipboard.writeText(copyText).then(function () {
-      onCopied && onCopied(copyText, value);
-      setCopied(true);
       var timer = setTimeout(function () {
         setCopied(false);
         clearTimeout(timer);
@@ -86,5 +89,4 @@ var Copied = function Copied(props) {
     })
   }));
 };
-exports.Copied = Copied;
 Copied.displayName = 'JVR.Copied';

package/cjs/comps/KeyValues.js

@@ -19,7 +19,7 @@ var _Container = require("../Container");
 var _symbol = require("../symbol");
 var _useHighlight = require("../utils/useHighlight");
 var _jsxRuntime = require("react/jsx-runtime");
-var KeyValues = function KeyValues(props) {
+var KeyValues = exports.KeyValues = function KeyValues(props) {
   var _expands$expandKey;
   var value = props.value,
     _props$expandKey = props.expandKey,
@@ -77,9 +77,8 @@ var KeyValues = function KeyValues(props) {
     })
   });
 };
-exports.KeyValues = KeyValues;
 KeyValues.displayName = 'JVR.KeyValues';
-var KayName = function KayName(props) {
+var KayName = exports.KayName = function KayName(props) {
   var keyName = props.keyName,
     value = props.value;
   var _useStore2 = (0, _store.useStore)(),
@@ -108,9 +107,8 @@ var KayName = function KayName(props) {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_symbol.Colon, {})]
   });
 };
-exports.KayName = KayName;
 KayName.displayName = 'JVR.KayName';
-var KeyValuesItem = function KeyValuesItem(props) {
+var KeyValuesItem = exports.KeyValuesItem = function KeyValuesItem(props) {
   var keyName = props.keyName,
     value = props.value,
     parentValue = props.parentValue,
@@ -156,5 +154,4 @@ var KeyValuesItem = function KeyValuesItem(props) {
     })]
   }));
 };
-exports.KeyValuesItem = KeyValuesItem;
 KeyValuesItem.displayName = 'JVR.KeyValuesItem';

package/cjs/comps/NestedClose.js

@@ -8,7 +8,7 @@ var _store = require("../store");
 var _Expands = require("../store/Expands");
 var _symbol = require("../symbol");
 var _jsxRuntime = require("react/jsx-runtime");
-var NestedClose = function NestedClose(props) {
+var NestedClose = exports.NestedClose = function NestedClose(props) {
   var _expands$expandKey;
   var value = props.value,
     expandKey = props.expandKey,
@@ -34,5 +34,4 @@ var NestedClose = function NestedClose(props) {
     })
   });
 };
-exports.NestedClose = NestedClose;
 NestedClose.displayName = 'JVR.NestedClose';

package/cjs/comps/NestedOpen.js

@@ -18,7 +18,7 @@ var _symbol = require("../symbol");
 var _Ellipsis = require("../section/Ellipsis");
 var _types = require("../types");
 var _jsxRuntime = require("react/jsx-runtime");
-var NestedOpen = function NestedOpen(props) {
+var NestedOpen = exports.NestedOpen = function NestedOpen(props) {
   var _expands$expandKey;
   var keyName = props.keyName,
     expandKey = props.expandKey,
@@ -67,9 +67,11 @@ var NestedOpen = function NestedOpen(props) {
     }), (keyName || typeof keyName === 'number') && /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyValues.KayName, {
       keyName: keyName
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_types.SetComp, {
-      value: initialValue
+      value: initialValue,
+      keyName: keyName
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_types.MapComp, {
-      value: initialValue
+      value: initialValue,
+      keyName: keyName
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_symbol.BracketsOpen, {
       isBrackets: isArray || isMySet
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Ellipsis.EllipsisComp, {
@@ -92,5 +94,4 @@ var NestedOpen = function NestedOpen(props) {
     })]
   }));
 };
-exports.NestedOpen = NestedOpen;
 NestedOpen.displayName = 'JVR.NestedOpen';

package/cjs/comps/Value.js

@@ -8,11 +8,10 @@ exports.isFloat = exports.Value = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _types = require("../types");
 var _jsxRuntime = require("react/jsx-runtime");
-var isFloat = function isFloat(n) {
+var isFloat = exports.isFloat = function isFloat(n) {
   return Number(n) === n && n % 1 !== 0 || isNaN(n);
 };
-exports.isFloat = isFloat;
-var Value = function Value(props) {
+var Value = exports.Value = function Value(props) {
   var value = props.value,
     keyName = props.keyName,
     expandKey = props.expandKey;
@@ -74,5 +73,4 @@ var Value = function Value(props) {
   }
   return null;
 };
-exports.Value = Value;
 Value.displayName = 'JVR.Value';

package/cjs/index.js

@@ -192,5 +192,4 @@ JsonView.CountInfo = _CountInfo.CountInfo;
 JsonView.CountInfoExtra = _CountInfoExtra.CountInfoExtra;
 JsonView.KeyName = _KeyName.KeyName;
 JsonView.displayName = 'JVR.JsonView';
-var _default = JsonView;
-exports["default"] = _default;
+var _default = exports["default"] = JsonView;

package/cjs/section/Copied.js

@@ -6,12 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.Copied = void 0;
 var _Section = require("../store/Section");
 var _useRender = require("../utils/useRender");
-var Copied = function Copied(props) {
+var Copied = exports.Copied = function Copied(props) {
   var _useSectionStore = (0, _Section.useSectionStore)(),
     _useSectionStore$Copi = _useSectionStore.Copied,
     Comp = _useSectionStore$Copi === void 0 ? {} : _useSectionStore$Copi;
   (0, _useRender.useSectionRender)(Comp, props, 'Copied');
   return null;
 };
-exports.Copied = Copied;
 Copied.displayName = 'JVR.Copied';

package/cjs/section/CountInfo.js

@@ -13,16 +13,15 @@ var _store = require("../store");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["value", "keyName"],
   _excluded2 = ["as", "render"];
-var CountInfo = function CountInfo(props) {
+var CountInfo = exports.CountInfo = function CountInfo(props) {
   var _useSectionStore = (0, _Section.useSectionStore)(),
     _useSectionStore$Coun = _useSectionStore.CountInfo,
     Comp = _useSectionStore$Coun === void 0 ? {} : _useSectionStore$Coun;
   (0, _useRender.useSectionRender)(Comp, props, 'CountInfo');
   return null;
 };
-exports.CountInfo = CountInfo;
 CountInfo.displayName = 'JVR.CountInfo';
-var CountInfoComp = function CountInfoComp(props) {
+var CountInfoComp = exports.CountInfoComp = function CountInfoComp(props) {
   var _props$value = props.value,
     value = _props$value === void 0 ? {} : _props$value,
     keyName = props.keyName,
@@ -53,5 +52,4 @@ var CountInfoComp = function CountInfoComp(props) {
   if (child) return child;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Elm, (0, _objectSpread2["default"])({}, elmProps));
 };
-exports.CountInfoComp = CountInfoComp;
 CountInfoComp.displayName = 'JVR.CountInfoComp';

package/cjs/section/CountInfoExtra.js

@@ -12,16 +12,15 @@ var _useRender = require("../utils/useRender");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["value", "keyName"],
   _excluded2 = ["as", "render"];
-var CountInfoExtra = function CountInfoExtra(props) {
+var CountInfoExtra = exports.CountInfoExtra = function CountInfoExtra(props) {
   var _useSectionStore = (0, _Section.useSectionStore)(),
     _useSectionStore$Coun = _useSectionStore.CountInfoExtra,
     Comp = _useSectionStore$Coun === void 0 ? {} : _useSectionStore$Coun;
   (0, _useRender.useSectionRender)(Comp, props, 'CountInfoExtra');
   return null;
 };
-exports.CountInfoExtra = CountInfoExtra;
 CountInfoExtra.displayName = 'JVR.CountInfoExtra';
-var CountInfoExtraComps = function CountInfoExtraComps(props) {
+var CountInfoExtraComps = exports.CountInfoExtraComps = function CountInfoExtraComps(props) {
   var _props$value = props.value,
     value = _props$value === void 0 ? {} : _props$value,
     keyName = props.keyName,
@@ -43,5 +42,4 @@ var CountInfoExtraComps = function CountInfoExtraComps(props) {
   if (child) return child;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Elm, (0, _objectSpread2["default"])({}, elmProps));
 };
-exports.CountInfoExtraComps = CountInfoExtraComps;
 CountInfoExtraComps.displayName = 'JVR.CountInfoExtraComps';

package/cjs/section/Ellipsis.js

@@ -11,16 +11,15 @@ var _Section = require("../store/Section");
 var _useRender = require("../utils/useRender");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["as", "render"];
-var Ellipsis = function Ellipsis(props) {
+var Ellipsis = exports.Ellipsis = function Ellipsis(props) {
   var _useSectionStore = (0, _Section.useSectionStore)(),
     _useSectionStore$Elli = _useSectionStore.Ellipsis,
     Comp = _useSectionStore$Elli === void 0 ? {} : _useSectionStore$Elli;
   (0, _useRender.useSectionRender)(Comp, props, 'Ellipsis');
   return null;
 };
-exports.Ellipsis = Ellipsis;
 Ellipsis.displayName = 'JVR.Ellipsis';
-var EllipsisComp = function EllipsisComp(_ref) {
+var EllipsisComp = exports.EllipsisComp = function EllipsisComp(_ref) {
   var isExpanded = _ref.isExpanded,
     value = _ref.value,
     keyName = _ref.keyName;
@@ -41,5 +40,4 @@ var EllipsisComp = function EllipsisComp(_ref) {
   if (!isExpanded) return null;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Elm, (0, _objectSpread2["default"])({}, reset));
 };
-exports.EllipsisComp = EllipsisComp;
 EllipsisComp.displayName = 'JVR.EllipsisComp';

package/cjs/section/KeyName.js

@@ -11,16 +11,15 @@ var _Section = require("../store/Section");
 var _useRender = require("../utils/useRender");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["as", "render"];
-var KeyName = function KeyName(props) {
+var KeyName = exports.KeyName = function KeyName(props) {
   var _useSectionStore = (0, _Section.useSectionStore)(),
     _useSectionStore$KeyN = _useSectionStore.KeyName,
     Comp = _useSectionStore$KeyN === void 0 ? {} : _useSectionStore$KeyN;
   (0, _useRender.useSectionRender)(Comp, props, 'KeyName');
   return null;
 };
-exports.KeyName = KeyName;
 KeyName.displayName = 'JVR.KeyName';
-var KeyNameComp = function KeyNameComp(props) {
+var KeyNameComp = exports.KeyNameComp = function KeyNameComp(props) {
   var children = props.children,
     value = props.value,
     keyName = props.keyName;
@@ -47,5 +46,4 @@ var KeyNameComp = function KeyNameComp(props) {
     children: children
   }));
 };
-exports.KeyNameComp = KeyNameComp;
 KeyNameComp.displayName = 'JVR.KeyNameComp';

package/cjs/store/Expands.js

@@ -16,10 +16,9 @@ var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 var reducer = function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 };
-var useExpandsStore = function useExpandsStore() {
+var useExpandsStore = exports.useExpandsStore = function useExpandsStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useExpandsStore = useExpandsStore;
 var DispatchExpands = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchExpands.displayName = 'JVR.DispatchExpands';
 function useExpands() {
@@ -28,7 +27,7 @@ function useExpands() {
 function useExpandsDispatch() {
   return (0, _react.useContext)(DispatchExpands);
 }
-var Expands = function Expands(_ref) {
+var Expands = exports.Expands = function Expands(_ref) {
   var initial = _ref.initial,
     dispatch = _ref.dispatch,
     children = _ref.children;
@@ -40,5 +39,4 @@ var Expands = function Expands(_ref) {
     })
   });
 };
-exports.Expands = Expands;
 Expands.displayName = 'JVR.Expands';

package/cjs/store/Section.js

@@ -58,10 +58,9 @@ var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 var reducer = function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 };
-var useSectionStore = function useSectionStore() {
+var useSectionStore = exports.useSectionStore = function useSectionStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useSectionStore = useSectionStore;
 var DispatchSection = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchSection.displayName = 'JVR.DispatchSection';
 function useSection() {
@@ -70,7 +69,7 @@ function useSection() {
 function useSectionDispatch() {
   return (0, _react.useContext)(DispatchSection);
 }
-var Section = function Section(_ref) {
+var Section = exports.Section = function Section(_ref) {
   var initial = _ref.initial,
     dispatch = _ref.dispatch,
     children = _ref.children;
@@ -82,5 +81,4 @@ var Section = function Section(_ref) {
     })
   });
 };
-exports.Section = Section;
 Section.displayName = 'JVR.Section';

package/cjs/store/ShowTools.js

@@ -16,10 +16,9 @@ var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 var reducer = function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 };
-var useShowToolsStore = function useShowToolsStore() {
+var useShowToolsStore = exports.useShowToolsStore = function useShowToolsStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useShowToolsStore = useShowToolsStore;
 var DispatchShowTools = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchShowTools.displayName = 'JVR.DispatchShowTools';
 function useShowTools() {
@@ -28,7 +27,7 @@ function useShowTools() {
 function useShowToolsDispatch() {
   return (0, _react.useContext)(DispatchShowTools);
 }
-var ShowTools = function ShowTools(_ref) {
+var ShowTools = exports.ShowTools = function ShowTools(_ref) {
   var initial = _ref.initial,
     dispatch = _ref.dispatch,
     children = _ref.children;
@@ -40,5 +39,4 @@ var ShowTools = function ShowTools(_ref) {
     })
   });
 };
-exports.ShowTools = ShowTools;
 ShowTools.displayName = 'JVR.ShowTools';

package/cjs/store/Symbols.js

@@ -85,10 +85,9 @@ var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 var reducer = function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 };
-var useSymbolsStore = function useSymbolsStore() {
+var useSymbolsStore = exports.useSymbolsStore = function useSymbolsStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useSymbolsStore = useSymbolsStore;
 var DispatchSymbols = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchSymbols.displayName = 'JVR.DispatchSymbols';
 function useSymbols() {
@@ -97,7 +96,7 @@ function useSymbols() {
 function useSymbolsDispatch() {
   return (0, _react.useContext)(DispatchSymbols);
 }
-var Symbols = function Symbols(_ref) {
+var Symbols = exports.Symbols = function Symbols(_ref) {
   var initial = _ref.initial,
     dispatch = _ref.dispatch,
     children = _ref.children;
@@ -109,5 +108,4 @@ var Symbols = function Symbols(_ref) {
     })
   });
 };
-exports.Symbols = Symbols;
 Symbols.displayName = 'JVR.Symbols';

package/cjs/store/Types.d.ts

@@ -1,32 +1,33 @@
-import { FC, PropsWithChildren, ComponentPropsWithoutRef } from 'react';
+import { PropsWithChildren, ComponentPropsWithoutRef } from 'react';
 export type TagType = React.ElementType | keyof JSX.IntrinsicElements;
-type TypesElementProps<T extends TagType> = {
+type TypesElementProps<T extends TagType = 'span'> = {
     as?: T;
     render?: (props: TypesElement<T>, result: {
         type: 'type' | 'value';
         value?: unknown;
+        keyName: string | number;
     }) => React.ReactNode;
     'data-type'?: string;
 };
 export type TypesElement<T extends TagType> = TypesElementProps<T> & ComponentPropsWithoutRef<T>;
-export type InitialTypesState = {
+export type InitialTypesState<T extends TagType = 'span'> = {
     displayDataTypes?: boolean;
-    Url?: TypesElement<TagType>;
-    Str?: TypesElement<TagType>;
-    Undefined?: TypesElement<TagType>;
-    Null?: TypesElement<TagType>;
-    True?: TypesElement<TagType>;
-    False?: TypesElement<TagType>;
-    Date?: TypesElement<TagType>;
-    Float?: TypesElement<TagType>;
-    Set?: TypesElement<TagType>;
-    Int?: TypesElement<TagType>;
-    Map?: TypesElement<TagType>;
-    Nan?: TypesElement<TagType>;
-    Bigint?: TypesElement<TagType>;
+    Url?: TypesElement<T>;
+    Str?: TypesElement<T>;
+    Undefined?: TypesElement<T>;
+    Null?: TypesElement<T>;
+    True?: TypesElement<T>;
+    False?: TypesElement<T>;
+    Date?: TypesElement<T>;
+    Float?: TypesElement<T>;
+    Set?: TypesElement<T>;
+    Int?: TypesElement<T>;
+    Map?: TypesElement<T>;
+    Nan?: TypesElement<T>;
+    Bigint?: TypesElement<T>;
 };
-type Dispatch = React.Dispatch<InitialTypesState>;
-export declare const useTypesStore: () => InitialTypesState;
+type Dispatch<T extends TagType> = React.Dispatch<InitialTypesState<T>>;
+export declare const useTypesStore: () => InitialTypesState<TagType>;
 export declare function useTypes(): [{
     displayDataTypes?: boolean | undefined;
     Url?: TypesElement<TagType> | undefined;
@@ -42,11 +43,14 @@ export declare function useTypes(): [{
     Map?: TypesElement<TagType> | undefined;
     Nan?: TypesElement<TagType> | undefined;
     Bigint?: TypesElement<TagType> | undefined;
-}, import("react").Dispatch<InitialTypesState>];
-export declare function useTypesDispatch(): Dispatch;
-interface TypesProps {
-    initial: InitialTypesState;
-    dispatch: Dispatch;
+}, import("react").Dispatch<InitialTypesState<TagType>>];
+export declare function useTypesDispatch(): Dispatch<TagType>;
+interface TypesProps<T extends TagType> {
+    initial: InitialTypesState<T>;
+    dispatch: Dispatch<TagType>;
+}
+export declare function Types<T extends TagType>({ initial, dispatch, children }: PropsWithChildren<TypesProps<T>>): import("react/jsx-runtime").JSX.Element;
+export declare namespace Types {
+    var displayName: string;
 }
-export declare const Types: FC<PropsWithChildren<TypesProps>>;
 export {};

package/cjs/store/Types.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Types = void 0;
+exports.Types = Types;
 exports.useTypes = useTypes;
 exports.useTypesDispatch = useTypesDispatch;
 exports.useTypesStore = void 0;
@@ -50,7 +50,8 @@ var initialState = {
   },
   Map: {
     style: {
-      color: 'var(--w-rjv-type-map-color, #268bd2)'
+      color: 'var(--w-rjv-type-map-color, #268bd2)',
+      marginRight: 3
     },
     as: 'span',
     'data-type': 'map',
@@ -86,7 +87,8 @@ var initialState = {
   },
   Set: {
     style: {
-      color: 'var(--w-rjv-type-set-color, #268bd2)'
+      color: 'var(--w-rjv-type-set-color, #268bd2)',
+      marginRight: 3
     },
     as: 'span',
     'data-type': 'set',
@@ -134,10 +136,9 @@ var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 var reducer = function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 };
-var useTypesStore = function useTypesStore() {
+var useTypesStore = exports.useTypesStore = function useTypesStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useTypesStore = useTypesStore;
 var DispatchTypes = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchTypes.displayName = 'JVR.DispatchTypes';
 function useTypes() {
@@ -146,7 +147,7 @@ function useTypes() {
 function useTypesDispatch() {
   return (0, _react.useContext)(DispatchTypes);
 }
-var Types = function Types(_ref) {
+function Types(_ref) {
   var initial = _ref.initial,
     dispatch = _ref.dispatch,
     children = _ref.children;
@@ -157,6 +158,5 @@ var Types = function Types(_ref) {
       children: children
     })
   });
-};
-exports.Types = Types;
+}
 Types.displayName = 'JVR.Types';

package/cjs/store.d.ts

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import { JsonViewProps } from './';
-import { type InitialTypesState } from './store/Types';
+import { type InitialTypesState, type TagType } from './store/Types';
 export type BlockTagType = keyof JSX.IntrinsicElements;
 export interface InitialState<T extends object> {
     value?: object;
@@ -20,10 +20,13 @@ export declare const Context: React.Context<InitialState<object>>;
 export declare function reducer(state: InitialState<object>, action: InitialState<object>): InitialState<object>;
 export declare const useStore: () => InitialState<object>;
 export declare const useDispatchStore: () => Dispatch;
-export interface ProviderProps {
+export interface ProviderProps<T extends TagType> {
     initialState?: InitialState<object>;
-    initialTypes?: InitialTypesState;
+    initialTypes?: InitialTypesState<T>;
 }
-export declare const Provider: React.FC<PropsWithChildren<ProviderProps>>;
+export declare const Provider: {
+    <T extends TagType>({ children, initialState: init, initialTypes, }: React.PropsWithChildren<ProviderProps<T>>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export declare function useDispatch(): Dispatch;
 export {};

package/cjs/store.js

@@ -18,28 +18,24 @@ var _Types = require("./store/Types");
 var _Symbols = require("./store/Symbols");
 var _Section = require("./store/Section");
 var _jsxRuntime = require("react/jsx-runtime");
-var initialState = {
+var initialState = exports.initialState = {
   objectSortKeys: false,
   indentWidth: 15
 };
-exports.initialState = initialState;
-var Context = /*#__PURE__*/(0, _react.createContext)(initialState);
-exports.Context = Context;
+var Context = exports.Context = /*#__PURE__*/(0, _react.createContext)(initialState);
 Context.displayName = 'JVR.Context';
 var DispatchContext = /*#__PURE__*/(0, _react.createContext)(function () {});
 DispatchContext.displayName = 'JVR.DispatchContext';
 function reducer(state, action) {
   return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, state), action);
 }
-var useStore = function useStore() {
+var useStore = exports.useStore = function useStore() {
   return (0, _react.useContext)(Context);
 };
-exports.useStore = useStore;
-var useDispatchStore = function useDispatchStore() {
+var useDispatchStore = exports.useDispatchStore = function useDispatchStore() {
   return (0, _react.useContext)(DispatchContext);
 };
-exports.useDispatchStore = useDispatchStore;
-var Provider = function Provider(_ref) {
+var Provider = exports.Provider = function Provider(_ref) {
   var children = _ref.children,
     init = _ref.initialState,
     initialTypes = _ref.initialTypes;
@@ -98,7 +94,6 @@ var Provider = function Provider(_ref) {
     })
   });
 };
-exports.Provider = Provider;
 function useDispatch() {
   return (0, _react.useContext)(DispatchContext);
 }

package/cjs/symbol/Arrow.js

@@ -6,12 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.Arrow = void 0;
 var _Symbols = require("../store/Symbols");
 var _useRender = require("../utils/useRender");
-var Arrow = function Arrow(props) {
+var Arrow = exports.Arrow = function Arrow(props) {
   var _useSymbolsStore = (0, _Symbols.useSymbolsStore)(),
     _useSymbolsStore$Arro = _useSymbolsStore.Arrow,
     Comp = _useSymbolsStore$Arro === void 0 ? {} : _useSymbolsStore$Arro;
   (0, _useRender.useSymbolsRender)(Comp, props, 'Arrow');
   return null;
 };
-exports.Arrow = Arrow;
 Arrow.displayName = 'JVR.Arrow';

package/cjs/symbol/BraceLeft.js

@@ -6,12 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.BraceLeft = void 0;
 var _Symbols = require("../store/Symbols");
 var _useRender = require("../utils/useRender");
-var BraceLeft = function BraceLeft(props) {
+var BraceLeft = exports.BraceLeft = function BraceLeft(props) {
   var _useSymbolsStore = (0, _Symbols.useSymbolsStore)(),
     _useSymbolsStore$Brac = _useSymbolsStore.BraceLeft,
     Comp = _useSymbolsStore$Brac === void 0 ? {} : _useSymbolsStore$Brac;
   (0, _useRender.useSymbolsRender)(Comp, props, 'BraceLeft');
   return null;
 };
-exports.BraceLeft = BraceLeft;
 BraceLeft.displayName = 'JVR.BraceLeft';