@uiw/react-json-view 2.0.0-alpha.25 → 2.0.0-alpha.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/cjs/Container.js +2 -1
- package/cjs/comps/Copied.js +20 -1
- package/cjs/comps/KeyValues.js +2 -1
- package/cjs/comps/useIdCompat.d.ts +1 -0
- package/cjs/comps/useIdCompat.js +14 -0
- package/esm/Container.js +3 -2
- package/esm/comps/Copied.js +20 -1
- package/esm/comps/KeyValues.js +3 -2
- package/esm/comps/useIdCompat.d.ts +1 -0
- package/esm/comps/useIdCompat.js +8 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -910,7 +910,7 @@ Here is the size benchmark (using [bundlephobia.com](https://bundlephobia.com))
|
|
|
910
910
|
| [react-domify](https://github.com/JedWatson/react-domify) | [](https://bundlephobia.com/result?p=react-domify) [](https://bundlephobia.com/result?p=react-domify) | [](https://bundlephobia.com/result?p=react-domify) | [](https://github.com/JedWatson/react-domify/commits) | [](https://www.npmjs.com/package/react-domify) | ❌ | [demo](https://jedwatson.github.io/react-domify/) |
|
|
911
911
|
| [react18-json-view](https://github.com/YYsuni/react18-json-view) | [](https://bundlephobia.com/result?p=react18-json-view) [](https://bundlephobia.com/result?p=react18-json-view) | [](https://bundlephobia.com/result?p=react18-json-view) | [](https://github.com/YYsuni/react18-json-view/commits) | [](https://www.npmjs.com/package/react18-json-view) | ❌ | [demo](https://jv.yysuni.com/) |
|
|
912
912
|
| [@textea/json-viewer](https://github.com/TexteaInc/json-viewer) | [](https://bundlephobia.com/result?p=@textea/json-viewer) [](https://bundlephobia.com/result?p=@textea/json-viewer) | [](https://bundlephobia.com/result?p=@textea/json-viewer) | [](https://github.com/TexteaInc/json-viewer/commits) | [](https://www.npmjs.com/package/@textea/json-viewer) | ✅ | [demo](https://stackblitz.com/edit/textea-json-viewer-v3-b4wgxq) |
|
|
913
|
-
| [react-editable-json-tree](https://github.com/oxyno-zeta/react-editable-json-tree) | [](https://bundlephobia.com/result?p=react-editable-json-tree) [](https://bundlephobia.com/result?p=react-editable-json-tree) | [](https://bundlephobia.com/result?p=react-editable-json-tree) | [ | [](https://bundlephobia.com/result?p=react-editable-json-tree) [](https://bundlephobia.com/result?p=react-editable-json-tree) | [](https://bundlephobia.com/result?p=react-editable-json-tree) | [](https://github.com/oxyno-zeta/react-editable-json-tree/commits) | [](https://www.npmjs.com/package/react-editable-json-tree) | ✅ | [demo](https://oxyno-zeta.github.io/react-editable-json-tree/) |
|
|
914
914
|
| [react-json-view](https://github.com/HuolalaTech/react-json-view) | [](https://bundlephobia.com/result?p=@huolala-tech/react-json-view) [](https://bundlephobia.com/result?p=@huolala-tech/react-json-view) | [](https://bundlephobia.com/result?p=@huolala-tech/react-json-view) | [](https://github.com/HuolalaTech/react-json-view/commits) | [](https://www.npmjs.com/package/@huolala-tech/react-json-view) | ❌ | [demo](https://huolalatech.github.io/react-json-view/) |
|
|
915
915
|
|
|
916
916
|
## Development
|
package/cjs/Container.js
CHANGED
|
@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
13
13
|
var _NestedClose = require("./comps/NestedClose");
|
|
14
14
|
var _NestedOpen = require("./comps/NestedOpen");
|
|
15
15
|
var _KeyValues = require("./comps/KeyValues");
|
|
16
|
+
var _useIdCompat = require("./comps/useIdCompat");
|
|
16
17
|
var _ShowTools = require("./store/ShowTools");
|
|
17
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
19
|
var _excluded = ["className", "children", "parentValue", "keyid", "level", "value", "initialValue", "keys", "keyName"];
|
|
@@ -30,7 +31,7 @@ var Container = exports.Container = /*#__PURE__*/(0, _react.forwardRef)(function
|
|
|
30
31
|
keyName = props.keyName,
|
|
31
32
|
elmProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
|
|
32
33
|
var dispatch = (0, _ShowTools.useShowToolsDispatch)();
|
|
33
|
-
var subkeyid = (0,
|
|
34
|
+
var subkeyid = (0, _useIdCompat.useIdCompat)();
|
|
34
35
|
var defaultClassNames = [className, 'w-rjv-inner'].filter(Boolean).join(' ');
|
|
35
36
|
var reset = {
|
|
36
37
|
onMouseEnter: function onMouseEnter() {
|
package/cjs/comps/Copied.js
CHANGED
|
@@ -54,7 +54,26 @@ var Copied = exports.Copied = function Copied(props) {
|
|
|
54
54
|
}
|
|
55
55
|
onCopied && onCopied(copyText, value);
|
|
56
56
|
setCopied(true);
|
|
57
|
-
navigator.clipboard
|
|
57
|
+
var _clipboard = navigator.clipboard || {
|
|
58
|
+
writeText: function writeText(text) {
|
|
59
|
+
return new Promise(function (reslove, reject) {
|
|
60
|
+
var textarea = document.createElement('textarea');
|
|
61
|
+
textarea.style.position = 'absolute';
|
|
62
|
+
textarea.style.opacity = '0';
|
|
63
|
+
textarea.style.left = '-99999999px';
|
|
64
|
+
textarea.value = text;
|
|
65
|
+
document.body.appendChild(textarea);
|
|
66
|
+
textarea.select();
|
|
67
|
+
if (!document.execCommand('copy')) {
|
|
68
|
+
reject();
|
|
69
|
+
} else {
|
|
70
|
+
reslove();
|
|
71
|
+
}
|
|
72
|
+
textarea.remove();
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
};
|
|
76
|
+
_clipboard.writeText(copyText).then(function () {
|
|
58
77
|
var timer = setTimeout(function () {
|
|
59
78
|
setCopied(false);
|
|
60
79
|
clearTimeout(timer);
|
package/cjs/comps/KeyValues.js
CHANGED
|
@@ -21,6 +21,7 @@ var _Container = require("../Container");
|
|
|
21
21
|
var _symbol = require("../symbol");
|
|
22
22
|
var _useHighlight = require("../utils/useHighlight");
|
|
23
23
|
var _Copied = require("../comps/Copied");
|
|
24
|
+
var _useIdCompat = require("../comps/useIdCompat");
|
|
24
25
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
25
26
|
var KeyValues = exports.KeyValues = function KeyValues(props) {
|
|
26
27
|
var _expands$expandKey;
|
|
@@ -127,7 +128,7 @@ var KeyValuesItem = exports.KeyValuesItem = function KeyValuesItem(props) {
|
|
|
127
128
|
_props$keys2 = props.keys,
|
|
128
129
|
keys = _props$keys2 === void 0 ? [] : _props$keys2;
|
|
129
130
|
var dispatch = (0, _ShowTools.useShowToolsDispatch)();
|
|
130
|
-
var subkeyid = (0,
|
|
131
|
+
var subkeyid = (0, _useIdCompat.useIdCompat)();
|
|
131
132
|
var isMyArray = Array.isArray(value);
|
|
132
133
|
var isMySet = value instanceof Set;
|
|
133
134
|
var isMyMap = value instanceof Map;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function useIdCompat(): string;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useIdCompat = useIdCompat;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
function useIdCompat() {
|
|
9
|
+
var idRef = (0, _react.useRef)(null);
|
|
10
|
+
if (idRef.current === null) {
|
|
11
|
+
idRef.current = 'custom-id-' + Math.random().toString(36).substr(2, 9);
|
|
12
|
+
}
|
|
13
|
+
return idRef.current;
|
|
14
|
+
}
|
package/esm/Container.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
3
|
var _excluded = ["className", "children", "parentValue", "keyid", "level", "value", "initialValue", "keys", "keyName"];
|
|
4
|
-
import React, { forwardRef
|
|
4
|
+
import React, { forwardRef } from 'react';
|
|
5
5
|
import { NestedClose } from './comps/NestedClose';
|
|
6
6
|
import { NestedOpen } from './comps/NestedOpen';
|
|
7
7
|
import { KeyValues } from './comps/KeyValues';
|
|
8
|
+
import { useIdCompat } from './comps/useIdCompat';
|
|
8
9
|
import { useShowToolsDispatch } from './store/ShowTools';
|
|
9
10
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
11
|
export var Container = /*#__PURE__*/forwardRef((props, ref) => {
|
|
@@ -19,7 +20,7 @@ export var Container = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
19
20
|
} = props,
|
|
20
21
|
elmProps = _objectWithoutPropertiesLoose(props, _excluded);
|
|
21
22
|
var dispatch = useShowToolsDispatch();
|
|
22
|
-
var subkeyid =
|
|
23
|
+
var subkeyid = useIdCompat();
|
|
23
24
|
var defaultClassNames = [className, 'w-rjv-inner'].filter(Boolean).join(' ');
|
|
24
25
|
var reset = {
|
|
25
26
|
onMouseEnter: () => dispatch({
|
package/esm/comps/Copied.js
CHANGED
|
@@ -44,7 +44,26 @@ export var Copied = props => {
|
|
|
44
44
|
}
|
|
45
45
|
onCopied && onCopied(copyText, value);
|
|
46
46
|
setCopied(true);
|
|
47
|
-
navigator.clipboard
|
|
47
|
+
var _clipboard = navigator.clipboard || {
|
|
48
|
+
writeText(text) {
|
|
49
|
+
return new Promise((reslove, reject) => {
|
|
50
|
+
var textarea = document.createElement('textarea');
|
|
51
|
+
textarea.style.position = 'absolute';
|
|
52
|
+
textarea.style.opacity = '0';
|
|
53
|
+
textarea.style.left = '-99999999px';
|
|
54
|
+
textarea.value = text;
|
|
55
|
+
document.body.appendChild(textarea);
|
|
56
|
+
textarea.select();
|
|
57
|
+
if (!document.execCommand('copy')) {
|
|
58
|
+
reject();
|
|
59
|
+
} else {
|
|
60
|
+
reslove();
|
|
61
|
+
}
|
|
62
|
+
textarea.remove();
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
_clipboard.writeText(copyText).then(() => {
|
|
48
67
|
var timer = setTimeout(() => {
|
|
49
68
|
setCopied(false);
|
|
50
69
|
clearTimeout(timer);
|
package/esm/comps/KeyValues.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
import { Fragment,
|
|
2
|
+
import { Fragment, useRef } from 'react';
|
|
3
3
|
import { useStore } from '../store';
|
|
4
4
|
import { useExpandsStore } from '../store/Expands';
|
|
5
5
|
import { useShowToolsDispatch } from '../store/ShowTools';
|
|
@@ -10,6 +10,7 @@ import { Container } from '../Container';
|
|
|
10
10
|
import { Quote, Colon } from '../symbol';
|
|
11
11
|
import { useHighlight } from '../utils/useHighlight';
|
|
12
12
|
import { Copied } from '../comps/Copied';
|
|
13
|
+
import { useIdCompat } from '../comps/useIdCompat';
|
|
13
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
15
|
export var KeyValues = props => {
|
|
15
16
|
var _expands$expandKey;
|
|
@@ -110,7 +111,7 @@ export var KeyValuesItem = props => {
|
|
|
110
111
|
keys = []
|
|
111
112
|
} = props;
|
|
112
113
|
var dispatch = useShowToolsDispatch();
|
|
113
|
-
var subkeyid =
|
|
114
|
+
var subkeyid = useIdCompat();
|
|
114
115
|
var isMyArray = Array.isArray(value);
|
|
115
116
|
var isMySet = value instanceof Set;
|
|
116
117
|
var isMyMap = value instanceof Map;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function useIdCompat(): string;
|