b-gran / object-editor-react Goto Github PK

Thank you.

Fisrt of all, object-editor-react is a great components!

But, object-editor-react need to tree shaking.

Hi I have an issue, can't resolve symbols by

import { SchemaTypes } from 'object-editor-react';
import { ArrayEditor, ObjectEditor } from 'object-editor-react';

I figure it would be easy enough to have a window.object that populates Editor[elements] and is modified in response to onUpdateElement, onRemoveElement, and onAddElement. That object could then be updated on the window after stringification.

It may then make it easy to port to some other backing store.

Hello,

I've been using this library as a crux piece for a tool i've been working on.

When running in my dev electron environment everything works exactly as expected; however, upon packaging my application using react-scripts build to create a production build it seems the styling is completely broken.

Here is my package.json

{
  "name": "nhmcs-tool",
  "version": "0.1.0",
  "build": {
    "files": [
      "build/**/*",
      "node_modules/**/*"
    ],
    "directories": {
      "buildResources": "assets"
    }
  },
  "homepage": "./",
  "main": "public/electron.js",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^4.5.0",
    "@material-ui/icons": "^4.4.3",
    "@rescripts/cli": "0.0.12",
    "material-ui-icons": "^1.0.0-beta.36",
    "electron-is-dev": "^1.1.0",
    "node-uuid": "^1.4.8",
    "object-editor-react": "^1.0.6",
    "react": "^16.10.1",
    "react-dom": "^16.10.1",
    "react-scripts": "3.2.0",
    "aws-sdk": "^2.546.0",
    "typescript": "^3.6.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "electron-dev": "concurrently \"npm start\" \"electron .\"",
    "postinstall": "electron-builder install-app-deps",
    "preelectron-pack": "npm build",
    "electron-pack": "npm run build -mw",
    "electron-exec-pack": "electron-packager ./build nhmcstool --platform=win32 --arch=x64",
    "dist": "electron-builder"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "concurrently": "^5.0.0",
    "electron": "^6.0.11",
    "rescripts": "0.0.1-security",
    "electron-builder": "^21.2.0",
    "electron-packager": "^14.0.6"
  }
}

/src/index.js looks like it is no longer needed in this project

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Rate-Limited

These updates are currently rate-limited. Click on a checkbox below to force their creation now.

• Update dependency @babel/core to v7.24.4
• Update dependency babel-eslint to v10.1.0
• Update dependency babel-loader to v8.3.0
• Update dependency classnames to v2.5.1
• Update dependency eslint-plugin-jsx-a11y to v6.8.0
• Update dependency eslint-plugin-react to v7.34.1
• Update dependency mini-css-extract-plugin to v0.12.0
• Update dependency pnp-webpack-plugin to v1.7.0
• Update dependency postcss-flexbugs-fixes to v4.2.1
• Update dependency prop-types to v15.8.1
• Update dependency ramda to ^0.29.0
• Update dependency resolve to v1.22.8
• Update dependency style-loader to v1.3.0
• Update dependency webpack to v4.47.0
• Update material-ui monorepo to v4.12.4 (@material-ui/core, @material-ui/icons)
• Update react monorepo (react, react-addons-update, react-dom)
• Update dependency @svgr/webpack to v8
• Update dependency babel-loader to v9
• Update dependency babel-preset-react-app to v10
• Update dependency camelcase to v8
• Update dependency css-loader to v7
• Update dependency dotenv to v16
• Update dependency dotenv-expand to v11
• Update dependency eslint to v9
• Update dependency eslint-config-react-app to v7
• Update dependency eslint-loader to v4
• Update dependency eslint-plugin-flowtype to v8
• Update dependency file-loader to v6
• Update dependency fs-extra to v11
• Update dependency glamorous to v5
• Update dependency html-webpack-plugin to v5
• Update dependency is-wsl to v3
• Update dependency jest-environment-jsdom-fourteen to v1
• Update dependency jest-watch-typeahead to v2
• Update dependency mini-css-extract-plugin to v2
• Update dependency optimize-css-assets-webpack-plugin to v6
• Update dependency postcss-flexbugs-fixes to v5
• Update dependency postcss-loader to v8
• Update dependency postcss-normalize to v10
• Update dependency postcss-preset-env to v9
• Update dependency postcss-safe-parser to v7
• Update dependency react-app-polyfill to v3
• Update dependency resolve-url-loader to v5
• Update dependency sass-loader to v14
• Update dependency semver to v7
• Update dependency style-loader to v4
• Update dependency terser-webpack-plugin to v5
• Update dependency url-loader to v4
• Update dependency webpack to v5
• Update dependency webpack-dev-server to v5
• Update dependency webpack-manifest-plugin to v5
• Update dependency workbox-webpack-plugin to v7
• Update jest monorepo to v29 (major) (babel-jest, jest, jest-resolve)
• Update typescript-eslint monorepo to v7 (major) (@typescript-eslint/eslint-plugin, @typescript-eslint/parser)
• 🔐 Create all rate-limited PRs at once 🔐

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• Replace dependency @material-ui/core with @mui/material
• Replace dependency @material-ui/icons with @mui/icons-material
• Replace dependency babel-eslint with @babel/eslint-parser
• Update dependency optimize-css-assets-webpack-plugin to v5.0.8
• Update dependency postcss-preset-env to v6.7.2
• Update dependency postcss-safe-parser to v4.0.2
• Update dependency react-app-polyfill to v1.0.6
• Update dependency semver to v6.3.1
• Update dependency terser-webpack-plugin to v1.4.5
• Update react monorepo (major) (eslint-plugin-react-hooks, react, react-dom)
• Click on this checkbox to rebase all open PRs at once

