@uiw/react-json-view 1.12.0 → 2.0.0-alpha.1

package/esm/{copied.js → comps/Copied.js}

@@ -1,30 +1,43 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["children", "style", "text", "onCopied", "render", "show"];
+var _excluded = ["keyName", "value", "expandKey"],
+  _excluded2 = ["as", "render"];
 import { useState } from 'react';
+import { useStore } from '../store';
+import { useShowToolsStore } from '../store/ShowTools';
+import { useSectionStore } from '../store/Section';
 import { jsx as _jsx } from "react/jsx-runtime";
-export function Copied(props) {
+export var Copied = props => {
   var {
-      style,
-      text = '',
-      onCopied,
-      render,
-      show
+      keyName,
+      value,
+      expandKey
     } = props,
-    reset = _objectWithoutPropertiesLoose(props, _excluded);
-  if (!show) return null;
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  var {
+    onCopied,
+    enableClipboard
+  } = useStore();
+  var showTools = useShowToolsStore();
+  var isShowTools = showTools[expandKey];
   var [copied, setCopied] = useState(false);
+  var {
+    Copied: Comp = {}
+  } = useSectionStore();
+  if (enableClipboard === false || !isShowTools) return null;
   var click = event => {
     event.stopPropagation();
-    var copyText = JSON.stringify(text || '', (key, value) => {
+    var copyText = JSON.stringify(value, (key, value) => {
       if (typeof value === 'bigint') {
         return value.toString();
       }
       return value;
     }, 2);
-    if (text === Infinity) copyText = Infinity;
+    if (typeof value === 'number' && value === Infinity) copyText = 'Infinity';
+    if (typeof value === 'number' && isNaN(value)) copyText = 'NaN';
+    if (typeof value === 'bigint') copyText = value + 'n';
     navigator.clipboard.writeText(copyText).then(() => {
-      onCopied && onCopied(copyText, text);
+      onCopied && onCopied(copyText, value);
       setCopied(true);
       var timer = setTimeout(() => {
         setCopied(false);
@@ -32,25 +45,27 @@ export function Copied(props) {
       }, 3000);
     }).catch(error => {});
   };
-  var defalutStyle = _extends({}, style, {
-    cursor: 'pointer',
-    verticalAlign: 'middle',
-    marginLeft: 5
+  var svgProps = {
+    fill: copied ? 'var(--w-rjv-copied-success-color, #28a745)' : 'var(--w-rjv-copied-color, currentColor)',
+    onClick: click
+  };
+  var {
+      render
+    } = Comp,
+    reset = _objectWithoutPropertiesLoose(Comp, _excluded2);
+  var elmProps = _extends({}, reset, other, svgProps);
+  var isRender = render && typeof render === 'function';
+  var child = isRender && render(_extends({}, elmProps, {
+    'data-copied': copied
+  }), {
+    value,
+    keyName
   });
-  var svgProps = _extends({
-    height: '1em',
-    width: '1em',
-    fill: 'var(--w-rjv-copied-color, currentColor)',
-    onClick: click,
-    style: defalutStyle,
-    className: 'w-rjv-copied'
-  }, reset);
-  if (render) return render(_extends({}, props, svgProps));
+  if (child) return child;
   if (copied) {
     return /*#__PURE__*/_jsx("svg", _extends({
       viewBox: "0 0 32 36"
-    }, svgProps, {
-      fill: "var(--w-rjv-copied-success-color, #28a745)",
+    }, elmProps, {
       children: /*#__PURE__*/_jsx("path", {
         d: "M27.5,33 L2.5,33 L2.5,12.5 L27.5,12.5 L27.5,15.2249049 C29.1403264,13.8627542 29.9736597,13.1778155 30,13.1700887 C30,11.9705278 30,10.0804982 30,7.5 C30,6.1 28.9,5 27.5,5 L20,5 C20,2.2 17.8,0 15,0 C12.2,0 10,2.2 10,5 L2.5,5 C1.1,5 0,6.1 0,7.5 L0,33 C0,34.4 1.1,36 2.5,36 L27.5,36 C28.9,36 30,34.4 30,33 L30,26.1114493 L27.5,28.4926435 L27.5,33 Z M7.5,7.5 L10,7.5 C10,7.5 12.5,6.4 12.5,5 C12.5,3.6 13.6,2.5 15,2.5 C16.4,2.5 17.5,3.6 17.5,5 C17.5,6.4 18.8,7.5 20,7.5 L22.5,7.5 C22.5,7.5 25,8.6 25,10 L5,10 C5,8.5 6.1,7.5 7.5,7.5 Z M5,27.5 L10,27.5 L10,25 L5,25 L5,27.5 Z M28.5589286,16 L32,19.6 L21.0160714,30.5382252 L13.5303571,24.2571429 L17.1303571,20.6571429 L21.0160714,24.5428571 L28.5589286,16 Z M17.5,15 L5,15 L5,17.5 L17.5,17.5 L17.5,15 Z M10,20 L5,20 L5,22.5 L10,22.5 L10,20 Z"
       })
@@ -58,10 +73,10 @@ export function Copied(props) {
   }
   return /*#__PURE__*/_jsx("svg", _extends({
     viewBox: "0 0 32 36"
-  }, svgProps, {
+  }, elmProps, {
     children: /*#__PURE__*/_jsx("path", {
       d: "M27.5,33 L2.5,33 L2.5,12.5 L27.5,12.5 L27.5,20 L30,20 L30,7.5 C30,6.1 28.9,5 27.5,5 L20,5 C20,2.2 17.8,0 15,0 C12.2,0 10,2.2 10,5 L2.5,5 C1.1,5 0,6.1 0,7.5 L0,33 C0,34.4 1.1,36 2.5,36 L27.5,36 C28.9,36 30,34.4 30,33 L30,29 L27.5,29 L27.5,33 Z M7.5,7.5 L10,7.5 C10,7.5 12.5,6.4 12.5,5 C12.5,3.6 13.6,2.5 15,2.5 C16.4,2.5 17.5,3.6 17.5,5 C17.5,6.4 18.8,7.5 20,7.5 L22.5,7.5 C22.5,7.5 25,8.6 25,10 L5,10 C5,8.5 6.1,7.5 7.5,7.5 Z M5,27.5 L10,27.5 L10,25 L5,25 L5,27.5 Z M22.5,21.5 L22.5,16.5 L12.5,24 L22.5,31.5 L22.5,26.5 L32,26.5 L32,21.5 L22.5,21.5 Z M17.5,15 L5,15 L5,17.5 L17.5,17.5 L17.5,15 Z M10,20 L5,20 L5,22.5 L10,22.5 L10,20 Z"
     })
   }));
-}
+};
 Copied.displayName = 'JVR.Copied';

package/esm/comps/CountInfo.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { type SectionElementProps } from '../store/Section';
+import { type TagType } from '../store/Types';
+export interface CountInfoProps<T extends object> {
+    value?: T;
+    keyName: string | number;
+}
+export declare const CountInfo: {
+    <T extends object>(props: SectionElementProps<TagType> & CountInfoProps<T> & import("react").HTMLAttributes<HTMLElement>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export interface CountInfoExtraProps<T extends object> {
+    value?: T;
+    keyName: string | number;
+}
+export declare const CountInfoExtra: {
+    <T extends object>(props: SectionElementProps<TagType> & CountInfoExtraProps<T>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/esm/comps/CountInfo.js

@@ -0,0 +1,70 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["value", "keyName"],
+  _excluded2 = ["as", "render"],
+  _excluded3 = ["value", "keyName"],
+  _excluded4 = ["as", "render"];
+import { useStore } from '../store';
+import { useSectionStore } from '../store/Section';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var CountInfo = props => {
+  var {
+      value = {},
+      keyName
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  var {
+    displayObjectSize
+  } = useStore();
+  var {
+    CountInfo: Comp = {}
+  } = useSectionStore();
+  if (!displayObjectSize) return null;
+  var {
+      as,
+      render
+    } = Comp,
+    reset = _objectWithoutPropertiesLoose(Comp, _excluded2);
+  var Elm = as || 'span';
+  reset.style = _extends({}, reset.style, props.style);
+  var len = Object.keys(value).length;
+  if (!reset.children) {
+    reset.children = len + " items";
+  }
+  var elmProps = _extends({}, reset, other);
+  var isRender = render && typeof render === 'function';
+  var child = isRender && render(_extends({}, elmProps, {
+    'data-length': len
+  }), {
+    value,
+    keyName
+  });
+  if (child) return child;
+  return /*#__PURE__*/_jsx(Elm, _extends({}, elmProps));
+};
+CountInfo.displayName = 'JVR.CountInfo';
+export var CountInfoExtra = props => {
+  var {
+      value = {},
+      keyName
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded3);
+  var {
+    CountInfoExtra: Comp = {}
+  } = useSectionStore();
+  var {
+      as,
+      render
+    } = Comp,
+    reset = _objectWithoutPropertiesLoose(Comp, _excluded4);
+  var Elm = as || 'span';
+  var isRender = render && typeof render === 'function';
+  var elmProps = _extends({}, reset, other);
+  var child = isRender && render(elmProps, {
+    value,
+    keyName
+  });
+  if (child) return child;
+  return /*#__PURE__*/_jsx(Elm, _extends({}, elmProps));
+};
+CountInfoExtra.displayName = 'JVR.CountInfoExtra';

package/esm/comps/Ellipsis.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export interface CountInfoProps<T extends object> {
+    value?: T;
+    keyName: string | number;
+    isExpanded: boolean;
+}
+export declare const Ellipsis: {
+    <T extends object>({ isExpanded, value, keyName }: CountInfoProps<T>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};

package/esm/comps/Ellipsis.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["as", "render"];
+import { useSectionStore } from '../store/Section';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Ellipsis = _ref => {
+  var {
+    isExpanded,
+    value,
+    keyName
+  } = _ref;
+  var {
+    Ellipsis: Comp = {}
+  } = useSectionStore();
+  var {
+      as,
+      render
+    } = Comp,
+    reset = _objectWithoutPropertiesLoose(Comp, _excluded);
+  var Elm = as || 'span';
+  var child = render && typeof render === 'function' && render(_extends({}, reset, {
+    'data-expanded': isExpanded
+  }), {
+    value,
+    keyName
+  });
+  if (child) return child;
+  if (!isExpanded) return null;
+  return /*#__PURE__*/_jsx(Elm, _extends({}, reset));
+};
+Ellipsis.displayName = 'JVR.Ellipsis';

package/esm/comps/Key.d.ts

@@ -0,0 +1,7 @@
+import { FC, PropsWithChildren } from 'react';
+type KeyProps = {
+    keyName: string | number;
+    value?: unknown;
+};
+export declare const Key: FC<PropsWithChildren<KeyProps>>;
+export {};

package/esm/comps/Key.js

@@ -0,0 +1,35 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["as", "render"];
+import { useSectionStore } from '../store/Section';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Key = props => {
+  var {
+    children,
+    value,
+    keyName
+  } = props;
+  var isNumber = typeof children === 'number';
+  var style = {
+    color: isNumber ? 'var(--w-rjv-key-number, #268bd2)' : 'var(--w-rjv-key-string, #002b36)'
+  };
+  var {
+    KeyName: Comp = {}
+  } = useSectionStore();
+  var {
+      as,
+      render
+    } = Comp,
+    reset = _objectWithoutPropertiesLoose(Comp, _excluded);
+  reset.style = _extends({}, reset.style, style);
+  var Elm = as || 'span';
+  var child = render && typeof render === 'function' && render(reset, {
+    value,
+    keyName
+  });
+  if (child) return child;
+  return /*#__PURE__*/_jsx(Elm, _extends({}, reset, {
+    children: children
+  }));
+};
+Key.displayName = 'JVR.Key';

package/esm/comps/KeyValues.d.ts

@@ -0,0 +1,22 @@
+interface KeyValuesProps<T extends object> {
+    keyName?: string | number;
+    value?: T;
+    parentValue?: T;
+    expandKey?: string;
+    level: number;
+}
+export declare const KeyValues: {
+    <T extends object>(props: KeyValuesProps<T>): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+interface KayNameProps<T extends object> extends Omit<KeyValuesProps<T>, 'level'> {
+}
+export declare const KayName: {
+    <T extends object>(props: KayNameProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const KeyValuesItem: {
+    <T extends object>(props: KeyValuesProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/esm/comps/KeyValues.js

@@ -0,0 +1,142 @@
+import _extends from "@babel/runtime/helpers/extends";
+import { Fragment, useId, useRef } from 'react';
+import { useStore } from '../store';
+import { useExpandsStore } from '../store/Expands';
+import { useShowToolsDispatch } from '../store/ShowTools';
+import { Value } from './Value';
+import { Key } from './Key';
+import { Container } from '../Container';
+import { Quote, Colon } from './ReRender/Symbols';
+import { useHighlight } from '../utils/useHighlight';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var KeyValues = props => {
+  var _expands$expandKey;
+  var {
+    value,
+    expandKey = '',
+    level
+  } = props;
+  var expands = useExpandsStore();
+  var {
+    objectSortKeys,
+    indentWidth,
+    collapsed
+  } = useStore();
+  var isMyArray = Array.isArray(value);
+  var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
+  if (isExpanded) {
+    return null;
+  }
+  // object
+  var entries = isMyArray ? Object.entries(value).map(m => [Number(m[0]), m[1]]) : Object.entries(value);
+  if (objectSortKeys) {
+    entries = objectSortKeys === true ? entries.sort((_ref, _ref2) => {
+      var [a] = _ref;
+      var [b] = _ref2;
+      return typeof a === 'string' && typeof b === 'string' ? a.localeCompare(b) : 0;
+    }) : entries.sort((_ref3, _ref4) => {
+      var [a] = _ref3;
+      var [b] = _ref4;
+      return typeof a === 'string' && typeof b === 'string' ? objectSortKeys(a, b) : 0;
+    });
+  }
+  var style = {
+    borderLeft: 'var(--w-rjv-border-left-width, 1px) var(--w-rjv-line-style, solid) var(--w-rjv-line-color, #ebebeb)',
+    paddingLeft: indentWidth,
+    marginLeft: 6
+  };
+  return /*#__PURE__*/_jsx("div", {
+    className: "w-rjv-wrap",
+    style: style,
+    children: entries.map((_ref5, idx) => {
+      var [key, val] = _ref5;
+      return /*#__PURE__*/_jsx(KeyValuesItem, {
+        parentValue: value,
+        keyName: key,
+        value: val,
+        level: level
+      }, idx);
+    })
+  });
+};
+KeyValues.displayName = 'JVR.KeyValues';
+export var KayName = props => {
+  var {
+    keyName,
+    value
+  } = props;
+  var {
+    highlightUpdates
+  } = useStore();
+  var isNumber = typeof keyName === 'number';
+  var highlightContainer = useRef(null);
+  useHighlight({
+    value,
+    highlightUpdates,
+    highlightContainer
+  });
+  return /*#__PURE__*/_jsxs(Fragment, {
+    children: [/*#__PURE__*/_jsxs("span", {
+      ref: highlightContainer,
+      children: [/*#__PURE__*/_jsx(Quote, {
+        isNumber: isNumber
+      }), /*#__PURE__*/_jsx(Key, {
+        keyName: keyName,
+        value: value,
+        children: keyName
+      }), /*#__PURE__*/_jsx(Quote, {
+        isNumber: isNumber
+      })]
+    }), /*#__PURE__*/_jsx(Colon, {})]
+  });
+};
+KayName.displayName = 'JVR.KayName';
+export var KeyValuesItem = props => {
+  var {
+    keyName,
+    value,
+    parentValue,
+    level = 0
+  } = props;
+  var dispatch = useShowToolsDispatch();
+  var subkeyid = useId();
+  var isMyArray = Array.isArray(value);
+  var isMySet = value instanceof Set;
+  var isMyMap = value instanceof Map;
+  var isDate = value instanceof Date;
+  var isUrl = value instanceof URL;
+  var isMyObject = value && typeof value === 'object' && !isMyArray && !isMySet && !isMyMap && !isDate && !isUrl;
+  var isNested = isMyObject || isMyArray || isMySet || isMyMap;
+  if (isNested) {
+    var myValue = isMySet ? Array.from(value) : isMyMap ? Object.fromEntries(value) : value;
+    return /*#__PURE__*/_jsx(Container, {
+      keyName: keyName,
+      value: myValue,
+      parentValue: parentValue,
+      initialValue: value,
+      level: level + 1
+    });
+  }
+  var reset = {
+    onMouseEnter: () => dispatch({
+      [subkeyid]: true
+    }),
+    onMouseLeave: () => dispatch({
+      [subkeyid]: false
+    })
+  };
+  return /*#__PURE__*/_jsxs("div", _extends({
+    className: "w-rjv-line"
+  }, reset, {
+    children: [/*#__PURE__*/_jsx(KayName, {
+      keyName: keyName,
+      value: value
+    }), /*#__PURE__*/_jsx(Value, {
+      keyName: keyName,
+      value: value,
+      expandKey: subkeyid
+    })]
+  }));
+};
+KeyValuesItem.displayName = 'JVR.KeyValuesItem';

package/esm/comps/NestedClose.d.ts

@@ -0,0 +1,10 @@
+interface NestedCloseProps<T extends object> {
+    value?: T;
+    expandKey: string;
+    level: number;
+}
+export declare const NestedClose: {
+    <T extends object>(props: NestedCloseProps<T>): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export {};

package/esm/comps/NestedClose.js

@@ -0,0 +1,34 @@
+import { useStore } from '../store';
+import { useExpandsStore } from '../store/Expands';
+import { BracketsClose } from './ReRender/Symbols';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var NestedClose = props => {
+  var _expands$expandKey;
+  var {
+    value,
+    expandKey,
+    level
+  } = props;
+  var expands = useExpandsStore();
+  var isArray = Array.isArray(value);
+  var {
+    collapsed
+  } = useStore();
+  var isMySet = value instanceof Set;
+  var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
+  var len = Object.keys(value).length;
+  if (isExpanded || len === 0) {
+    return null;
+  }
+  var style = {
+    paddingLeft: 4
+  };
+  return /*#__PURE__*/_jsx("div", {
+    style: style,
+    children: /*#__PURE__*/_jsx(BracketsClose, {
+      isBrackets: isArray || isMySet,
+      isVisiable: true
+    })
+  });
+};
+NestedClose.displayName = 'JVR.NestedClose';

package/esm/comps/NestedOpen.d.ts

@@ -0,0 +1,11 @@
+export interface NestedOpenProps<T extends object> {
+    keyName?: string | number;
+    value?: T;
+    initialValue?: T;
+    expandKey: string;
+    level: number;
+}
+export declare const NestedOpen: {
+    <T extends object>(props: NestedOpenProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/esm/comps/NestedOpen.js

@@ -0,0 +1,91 @@
+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 { CountInfo, CountInfoExtra } from './CountInfo';
+import { Arrow, BracketsOpen, BracketsClose } from './ReRender/Symbols';
+import { Ellipsis } from './Ellipsis';
+import { SetComp, MapComp } from './ReRender/Types';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var NestedOpen = props => {
+  var _expands$expandKey;
+  var {
+    keyName,
+    expandKey,
+    initialValue,
+    value,
+    level
+  } = props;
+  var expands = useExpandsStore();
+  var dispatchExpands = useExpandsDispatch();
+  var {
+    onExpand,
+    collapsed
+  } = useStore();
+  var isArray = Array.isArray(value);
+  var isMySet = value instanceof Set;
+  var isExpanded = (_expands$expandKey = expands[expandKey]) != null ? _expands$expandKey : typeof collapsed === 'boolean' ? collapsed : typeof collapsed === 'number' ? level > collapsed : false;
+  var isObject = typeof value === 'object';
+  var click = () => {
+    var opt = {
+      expand: !isExpanded,
+      value,
+      keyid: expandKey,
+      keyName
+    };
+    onExpand && onExpand(opt);
+    dispatchExpands({
+      [expandKey]: opt.expand
+    });
+  };
+  var style = {
+    display: 'inline-flex',
+    alignItems: 'center'
+  };
+  var arrowStyle = {
+    transform: "rotate(" + (!isExpanded ? '0' : '-90') + "deg)",
+    transition: 'all 0.3s'
+  };
+  var len = Object.keys(value).length;
+  var showArrow = len !== 0 && (isArray || isMySet || isObject);
+  var reset = {
+    style
+  };
+  if (showArrow) {
+    reset.onClick = click;
+  }
+  return /*#__PURE__*/_jsxs("span", _extends({}, reset, {
+    children: [showArrow && /*#__PURE__*/_jsx(Arrow, {
+      style: arrowStyle,
+      expandKey: expandKey
+    }), (keyName || typeof keyName === 'number') && /*#__PURE__*/_jsx(KayName, {
+      keyName: keyName
+    }), /*#__PURE__*/_jsx(SetComp, {
+      isSet: initialValue instanceof Set
+    }), /*#__PURE__*/_jsx(MapComp, {
+      isMap: initialValue instanceof Map
+    }), /*#__PURE__*/_jsx(BracketsOpen, {
+      isBrackets: isArray || isMySet
+    }), /*#__PURE__*/_jsx(Ellipsis, {
+      keyName: keyName,
+      value: value,
+      isExpanded: isExpanded
+    }), /*#__PURE__*/_jsx(BracketsClose, {
+      isVisiable: isExpanded || !showArrow,
+      isBrackets: isArray || isMySet
+    }), /*#__PURE__*/_jsx(CountInfo, {
+      value: value,
+      keyName: keyName
+    }), /*#__PURE__*/_jsx(CountInfoExtra, {
+      value: value,
+      keyName: keyName
+    }), /*#__PURE__*/_jsx(Copied, {
+      keyName: keyName,
+      value: value,
+      expandKey: expandKey
+    })]
+  }));
+};
+NestedOpen.displayName = 'JVR.NestedOpen';

package/esm/comps/ReRender/Symbols.d.ts

@@ -0,0 +1,44 @@
+/// <reference types="react" />
+import { type SymbolsElement } from '../../store/Symbols';
+import { type TagType } from '../../store/Types';
+export declare const Quote: {
+    (props: {
+        isNumber?: boolean | undefined;
+    }): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export declare const ValueQuote: {
+    (props: {
+        isNumber?: boolean | undefined;
+    }): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export declare const Colon: {
+    (): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const Arrow: {
+    <T extends TagType>(props: {
+        as?: T | undefined;
+        render?: ((props: SymbolsElement<T>) => import("react").ReactNode) | undefined;
+        'data-type'?: string | undefined;
+    } & import("react").PropsWithoutRef<import("react").ComponentProps<T>> & {
+        expandKey: string;
+    }): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const BracketsOpen: {
+    ({ isBrackets }: {
+        isBrackets?: boolean | undefined;
+    }): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type BracketsCloseProps = {
+    isBrackets?: boolean;
+    isVisiable?: boolean;
+};
+export declare const BracketsClose: {
+    ({ isBrackets, isVisiable }: BracketsCloseProps): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export {};