@jinntec/jinntap 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +148 -0
- package/package.json +74 -0
package/README.md
ADDED
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
# JinnTap
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
Edit TEI XML documents using a rich text editor. JinnTap preserves the structure of the XML in the editor. There's no need for complex transformation steps from TEI to HTML and back. The representation of the document in the editor corresponds directly with the XML. TEI elements are converted to HTML custom elements, preserving all attributes and structural features.
|
|
6
|
+
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install jinn-tap
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Development Setup
|
|
14
|
+
|
|
15
|
+
### Prerequisites
|
|
16
|
+
- Node.js (v16 or higher)
|
|
17
|
+
- npm (v7 or higher)
|
|
18
|
+
|
|
19
|
+
### Building the Project
|
|
20
|
+
|
|
21
|
+
```bash
|
|
22
|
+
# Install dependencies
|
|
23
|
+
npm install
|
|
24
|
+
|
|
25
|
+
# Build the project
|
|
26
|
+
npm run build
|
|
27
|
+
|
|
28
|
+
# Build the demo
|
|
29
|
+
npm run build:demo
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### Running the Demo
|
|
33
|
+
|
|
34
|
+
```bash
|
|
35
|
+
# Start the development server
|
|
36
|
+
npm run dev
|
|
37
|
+
|
|
38
|
+
# Preview the built demo
|
|
39
|
+
npm run preview
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### Running Tests
|
|
43
|
+
|
|
44
|
+
```bash
|
|
45
|
+
# Open Cypress test runner
|
|
46
|
+
npm run cypress:open
|
|
47
|
+
|
|
48
|
+
# Run tests in headless mode
|
|
49
|
+
npm run cypress:run
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Usage
|
|
53
|
+
|
|
54
|
+
### Basic Usage
|
|
55
|
+
|
|
56
|
+
```html
|
|
57
|
+
<!DOCTYPE html>
|
|
58
|
+
<html>
|
|
59
|
+
<head>
|
|
60
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
|
|
61
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
|
62
|
+
<script type="module" src="node_modules/jinn-tap/dist/jinn-tap.es.js"></script>
|
|
63
|
+
</head>
|
|
64
|
+
<body>
|
|
65
|
+
<jinn-tap></jinn-tap>
|
|
66
|
+
<pre id="output"></pre>
|
|
67
|
+
<script>
|
|
68
|
+
document.addEventListener('DOMContentLoaded', () => {
|
|
69
|
+
const editor = document.querySelector('jinn-tap');
|
|
70
|
+
const output = document.querySelector('#output');
|
|
71
|
+
|
|
72
|
+
editor.addEventListener('content-change', (event) => {
|
|
73
|
+
output.textContent = event.detail.teiXml;
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
</script>
|
|
77
|
+
</body>
|
|
78
|
+
</html>
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
### With Initial Content
|
|
82
|
+
|
|
83
|
+
```html
|
|
84
|
+
<jinn-tap content="<tei-div><tei-p>Initial content</tei-p></tei-div>"></jinn-tap>
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
### JavaScript API
|
|
88
|
+
|
|
89
|
+
```javascript
|
|
90
|
+
// Get the editor instance
|
|
91
|
+
const editor = document.querySelector('jinn-tap').tiptap;
|
|
92
|
+
|
|
93
|
+
// Set content programmatically
|
|
94
|
+
editor.commands.setContent('<tei-div><tei-p>New content</tei-p></tei-div>');
|
|
95
|
+
|
|
96
|
+
// Get content as HTML
|
|
97
|
+
const htmlContent = editor.getHTML();
|
|
98
|
+
|
|
99
|
+
// Get content as TEI XML
|
|
100
|
+
const teiXml = editor.teiXml;
|
|
101
|
+
|
|
102
|
+
// Focus the editor
|
|
103
|
+
editor.focus();
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
## Keyboard Shortcuts
|
|
107
|
+
|
|
108
|
+
The editor supports the following keyboard shortcuts:
|
|
109
|
+
|
|
110
|
+
### Text Formatting
|
|
111
|
+
- `Ctrl/Cmd + B` - Toggle bold text (hi with rend="bold")
|
|
112
|
+
- `Ctrl/Cmd + I` - Toggle italic text (hi with rend="italic")
|
|
113
|
+
- `Ctrl/Cmd + U` - Toggle underline text (hi with rend="underline")
|
|
114
|
+
|
|
115
|
+
### TEI Elements
|
|
116
|
+
- `Ctrl/Cmd + Shift + P` - Insert TEI persName
|
|
117
|
+
- `Ctrl/Cmd + Shift + L` - Toggle list
|
|
118
|
+
- `Ctrl/Cmd + Shift + U` - Insert footnote
|
|
119
|
+
- `Tab` - Indent list item
|
|
120
|
+
- `Shift + Tab` - Outdent list item
|
|
121
|
+
- `Enter` - Create new list item
|
|
122
|
+
- `Backspace` at start of list item - Convert to paragraph
|
|
123
|
+
|
|
124
|
+
### General
|
|
125
|
+
- `Ctrl/Cmd + C` - Copy selected text
|
|
126
|
+
- `Ctrl/Cmd + V` - Paste text
|
|
127
|
+
- `Ctrl/Cmd + X` - Cut text
|
|
128
|
+
- `Ctrl/Cmd + Z` - Undo
|
|
129
|
+
- `Ctrl/Cmd + Shift + Z` - Redo
|
|
130
|
+
|
|
131
|
+
## Events
|
|
132
|
+
|
|
133
|
+
The component dispatches the following events:
|
|
134
|
+
|
|
135
|
+
### content-change
|
|
136
|
+
Fired when the editor content changes.
|
|
137
|
+
|
|
138
|
+
```javascript
|
|
139
|
+
editor.addEventListener('content-change', (event) => {
|
|
140
|
+
const { content, teiXml } = event.detail;
|
|
141
|
+
// content: HTML content
|
|
142
|
+
// teiXml: TEI XML content
|
|
143
|
+
});
|
|
144
|
+
```
|
|
145
|
+
|
|
146
|
+
## License
|
|
147
|
+
|
|
148
|
+
[GNU General Public License v3.0](https://www.gnu.org/licenses/gpl-3.0.en.html)
|
package/package.json
ADDED
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@jinntec/jinntap",
|
|
3
|
+
"version": "1.0.1",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"main": "./dist/jinn-tap.umd.js",
|
|
6
|
+
"module": "./dist/jinn-tap.es.js",
|
|
7
|
+
"types": "./dist/jinn-tap.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/jinn-tap.es.js",
|
|
11
|
+
"require": "./dist/jinn-tap.umd.js",
|
|
12
|
+
"types": "./dist/jinn-tap.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": [
|
|
16
|
+
"dist/jinn-tap.es.js",
|
|
17
|
+
"dist/jinn-tap.umd.js",
|
|
18
|
+
"dist/jinn-tap.d.ts"
|
|
19
|
+
],
|
|
20
|
+
"scripts": {
|
|
21
|
+
"dev": "vite",
|
|
22
|
+
"build": "vite build",
|
|
23
|
+
"build:demo": "vite build --config vite.demo.config.js",
|
|
24
|
+
"preview": "vite preview",
|
|
25
|
+
"cypress:open": "cypress open",
|
|
26
|
+
"cypress:run": "cypress run",
|
|
27
|
+
"test": "cypress run",
|
|
28
|
+
"semantic-release": "semantic-release"
|
|
29
|
+
},
|
|
30
|
+
"dependencies": {
|
|
31
|
+
"@tiptap/core": "^2.11.7",
|
|
32
|
+
"@tiptap/extension-history": "^2.11.7",
|
|
33
|
+
"@tiptap/extension-placeholder": "^2.11.7",
|
|
34
|
+
"@tiptap/pm": "^2.11.7",
|
|
35
|
+
"@tiptap/starter-kit": "^2.11.7",
|
|
36
|
+
"rollup": "^4.40.0"
|
|
37
|
+
},
|
|
38
|
+
"devDependencies": {
|
|
39
|
+
"@semantic-release/changelog": "^6.0.3",
|
|
40
|
+
"@semantic-release/git": "^10.0.1",
|
|
41
|
+
"@semantic-release/github": "^9.2.6",
|
|
42
|
+
"@semantic-release/npm": "^10.0.4",
|
|
43
|
+
"chai-xml": "^0.4.1",
|
|
44
|
+
"cypress": "^14.2.1",
|
|
45
|
+
"semantic-release": "^22.0.8",
|
|
46
|
+
"vite": "^5.1.0"
|
|
47
|
+
},
|
|
48
|
+
"keywords": [
|
|
49
|
+
"tei",
|
|
50
|
+
"xml",
|
|
51
|
+
"editor",
|
|
52
|
+
"tiptap",
|
|
53
|
+
"web-component"
|
|
54
|
+
],
|
|
55
|
+
"author": "",
|
|
56
|
+
"license": "GPL-3.0-or-later",
|
|
57
|
+
"repository": {
|
|
58
|
+
"type": "git",
|
|
59
|
+
"url": "git+https://github.com/JinnElements/jinn-tap.git"
|
|
60
|
+
},
|
|
61
|
+
"release": {
|
|
62
|
+
"branches": [
|
|
63
|
+
"main"
|
|
64
|
+
],
|
|
65
|
+
"plugins": [
|
|
66
|
+
"@semantic-release/commit-analyzer",
|
|
67
|
+
"@semantic-release/release-notes-generator",
|
|
68
|
+
"@semantic-release/changelog",
|
|
69
|
+
"@semantic-release/npm",
|
|
70
|
+
"@semantic-release/github",
|
|
71
|
+
"@semantic-release/git"
|
|
72
|
+
]
|
|
73
|
+
}
|
|
74
|
+
}
|