Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Auto Link when click Enter #783

Closed
cristianpoleyJS opened this issue Aug 4, 2020 · 3 comments
Closed

Auto Link when click Enter #783

cristianpoleyJS opened this issue Aug 4, 2020 · 3 comments
Labels
Type: Feature The issue or pullrequest is a new feature

Comments

@cristianpoleyJS
Copy link

cristianpoleyJS commented Aug 4, 2020

When I type a link in the content and click the Enter button, it is not detected as a link and the <p> element remains, but if I click the space tab it is detected.

import { markInputRule } from 'tiptap-commands'
import { Link } from 'tiptap-extensions'

export class CustomLink extends Link {
  get schema () {
    return {
      attrs: {
        href: {
          default: null
        },
        'data-link-type': {
          default: 'link'
        },
        target: {
          default: null
        },
        rel: {
          default: null
        },
        class: {
          default: 'oct-a'
        }
      },
      inclusive: false,
      parseDOM: [
        {
          tag: 'a[href]',
          getAttrs: dom => {
            return {
              href: dom.getAttribute('href'),
              target: dom.getAttribute('target'),
              rel: dom.getAttribute('rel'),
              'data-link-type': dom.getAttribute('data-link-type')
            }
          }
        }
      ],
      toDOM: node => {
        return [
          'a',
          {
            ...node.attrs,
            target: '__blank',
            class: 'oct-a',
            rel: 'noopener noreferrer nofollow'
          },
          0
        ]
      }
    }
  }

  inputRules ({ type }) {
    return [
      markInputRule(
        /(https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\\+.~#?&//=]*))\s$/g,
        type,
        (url) => ({ href: url[0] })
      )
    ]
  }
}

When paste link

When write link and click space tab:

When write link and click Enter:

@cristianpoleyJS cristianpoleyJS added the Type: Feature The issue or pullrequest is a new feature label Aug 4, 2020
@BrianHung
Copy link
Contributor

ProseMirror input-rules by default do not span between paragraphs: https://discuss.prosemirror.net/t/trigger-inputrule-on-enter/1118. To implement this behavior, try creating a custom subclass of https://github.com/ProseMirror/prosemirror-inputrules which looks between paragraphs.

@andreasvirkus andreasvirkus mentioned this issue Oct 6, 2020
6 tasks
@hanspagel hanspagel added v2 and removed v2 labels Jan 7, 2021
@cristianpoleyJS
Copy link
Author

I guess it will be studied to be added in Tiptap version 2 @hanspagel.
Looking forward to it! I close the PR.

@daniellokato
Copy link

@cristianpoleyJS I have the same problem. Were you able to find a solution?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Feature The issue or pullrequest is a new feature
Projects
None yet
Development

No branches or pull requests

4 participants