Ignored or Blocked

These are blocked by an existing closed PR and will not be recreated unless you click a checkbox below.

• Update dependency react-dev-utils to v11 [SECURITY]
• Update dependency babel-plugin-named-asset-import to v0.3.8
• Update dependency eslint-loader to v3.0.4
• Update dependency resolve-url-loader to v3.1.5
• Update dependency babel-preset-react-app to v9.1.2
• Update dependency case-sensitive-paths-webpack-plugin to v2.4.0
• Update dependency eslint to v6.8.0
• Update dependency eslint-config-react-app to v5.2.1
• Update dependency eslint-plugin-import to v2.29.1
• Update dependency html-webpack-plugin to v4.5.2
• Update dependency jest-watch-typeahead to v0.6.5
• Update dependency sass-loader to v7.3.1
• Update dependency ts-pnp to v1.2.0
• Update dependency url-loader to v2.3.0
• Update dependency webpack-dev-server to v3.11.3
• Update dependency webpack-manifest-plugin to v2.2.0
• Update typescript-eslint monorepo to v2.34.0 (@typescript-eslint/eslint-plugin, @typescript-eslint/parser)

Detected dependencies

• Check this box to trigger a request for Renovate to run again on this repository

Desired:
const schema = { identifier: Schema.SchemaTypes.number(), notes: Schema.SchemaTypes.string(), myArray: Schema.SchemaTypes.arrayOf(Schema.SchemaTypes.string())(), };
What goes wrong? The ElementRow does not show any input elements other than add/trash.

Contrast:
const schema = { identifier: Schema.SchemaTypes.number(), notes: Schema.SchemaTypes.string(), myArray: Schema.SchemaTypes.arrayOf({workaround: Schema.SchemaTypes.string()})(), };
Why does this work? props.type is used in ElementRow as _.map(Object.keys(props.type), ...). This does not work well when props.type is a function with no keys

Hey there,

Thanks for your contribution to the open source world, this components look pretty cool.
Is it possible to pass rowsPerPage as props? Five rows is really not enough for our project...

Kind regards from Würzburg
Yorick

I believe this is the same or closely related to issue #6 . That issue was closed but I am not sure why.

Consider the schema:

const schema = {
  publicUserProperties: SchemaTypes.arrayOf({
    nested: SchemaTypes.string()
  }),
      (and a few more...)
}

and the object:

{
  "publicUserProperties": [
    "username",
    "givenname",
    "surname",
      (and a few more...)
  ],
}

This gives me the GUI:

Instead of seeing the strings in the object, I see whitespace. How can I get the strings to appear correctly in the GUI?

Test:
/src/test/index.js Line 28, change 'foo' to 'type'
Open demo page and edit 'test' field.

There is an exception on line 330 of Editor.js:
(this.props.type.type && this.props.type.type.match(/array/) !== null) ||
where this.props.type.type.match is not a function.

If you are attaching 'type' for schema checking/validation, perhaps it could be renamed to something a schema would not be likely to contain like ________type 😎

At

'row' is used in bootstrap and breaks table alignment.

I propose we either use less classnames or use more unique classnames. Additionally the out-of-box styles play very poorly with bootstrap.

Is it possible to:

1. Change the title "Array" at the top left of the ArrayEditor component?
   1.1) Similarly change the adding button text from "NEW" to something else like "Add"?
2. Remove the Question mark icons next to each title/label in the toolbar/table?

Context: Using React with Typescript

Starting this thread here as the discussions feature hasn't been enabled for this repo yet.

Looking for ^14.0.0
npm ERR! No compatible version found: react-addons-update@^14.0.0
npm ERR! Valid install targets:
npm ERR! 15.3.2, 15.3.2-rc.1, 15.3.1, 15.3.1-rc.2, 15.3.1-rc.1, 15.3.0, 15.3.0-rc.3, 15.3.0-rc.2, 15
.3.0-rc.1, 15.2.1, 15.2.0, 15.2.0-rc.2, 15.2.0-rc.1, 15.1.0, 15.1.0-alpha.1, 15.0.3-alpha.2, 15.0.3-
alpha.1, 15.0.2, 15.0.2-alpha.4, 15.0.2-alpha.3, 15.0.2-alpha.2, 15.0.2-alpha.1, 15.0.1, 15.0.0, 15.
0.0-rc.2, 15.0.0-rc.1, 0.15.0-alpha.1, 0.14.8, 0.14.7, 0.14.6, 0.14.5, 0.14.4, 0.14.3, 0.14.2, 0.14.
1, 0.14.0, 0.14.0-rc1, 0.14.0-beta3, 0.14.0-beta2, 0.14.0-beta1

npm ERR! node v4.4.6
npm ERR! npm v3.10.7

I first create a default react project using npx create-react-app
then
I install the object-editor-react via npm
then
I copy the src directory (by downloading it from git), overwriting my src directory

WHen I try to run npm start, I get:

Failed to compile

src/util.js
Line 54:25: React Hook "R.useWith" cannot be called at the top level. React Hooks must be called in a React function component or a custom React Hook function react-hooks/rules-of-hooks

Search for the keywords to learn more about each error.
"

It appears that the utils.js has a fundamental issue that violates this 'React Hook' principle.
Since I am not an expert, I don't know yet how to go around this issue.

Any idea what I am doing wrong?

Hi,
Is there any way to generate the schema used by this editor from a valid JSON schema?
Thanks
Russell

NPMjs.com reports this package is at version 1.0.0 and when I ran npm install --save, it only came with package.json. 🐛 🍉