Giter VIP home page Giter VIP logo

last-draft's People

Contributors

codekonami avatar jameszmartin avatar kristajg avatar s123121 avatar stagfoo avatar svnm avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

last-draft's Issues

add support for srcset, alt and title on image upload

Would like to be able to use last-draft image upload for more robust image handling. Would be nice at the very least to support other attributes on image tags like srcset, alt and title. In addition, it'd be great to be able to do alignment and stuff as well but i think the 3 in the title are important.

Two uploads at the same time is acting weird

Here is a gif of two uploads launched at the same time (each is waiting 10 seconds for completion)

bug-last-draft

Once the first one is finished, the placeholder block of the second is destroyed. But once the promise is resolved the image block is created perfectly for the second image. However, the first image block seems to change to the placeholder type (you can notice the opacity modification)

Can't run v3 in my project.

After use it according to readme mentioned, I got some errors:

Module not found: 'draft-convert'
Module not found: 'draft-js-dnd-plugin'

I saw draft-convert is peerDependencies, so I add it to my project; but how about draft-js-dnd-plugin?

Not able to upload twice the same image in a row

If I upload an image A.jpg and wait for the image to be uploaded the block is created.
But if I try to reupload it once again it doesn't work and there is no error displayed.

If I upload another image B.jpg it works and then I can reupload A.jpg if I want.

In a way, it's kind of a great feature to prevent people from uploading the same image twice but I think it should at least display a message.

Code block support?

Loved the work!
Was just wondering if there is any way to add code block? This package has everything I need. if there is support for code block I can easily migrate to this.

[Enhancement] Unify color.js used in editor and ld-color-picker

it would be nice if we could find a way to have only color.js for colors in the color picker and editor because for now if color.js(editor) != color.js(ld-color-picker) you will get no/wrong colors because of how draft works.

inside the plugin system is there a way access the styleMap? if so we could pull out the colors there and generator what is need for the color picker.

It doesn't appear there is a way to remove the image plugin

Hey this looks like it would be great, but it doesn't seem to let me disable the default image plugin.

I would think I could do plugins={[]} for example, to disable all plugins, but the image plugin remains... Looking at the code, this is because the plugins prop only allows you to push new plugins onto the array, not set it.

https://github.com/vacenz/last-draft/blob/master/src/components/Editor.js#L154

Is there some constraint I don't understand that will not let us provide our own list?

why i m not able to run the project...

bundle.js:7779 Uncaught TypeError: Cannot read property '__reactInternalInstance$rc1tkywex4htm05izkv7h9f6r' of null(โ€ฆ)getClosestInstanceFromNode @ bundle.js:7779findParent @ bundle.js:126246handleTopLevelImpl @ bundle.js:126275perform @ bundle.js:27598batchedUpdates @ bundle.js:53331batchedUpdates @ bundle.js:9615dispatchEvent @ bundle.js:126355
http://localhost:3000/example/styles/plugins.css Failed to load resource: the server responded with a status of 404 (Not Found)

linkify links exporting to html

@codeKonami I just put in a small update to the logic for linkify here which means that links are only matched when they have a url schema.

This now works well in my editor I am using last draft for, but I think that is because on the server we are transforming valid links to an <a> tag. It looks like there is no entity support for draft-js-export-html so I am not sure what the best approach for this is? Using draft-convert convertToHTML would work well for this, but I have found it to be very slow compared to draft-js-export-html.

The other update was to links in the toolbar, ensuring they save with the schema. It fixes the issue where it was saving invalid links e.g. g.co where we really want to save https://g.co

Sidebar does not follow after uploading an image

You can see more clearly the bugs on the gif attached. There are two bugs.

First, after uploading an image, a block is created after the block image but the sidebar doesn't follow.

Secondly, after creating a new empty block, the sidebar comes down but a click on it doesn't display the toolbar at the right position it seems stuck on the block above the image. Some text needs to be entered to position correctly the toolbar.

