From 25f5205f78663a37610295268bf3f7c669592681 Mon Sep 17 00:00:00 2001 From: Ashwin Menkudle Date: Sat, 20 Feb 2021 12:50:06 +0530 Subject: [PATCH 1/7] fix: missing quotesOnKeys props in TS typings missing quotesOnKeys props in TS typings --- index.d.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/index.d.ts b/index.d.ts index 4a91dc29..c1a2ce31 100644 --- a/index.d.ts +++ b/index.d.ts @@ -87,6 +87,12 @@ export interface ReactJsonViewProps { * Default: true */ displayDataTypes?: boolean; + /** + * set to false to remove quotes from keys (eg. "name": vs. name:) + * + * Default: true + */ + quotesOnKeys?: boolean; /** * When a callback function is passed in, edit functionality is enabled. * The callback is invoked before edits are completed. Returning false From 51890fa751cc574330e79e4ed95265fd69830a1c Mon Sep 17 00:00:00 2001 From: superfaz <16510828+superfaz@users.noreply.github.com> Date: Tue, 23 Feb 2021 00:47:20 +0100 Subject: [PATCH 2/7] Fix display issue for objects with length property --- src/js/components/JsonViewer.js | 3 ++- test/tests/js/Index-test.js | 13 +++++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/src/js/components/JsonViewer.js b/src/js/components/JsonViewer.js index 9e6b2eac..07f09a7e 100644 --- a/src/js/components/JsonViewer.js +++ b/src/js/components/JsonViewer.js @@ -8,9 +8,10 @@ export default class extends React.PureComponent { const namespace = [props.name]; let ObjectComponent = JsonObject; + const size = Array.isArray(props.src) ? props.src.length: Object.keys(props.src).length; if ( props.groupArraysAfterLength && - props.src.length > props.groupArraysAfterLength + size > props.groupArraysAfterLength ) { ObjectComponent = ArrayGroup; } diff --git a/test/tests/js/Index-test.js b/test/tests/js/Index-test.js index d0a8bbff..046bf7f3 100644 --- a/test/tests/js/Index-test.js +++ b/test/tests/js/Index-test.js @@ -117,4 +117,17 @@ describe("", function() { ) expect(wrapper.find(".array-group")).to.have.length(3) }) + + it("length is correct even if an object has a length property", function () { + const wrapper = render( + + ) + expect(wrapper.find(".object-size")).to.have.length(1) + }) }) From f4fe4080d25adec5ea656446e3511ef8f99fd757 Mon Sep 17 00:00:00 2001 From: superfaz <16510828+superfaz@users.noreply.github.com> Date: Tue, 23 Feb 2021 01:05:00 +0100 Subject: [PATCH 3/7] Update JsonViewer.js Fix code style --- src/js/components/JsonViewer.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/js/components/JsonViewer.js b/src/js/components/JsonViewer.js index 07f09a7e..f68a4ecf 100644 --- a/src/js/components/JsonViewer.js +++ b/src/js/components/JsonViewer.js @@ -8,7 +8,9 @@ export default class extends React.PureComponent { const namespace = [props.name]; let ObjectComponent = JsonObject; - const size = Array.isArray(props.src) ? props.src.length: Object.keys(props.src).length; + const size = Array.isArray(props.src) + ? props.src.length + : Object.keys(props.src).length; if ( props.groupArraysAfterLength && size > props.groupArraysAfterLength From 7d4c330c5c2a4857ee1245008588d560690b1de0 Mon Sep 17 00:00:00 2001 From: mac-s-g Date: Sun, 7 Mar 2021 17:46:23 -0800 Subject: [PATCH 4/7] upgrade react-textarea-autosize dependency to 8.3.2 --- package-lock.json | 66 ++++++++++++++++++++--------- package.json | 4 +- src/js/components/VariableEditor.js | 1 + src/js/themes/getStyle.js | 1 - src/js/themes/styleConstants.js | 1 - 5 files changed, 50 insertions(+), 23 deletions(-) diff --git a/package-lock.json b/package-lock.json index cce010cd..9589552f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "react-json-view", - "version": "1.21.0", + "version": "1.21.1", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -1208,7 +1208,6 @@ "version": "7.12.13", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.12.13.tgz", "integrity": "sha512-8+3UMPBrjFa/6TtKi/7sehPKqfAm4g6K+YQjyyFOLUTxzOngcRZTlAVY8sc2CORJYqdHQY8gRPHmn+qo15rCBw==", - "dev": true, "requires": { "regenerator-runtime": "^0.13.4" } @@ -9409,9 +9408,9 @@ "dev": true }, "immer": { - "version": "7.0.9", - "resolved": "https://registry.npmjs.org/immer/-/immer-7.0.9.tgz", - "integrity": "sha512-Vs/gxoM4DqNAYR7pugIxi0Xc8XAun/uy7AQu4fLLqaTBHxjOP9pJ266Q9MWA/ly4z6rAFZbvViOtihxUZ7O28A==", + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/immer/-/immer-8.0.1.tgz", + "integrity": "sha512-aqXhGP7//Gui2+UrEtvxZxSquQVXTpZ7KDxfCcKAF3Vysvw0CViVaW9RZ1j1xlIYqaaaipBoqdqeibkc18PNvA==", "dev": true }, "import-cwd": { @@ -14010,9 +14009,9 @@ } }, "open": { - "version": "7.4.0", - "resolved": "https://registry.npmjs.org/open/-/open-7.4.0.tgz", - "integrity": "sha512-PGoBCX/lclIWlpS/R2PQuIR4NJoXh6X5AwVzE7WXnWRGvHg7+4TBCgsujUgiPpm0K1y4qvQeWnCWVTpTKZBtvA==", + "version": "7.4.2", + "resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz", + "integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==", "dev": true, "requires": { "is-docker": "^2.0.0", @@ -15741,6 +15740,7 @@ "version": "15.7.2", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz", "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==", + "dev": true, "requires": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", @@ -16010,9 +16010,9 @@ } }, "react-dev-utils": { - "version": "11.0.2", - "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.2.tgz", - "integrity": "sha512-xG7GlMoYkrgc2M1kDCHKRywXMDbFnjOB+/VzpytQyYBusEzR8NlGTMmUbvN86k94yyKu5XReHB8eZC2JZrNchQ==", + "version": "11.0.3", + "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.3.tgz", + "integrity": "sha512-4lEA5gF4OHrcJLMUV1t+4XbNDiJbsAWCH5Z2uqlTqW6dD7Cf5nEASkeXrCI/Mz83sI2o527oBIFKVMXtRf1Vtg==", "dev": true, "requires": { "@babel/code-frame": "7.10.4", @@ -16028,7 +16028,7 @@ "global-modules": "2.0.0", "globby": "11.0.1", "gzip-size": "5.1.1", - "immer": "7.0.9", + "immer": "8.0.1", "is-root": "2.1.0", "loader-utils": "2.0.0", "open": "^7.0.2", @@ -16207,7 +16207,8 @@ "react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "dev": true }, "react-lifecycles-compat": { "version": "3.0.4", @@ -16945,11 +16946,13 @@ } }, "react-textarea-autosize": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-6.1.0.tgz", - "integrity": "sha512-F6bI1dgib6fSvG8so1HuArPUv+iVEfPliuLWusLF+gAKz0FbB4jLrWUrTAeq1afnPT2c9toEZYUdz/y1uKMy4A==", + "version": "8.3.2", + "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.3.2.tgz", + "integrity": "sha512-JrMWVgQSaExQByP3ggI1eA8zF4mF0+ddVuX7acUeK2V7bmrpjVOY72vmLz2IXFJSAXoY3D80nEzrn0GWajWK3Q==", "requires": { - "prop-types": "^15.6.0" + "@babel/runtime": "^7.10.2", + "use-composed-ref": "^1.0.0", + "use-latest": "^1.0.0" } }, "read-pkg": { @@ -17057,8 +17060,7 @@ "regenerator-runtime": { "version": "0.13.7", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz", - "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==", - "dev": true + "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==" }, "regenerator-transform": { "version": "0.14.5", @@ -19640,6 +19642,11 @@ "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==", "dev": true }, + "ts-essentials": { + "version": "2.0.12", + "resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-2.0.12.tgz", + "integrity": "sha512-3IVX4nI6B5cc31/GFFE+i8ey/N2eA0CZDbo6n0yrz0zDX8ZJ8djmU1p+XRz7G3is0F3bB3pu2pAroFdAWQKU3w==" + }, "ts-pnp": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/ts-pnp/-/ts-pnp-1.2.0.tgz", @@ -20008,6 +20015,27 @@ "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==", "dev": true }, + "use-composed-ref": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/use-composed-ref/-/use-composed-ref-1.1.0.tgz", + "integrity": "sha512-my1lNHGWsSDAhhVAT4MKs6IjBUtG6ZG11uUqexPH9PptiIZDQOzaF4f5tEbJ2+7qvNbtXNBbU3SfmN+fXlWDhg==", + "requires": { + "ts-essentials": "^2.0.3" + } + }, + "use-isomorphic-layout-effect": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.1.tgz", + "integrity": "sha512-L7Evj8FGcwo/wpbv/qvSfrkHFtOpCzvM5yl2KVyDJoylVuSvzphiiasmjgQPttIGBAy2WKiBNR98q8w7PiNgKQ==" + }, + "use-latest": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/use-latest/-/use-latest-1.2.0.tgz", + "integrity": "sha512-d2TEuG6nSLKQLAfW3By8mKr8HurOlTkul0sOpxbClIv4SQ4iOd7BYr7VIzdbktUCnv7dua/60xzd8igMU6jmyw==", + "requires": { + "use-isomorphic-layout-effect": "^1.0.0" + } + }, "util": { "version": "0.11.1", "resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz", diff --git a/package.json b/package.json index f3d02663..29af99d3 100644 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "react-json-view", "description": "Interactive react component for displaying javascript arrays and JSON objects.", - "version": "1.21.1", + "version": "1.21.2", "main": "dist/main.js", "dependencies": { "flux": "^4.0.1", "react-base16-styling": "^0.6.0", "react-lifecycles-compat": "^3.0.4", - "react-textarea-autosize": "^6.1.0" + "react-textarea-autosize": "^8.3.2" }, "devDependencies": { "@babel/eslint-parser": "^7.12.1", diff --git a/src/js/components/VariableEditor.js b/src/js/components/VariableEditor.js index 834ae55f..a78aab4e 100644 --- a/src/js/components/VariableEditor.js +++ b/src/js/components/VariableEditor.js @@ -293,6 +293,7 @@ class VariableEditor extends React.PureComponent { e.stopPropagation(); }} placeholder="update this value" + minRows={2} {...Theme(theme, 'edit-input')} />
diff --git a/src/js/themes/getStyle.js b/src/js/themes/getStyle.js index b00afed3..2ee98f7b 100644 --- a/src/js/themes/getStyle.js +++ b/src/js/themes/getStyle.js @@ -292,7 +292,6 @@ const getDefaultThemeStyling = theme => { }, 'edit-input': { display: 'inline-block', - minHeight: constants.editInputHeight, minWidth: constants.editInputMinWidth, borderRadius: constants.editInputBorderRadius, backgroundColor: colors.editVariable.background, diff --git a/src/js/themes/styleConstants.js b/src/js/themes/styleConstants.js index 0754d3ac..5182417f 100644 --- a/src/js/themes/styleConstants.js +++ b/src/js/themes/styleConstants.js @@ -69,7 +69,6 @@ export default { tooltipPadding: '4px', - editInputHeight: '25px', editInputMinWidth: '130px', editInputBorderRadius: '2px', editInputPadding: '5px', From 7f3f4807a27998f46dcf1631c3165f6f379307b2 Mon Sep 17 00:00:00 2001 From: Bob Thomas Date: Mon, 8 Mar 2021 16:35:01 -0500 Subject: [PATCH 5/7] Fix "Invalid array length" error If an object has more keys than `groupArraysAfterLength`, then it will be rendered as an Array due to the changes in #336 Fix this logic so only arrays are rendered as arrays. Fixes #340 --- src/js/components/JsonViewer.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/js/components/JsonViewer.js b/src/js/components/JsonViewer.js index f68a4ecf..5c0278f8 100644 --- a/src/js/components/JsonViewer.js +++ b/src/js/components/JsonViewer.js @@ -8,12 +8,10 @@ export default class extends React.PureComponent { const namespace = [props.name]; let ObjectComponent = JsonObject; - const size = Array.isArray(props.src) - ? props.src.length - : Object.keys(props.src).length; if ( + Array.isArray(props.src) && props.groupArraysAfterLength && - size > props.groupArraysAfterLength + props.src.length > props.groupArraysAfterLength ) { ObjectComponent = ArrayGroup; } From 8f36a3438ab4a9929f1411effe9f05406a90a97e Mon Sep 17 00:00:00 2001 From: mac-s-g Date: Mon, 8 Mar 2021 19:05:54 -0800 Subject: [PATCH 6/7] bump patch version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 29af99d3..36d66aad 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "react-json-view", "description": "Interactive react component for displaying javascript arrays and JSON objects.", - "version": "1.21.2", + "version": "1.21.3", "main": "dist/main.js", "dependencies": { "flux": "^4.0.1", From 443465ebdaa236da8c5d0e7bda2b7e57ca5d5a7b Mon Sep 17 00:00:00 2001 From: Mac Gainor Date: Fri, 30 Jun 2023 13:12:48 -0700 Subject: [PATCH 7/7] deprecation notice --- README.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/README.md b/README.md index 20ad1189..f49fb1c4 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,11 @@ [![npm](https://img.shields.io/npm/v/react-json-view.svg)](https://www.npmjs.com/package/react-json-view) [![npm](https://img.shields.io/npm/l/react-json-view.svg)](https://github.com/mac-s-g/react-json-view/blob/master/LISCENSE) [![Build Status](https://travis-ci.org/mac-s-g/react-json-view.svg)](https://travis-ci.org/mac-s-g/react-json-view) [![Coverage Status](https://coveralls.io/repos/github/mac-s-g/react-json-view/badge.svg?branch=master)](https://coveralls.io/github/mac-s-g/react-json-view?branch=master) +### ⚠️ This project is no longer being maintained ⚠️ +Sorry for the silence, ya'll. I'm no longer able to invest the time necessary to keep this project maintained. It's been a great experience working with everyone. +based on recent discussion, it looks like [@microlink/react-json-view](https://github.com/microlinkhq/react-json-view) is a good candidate for replacement. +Thank you to RJV users and everyone who contributed to this project. ❤️ + # react-json-view RJV is a React component for displaying and editing javascript **arrays** and **JSON objects**.