cannercms / canner-slate-editor Goto Github PK

https://github.com/sparksuite/simplemde-markdown-editor

Add a editor that preserve md syntax in the editor

Hello,

I came across your awesome project and i wanted to help contribute to this great project...
I created a logo for you... Two similar design styles based on the same idea concept...
You are free to choose any style you like the most and use...
If you find any of the styles good enough and you like it, please do let me know.

The link contains the google drive files for your use.
https://drive.google.com/drive/folders/1gjJncpskKWMuNCwPuFLAwB6LKTMBw7NL?usp=sharing

Now in slate-editor-icons we move render functions to plugins

I tried the live demo here and accidentally typed in a couple of ´-characters at the start of a header. The editor froze and I couldn't delete it.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

I initiated a slate-md-editor as follows:

// imports
import React, { Component } from 'react'          ;
import { Value  }           from 'slate'          ;
import  Editor              from 'slate-md-editor';
import { State }            from "markup-it"      ;
import { isKeyHotkey }      from 'is-hotkey'      ;
import markdown             from "markup-it/lib/markdown";


// initialize value 
const readme    = require("./Readme.md");
const mdParser  = State.create(markdown);
const MdEditor  = Editor();
const doc       = mdParser.deserializeToDocument(readme);
const vo        = Value.create({ doc });
const vk        = JSON.parse(localStorage.getItem('body-value'));
const v_on_load = Value.fromJSON( vk ) || vo;

// container 
class EditorContainer extends Component {

    //  functions ...


    return (
    
      <MdEditor 
        className ='editor'
      	style     = {css}
        value     = {this.state.value}
        onKeyDown = {this.onKeyDown  }
        onChange  = {this.onChange   }

        // this messes up the markdown format completely
        plugins   = {plugins}

      />
	);
}


// plugins
const plugins = [ hotKeys(shortCuts) ];
const shortCuts = { 'ctrl+l' : centerOnCursor }
function centerOnCursor(e, change){ return false }

When I add plugins={plugins} into MdEditor the existing markdown format is destroyed completely. I assume this is because I accidently overwrote what plugins existed before. Is there an API to pass in additional plugins? I would like to initialize the editor as an MdEditor if possible, instead of an Editor and pass in slate-md as a plugin. Especially because import {MarkdownPlugin} from 'slate-md-editor' does not work for me.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

I've been meaning to test this in a real use case for a long time now, but it's an incredible headache to get working because of the incredible headache antd is to get working. I've followed all the guides, but I still have trouble loading the styles from antd in Webpack.

I'm sure I'm eventually going to get it working, but is there a way to just use this library without it?

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

Following the example, I initiated an editor with:

   import { Editor } from 'slate-md-editor';
   const MdEditor = Editor();

But received error: TypeError: Object(...) is not a function
I also tried passing in a trivial option:

const MdEditor = Editor({markdownOption : {}});

But the same error is thrown.

I’m not personally using this but thought you should know, try to type any Chinese or Japanese characters in there and it immediately refreshes. Cheers

I was trying to install canner-slate-editor, but found this error:

npm ERR! code E404
npm ERR! 404 Not Found: @canner/slate-editor-help@^1.5.0

currently, deserializing video nodes are not right. https://github.com/Canner/slate-editor-icons/blob/master/packages/slate-editor-html/src/videoRules.js#L21. It should create different types from different sources (youtube, youku ...block types) .

Ideally, users could select an area and type '**' to wrap bold mark. So does some mark types.

https://github.com/Canner/canner-slate-editor/blob/f414b6c61500f24cda6eaa63e098aee9d6ce8e2a/packages/slate-icons/header/src/index.js#L37

it seems as if the setBlock method has been renamed to setBlocks in newer versions of slate.

When installing canner-slate-editor, there are mismatched peer dependencies:

$ mkdir test
$ cd test
$ npm init -y
$ npm install --save antd@^3.10.1 canner-slate-editor@^1.5.4 immutable@^3.8.2 react@^16.5.2 react-dom@^16.5.2 slate@^0.33.8 slate-react@^0.12.11

> [email protected] postinstall /Users/spencerelliott/Dev/elliottsj/slatetest/node_modules/styled-components
> node ./scripts/postinstall.js || exit 0

