add mooore typography rules

This commit is contained in:
Hans Pagel 2020-11-05 23:06:59 +01:00
parent 2a0ef712cc
commit 7fa5ad5db4
3 changed files with 87 additions and 24 deletions

View File

@ -21,39 +21,81 @@ context('/api/extensions/typography', () => {
.should('contain', '… ellipsis')
})
it('should make an correct open double quote', () => {
it('should make a correct open double quote', () => {
cy.get('.ProseMirror')
.type('"openDoubleQuote"')
.should('contain', '“openDoubleQuote')
})
it('should make an correct close double quote', () => {
it('should make a correct close double quote', () => {
cy.get('.ProseMirror')
.type('"closeDoubleQuote"')
.should('contain', 'closeDoubleQuote”')
})
it('should make an correct open single quote', () => {
it('should make a correct open single quote', () => {
cy.get('.ProseMirror')
.type("'openSingleQuote'")
.should('contain', 'openSingleQuote')
})
it('should make an correct close single quote', () => {
it('should make a correct close single quote', () => {
cy.get('.ProseMirror')
.type("'closeSingleQuote'")
.should('contain', 'closeSingleQuote')
})
it('should make a leftwards arrow', () => {
it('should make a left arrow', () => {
cy.get('.ProseMirror')
.type('<- leftwardsArrow')
.should('contain', '← leftwardsArrow')
.type('<- leftArrow')
.should('contain', '← leftArrow')
})
it('should make a rightwards arrow', () => {
it('should make a right arrow', () => {
cy.get('.ProseMirror')
.type('-> rightwardsArrow')
.should('contain', '→ rightwardsArrow')
.type('-> rightArrow')
.should('contain', '→ rightArrow')
})
it('should make a copyright sign', () => {
cy.get('.ProseMirror')
.type('(c) copyright')
.should('contain', '© copyright')
})
it('should make a registered trademark sign', () => {
cy.get('.ProseMirror')
.type('(r) registeredTrademark')
.should('contain', '® registeredTrademark')
})
it('should make a one half', () => {
cy.get('.ProseMirror')
.type('1/2 oneHalfw')
.should('contain', '½ oneHalf')
})
it('should make a plus/minus sign', () => {
cy.get('.ProseMirror')
.type('+/- plusMinus')
.should('contain', '± plusMinus')
})
it('should make a not equal sign', () => {
cy.get('.ProseMirror')
.type('!= notEqual')
.should('contain', '≠ notEqual')
})
it('should make a laquo', () => {
cy.get('.ProseMirror')
.type('<< laquorow')
.should('contain', '« laquo')
})
it('should make a raquo', () => {
cy.get('.ProseMirror')
.type('>> raquorow')
.should('contain', '» raquo')
})
})

View File

@ -11,16 +11,23 @@ yarn add @tiptap/typography
```
## Rules
| Name | Description |
| ---------------- | ------------------------------------------------------ |
| emDash | Converts double dashes `--` to an emdash `—`. |
| ellipsis | Converts three dots `...` to an ellipsis character `…` |
| openDoubleQuote | `“`Smart” opening double quotes. |
| closeDoubleQuote | “Smart`”` closing double quotes. |
| openSingleQuote | ``Smart opening single quotes. |
| closeSingleQuote | Smart`` closing single quotes. |
| leftwardsArrow | Converts <code><&dash;</code> to an arrow `←`. |
| leftwardsArrow | Converts <code>&dash;></code> to an arrow `→`. |
| Name | Description |
| ------------------- | ---------------------------------------------------------------- |
| emDash | Converts double dashes `--` to an emdash `—`. |
| ellipsis | Converts three dots `...` to an ellipsis character `…` |
| openDoubleQuote | `“`Smart” opening double quotes. |
| closeDoubleQuote | “Smart`”` closing double quotes. |
| openSingleQuote | ``Smart opening single quotes. |
| closeSingleQuote | Smart`` closing single quotes. |
| leftArrow | Converts <code><&dash;</code> to an arrow `←` . |
| rightArrow | Converts <code>&dash;></code> to an arrow `→`. |
| copyright | Converts `(c)` to a copyright sign `©`. |
| registeredTrademark | Converts `(r)` to registered trademark sign `®`. |
| oneHalf | Converts `1/2` to one half `½`. |
| plusMinus | Converts `+/-` to plus/minus sign `±`. |
| notEqual | Converts `!=` to a not equal sign `≠`. |
| laquo | Converts `<<` to left-pointing double angle quotation mark `«`. |
| raquo | Converts `>>` to right-pointing double angle quotation mark `»`. |
## Source code
[packages/typography/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/typography/)

View File

@ -9,8 +9,15 @@ import {
InputRule,
} from 'prosemirror-inputrules'
export const leftwardsArrow = new InputRule(/<-$/, '←')
export const rightwardsArrow = new InputRule(/->$/, '→')
export const leftArrow = new InputRule(/<-$/, '←')
export const rightArrow = new InputRule(/->$/, '→')
export const copyright = new InputRule(/\(c\)$/, '©')
export const registeredTrademark = new InputRule(/\(r\)$/, '®')
export const oneHalf = new InputRule(/1\/2$/, '½')
export const plusMinus = new InputRule(/\+\/-$/, '±')
export const notEqual = new InputRule(/!=$/, '≠')
export const laquo = new InputRule(/<<$/, '«')
export const raquo = new InputRule(/>>$/, '»')
const Typography = createExtension({
addInputRules() {
@ -21,8 +28,15 @@ const Typography = createExtension({
closeDoubleQuote,
openSingleQuote,
closeSingleQuote,
leftwardsArrow,
rightwardsArrow,
leftArrow,
rightArrow,
copyright,
registeredTrademark,
oneHalf,
plusMinus,
notEqual,
laquo,
raquo,
]
},
})