sidebar-bug

Enable multiple headings

Awesome job on last-draft! It's really great. Would love it if it were possible to choose multiple headings in the blocks array, as opposed to just h2 - seems like the only interface to extending last-draft right now is through plugins, and that would probably be overkill for users who just want to include h1, h3, h4, h5, and/or h6 tags.

initialState

There doesn't seem to be a way to set the initial state to empty - am I missing something here? Is this perhaps something that requires using a draft-js method I don't know about?

with initial raw content as in the example such as:

const raw = {
  'entityMap': {},
  'blocks': [{
    "key": "ag6qs",
    "text": "Start typing",
    "type": "quote",
    "depth": 0,
    "inlineStyleRanges": [],
    "entityRanges": [],
    "data": {}
  }]
};

everything works fine, but with:

const raw = {
  'entityMap': {},
  'blocks': []
};

I get:

ContentState.js?72c3:119

Uncaught (in promise) TypeError: Cannot read property 'getKey' of undefined

Iframes still not showing up

Hey @StevenIseki I put in a PR yesterday to fix the iframe issue... I saw you merged it (thanks!) but then made a series of subsequent changes which somehow brings me back to square one - still have problems with iframes in the editor.

The iframes ARE saving (which is an improvement) but now they just plain don't show up in the editor anymore (they were at the time of my code getting merged - for now I am pointing to my forked branch since that is working with iframe insertion, but v1.3.0 is not).

Disable Video Plugins

Is it already possible to somehoe disable the video or / and image plugin? From reading the code, it seams they always get appended.
Wouldn't you think it's better to give the user the freedom to decide if they are needed?

Plugins Clarification

I see you've created your own custom plugins as examples - does this mean that last-draft won't work with draft-js-plugins? If not, could you give some clarification as to why and what kind of work needs to be done to either modify such plugins or create our own? If they are meant to work with last-draft out of the box, perhaps it would be a good thing to mention in the documentation - that would be a big selling point I think.

v2 autocomplete mention, emoji needs to exit

Need to exit the autocomplete for mentions and emoji key binding, if

  • more than 2 spaces entered
  • greater than 100 characters
  • throttle the autocompletes with a timeout

Otherwise the async function might send way too much data.

Mismatch between git repo & npm package

Hello, thanks for the great editor.
I try to integrate your editor into my project. However, the package failed to build.
The error is:
Module not found: Error: Cannot resolve 'file' or 'directory' ./Blockquote in /node_modules/last-draft/lib/components/Buttons
However, in the npm(yarn) package, inside the above folder, there is this file:
BlockQuote.js
as in your git repo:
Blockquote.js
(Notice the capitalized Q, this only fail to build on Linux, it is working fine in mac)

Copyright Holder

Hi @StevenIseki,

Could you please put the copyright holder and license inside each Megadraft's file? For the files you have modified, you can add a new copyright notice with your name.

Cheers!

invalid type warning for AlignmentTool

Hi, I'm trying out the V3 Editor component but am having trouble getting started.

error message

proxyConsole.js:56 Warning: React.createElement: type is invalid
-- expected a string (for built-in components) or a class/function
(for composite components) but got: undefined. You likely forgot to
export your component from the file it's defined in. Check the render
method of `AlignmentTool`

my render method

There's nothing too fancy going on. The editorState prop is an instance of regular DraftJS' EditorState. The plugin is draft-js-mention-plugin

<Editor
  editorState={this.state.bodyState}
  onChange={this.updateBodyState}
  placeholder="some placeholder text..."
  plugins={plugins}
/>

package.json:

"dependencies": {
    "draft-js": "^0.10.1",
    "draft-js-mention-plugin": "^2.0.0-rc2",
    "draft-js-plugins-editor": "^2.0.0-rc2",
    "last-draft": "^3.0.0",
    "react": "^15.5.4"
  }

any insight on this issue?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.