@alitons/ckeditor5 0.0.4 → 0.0.5
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 +33 -0
- package/build/ckeditor.d.ts +7 -13
- package/build/ckeditor.js +2 -2
- package/build/ckeditor.js.map +1 -1
- package/build/components/list/listitemview.d.ts +15 -0
- package/build/components/list/listseparatorview.d.ts +9 -0
- package/build/components/list/listview.d.ts +25 -0
- package/build/plugins/NumberedDivListSplit.d.ts +6 -0
- package/build/plugins/listaNumerada-bkp.d.ts +5 -0
- package/build/plugins/listaNumerada.d.ts +5 -0
- package/package.json +3 -2
- package/sample/index.html +12 -2
- package/sample/script.js +44 -17
- package/src/ckeditor.ts +7 -2
- package/src/components/list/listitemview.d.ts +35 -0
- package/src/components/list/listitemview.js +42 -0
- package/src/components/list/listview.d.ts +65 -0
- package/src/components/list/listview.js +92 -0
- package/src/css/custom.css +87 -0
- package/src/plugins/NumberedDivListSplit.ts +174 -0
- package/src/plugins/listaNumerada.ts +743 -0
- package/src/plugins/modelo.ts +102 -102
package/src/plugins/modelo.ts
CHANGED
|
@@ -12,7 +12,7 @@ window.$ = $;
|
|
|
12
12
|
window.jQuery = $;
|
|
13
13
|
|
|
14
14
|
export default class DocumentoModelo extends Plugin {
|
|
15
|
-
|
|
15
|
+
options = [] as any;
|
|
16
16
|
uid = Math.random().toString(36).substring(7);
|
|
17
17
|
init() {
|
|
18
18
|
this.createPopup()
|
|
@@ -23,12 +23,12 @@ export default class DocumentoModelo extends Plugin {
|
|
|
23
23
|
createPopup() {
|
|
24
24
|
this.editor.ui.componentFactory.add( 'documentoModelo', () => {
|
|
25
25
|
|
|
26
|
-
|
|
26
|
+
const dropdown = createDropdown( this.editor.locale );
|
|
27
27
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
28
|
+
// Configure dropdown's button properties:
|
|
29
|
+
dropdown.buttonView.set( {
|
|
30
|
+
label: 'Modelos',
|
|
31
|
+
icon: `<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="272px" height="272px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
|
|
32
32
|
viewBox="0 0 272 272"
|
|
33
33
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
34
34
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
@@ -68,13 +68,13 @@ export default class DocumentoModelo extends Plugin {
|
|
|
68
68
|
</g>
|
|
69
69
|
</g>
|
|
70
70
|
</svg>`,
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
71
|
+
withText: true,
|
|
72
|
+
tooltip: true
|
|
73
|
+
} );
|
|
74
74
|
|
|
75
|
-
|
|
75
|
+
dropdown.render();
|
|
76
76
|
|
|
77
|
-
|
|
77
|
+
//VERIFICA SE O EDITOR ESTÁ DESATIVADO
|
|
78
78
|
setTimeout(() => {
|
|
79
79
|
if(this.editor.isReadOnly) dropdown.isEnabled = false
|
|
80
80
|
}, 500)
|
|
@@ -85,52 +85,52 @@ export default class DocumentoModelo extends Plugin {
|
|
|
85
85
|
else dropdown.isEnabled = true
|
|
86
86
|
})
|
|
87
87
|
|
|
88
|
-
|
|
88
|
+
const toolbar = this.editor.config.get('toolbar') as any;
|
|
89
89
|
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
90
|
+
if(!toolbar!.seiOptions || toolbar!.seiOptions === undefined || [null, undefined, ''].includes(toolbar!.seiOptions?.url)) {
|
|
91
|
+
dropdown.isEnabled = false
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
// CRIAR O ELEMENTO IGUAL AO ELEMENTO DE BUSCA
|
|
95
|
+
const input = document.createElement( 'div' );
|
|
96
96
|
input.classList.add('documento_modelo_container')
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
97
|
+
input.innerHTML = `<div class="ck ck-reset ck-dropdown__panel ck-dropdown__panel_se ck-dropdown__panel-visible ck-dropdown__panel_documento_modelo" style="left: initial;right: 0;">
|
|
98
|
+
<form class="ck ck-find-and-replace-form">
|
|
99
|
+
<div class="ck ck-form__header">
|
|
100
|
+
<h2 class="ck ck-form__header__label">Documento Modelo</h2>
|
|
101
|
+
</div>
|
|
102
|
+
<fieldset class="ck ck-find-and-replace-form__find" style="margin-bottom: 0px; padding-bottom: 0px;">
|
|
103
|
+
<div class="ck ck-labeled-field-view ck-labeled-field-view_empty">
|
|
104
104
|
<label>Categoria</label>
|
|
105
|
-
|
|
105
|
+
<div class="ck ck-labeled-field-view__input-wrapper">
|
|
106
106
|
<select class="ck ck-input ck-input-text_empty ck-input-select categoriamodeloselect" id="search-input-categoria-document-modelo-${this.uid}">
|
|
107
107
|
</select>
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
108
|
+
</div>
|
|
109
|
+
<div class="ck ck-labeled-field-view__status ck-labeled-field-view__status_error" id="search-error-sei-${this.uid}" role="alert"></div>
|
|
110
|
+
</div>
|
|
111
|
+
</fieldset>
|
|
112
|
+
<fieldset class="ck ck-find-and-replace-form__find">
|
|
113
|
+
<div class="ck ck-labeled-field-view ck-labeled-field-view_empty">
|
|
114
114
|
<label>Modelo</label>
|
|
115
|
-
|
|
115
|
+
<div class="ck ck-labeled-field-view__input-wrapper">
|
|
116
116
|
<select class="ck ck-input ck-input-text_empty ck-input-select documentomodeloselect" id="search-input-documento-modelo-${this.uid}">
|
|
117
117
|
</select>
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
118
|
+
</div>
|
|
119
|
+
<div class="ck ck-labeled-field-view__status ck-labeled-field-view__status_error" id="search-error-sei-${this.uid}" role="alert"></div>
|
|
120
|
+
</div>
|
|
121
|
+
</fieldset>
|
|
122
|
+
<fieldset class="ck ck-find-and-replace-form__replace" id="search-actions-documento-modelo-${this.uid}" style="display: none">
|
|
123
|
+
<div class="ck ck-labeled-field-view ck-disabled ck-labeled-field-view_empty" style="background: #e9ecef; border: 1px solid #ced4da; padding: 5px; height: 200px; overflow: auto; text-align: initial;">
|
|
124
|
+
<div class="ck" id="search-result-documento-modelo-${this.uid}"></div>
|
|
125
|
+
</div>
|
|
126
|
+
<button class="ck ck-button ck-button-save ck-off ck-button_with-text" type="button" tabindex="-1" id="search-add-documento-modelo-${this.uid}">
|
|
127
|
+
<svg class="ck ck-icon ck-reset_all-excluded ck-icon_inherit-color ck-button__icon" viewBox="0 0 20 20"><path d="M6.972 16.615a.997.997 0 0 1-.744-.292l-4.596-4.596a1 1 0 1 1 1.414-1.414l3.926 3.926 9.937-9.937a1 1 0 0 1 1.414 1.415L7.717 16.323a.997.997 0 0 1-.745.292z"></path></svg>
|
|
128
|
+
<span class="ck ck-button__label">Importar</span>
|
|
129
|
+
</button>
|
|
130
|
+
</fieldset>
|
|
131
|
+
</form>
|
|
132
|
+
</div>`;
|
|
133
|
+
dropdown.panelView.element.appendChild( input );
|
|
134
134
|
|
|
135
135
|
const self = this;
|
|
136
136
|
|
|
@@ -150,55 +150,55 @@ export default class DocumentoModelo extends Plugin {
|
|
|
150
150
|
}
|
|
151
151
|
});
|
|
152
152
|
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
153
|
+
$('body').on('keyup', `.ck-error`, function() {
|
|
154
|
+
$(this).removeClass('ck-error')
|
|
155
|
+
$(`#search-error-sei-${this.uid}`).html('')
|
|
156
|
+
});
|
|
157
157
|
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
158
|
+
$('body').on('click', `#search-add-documento-modelo-${this.uid}`, async function() {
|
|
159
|
+
const conteudo = $(`#search-result-documento-modelo-${self.uid}`).html()
|
|
160
|
+
const viewDocument = self.editor.editing.view.document;
|
|
161
|
+
const htmlDP = new HtmlDataProcessor( viewDocument );
|
|
162
|
+
const viewFragment = htmlDP.toView( conteudo );
|
|
163
|
+
const modelFragment = self.editor.data.toModel( viewFragment ) as any;
|
|
164
164
|
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
165
|
+
self.editor.model.change(writer => {
|
|
166
|
+
writer.remove(writer.createRangeIn(self.editor.model.document.getRoot()));
|
|
167
|
+
self.editor.model.insertContent(modelFragment);
|
|
168
|
+
});
|
|
169
169
|
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
170
|
+
// LIMPA O CAMPO DE BUSCA
|
|
171
|
+
$(`#search-input-documento-modelo-${self.uid}`).val('')
|
|
172
|
+
$(`#search-actions-documento-modelo-${self.uid}`).hide()
|
|
173
173
|
|
|
174
|
-
|
|
174
|
+
});
|
|
175
175
|
|
|
176
|
-
|
|
176
|
+
return dropdown;
|
|
177
177
|
});
|
|
178
178
|
}
|
|
179
179
|
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
180
|
+
async openModalDocumentoModelo(){
|
|
181
|
+
const val = await Swal.fire({
|
|
182
|
+
title: 'Modelo de Documento',
|
|
183
|
+
html: `
|
|
184
|
+
<div class="row w-100">
|
|
185
|
+
${(this.options.categoria) ? `<div class="col-12 mb-3" style="text-align: justify;">
|
|
186
|
+
<div class="form-group">
|
|
187
|
+
<select class="form-select categoriamodeloselect">
|
|
188
|
+
</select>
|
|
189
|
+
</div>
|
|
190
|
+
</div>` : ''}
|
|
191
|
+
<div class="col-12" style="text-align: justify;">
|
|
192
|
+
<div class="form-group">
|
|
193
|
+
<select class="form-select documentomodeloselect">
|
|
194
|
+
</select>
|
|
195
|
+
</div>
|
|
196
|
+
</div>
|
|
197
|
+
<div class="col-12 mt-5">
|
|
198
|
+
<div readonly class="form-control documentomodeloviewer" style="height: 200px; text-align: justify; overflow: auto;"></div>
|
|
199
|
+
</div>
|
|
200
|
+
</div>
|
|
201
|
+
`,
|
|
202
202
|
willOpen: () => {
|
|
203
203
|
|
|
204
204
|
$('.categoriamodeloselect')
|
|
@@ -210,20 +210,20 @@ export default class DocumentoModelo extends Plugin {
|
|
|
210
210
|
$('.documentomodeloviewer').html(e.target.value)
|
|
211
211
|
})
|
|
212
212
|
},
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
213
|
+
showCancelButton: true,
|
|
214
|
+
confirmButtonText: 'Adicionar',
|
|
215
|
+
cancelButtonText: 'Cancelar',
|
|
216
216
|
confirmButtonColor: '#3565A0',
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
217
|
+
allowOutsideClick: () => !Swal.isLoading()
|
|
218
|
+
}).then((result) => {
|
|
219
|
+
if (result.isConfirmed) {
|
|
220
|
+
const documentomodeloviewer = document.querySelector('.documentomodeloviewer')
|
|
221
|
+
return documentomodeloviewer!.innerHTML
|
|
222
|
+
}
|
|
223
|
+
})
|
|
224
224
|
|
|
225
|
-
|
|
226
|
-
|
|
225
|
+
return val;
|
|
226
|
+
}
|
|
227
227
|
|
|
228
228
|
parametrosDocumentoModeloCategoria() {
|
|
229
229
|
const self = this
|