@uiw/react-json-view 2.0.0-alpha.2 → 2.0.0-alpha.21
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 +146 -21
- package/basic.d.ts +3 -0
- package/cjs/Container.d.ts +2 -0
- package/cjs/Container.js +9 -4
- package/cjs/arrow/TriangleArrow.js +1 -1
- package/cjs/comps/Copied.d.ts +2 -3
- package/cjs/comps/Copied.js +29 -16
- package/cjs/comps/KeyValues.d.ts +2 -4
- package/cjs/comps/KeyValues.js +49 -24
- package/cjs/comps/NestedClose.js +3 -4
- package/cjs/comps/NestedOpen.d.ts +2 -3
- package/cjs/comps/NestedOpen.js +23 -17
- package/cjs/comps/Value.d.ts +1 -2
- package/cjs/comps/Value.js +16 -20
- package/cjs/editor/KeyName.d.ts +2 -0
- package/cjs/editor/KeyName.js +82 -0
- package/cjs/editor/index.d.ts +19 -0
- package/cjs/editor/index.js +44 -0
- package/cjs/editor/store.d.ts +28 -0
- package/cjs/editor/store.js +23 -0
- package/cjs/index.d.ts +5 -3
- package/cjs/index.js +11 -8
- package/cjs/section/Copied.d.ts +1 -1
- package/cjs/section/Copied.js +1 -2
- package/cjs/section/CountInfo.d.ts +10 -1
- package/cjs/section/CountInfo.js +42 -4
- package/cjs/section/CountInfoExtra.d.ts +10 -1
- package/cjs/section/CountInfoExtra.js +32 -4
- package/cjs/section/Ellipsis.d.ts +10 -0
- package/cjs/section/Ellipsis.js +30 -4
- package/cjs/section/KeyName.d.ts +8 -0
- package/cjs/section/KeyName.js +40 -4
- package/cjs/section/Row.d.ts +14 -0
- package/cjs/section/Row.js +51 -0
- package/cjs/store/Expands.js +2 -4
- package/cjs/store/Section.d.ts +12 -6
- package/cjs/store/Section.js +6 -4
- package/cjs/store/ShowTools.js +2 -4
- package/cjs/store/Symbols.d.ts +2 -2
- package/cjs/store/Symbols.js +2 -4
- package/cjs/store/Types.d.ts +28 -24
- package/cjs/store/Types.js +8 -8
- package/cjs/store.d.ts +7 -4
- package/cjs/store.js +5 -10
- package/cjs/symbol/Arrow.d.ts +1 -1
- package/cjs/symbol/Arrow.js +1 -2
- package/cjs/symbol/BraceLeft.d.ts +1 -1
- package/cjs/symbol/BraceLeft.js +1 -2
- package/cjs/symbol/BraceRight.d.ts +1 -1
- package/cjs/symbol/BraceRight.js +1 -2
- package/cjs/symbol/BracketsLeft.d.ts +1 -1
- package/cjs/symbol/BracketsLeft.js +1 -2
- package/cjs/symbol/BracketsRight.d.ts +1 -1
- package/cjs/symbol/BracketsRight.js +1 -2
- package/cjs/symbol/Colon.d.ts +1 -1
- package/cjs/symbol/Colon.js +1 -2
- package/cjs/symbol/Quote.d.ts +1 -1
- package/cjs/symbol/Quote.js +1 -2
- package/cjs/symbol/ValueQuote.d.ts +1 -1
- package/cjs/symbol/ValueQuote.js +1 -2
- package/{esm/comps/ReRender/Symbols.d.ts → cjs/symbol/index.d.ts} +4 -6
- package/cjs/{comps/ReRender/Symbols.js → symbol/index.js} +32 -33
- package/cjs/theme/basic.js +4 -3
- package/cjs/theme/dark.js +2 -3
- package/cjs/theme/github.dark.js +2 -3
- package/cjs/theme/github.light.js +2 -3
- package/cjs/theme/gruvbox.js +2 -3
- package/cjs/theme/light.js +2 -3
- package/cjs/theme/monokai.js +2 -3
- package/cjs/theme/nord.js +2 -3
- package/cjs/theme/vscode.js +2 -3
- package/cjs/types/Bigint.d.ts +1 -1
- package/cjs/types/Bigint.js +1 -2
- package/cjs/types/Date.d.ts +1 -1
- package/cjs/types/Date.js +1 -2
- package/cjs/types/False.d.ts +1 -1
- package/cjs/types/False.js +1 -2
- package/cjs/types/Float.d.ts +1 -1
- package/cjs/types/Float.js +1 -2
- package/cjs/types/Int.d.ts +1 -1
- package/cjs/types/Int.js +1 -2
- package/cjs/types/Map.d.ts +1 -1
- package/cjs/types/Map.js +1 -2
- package/cjs/types/Nan.d.ts +1 -1
- package/cjs/types/Nan.js +1 -2
- package/cjs/types/Null.d.ts +1 -1
- package/cjs/types/Null.js +1 -2
- package/cjs/types/Set.d.ts +1 -1
- package/cjs/types/Set.js +1 -2
- package/cjs/types/String.d.ts +1 -1
- package/cjs/types/String.js +1 -2
- package/cjs/types/True.d.ts +1 -1
- package/cjs/types/True.js +1 -2
- package/cjs/types/Undefined.d.ts +1 -1
- package/cjs/types/Undefined.js +1 -2
- package/cjs/types/Url.d.ts +1 -1
- package/cjs/types/Url.js +1 -2
- package/{esm/comps/ReRender/Types.d.ts → cjs/types/index.d.ts} +2 -2
- package/cjs/{comps/ReRender/Types.js → types/index.js} +92 -171
- package/cjs/utils/useHighlight.js +0 -1
- package/cjs/utils/useRender.d.ts +1 -1
- package/editor.d.ts +22 -20
- package/esm/Container.d.ts +2 -0
- package/esm/Container.js +10 -4
- package/esm/arrow/TriangleArrow.js +1 -1
- package/esm/comps/Copied.d.ts +2 -3
- package/esm/comps/Copied.js +27 -15
- package/esm/comps/KeyValues.d.ts +2 -4
- package/esm/comps/KeyValues.js +37 -15
- package/esm/comps/NestedClose.js +1 -1
- package/esm/comps/NestedOpen.d.ts +2 -3
- package/esm/comps/NestedOpen.js +18 -12
- package/esm/comps/Value.d.ts +1 -2
- package/esm/comps/Value.js +3 -5
- package/esm/editor/KeyName.d.ts +2 -0
- package/esm/editor/KeyName.js +77 -0
- package/esm/editor/index.d.ts +19 -0
- package/esm/editor/index.js +33 -0
- package/esm/editor/store.d.ts +28 -0
- package/esm/editor/store.js +13 -0
- package/esm/index.d.ts +5 -3
- package/esm/index.js +9 -6
- package/esm/section/Copied.d.ts +1 -1
- package/esm/section/CountInfo.d.ts +10 -1
- package/esm/section/CountInfo.js +43 -1
- package/esm/section/CountInfoExtra.d.ts +10 -1
- package/esm/section/CountInfoExtra.js +32 -1
- package/esm/section/Ellipsis.d.ts +10 -0
- package/esm/section/Ellipsis.js +31 -1
- package/esm/section/KeyName.d.ts +8 -0
- package/esm/section/KeyName.js +41 -1
- package/esm/section/Row.d.ts +14 -0
- package/esm/section/Row.js +47 -0
- package/esm/store/Section.d.ts +12 -6
- package/esm/store/Section.js +4 -0
- package/esm/store/Symbols.d.ts +2 -2
- package/esm/store/Types.d.ts +28 -24
- package/esm/store/Types.js +6 -4
- package/esm/store.d.ts +7 -4
- package/esm/symbol/Arrow.d.ts +1 -1
- package/esm/symbol/BraceLeft.d.ts +1 -1
- package/esm/symbol/BraceRight.d.ts +1 -1
- package/esm/symbol/BracketsLeft.d.ts +1 -1
- package/esm/symbol/BracketsRight.d.ts +1 -1
- package/esm/symbol/Colon.d.ts +1 -1
- package/esm/symbol/Quote.d.ts +1 -1
- package/esm/symbol/ValueQuote.d.ts +1 -1
- package/{cjs/comps/ReRender/Symbols.d.ts → esm/symbol/index.d.ts} +4 -6
- package/esm/{comps/ReRender/Symbols.js → symbol/index.js} +26 -24
- package/esm/theme/basic.js +2 -0
- package/esm/types/Bigint.d.ts +1 -1
- package/esm/types/Date.d.ts +1 -1
- package/esm/types/False.d.ts +1 -1
- package/esm/types/Float.d.ts +1 -1
- package/esm/types/Int.d.ts +1 -1
- package/esm/types/Map.d.ts +1 -1
- package/esm/types/Nan.d.ts +1 -1
- package/esm/types/Null.d.ts +1 -1
- package/esm/types/Set.d.ts +1 -1
- package/esm/types/String.d.ts +1 -1
- package/esm/types/True.d.ts +1 -1
- package/esm/types/Undefined.d.ts +1 -1
- package/esm/types/Url.d.ts +1 -1
- package/{cjs/comps/ReRender/Types.d.ts → esm/types/index.d.ts} +2 -2
- package/esm/{comps/ReRender/Types.js → types/index.js} +76 -148
- package/esm/utils/useHighlight.js +0 -1
- package/esm/utils/useRender.d.ts +1 -1
- package/githubDark.d.ts +3 -0
- package/githubLight.d.ts +3 -0
- package/gruvbox.d.ts +3 -0
- package/monokai.d.ts +3 -0
- package/nord.d.ts +3 -0
- package/package.json +11 -5
- package/vscode.d.ts +3 -0
- package/cjs/comps/CountInfo.d.ts +0 -19
- package/cjs/comps/CountInfo.js +0 -72
- package/cjs/comps/Ellipsis.d.ts +0 -10
- package/cjs/comps/Ellipsis.js +0 -35
- package/cjs/comps/Key.d.ts +0 -7
- package/cjs/comps/Key.js +0 -41
- package/esm/comps/CountInfo.d.ts +0 -19
- package/esm/comps/CountInfo.js +0 -70
- package/esm/comps/Ellipsis.d.ts +0 -10
- package/esm/comps/Ellipsis.js +0 -31
- package/esm/comps/Key.d.ts +0 -7
- package/esm/comps/Key.js +0 -37
package/esm/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
-
var _excluded = ["className", "style", "value", "children", "collapsed", "indentWidth", "displayObjectSize", "shortenTextAfterLength", "highlightUpdates", "enableClipboard", "displayDataTypes", "objectSortKeys", "onExpand"];
|
|
3
|
+
var _excluded = ["className", "style", "value", "children", "collapsed", "indentWidth", "displayObjectSize", "shortenTextAfterLength", "highlightUpdates", "enableClipboard", "displayDataTypes", "objectSortKeys", "onExpand", "onCopied"];
|
|
4
4
|
import { forwardRef } from 'react';
|
|
5
5
|
import { Provider } from './store';
|
|
6
6
|
import { Container } from './Container';
|
|
@@ -30,14 +30,14 @@ import { CountInfo } from './section/CountInfo';
|
|
|
30
30
|
import { CountInfoExtra } from './section/CountInfoExtra';
|
|
31
31
|
import { Ellipsis } from './section/Ellipsis';
|
|
32
32
|
import { KeyName } from './section/KeyName';
|
|
33
|
-
import {
|
|
34
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
33
|
+
import { Row } from './section/Row';
|
|
34
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
35
35
|
export * from './store';
|
|
36
36
|
export * from './store/Expands';
|
|
37
37
|
export * from './store/ShowTools';
|
|
38
38
|
export * from './store/Symbols';
|
|
39
39
|
export * from './store/Types';
|
|
40
|
-
export * from './
|
|
40
|
+
export * from './symbol';
|
|
41
41
|
var JsonView = /*#__PURE__*/forwardRef((props, ref) => {
|
|
42
42
|
var {
|
|
43
43
|
className = '',
|
|
@@ -47,12 +47,13 @@ var JsonView = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
47
47
|
collapsed,
|
|
48
48
|
indentWidth = 15,
|
|
49
49
|
displayObjectSize = true,
|
|
50
|
-
shortenTextAfterLength =
|
|
50
|
+
shortenTextAfterLength = 30,
|
|
51
51
|
highlightUpdates = true,
|
|
52
52
|
enableClipboard = true,
|
|
53
53
|
displayDataTypes = true,
|
|
54
54
|
objectSortKeys = false,
|
|
55
|
-
onExpand
|
|
55
|
+
onExpand,
|
|
56
|
+
onCopied
|
|
56
57
|
} = props,
|
|
57
58
|
elmProps = _objectWithoutPropertiesLoose(props, _excluded);
|
|
58
59
|
var defaultStyle = _extends({
|
|
@@ -73,6 +74,7 @@ var JsonView = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
73
74
|
enableClipboard,
|
|
74
75
|
shortenTextAfterLength,
|
|
75
76
|
highlightUpdates,
|
|
77
|
+
onCopied,
|
|
76
78
|
onExpand
|
|
77
79
|
},
|
|
78
80
|
initialTypes: {
|
|
@@ -113,5 +115,6 @@ JsonView.Copied = Copied;
|
|
|
113
115
|
JsonView.CountInfo = CountInfo;
|
|
114
116
|
JsonView.CountInfoExtra = CountInfoExtra;
|
|
115
117
|
JsonView.KeyName = KeyName;
|
|
118
|
+
JsonView.Row = Row;
|
|
116
119
|
JsonView.displayName = 'JVR.JsonView';
|
|
117
120
|
export default JsonView;
|
package/esm/section/Copied.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type TagType } from '../store/Types';
|
|
2
2
|
import { type SectionElement } from '../store/Section';
|
|
3
3
|
export declare const Copied: {
|
|
4
|
-
(props: SectionElement<
|
|
4
|
+
<K extends TagType = "svg">(props: SectionElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1,6 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { type TagType } from '../store/Types';
|
|
2
|
-
import { type SectionElement } from '../store/Section';
|
|
3
|
+
import { type SectionElement, type SectionElementProps } from '../store/Section';
|
|
3
4
|
export declare const CountInfo: {
|
|
4
5
|
<K extends TagType>(props: SectionElement<K>): null;
|
|
5
6
|
displayName: string;
|
|
6
7
|
};
|
|
8
|
+
export interface CountInfoCompProps<T extends object> {
|
|
9
|
+
value?: T;
|
|
10
|
+
keyName: string | number;
|
|
11
|
+
}
|
|
12
|
+
export declare const CountInfoComp: {
|
|
13
|
+
<K extends TagType, T extends object>(props: SectionElementProps<K> & CountInfoCompProps<T> & React.HTMLAttributes<HTMLElement>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
|
|
14
|
+
displayName: string;
|
|
15
|
+
};
|
package/esm/section/CountInfo.js
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
+
var _excluded = ["value", "keyName"],
|
|
4
|
+
_excluded2 = ["as", "render"];
|
|
1
5
|
import { useSectionStore } from '../store/Section';
|
|
2
6
|
import { useSectionRender } from '../utils/useRender';
|
|
7
|
+
import { useStore } from '../store';
|
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
9
|
export var CountInfo = props => {
|
|
4
10
|
var {
|
|
5
11
|
CountInfo: Comp = {}
|
|
@@ -7,4 +13,40 @@ export var CountInfo = props => {
|
|
|
7
13
|
useSectionRender(Comp, props, 'CountInfo');
|
|
8
14
|
return null;
|
|
9
15
|
};
|
|
10
|
-
CountInfo.displayName = 'JVR.CountInfo';
|
|
16
|
+
CountInfo.displayName = 'JVR.CountInfo';
|
|
17
|
+
export var CountInfoComp = props => {
|
|
18
|
+
var {
|
|
19
|
+
value = {},
|
|
20
|
+
keyName
|
|
21
|
+
} = props,
|
|
22
|
+
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
23
|
+
var {
|
|
24
|
+
displayObjectSize
|
|
25
|
+
} = useStore();
|
|
26
|
+
var {
|
|
27
|
+
CountInfo: Comp = {}
|
|
28
|
+
} = useSectionStore();
|
|
29
|
+
if (!displayObjectSize) return null;
|
|
30
|
+
var {
|
|
31
|
+
as,
|
|
32
|
+
render
|
|
33
|
+
} = Comp,
|
|
34
|
+
reset = _objectWithoutPropertiesLoose(Comp, _excluded2);
|
|
35
|
+
var Elm = as || 'span';
|
|
36
|
+
reset.style = _extends({}, reset.style, props.style);
|
|
37
|
+
var len = Object.keys(value).length;
|
|
38
|
+
if (!reset.children) {
|
|
39
|
+
reset.children = len + " item" + (len === 1 ? '' : 's');
|
|
40
|
+
}
|
|
41
|
+
var elmProps = _extends({}, reset, other);
|
|
42
|
+
var isRender = render && typeof render === 'function';
|
|
43
|
+
var child = isRender && render(_extends({}, elmProps, {
|
|
44
|
+
'data-length': len
|
|
45
|
+
}), {
|
|
46
|
+
value,
|
|
47
|
+
keyName
|
|
48
|
+
});
|
|
49
|
+
if (child) return child;
|
|
50
|
+
return /*#__PURE__*/_jsx(Elm, _extends({}, elmProps));
|
|
51
|
+
};
|
|
52
|
+
CountInfoComp.displayName = 'JVR.CountInfoComp';
|
|
@@ -1,6 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { type TagType } from '../store/Types';
|
|
2
|
-
import { type SectionElement } from '../store/Section';
|
|
3
|
+
import { type SectionElement, type SectionElementProps } from '../store/Section';
|
|
3
4
|
export declare const CountInfoExtra: {
|
|
4
5
|
<K extends TagType>(props: SectionElement<K>): null;
|
|
5
6
|
displayName: string;
|
|
6
7
|
};
|
|
8
|
+
export interface CountInfoExtraCompsProps<T extends object> {
|
|
9
|
+
value?: T;
|
|
10
|
+
keyName: string | number;
|
|
11
|
+
}
|
|
12
|
+
export declare const CountInfoExtraComps: {
|
|
13
|
+
<T extends object, K extends TagType>(props: SectionElementProps<K> & CountInfoExtraCompsProps<T>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
|
|
14
|
+
displayName: string;
|
|
15
|
+
};
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
+
var _excluded = ["value", "keyName"],
|
|
4
|
+
_excluded2 = ["as", "render"];
|
|
1
5
|
import { useSectionStore } from '../store/Section';
|
|
2
6
|
import { useSectionRender } from '../utils/useRender';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
8
|
export var CountInfoExtra = props => {
|
|
4
9
|
var {
|
|
5
10
|
CountInfoExtra: Comp = {}
|
|
@@ -7,4 +12,30 @@ export var CountInfoExtra = props => {
|
|
|
7
12
|
useSectionRender(Comp, props, 'CountInfoExtra');
|
|
8
13
|
return null;
|
|
9
14
|
};
|
|
10
|
-
CountInfoExtra.displayName = 'JVR.CountInfoExtra';
|
|
15
|
+
CountInfoExtra.displayName = 'JVR.CountInfoExtra';
|
|
16
|
+
export var CountInfoExtraComps = props => {
|
|
17
|
+
var {
|
|
18
|
+
value = {},
|
|
19
|
+
keyName
|
|
20
|
+
} = props,
|
|
21
|
+
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
22
|
+
var {
|
|
23
|
+
CountInfoExtra: Comp = {}
|
|
24
|
+
} = useSectionStore();
|
|
25
|
+
var {
|
|
26
|
+
as,
|
|
27
|
+
render
|
|
28
|
+
} = Comp,
|
|
29
|
+
reset = _objectWithoutPropertiesLoose(Comp, _excluded2);
|
|
30
|
+
if (!render && !reset.children) return null;
|
|
31
|
+
var Elm = as || 'span';
|
|
32
|
+
var isRender = render && typeof render === 'function';
|
|
33
|
+
var elmProps = _extends({}, reset, other);
|
|
34
|
+
var child = isRender && render(elmProps, {
|
|
35
|
+
value,
|
|
36
|
+
keyName
|
|
37
|
+
});
|
|
38
|
+
if (child) return child;
|
|
39
|
+
return /*#__PURE__*/_jsx(Elm, _extends({}, elmProps));
|
|
40
|
+
};
|
|
41
|
+
CountInfoExtraComps.displayName = 'JVR.CountInfoExtraComps';
|
|
@@ -1,6 +1,16 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { type TagType } from '../store/Types';
|
|
2
3
|
import { type SectionElement } from '../store/Section';
|
|
3
4
|
export declare const Ellipsis: {
|
|
4
5
|
<K extends TagType>(props: SectionElement<K>): null;
|
|
5
6
|
displayName: string;
|
|
6
7
|
};
|
|
8
|
+
export interface EllipsisCompProps<T extends object> {
|
|
9
|
+
value?: T;
|
|
10
|
+
keyName: string | number;
|
|
11
|
+
isExpanded: boolean;
|
|
12
|
+
}
|
|
13
|
+
export declare const EllipsisComp: {
|
|
14
|
+
<T extends object>({ isExpanded, value, keyName }: EllipsisCompProps<T>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null;
|
|
15
|
+
displayName: string;
|
|
16
|
+
};
|
package/esm/section/Ellipsis.js
CHANGED
|
@@ -1,5 +1,9 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
+
var _excluded = ["as", "render"];
|
|
1
4
|
import { useSectionStore } from '../store/Section';
|
|
2
5
|
import { useSectionRender } from '../utils/useRender';
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
7
|
export var Ellipsis = props => {
|
|
4
8
|
var {
|
|
5
9
|
Ellipsis: Comp = {}
|
|
@@ -7,4 +11,30 @@ export var Ellipsis = props => {
|
|
|
7
11
|
useSectionRender(Comp, props, 'Ellipsis');
|
|
8
12
|
return null;
|
|
9
13
|
};
|
|
10
|
-
Ellipsis.displayName = 'JVR.Ellipsis';
|
|
14
|
+
Ellipsis.displayName = 'JVR.Ellipsis';
|
|
15
|
+
export var EllipsisComp = _ref => {
|
|
16
|
+
var {
|
|
17
|
+
isExpanded,
|
|
18
|
+
value,
|
|
19
|
+
keyName
|
|
20
|
+
} = _ref;
|
|
21
|
+
var {
|
|
22
|
+
Ellipsis: Comp = {}
|
|
23
|
+
} = useSectionStore();
|
|
24
|
+
var {
|
|
25
|
+
as,
|
|
26
|
+
render
|
|
27
|
+
} = Comp,
|
|
28
|
+
reset = _objectWithoutPropertiesLoose(Comp, _excluded);
|
|
29
|
+
var Elm = as || 'span';
|
|
30
|
+
var child = render && typeof render === 'function' && render(_extends({}, reset, {
|
|
31
|
+
'data-expanded': isExpanded
|
|
32
|
+
}), {
|
|
33
|
+
value,
|
|
34
|
+
keyName
|
|
35
|
+
});
|
|
36
|
+
if (child) return child;
|
|
37
|
+
if (!isExpanded) return null;
|
|
38
|
+
return /*#__PURE__*/_jsx(Elm, _extends({}, reset));
|
|
39
|
+
};
|
|
40
|
+
EllipsisComp.displayName = 'JVR.EllipsisComp';
|
package/esm/section/KeyName.d.ts
CHANGED
|
@@ -1,6 +1,14 @@
|
|
|
1
|
+
import { type PropsWithChildren } from 'react';
|
|
1
2
|
import { type TagType } from '../store/Types';
|
|
2
3
|
import { type SectionElement } from '../store/Section';
|
|
4
|
+
import { type SectionElementResult } from '../store/Section';
|
|
3
5
|
export declare const KeyName: {
|
|
4
6
|
<K extends TagType>(props: SectionElement<K>): null;
|
|
5
7
|
displayName: string;
|
|
6
8
|
};
|
|
9
|
+
export interface KeyNameCompProps<T extends object> extends React.HTMLAttributes<HTMLSpanElement>, SectionElementResult<T> {
|
|
10
|
+
}
|
|
11
|
+
export declare const KeyNameComp: {
|
|
12
|
+
<T extends object>(props: PropsWithChildren<KeyNameCompProps<T>>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
};
|
package/esm/section/KeyName.js
CHANGED
|
@@ -1,5 +1,9 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
+
var _excluded = ["as", "render"];
|
|
1
4
|
import { useSectionStore } from '../store/Section';
|
|
2
5
|
import { useSectionRender } from '../utils/useRender';
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
7
|
export var KeyName = props => {
|
|
4
8
|
var {
|
|
5
9
|
KeyName: Comp = {}
|
|
@@ -7,4 +11,40 @@ export var KeyName = props => {
|
|
|
7
11
|
useSectionRender(Comp, props, 'KeyName');
|
|
8
12
|
return null;
|
|
9
13
|
};
|
|
10
|
-
KeyName.displayName = 'JVR.KeyName';
|
|
14
|
+
KeyName.displayName = 'JVR.KeyName';
|
|
15
|
+
export var KeyNameComp = props => {
|
|
16
|
+
var {
|
|
17
|
+
children,
|
|
18
|
+
value,
|
|
19
|
+
parentValue,
|
|
20
|
+
keyName,
|
|
21
|
+
keys
|
|
22
|
+
} = props;
|
|
23
|
+
var isNumber = typeof children === 'number';
|
|
24
|
+
var style = {
|
|
25
|
+
color: isNumber ? 'var(--w-rjv-key-number, #268bd2)' : 'var(--w-rjv-key-string, #002b36)'
|
|
26
|
+
};
|
|
27
|
+
var {
|
|
28
|
+
KeyName: Comp = {}
|
|
29
|
+
} = useSectionStore();
|
|
30
|
+
var {
|
|
31
|
+
as,
|
|
32
|
+
render
|
|
33
|
+
} = Comp,
|
|
34
|
+
reset = _objectWithoutPropertiesLoose(Comp, _excluded);
|
|
35
|
+
reset.style = _extends({}, reset.style, style);
|
|
36
|
+
var Elm = as || 'span';
|
|
37
|
+
var child = render && typeof render === 'function' && render(_extends({}, reset, {
|
|
38
|
+
children
|
|
39
|
+
}), {
|
|
40
|
+
value,
|
|
41
|
+
parentValue,
|
|
42
|
+
keyName,
|
|
43
|
+
keys
|
|
44
|
+
});
|
|
45
|
+
if (child) return child;
|
|
46
|
+
return /*#__PURE__*/_jsx(Elm, _extends({}, reset, {
|
|
47
|
+
children: children
|
|
48
|
+
}));
|
|
49
|
+
};
|
|
50
|
+
KeyNameComp.displayName = 'JVR.KeyNameComp';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type TagType } from '../store/Types';
|
|
3
|
+
import { type SectionElement } from '../store/Section';
|
|
4
|
+
import { type SectionElementResult } from '../store/Section';
|
|
5
|
+
export declare const Row: {
|
|
6
|
+
<K extends TagType>(props: SectionElement<K>): null;
|
|
7
|
+
displayName: string;
|
|
8
|
+
};
|
|
9
|
+
export interface RowCompProps<T extends object> extends React.HTMLAttributes<HTMLDivElement>, SectionElementResult<T> {
|
|
10
|
+
}
|
|
11
|
+
export declare const RowComp: {
|
|
12
|
+
<T extends object>(props: React.PropsWithChildren<RowCompProps<T>>): string | number | true | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
3
|
+
var _excluded = ["children", "value", "parentValue", "keyName", "keys"],
|
|
4
|
+
_excluded2 = ["as", "render", "children"];
|
|
5
|
+
import { useSectionStore } from '../store/Section';
|
|
6
|
+
import { useSectionRender } from '../utils/useRender';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
export var Row = props => {
|
|
9
|
+
var {
|
|
10
|
+
Row: Comp = {}
|
|
11
|
+
} = useSectionStore();
|
|
12
|
+
useSectionRender(Comp, props, 'Row');
|
|
13
|
+
return null;
|
|
14
|
+
};
|
|
15
|
+
Row.displayName = 'JVR.Row';
|
|
16
|
+
export var RowComp = props => {
|
|
17
|
+
var {
|
|
18
|
+
children,
|
|
19
|
+
value,
|
|
20
|
+
parentValue,
|
|
21
|
+
keyName,
|
|
22
|
+
keys
|
|
23
|
+
} = props,
|
|
24
|
+
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
25
|
+
var {
|
|
26
|
+
Row: Comp = {}
|
|
27
|
+
} = useSectionStore();
|
|
28
|
+
var {
|
|
29
|
+
as,
|
|
30
|
+
render
|
|
31
|
+
} = Comp,
|
|
32
|
+
reset = _objectWithoutPropertiesLoose(Comp, _excluded2);
|
|
33
|
+
var Elm = as || 'div';
|
|
34
|
+
var child = render && typeof render === 'function' && render(_extends({}, other, reset, {
|
|
35
|
+
children
|
|
36
|
+
}), {
|
|
37
|
+
value,
|
|
38
|
+
keyName,
|
|
39
|
+
parentValue,
|
|
40
|
+
keys
|
|
41
|
+
});
|
|
42
|
+
if (child) return child;
|
|
43
|
+
return /*#__PURE__*/_jsx(Elm, _extends({}, other, reset, {
|
|
44
|
+
children: children
|
|
45
|
+
}));
|
|
46
|
+
};
|
|
47
|
+
RowComp.displayName = 'JVR.RowComp';
|
package/esm/store/Section.d.ts
CHANGED
|
@@ -1,18 +1,23 @@
|
|
|
1
1
|
import React, { FC, PropsWithChildren, ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
import { type TagType } from './Types';
|
|
3
|
-
export
|
|
3
|
+
export interface SectionElementResult<T extends object, K = string | number> {
|
|
4
|
+
value?: T;
|
|
5
|
+
parentValue?: T;
|
|
6
|
+
keyName?: K;
|
|
7
|
+
/** Index of the parent `keyName` */
|
|
8
|
+
keys?: K[];
|
|
9
|
+
}
|
|
10
|
+
export type SectionElementProps<T extends TagType = 'span'> = {
|
|
4
11
|
as?: T;
|
|
5
|
-
render?: (props: SectionElement<T>, result:
|
|
6
|
-
value: unknown;
|
|
7
|
-
keyName: string | number;
|
|
8
|
-
}) => React.ReactNode;
|
|
12
|
+
render?: (props: SectionElement<T>, result: SectionElementResult<object>) => React.ReactNode;
|
|
9
13
|
};
|
|
10
|
-
export type SectionElement<T extends TagType> = SectionElementProps<T> & ComponentPropsWithoutRef<T>;
|
|
14
|
+
export type SectionElement<T extends TagType = 'span'> = SectionElementProps<T> & ComponentPropsWithoutRef<T>;
|
|
11
15
|
type InitialState<T extends TagType> = {
|
|
12
16
|
Copied?: SectionElement<T>;
|
|
13
17
|
CountInfo?: SectionElement<T>;
|
|
14
18
|
CountInfoExtra?: SectionElement<T>;
|
|
15
19
|
Ellipsis?: SectionElement<T>;
|
|
20
|
+
Row?: SectionElement<T>;
|
|
16
21
|
KeyName?: SectionElement<T>;
|
|
17
22
|
};
|
|
18
23
|
type Dispatch = React.Dispatch<InitialState<TagType>>;
|
|
@@ -22,6 +27,7 @@ export declare function useSection(): [{
|
|
|
22
27
|
CountInfo?: SectionElement<TagType> | undefined;
|
|
23
28
|
CountInfoExtra?: SectionElement<TagType> | undefined;
|
|
24
29
|
Ellipsis?: SectionElement<TagType> | undefined;
|
|
30
|
+
Row?: SectionElement<TagType> | undefined;
|
|
25
31
|
KeyName?: SectionElement<TagType> | undefined;
|
|
26
32
|
}, React.Dispatch<InitialState<TagType>>];
|
|
27
33
|
export declare function useSectionDispatch(): Dispatch;
|
package/esm/store/Section.js
CHANGED
package/esm/store/Symbols.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { FC, PropsWithChildren, ElementType, ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
import { type TagType } from './Types';
|
|
3
|
-
type SymbolsElementProps<T extends TagType> = {
|
|
3
|
+
type SymbolsElementProps<T extends TagType = 'span'> = {
|
|
4
4
|
as?: T;
|
|
5
5
|
render?: (props: SymbolsElement<T>) => React.ReactNode;
|
|
6
6
|
'data-type'?: string;
|
|
7
7
|
};
|
|
8
|
-
export type SymbolsElement<T extends TagType> = SymbolsElementProps<T> & ComponentPropsWithoutRef<T>;
|
|
8
|
+
export type SymbolsElement<T extends TagType = 'span'> = SymbolsElementProps<T> & ComponentPropsWithoutRef<T>;
|
|
9
9
|
type InitialState<T extends ElementType = 'span'> = {
|
|
10
10
|
Arrow?: SymbolsElement<T>;
|
|
11
11
|
Colon?: SymbolsElement<T>;
|
package/esm/store/Types.d.ts
CHANGED
|
@@ -1,32 +1,33 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { PropsWithChildren, ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
export type TagType = React.ElementType | keyof JSX.IntrinsicElements;
|
|
3
|
-
type TypesElementProps<T extends TagType> = {
|
|
3
|
+
type TypesElementProps<T extends TagType = 'span'> = {
|
|
4
4
|
as?: T;
|
|
5
5
|
render?: (props: TypesElement<T>, result: {
|
|
6
6
|
type: 'type' | 'value';
|
|
7
7
|
value?: unknown;
|
|
8
|
+
keyName: string | number;
|
|
8
9
|
}) => React.ReactNode;
|
|
9
10
|
'data-type'?: string;
|
|
10
11
|
};
|
|
11
12
|
export type TypesElement<T extends TagType> = TypesElementProps<T> & ComponentPropsWithoutRef<T>;
|
|
12
|
-
export type InitialTypesState = {
|
|
13
|
+
export type InitialTypesState<T extends TagType = 'span'> = {
|
|
13
14
|
displayDataTypes?: boolean;
|
|
14
|
-
Url?: TypesElement<
|
|
15
|
-
Str?: TypesElement<
|
|
16
|
-
Undefined?: TypesElement<
|
|
17
|
-
Null?: TypesElement<
|
|
18
|
-
True?: TypesElement<
|
|
19
|
-
False?: TypesElement<
|
|
20
|
-
Date?: TypesElement<
|
|
21
|
-
Float?: TypesElement<
|
|
22
|
-
Set?: TypesElement<
|
|
23
|
-
Int?: TypesElement<
|
|
24
|
-
Map?: TypesElement<
|
|
25
|
-
Nan?: TypesElement<
|
|
26
|
-
Bigint?: TypesElement<
|
|
15
|
+
Url?: TypesElement<T>;
|
|
16
|
+
Str?: TypesElement<T>;
|
|
17
|
+
Undefined?: TypesElement<T>;
|
|
18
|
+
Null?: TypesElement<T>;
|
|
19
|
+
True?: TypesElement<T>;
|
|
20
|
+
False?: TypesElement<T>;
|
|
21
|
+
Date?: TypesElement<T>;
|
|
22
|
+
Float?: TypesElement<T>;
|
|
23
|
+
Set?: TypesElement<T>;
|
|
24
|
+
Int?: TypesElement<T>;
|
|
25
|
+
Map?: TypesElement<T>;
|
|
26
|
+
Nan?: TypesElement<T>;
|
|
27
|
+
Bigint?: TypesElement<T>;
|
|
27
28
|
};
|
|
28
|
-
type Dispatch = React.Dispatch<InitialTypesState
|
|
29
|
-
export declare const useTypesStore: () => InitialTypesState
|
|
29
|
+
type Dispatch<T extends TagType> = React.Dispatch<InitialTypesState<T>>;
|
|
30
|
+
export declare const useTypesStore: () => InitialTypesState<TagType>;
|
|
30
31
|
export declare function useTypes(): [{
|
|
31
32
|
displayDataTypes?: boolean | undefined;
|
|
32
33
|
Url?: TypesElement<TagType> | undefined;
|
|
@@ -42,11 +43,14 @@ export declare function useTypes(): [{
|
|
|
42
43
|
Map?: TypesElement<TagType> | undefined;
|
|
43
44
|
Nan?: TypesElement<TagType> | undefined;
|
|
44
45
|
Bigint?: TypesElement<TagType> | undefined;
|
|
45
|
-
}, import("react").Dispatch<InitialTypesState
|
|
46
|
-
export declare function useTypesDispatch(): Dispatch
|
|
47
|
-
interface TypesProps {
|
|
48
|
-
initial: InitialTypesState
|
|
49
|
-
dispatch: Dispatch
|
|
46
|
+
}, import("react").Dispatch<InitialTypesState<TagType>>];
|
|
47
|
+
export declare function useTypesDispatch(): Dispatch<TagType>;
|
|
48
|
+
interface TypesProps<T extends TagType> {
|
|
49
|
+
initial: InitialTypesState<T>;
|
|
50
|
+
dispatch: Dispatch<TagType>;
|
|
51
|
+
}
|
|
52
|
+
export declare function Types<T extends TagType>({ initial, dispatch, children }: PropsWithChildren<TypesProps<T>>): import("react/jsx-runtime").JSX.Element;
|
|
53
|
+
export declare namespace Types {
|
|
54
|
+
var displayName: string;
|
|
50
55
|
}
|
|
51
|
-
export declare const Types: FC<PropsWithChildren<TypesProps>>;
|
|
52
56
|
export {};
|
package/esm/store/Types.js
CHANGED
|
@@ -40,7 +40,8 @@ var initialState = {
|
|
|
40
40
|
},
|
|
41
41
|
Map: {
|
|
42
42
|
style: {
|
|
43
|
-
color: 'var(--w-rjv-type-map-color, #268bd2)'
|
|
43
|
+
color: 'var(--w-rjv-type-map-color, #268bd2)',
|
|
44
|
+
marginRight: 3
|
|
44
45
|
},
|
|
45
46
|
as: 'span',
|
|
46
47
|
'data-type': 'map',
|
|
@@ -76,7 +77,8 @@ var initialState = {
|
|
|
76
77
|
},
|
|
77
78
|
Set: {
|
|
78
79
|
style: {
|
|
79
|
-
color: 'var(--w-rjv-type-set-color, #268bd2)'
|
|
80
|
+
color: 'var(--w-rjv-type-set-color, #268bd2)',
|
|
81
|
+
marginRight: 3
|
|
80
82
|
},
|
|
81
83
|
as: 'span',
|
|
82
84
|
'data-type': 'set',
|
|
@@ -133,7 +135,7 @@ export function useTypes() {
|
|
|
133
135
|
export function useTypesDispatch() {
|
|
134
136
|
return useContext(DispatchTypes);
|
|
135
137
|
}
|
|
136
|
-
export
|
|
138
|
+
export function Types(_ref) {
|
|
137
139
|
var {
|
|
138
140
|
initial,
|
|
139
141
|
dispatch,
|
|
@@ -146,5 +148,5 @@ export var Types = _ref => {
|
|
|
146
148
|
children: children
|
|
147
149
|
})
|
|
148
150
|
});
|
|
149
|
-
}
|
|
151
|
+
}
|
|
150
152
|
Types.displayName = 'JVR.Types';
|
package/esm/store.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { PropsWithChildren } from 'react';
|
|
2
2
|
import { JsonViewProps } from './';
|
|
3
|
-
import { type InitialTypesState } from './store/Types';
|
|
3
|
+
import { type InitialTypesState, type TagType } from './store/Types';
|
|
4
4
|
export type BlockTagType = keyof JSX.IntrinsicElements;
|
|
5
5
|
export interface InitialState<T extends object> {
|
|
6
6
|
value?: object;
|
|
@@ -20,10 +20,13 @@ export declare const Context: React.Context<InitialState<object>>;
|
|
|
20
20
|
export declare function reducer(state: InitialState<object>, action: InitialState<object>): InitialState<object>;
|
|
21
21
|
export declare const useStore: () => InitialState<object>;
|
|
22
22
|
export declare const useDispatchStore: () => Dispatch;
|
|
23
|
-
export interface ProviderProps {
|
|
23
|
+
export interface ProviderProps<T extends TagType> {
|
|
24
24
|
initialState?: InitialState<object>;
|
|
25
|
-
initialTypes?: InitialTypesState
|
|
25
|
+
initialTypes?: InitialTypesState<T>;
|
|
26
26
|
}
|
|
27
|
-
export declare const Provider:
|
|
27
|
+
export declare const Provider: {
|
|
28
|
+
<T extends TagType>({ children, initialState: init, initialTypes, }: PropsWithChildren<ProviderProps<T>>): import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
displayName: string;
|
|
30
|
+
};
|
|
28
31
|
export declare function useDispatch(): Dispatch;
|
|
29
32
|
export {};
|
package/esm/symbol/Arrow.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const Arrow: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const BraceLeft: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const BraceRight: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const BracketsLeft: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const BracketsRight: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
package/esm/symbol/Colon.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const Colon: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
package/esm/symbol/Quote.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type SymbolsElement } from '../store/Symbols';
|
|
2
2
|
import { type TagType } from '../store/Types';
|
|
3
3
|
export declare const Quote: {
|
|
4
|
-
(props: SymbolsElement<
|
|
4
|
+
<K extends TagType = "span">(props: SymbolsElement<K>): null;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|