From 41b03db92fe4f1783243421a5d3f2a241ae0431f Mon Sep 17 00:00:00 2001 From: Prev Wong Date: Tue, 14 Jan 2020 22:16:51 +0800 Subject: [PATCH 1/7] Update feature_request.md --- .github/ISSUE_TEMPLATE/feature_request.md | 9 --------- 1 file changed, 9 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md index b75a8b62b..779e392d6 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -7,15 +7,6 @@ assignees: '' --- -**Is your feature request related to the core ?** - -Remember that Craft.js is an abstraction; implementation-related features are not part of the core. - -"Implement API to handle drag preview", "Add editor action to copy elements", "Show drag preview when dragging elements" are examples of feature requests that are related to the core. - -"Implement a file uploader", "Add a gallery component", "Add a layers panel", "Create tooltip component" are examples of feature requests that are **not** related to the core. We could still consider working on some of them as separate packages (eg: [@craftjs/layers](https://github.com/prevwong/craft.js/tree/master/packages/layers)). However, please understand that these will not be top priority at the moment. - - **Is your feature request related to a problem? Please describe.** A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] From cf5392b5d990c299b9c2c154248eec83e78dc663 Mon Sep 17 00:00:00 2001 From: Prev Wong Date: Wed, 15 Jan 2020 02:55:55 +0800 Subject: [PATCH 2/7] fix typo in NodeHelpers --- packages/docs/docs/api/NodeHelpers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docs/docs/api/NodeHelpers.md b/packages/docs/docs/api/NodeHelpers.md index 5e268e72d..e5838d3a5 100644 --- a/packages/docs/docs/api/NodeHelpers.md +++ b/packages/docs/docs/api/NodeHelpers.md @@ -15,7 +15,7 @@ import {useEditor} from "@craftjs/core"; const TextComponent = () => { const { id } = useNode(); - const { query: {is} } = useEditor(); + const { query: {node} } = useEditor(); const isRoot = node(id).Root(), isDraggable = node(id).Draggable(); ... From 3c1aa997151da02e7bc6f156bb61b52d7a7bbf8a Mon Sep 17 00:00:00 2001 From: MO Date: Wed, 15 Jan 2020 16:25:58 +0800 Subject: [PATCH 3/7] chore: add missing dependencies in example --- packages/examples/basic/package.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/examples/basic/package.json b/packages/examples/basic/package.json index 9d3e597c4..635488257 100644 --- a/packages/examples/basic/package.json +++ b/packages/examples/basic/package.json @@ -23,6 +23,8 @@ "clean": "rimraf lib .next out dist" }, "devDependencies": { - "@zeit/next-css": "^1.0.1" + "@zeit/next-css": "^1.0.1", + "cross-env": "^6.0.3", + "next-compose-plugins": "^2.2.0" } } From b7ddab297ebee84859ca04a1168d37e8c4eb0b54 Mon Sep 17 00:00:00 2001 From: Prev Wong Date: Fri, 17 Jan 2020 12:47:43 +0800 Subject: [PATCH 4/7] docs: fix typo in setCustom --- packages/docs/docs/api/useEditor.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docs/docs/api/useEditor.md b/packages/docs/docs/api/useEditor.md index 1e6d7aebb..f1d17b716 100644 --- a/packages/docs/docs/api/useEditor.md +++ b/packages/docs/docs/api/useEditor.md @@ -40,8 +40,8 @@ const { connectors, actions, query, ...collected } = useEditor(collector); ["deserialize", "() => String", "Recreate Nodes from JSON. This will clear all the current Nodes in the editor state with the recreated Nodes"], ["move", "(nodeId: NodeId, targetParentId: NodeId, index: number) => void", "Move a Node to the specified parent Node at the given index."], ["setProp", "(nodeId: NodeId, update: (props: Object) => void) => void", "Manipulate the props of the given Node"], + ["setCustom", "(nodeId: NodeId, update: (custom: Object) => void) => void", "Manipulate the custom values of the given Node"], ["setHidden", "(nodeId: NodeId, bool: boolean) => void", "When set to true, the User Component of the specified Node will be hidden, but not removed"], - ["setCustom", "(nodeId: NodeId, custom: (custom: Object) => void", "Update the given Node's custom properties"], ["setOptions", "(options: Object) => void", "Update the editor's options. The options object passed is the same as the <Editor /> props."] ]], ["query", "Query", [ From aefe7b359f40f5caed9ae07f8702d3b7696ff5ae Mon Sep 17 00:00:00 2001 From: Prev Wong Date: Fri, 17 Jan 2020 18:47:09 +0800 Subject: [PATCH 5/7] chore: add typescript to devDependencies --- packages/examples/landing/package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/examples/landing/package.json b/packages/examples/landing/package.json index cea2116aa..9ebc35654 100644 --- a/packages/examples/landing/package.json +++ b/packages/examples/landing/package.json @@ -45,6 +45,7 @@ "next-compose-plugins": "^2.2.0", "postcss-import": "^12.0.1", "postcss-preset-env": "^6.7.0", - "tailwindcss": "^1.1.3" + "tailwindcss": "^1.1.3", + "typescript": "^3.7.5" } } From 2d2297d1e8065abfde3f4d2dd77e8566128b3603 Mon Sep 17 00:00:00 2001 From: Prev Wong Date: Fri, 17 Jan 2020 18:47:37 +0800 Subject: [PATCH 6/7] readme: yarn => npm --- packages/examples/basic/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/examples/basic/README.md b/packages/examples/basic/README.md index baa80d2f7..a5417b299 100644 --- a/packages/examples/basic/README.md +++ b/packages/examples/basic/README.md @@ -8,6 +8,6 @@ Check out the live demo [here](https://craft.js.org/examples/basic/) ```bash > git clone https://github.com/prevwong/craft.js/ > cd craft.js/packages/examples/basic -> yarn install -> yarn dev +> npm install +> npm dev ``` From bf32bffdb5fc7eb475a3c55ef05b08a89dd80bd7 Mon Sep 17 00:00:00 2001 From: Shingo Yamazaki Date: Thu, 30 Jan 2020 00:51:32 +0900 Subject: [PATCH 7/7] docs: fix typo in Basic Tutorial --- packages/docs/docs/guides/basic-tutorial.md | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/packages/docs/docs/guides/basic-tutorial.md b/packages/docs/docs/guides/basic-tutorial.md index 1cf4dc956..8e45b008f 100755 --- a/packages/docs/docs/guides/basic-tutorial.md +++ b/packages/docs/docs/guides/basic-tutorial.md @@ -32,7 +32,7 @@ With Craft.js you decide how your editor should look and function. So, let's bui To make our lives easier, we'll use some external packages for designing our user interfaces. ```bash -yarn add material-ui react-contenteditable material-ui-color-picker +yarn add @material-ui/core react-contenteditable material-ui-color-picker ``` ### User Components @@ -42,7 +42,6 @@ Let's first create the User Components - the components that our end users will ```jsx // components/user/Text.js import React from "react"; -import { Typography } from "@material-ui/core"; export const Text = ({text, fontSize}) => { return ( @@ -59,9 +58,9 @@ export const Text = ({text, fontSize}) => { import React from "react"; import {Button as MaterialButton} from "@material-ui/core"; -export const Button = ({size, variant, primary, children}) => { +export const Button = ({size, variant, color, children}) => { return ( - + {children} ) @@ -73,6 +72,9 @@ We will also create a Container component which would allow our users to change ```jsx // components/user/Container.js +import React from "react"; +import { Paper } from "@material-ui/core"; + export const Container = ({background, padding = 0, children}) => { return ( @@ -88,9 +90,9 @@ Now, let's create another user component that will be more advanced. It will be ```jsx // components/user/Card.js import React from "react"; -import Text from "./Text"; -import Button from "./Button"; -import Container from "./Container"; +import { Text } from "./Text"; +import { Button } from "./Button"; +import { Container } from "./Container"; export const Card = ({background, padding = 20}) => { return ( @@ -149,6 +151,7 @@ For now, let's just put in some dummy text fields. We'll revisit this in the lat ```jsx // components/SettingsPanel.js +import React from 'react'; import { Box, Chip, Grid, Typography, Button as MaterialButton, FormControl, FormLabel, Slider } from "@material-ui/core"; export const SettingsPanel = () => {