Use styled-components at work? Consider supporting our development efforts at opencollective.com/styled-components
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.3 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.4 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.3 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.5 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.3 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.3 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.5 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.5 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.5 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.29.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.32.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.32.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.29.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @canner/slate-helper-block-list@^0.1.12 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @canner/slate-helper-block-quote@^0.1.12 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate-edit-blockquote@^0.6.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @canner/slate-helper-block-list@^0.1.12 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @canner/slate-helper-block-quote@^0.1.12 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @canner/slate-icon-emoji@^1.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.32.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.7 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.7 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of slate@>=^0.33.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react@>=^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react-dom@>=^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react@>=^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react-dom@>=^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.2 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of slate@^0.29.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

+ [email protected]
+ [email protected]
+ [email protected]
+ [email protected]
+ [email protected]
+ [email protected]
+ [email protected]
added 358 packages from 241 contributors and audited 6096 packages in 17.073s
found 0 vulnerabilities

It is not possible to avoid these warnings because many of these peer dependencies have no version which satisfies all version constraints.

For example:

[email protected] depends on @canner/slate-helper-block-list@^1.5.0, but [email protected] depends on a peer of @canner/slate-helper-block-list@^0.1.12. There is no version that satisfies both constraints ^1.5.0 and ^0.1.12.

Another problem is that many sub-packages are specifying their peer dependencies using an invalid syntax, e.g. https://github.com/Canner/canner-slate-editor/blob/0330dc6000a3e31ff6aa7a46309c54eddb6c4acf/packages/slate-icons/shared/package.json#L12

>=^1.0.6 is not a valid semver constraint, so npm raises the error

npm WARN @canner/[email protected] requires a peer of @canner/slate-constant@>=^1.0.6 but none is installed. You must install peer dependencies yourself.

Suggested fixes

• Fix all invalid semver constraints, e.g. change >=^1.0.6 to >=1.0.6.
• Loosen peer dependency constraints so that a valid version exists for every combination. e.g. change slate-toolbar's peer dep on @canner/slate-helper-block-list from ^0.1.12 to >=0.1.12.
• Add a CI build step to prevent this from occurring in the future, e.g. Travis CI or CircleCI. Run the command npm ls as part of the build, which produces an error if peer dependencies are mismatched.

For example, when I type ctrl+opt+1, the editor inserts ‘1’.

The keyDown listener event should block the default event:e.preventDefault();

Many of slate plugins are managed using npm. How should we create a PR?

Maybe we need a button to import the markdown source.

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

I tried in the demo but looks like it is not supported.

Extra Space Problem

I run the demo. When I manually type a link element, it is converted to a link. It's good. I only observe some extra spaces before the link text. This may need some fix.

Pasting link in markdown breaks further links.

When I pasted the following:

[example](http://example.com "Optional title")[space]

It did not convert to a link. Then I tried to add similar links below this line and they did not convert to a link either.

However when I try to manually type a link to another position (away from the pasted string) in the document, it is converted to link properly.

Editing Links

One more thing: can we edit existing links by putting cursor over the link?

As you know, I think this markdown plugin is great! It saves me a lot of headaches of maintaining my own, sloppy, markdown plugins.

Two things I'd love to see in this plugin:

1. Support for custom block/mark tags
2. Support for * for italics - I know first-hand this is a pain due to the edge case of handling triple asterisks for italics+bold

Thoughts on these @chilijung?

Thanks again! Amazing work!

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

http://lab.lepture.com/editor/

#26

Hi there,

I have a very strange behaviour of the code block. I've captured a gif to show you what I mean:

If i type ` for several times only some of them are converted to HTML and somehow backspace is broken after I get a code block.

I'm using a Mac Book Pro (10.13) with Chrome 65.

Best regards,
Jan

./node_modules/slate-md-editor/lib/index.js
Module not found: app/node_modules/@canner/slate-icon-codeBlock/lib/index.js does not match the corresponding path on disk slate-icon-codeblock.

https://github.com/sparksuite/simplemde-markdown-editor

~sasdfs~ markdown syntax support

One of the very first words I read in your demo has a typo