@uiw/react-json-view 2.0.0-alpha.26 → 2.0.0-alpha.27

package/cjs/Container.js

@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _NestedClose = require("./comps/NestedClose");
 var _NestedOpen = require("./comps/NestedOpen");
 var _KeyValues = require("./comps/KeyValues");
+var _useIdCompat = require("./comps/useIdCompat");
 var _ShowTools = require("./store/ShowTools");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["className", "children", "parentValue", "keyid", "level", "value", "initialValue", "keys", "keyName"];
@@ -30,7 +31,7 @@ var Container = exports.Container = /*#__PURE__*/(0, _react.forwardRef)(function
     keyName = props.keyName,
     elmProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var dispatch = (0, _ShowTools.useShowToolsDispatch)();
-  var subkeyid = (0, _react.useId)();
+  var subkeyid = (0, _useIdCompat.useIdCompat)();
   var defaultClassNames = [className, 'w-rjv-inner'].filter(Boolean).join(' ');
   var reset = {
     onMouseEnter: function onMouseEnter() {

package/cjs/comps/KeyValues.js

@@ -21,6 +21,7 @@ var _Container = require("../Container");
 var _symbol = require("../symbol");
 var _useHighlight = require("../utils/useHighlight");
 var _Copied = require("../comps/Copied");
+var _useIdCompat = require("../comps/useIdCompat");
 var _jsxRuntime = require("react/jsx-runtime");
 var KeyValues = exports.KeyValues = function KeyValues(props) {
   var _expands$expandKey;
@@ -127,7 +128,7 @@ var KeyValuesItem = exports.KeyValuesItem = function KeyValuesItem(props) {
     _props$keys2 = props.keys,
     keys = _props$keys2 === void 0 ? [] : _props$keys2;
   var dispatch = (0, _ShowTools.useShowToolsDispatch)();
-  var subkeyid = (0, _react.useId)();
+  var subkeyid = (0, _useIdCompat.useIdCompat)();
   var isMyArray = Array.isArray(value);
   var isMySet = value instanceof Set;
   var isMyMap = value instanceof Map;

package/cjs/comps/useIdCompat.d.ts

@@ -0,0 +1 @@
+export declare function useIdCompat(): string;

package/cjs/comps/useIdCompat.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useIdCompat = useIdCompat;
+var _react = require("react");
+function useIdCompat() {
+  var idRef = (0, _react.useRef)(null);
+  if (idRef.current === null) {
+    idRef.current = 'custom-id-' + Math.random().toString(36).substr(2, 9);
+  }
+  return idRef.current;
+}

package/esm/Container.js

@@ -1,10 +1,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, useId } from 'react';
+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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var Container = /*#__PURE__*/forwardRef((props, ref) => {
@@ -19,7 +20,7 @@ export var Container = /*#__PURE__*/forwardRef((props, ref) => {
     } = props,
     elmProps = _objectWithoutPropertiesLoose(props, _excluded);
   var dispatch = useShowToolsDispatch();
-  var subkeyid = useId();
+  var subkeyid = useIdCompat();
   var defaultClassNames = [className, 'w-rjv-inner'].filter(Boolean).join(' ');
   var reset = {
     onMouseEnter: () => dispatch({

package/esm/comps/KeyValues.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
-import { Fragment, useId, useRef } from 'react';
+import { Fragment, useRef } from 'react';
 import { useStore } from '../store';
 import { useExpandsStore } from '../store/Expands';
 import { useShowToolsDispatch } from '../store/ShowTools';
@@ -10,6 +10,7 @@ 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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export var KeyValues = props => {
   var _expands$expandKey;
@@ -110,7 +111,7 @@ export var KeyValuesItem = props => {
     keys = []
   } = props;
   var dispatch = useShowToolsDispatch();
-  var subkeyid = useId();
+  var subkeyid = useIdCompat();
   var isMyArray = Array.isArray(value);
   var isMySet = value instanceof Set;
   var isMyMap = value instanceof Map;

package/esm/comps/useIdCompat.d.ts

@@ -0,0 +1 @@
+export declare function useIdCompat(): string;

package/esm/comps/useIdCompat.js

@@ -0,0 +1,8 @@
+import { useRef } from 'react';
+export function useIdCompat() {
+  var idRef = useRef(null);
+  if (idRef.current === null) {
+    idRef.current = 'custom-id-' + Math.random().toString(36).substr(2, 9);
+  }
+  return idRef.current;
+}

package/package.json

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