@uiw/react-json-view 1.8.3 → 1.8.4

package/cjs/index.js

@@ -49,7 +49,7 @@ var JsonView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, style);
   var cls = "w-json-view-container w-rjv ".concat(className || '');
   var keyid = (0, _react.useId)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_node.RooNode, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_node.RootNode, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
     className: cls,
     value: value
   }, reset), {}, {

package/cjs/node.d.ts

@@ -2,7 +2,7 @@ import { FC, PropsWithChildren } from 'react';
 import { LabelProps } from './value';
 import { JsonViewProps } from './';
 export declare const CountInfo: FC<PropsWithChildren<LabelProps>>;
-export interface RooNodeProps<T extends object> extends JsonViewProps<T> {
+export interface RootNodeProps<T extends object> extends JsonViewProps<T> {
     keyName?: string | number;
     keyid?: string;
     level?: number;
@@ -10,4 +10,4 @@ export interface RooNodeProps<T extends object> extends JsonViewProps<T> {
     namespace?: Array<string | number>;
     setParentValue?: React.Dispatch<React.SetStateAction<T>>;
 }
-export declare function RooNode<T extends object>(props: RooNodeProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare const RootNode: import("react").ForwardRefExoticComponent<Omit<RootNodeProps<object>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/cjs/node.js

@@ -4,8 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CountInfo = void 0;
-exports.RooNode = RooNode;
+exports.RootNode = exports.CountInfo = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -41,7 +40,7 @@ var CountInfo = function CountInfo(_ref) {
   });
 };
 exports.CountInfo = CountInfo;
-function RooNode(props) {
+var RootNode = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _expands$keyid;
   var _props$value = props.value,
     value = _props$value === void 0 ? {} : _props$value,
@@ -195,7 +194,9 @@ function RooNode(props) {
     setParentValue: setParentValue,
     setValue: setValueData
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, reset), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _objectSpread2["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+    ref: ref
+  }, reset), {}, {
     className: "".concat(className, " w-rjv-inner")
   }, eventProps), {}, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_value.Line, {
@@ -250,7 +251,7 @@ function RooNode(props) {
           var label = isArray ? idx : key;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_value.Line, {
             className: "w-rjv-wrap",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RooNode, (0, _objectSpread2["default"])({
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RootNode, (0, _objectSpread2["default"])({
               value: item,
               namespace: [].concat((0, _toConsumableArray2["default"])(namespace), [label]),
               keyName: label,
@@ -261,7 +262,7 @@ function RooNode(props) {
         if ((0, _typeof2["default"])(item) === 'object' && item && !(item instanceof Date) && !isEmpty) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_value.Line, {
             className: "w-rjv-wrap",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RooNode, (0, _objectSpread2["default"])({
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RootNode, (0, _objectSpread2["default"])({
               value: item,
               namespace: [].concat((0, _toConsumableArray2["default"])(namespace), [key]),
               keyName: key,
@@ -294,26 +295,6 @@ function RooNode(props) {
             visible: expand
           }) || countInfo;
         }
-        // if (length > -1) {
-        //   countInfo = (
-        //     <Fragment>
-        //       {countInfo}
-        //       {components.countInfoExtra &&
-        //         components.countInfoExtra({
-        //           count: length,
-        //           level,
-        //           showTools,
-        //           keyName,
-        //           visible: expand,
-        //           value: valueData,
-        //           namespace: [...namespace],
-        //           parentValue,
-        //           setParentValue,
-        //           setValue: setValueData,
-        //         })}
-        //     </Fragment>
-        //   )
-        // }
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_value.ValueView, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
           components: components,
           namespace: [].concat((0, _toConsumableArray2["default"])(namespace), [key])
@@ -339,4 +320,5 @@ function RooNode(props) {
       })
     })]
   }));
-}
+});
+exports.RootNode = RootNode;

package/esm/index.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutP
 var _excluded = ["value", "style", "className"];
 import React, { useId } from 'react';
 import { forwardRef } from 'react';
-import { RooNode } from './node';
+import { RootNode } from './node';
 import { jsx as _jsx } from "react/jsx-runtime";
 export * from './node';
 export * from './value';
@@ -22,7 +22,7 @@ var JsonView = /*#__PURE__*/forwardRef((props, ref) => {
   }, style);
   var cls = "w-json-view-container w-rjv " + (className || '');
   var keyid = useId();
-  return /*#__PURE__*/_jsx(RooNode, _extends({
+  return /*#__PURE__*/_jsx(RootNode, _extends({
     className: cls,
     value: value
   }, reset, {

package/esm/node.d.ts

@@ -2,7 +2,7 @@ import { FC, PropsWithChildren } from 'react';
 import { LabelProps } from './value';
 import { JsonViewProps } from './';
 export declare const CountInfo: FC<PropsWithChildren<LabelProps>>;
-export interface RooNodeProps<T extends object> extends JsonViewProps<T> {
+export interface RootNodeProps<T extends object> extends JsonViewProps<T> {
     keyName?: string | number;
     keyid?: string;
     level?: number;
@@ -10,4 +10,4 @@ export interface RooNodeProps<T extends object> extends JsonViewProps<T> {
     namespace?: Array<string | number>;
     setParentValue?: React.Dispatch<React.SetStateAction<T>>;
 }
-export declare function RooNode<T extends object>(props: RooNodeProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare const RootNode: import("react").ForwardRefExoticComponent<Omit<RootNodeProps<object>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/esm/node.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["value", "keyName", "className", "displayDataTypes", "components", "displayObjectSize", "enableClipboard", "highlightUpdates", "objectSortKeys", "indentWidth", "collapsed", "level", "keyid", "quotes", "namespace", "onCopied", "onExpand", "parentValue", "setParentValue"];
-import { Fragment, useId, cloneElement, useState, useEffect } from 'react';
+import { Fragment, useId, cloneElement, useState, useEffect, forwardRef } from 'react';
 import { ValueView, Colon, Label, Line, typeMap } from './value';
 import { TriangleArrow } from './arrow/TriangleArrow';
 import { useExpandsStatus, store } from './store';
@@ -32,7 +32,7 @@ export var CountInfo = _ref => {
     children: [children, " items"]
   });
 };
-export function RooNode(props) {
+export var RootNode = /*#__PURE__*/forwardRef((props, ref) => {
   var _expands$keyid;
   var {
       value = {},
@@ -156,7 +156,9 @@ export function RooNode(props) {
     setParentValue,
     setValue: setValueData
   });
-  return /*#__PURE__*/_jsxs("div", _extends({}, reset, {
+  return /*#__PURE__*/_jsxs("div", _extends({
+    ref: ref
+  }, reset, {
     className: className + " w-rjv-inner"
   }, eventProps, {
     children: [/*#__PURE__*/_jsxs(Line, {
@@ -209,7 +211,7 @@ export function RooNode(props) {
           var label = isArray ? idx : key;
           return /*#__PURE__*/_jsx(Line, {
             className: "w-rjv-wrap",
-            children: /*#__PURE__*/_jsx(RooNode, _extends({
+            children: /*#__PURE__*/_jsx(RootNode, _extends({
               value: item,
               namespace: [...namespace, label],
               keyName: label,
@@ -220,7 +222,7 @@ export function RooNode(props) {
         if (typeof item === 'object' && item && !(item instanceof Date) && !isEmpty) {
           return /*#__PURE__*/_jsx(Line, {
             className: "w-rjv-wrap",
-            children: /*#__PURE__*/_jsx(RooNode, _extends({
+            children: /*#__PURE__*/_jsx(RootNode, _extends({
               value: item,
               namespace: [...namespace, key],
               keyName: key,
@@ -253,26 +255,6 @@ export function RooNode(props) {
             visible: expand
           }) || countInfo;
         }
-        // if (length > -1) {
-        //   countInfo = (
-        //     <Fragment>
-        //       {countInfo}
-        //       {components.countInfoExtra &&
-        //         components.countInfoExtra({
-        //           count: length,
-        //           level,
-        //           showTools,
-        //           keyName,
-        //           visible: expand,
-        //           value: valueData,
-        //           namespace: [...namespace],
-        //           parentValue,
-        //           setParentValue,
-        //           setValue: setValueData,
-        //         })}
-        //     </Fragment>
-        //   )
-        // }
         return /*#__PURE__*/_jsx(ValueView, _extends({
           components: components,
           namespace: [...namespace, key]
@@ -298,4 +280,4 @@ export function RooNode(props) {
       })
     })]
   }));
-}
+});

package/package.json

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