@firestitch/html-editor 12.0.1 → 12.0.2
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/app/components/html-editor/html-editor.component.d.ts +2 -1
- package/app/enums/default-plugin.enum.d.ts +3 -2
- package/app/fs-html-editor.module.d.ts +12 -3
- package/app/interfaces/html-editor-config.d.ts +12 -3
- package/app/services/froala-loader.service.d.ts +2 -2
- package/bundles/firestitch-html-editor.umd.js +60 -23
- package/bundles/firestitch-html-editor.umd.js.map +1 -1
- package/esm2015/app/components/html-editor/html-editor.component.js +47 -12
- package/esm2015/app/consts/text-buttons.const.js +1 -1
- package/esm2015/app/enums/default-plugin.enum.js +1 -1
- package/esm2015/app/fs-html-editor.module.js +2 -2
- package/esm2015/app/interfaces/html-editor-config.js +1 -1
- package/esm2015/app/services/froala-loader.service.js +8 -8
- package/esm2015/app/utils/loader.js +2 -1
- package/fesm2015/firestitch-html-editor.js +55 -19
- package/fesm2015/firestitch-html-editor.js.map +1 -1
- package/package.json +1 -1
|
@@ -30,7 +30,6 @@ export declare class FsHtmlEditorComponent implements OnInit, AfterViewInit, Con
|
|
|
30
30
|
hasContent(): boolean;
|
|
31
31
|
initialize(options?: any): void;
|
|
32
32
|
private _processImageUpload;
|
|
33
|
-
private _getTextNode;
|
|
34
33
|
uninitializedClick(event: UIEvent): void;
|
|
35
34
|
updateSize(): void;
|
|
36
35
|
validate(control: AbstractControl): ValidationErrors | null;
|
|
@@ -47,11 +46,13 @@ export declare class FsHtmlEditorComponent implements OnInit, AfterViewInit, Con
|
|
|
47
46
|
destroy(): void;
|
|
48
47
|
private _createConfig;
|
|
49
48
|
private _change;
|
|
49
|
+
private _initButtons;
|
|
50
50
|
private _initPlugins;
|
|
51
51
|
private _createOptions;
|
|
52
52
|
private _listenLazyInit;
|
|
53
53
|
private _contentChanged;
|
|
54
54
|
private _setupFroala;
|
|
55
|
+
private _getTextNode;
|
|
55
56
|
static ɵfac: i0.ɵɵFactoryDeclaration<FsHtmlEditorComponent, [{ optional: true; }, null, null]>;
|
|
56
57
|
static ɵcmp: i0.ɵɵComponentDeclaration<FsHtmlEditorComponent, "fs-html-editor", never, { "config": "config"; }, {}, never, never>;
|
|
57
58
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare const enum
|
|
1
|
+
export declare const enum FroalaPlugin {
|
|
2
2
|
Align = "align",
|
|
3
3
|
Colors = "colors",
|
|
4
4
|
Image = "image",
|
|
@@ -10,5 +10,6 @@ export declare const enum DefaultPlugin {
|
|
|
10
10
|
Video = "video",
|
|
11
11
|
Quote = "quote",
|
|
12
12
|
Draggable = "draggable",
|
|
13
|
-
FontSize = "font_size"
|
|
13
|
+
FontSize = "font_size",
|
|
14
|
+
QuickInsert = "quick_insert"
|
|
14
15
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ModuleWithProviders } from '@angular/core';
|
|
2
2
|
import { FsHtmlEditorConfig } from './interfaces/html-editor-config';
|
|
3
|
-
import {
|
|
3
|
+
import { FroalaPlugin } from './enums/default-plugin.enum';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
import * as i1 from "./components/html-editor/html-editor.component";
|
|
6
6
|
import * as i2 from "./components/html-renderer/html-renderer.component";
|
|
@@ -22,12 +22,21 @@ export declare function FsHtmlEditorConfigFactory(config: FsHtmlEditorConfig): {
|
|
|
22
22
|
placeholder?: string;
|
|
23
23
|
maxLength?: number;
|
|
24
24
|
autofocus?: boolean;
|
|
25
|
-
froalaConfig?: any;
|
|
26
25
|
disabled?: boolean;
|
|
27
26
|
activationKey?: any;
|
|
28
27
|
tooltip?: string;
|
|
29
28
|
plugins?: import("./classes/plugin").Plugin[];
|
|
30
|
-
|
|
29
|
+
froalaPlugins: FroalaPlugin[];
|
|
30
|
+
froalaConfig?: any;
|
|
31
31
|
assetsJSPath?: string;
|
|
32
32
|
assetsCSSPath?: string;
|
|
33
|
+
buttons?: {
|
|
34
|
+
name: string;
|
|
35
|
+
svgKey?: string;
|
|
36
|
+
title?: string;
|
|
37
|
+
focus?: boolean;
|
|
38
|
+
undo?: boolean;
|
|
39
|
+
refreshAfterCallback?: boolean;
|
|
40
|
+
click: (editor: any) => void;
|
|
41
|
+
}[];
|
|
33
42
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Observable } from 'rxjs';
|
|
2
2
|
import { Plugin } from '../classes/plugin';
|
|
3
|
-
import {
|
|
3
|
+
import { FroalaPlugin } from '../enums/default-plugin.enum';
|
|
4
4
|
export interface FsHtmlEditorConfig {
|
|
5
5
|
image?: FsHtmlEditorUploadConfig;
|
|
6
6
|
label?: string;
|
|
@@ -11,14 +11,23 @@ export interface FsHtmlEditorConfig {
|
|
|
11
11
|
placeholder?: string;
|
|
12
12
|
maxLength?: number;
|
|
13
13
|
autofocus?: boolean;
|
|
14
|
-
froalaConfig?: any;
|
|
15
14
|
disabled?: boolean;
|
|
16
15
|
activationKey?: any;
|
|
17
16
|
tooltip?: string;
|
|
18
17
|
plugins?: Plugin[];
|
|
19
|
-
|
|
18
|
+
froalaPlugins?: FroalaPlugin[];
|
|
19
|
+
froalaConfig?: any;
|
|
20
20
|
assetsJSPath?: string;
|
|
21
21
|
assetsCSSPath?: string;
|
|
22
|
+
buttons?: {
|
|
23
|
+
name: string;
|
|
24
|
+
svgKey?: string;
|
|
25
|
+
title?: string;
|
|
26
|
+
focus?: boolean;
|
|
27
|
+
undo?: boolean;
|
|
28
|
+
refreshAfterCallback?: boolean;
|
|
29
|
+
click: (editor: any) => void;
|
|
30
|
+
}[];
|
|
22
31
|
}
|
|
23
32
|
export interface FsHtmlEditorUploadConfig {
|
|
24
33
|
width?: number | undefined;
|
|
@@ -5,7 +5,7 @@ export declare class FsFroalaLoaderService {
|
|
|
5
5
|
private _defaultConfig;
|
|
6
6
|
private _FroalaEditor;
|
|
7
7
|
private _froalaLoaded;
|
|
8
|
-
private
|
|
8
|
+
private _froalaPluginsLoaded;
|
|
9
9
|
private _loaded$;
|
|
10
10
|
constructor(_defaultConfig: FsHtmlEditorConfig);
|
|
11
11
|
get loaded$(): Observable<boolean>;
|
|
@@ -14,7 +14,7 @@ export declare class FsFroalaLoaderService {
|
|
|
14
14
|
private _load;
|
|
15
15
|
private _loadPlugins;
|
|
16
16
|
private _froalaDone;
|
|
17
|
-
private
|
|
17
|
+
private _froalaPluginsDone;
|
|
18
18
|
static ɵfac: i0.ɵɵFactoryDeclaration<FsFroalaLoaderService, [{ optional: true; }]>;
|
|
19
19
|
static ɵprov: i0.ɵɵInjectableDeclaration<FsFroalaLoaderService>;
|
|
20
20
|
}
|
|
@@ -405,6 +405,7 @@
|
|
|
405
405
|
quote: 'plugins/quote.min.js',
|
|
406
406
|
draggable: 'plugins/draggable.min.js',
|
|
407
407
|
font_size: 'plugins/font_size.min.js',
|
|
408
|
+
quick_insert: 'plugins/quick_insert.min.js',
|
|
408
409
|
};
|
|
409
410
|
var stylesPaths = {
|
|
410
411
|
froala: 'froala_editor.pkgd.min.css',
|
|
@@ -471,8 +472,8 @@
|
|
|
471
472
|
function FsFroalaLoaderService(_defaultConfig) {
|
|
472
473
|
this._defaultConfig = _defaultConfig;
|
|
473
474
|
this._froalaLoaded = new rxjs.BehaviorSubject(false);
|
|
474
|
-
this.
|
|
475
|
-
this._loaded$ = rxjs.combineLatest([this._froalaLoaded, this.
|
|
475
|
+
this._froalaPluginsLoaded = new rxjs.BehaviorSubject(false);
|
|
476
|
+
this._loaded$ = rxjs.combineLatest([this._froalaLoaded, this._froalaPluginsLoaded])
|
|
476
477
|
.pipe(operators.map(function (_a) {
|
|
477
478
|
var _b = __read(_a, 2), FroalaReady = _b[0], pluginsRead = _b[1];
|
|
478
479
|
return pluginsRead && FroalaReady;
|
|
@@ -496,7 +497,7 @@
|
|
|
496
497
|
});
|
|
497
498
|
Object.defineProperty(FsFroalaLoaderService.prototype, "ready", {
|
|
498
499
|
get: function () {
|
|
499
|
-
return this._froalaLoaded.getValue() && this.
|
|
500
|
+
return this._froalaLoaded.getValue() && this._froalaPluginsLoaded.getValue();
|
|
500
501
|
},
|
|
501
502
|
enumerable: false,
|
|
502
503
|
configurable: true
|
|
@@ -520,13 +521,13 @@
|
|
|
520
521
|
}), operators.concatMap(function () {
|
|
521
522
|
return _this._loadPlugins();
|
|
522
523
|
}), operators.tap(function () {
|
|
523
|
-
_this.
|
|
524
|
+
_this._froalaPluginsDone();
|
|
524
525
|
}))
|
|
525
526
|
.subscribe();
|
|
526
527
|
};
|
|
527
528
|
FsFroalaLoaderService.prototype._loadPlugins = function () {
|
|
528
529
|
var imports = this._defaultConfig
|
|
529
|
-
.
|
|
530
|
+
.froalaPlugins
|
|
530
531
|
.reduce(function (acc, pluginName) {
|
|
531
532
|
var import$ = ResourceLoader.loadResource(pluginName);
|
|
532
533
|
acc.push(import$);
|
|
@@ -537,8 +538,8 @@
|
|
|
537
538
|
FsFroalaLoaderService.prototype._froalaDone = function () {
|
|
538
539
|
this._froalaLoaded.next(true);
|
|
539
540
|
};
|
|
540
|
-
FsFroalaLoaderService.prototype.
|
|
541
|
-
this.
|
|
541
|
+
FsFroalaLoaderService.prototype._froalaPluginsDone = function () {
|
|
542
|
+
this._froalaPluginsLoaded.next(true);
|
|
542
543
|
};
|
|
543
544
|
return FsFroalaLoaderService;
|
|
544
545
|
}());
|
|
@@ -656,7 +657,7 @@
|
|
|
656
657
|
if (options === void 0) { options = {}; }
|
|
657
658
|
var config = this._createConfig();
|
|
658
659
|
this._initPlugins(config);
|
|
659
|
-
|
|
660
|
+
this._initButtons(config);
|
|
660
661
|
this._editor = new this._fr.FroalaEditor(this.el, this._createOptions(), function () {
|
|
661
662
|
_this._froalaReady$.next({ config: config, options: options });
|
|
662
663
|
});
|
|
@@ -666,21 +667,11 @@
|
|
|
666
667
|
var processor = new file.FileProcessor();
|
|
667
668
|
var file$1 = new file.FsFile(blob);
|
|
668
669
|
return processor.process([file$1], this.config.image)
|
|
669
|
-
.pipe(operators.switchMap(function (
|
|
670
|
-
var
|
|
670
|
+
.pipe(operators.switchMap(function (_d) {
|
|
671
|
+
var _e = __read(_d, 1), f = _e[0];
|
|
671
672
|
return _this.config.image.upload(f.file);
|
|
672
673
|
}));
|
|
673
674
|
};
|
|
674
|
-
FsHtmlEditorComponent.prototype._getTextNode = function (node) {
|
|
675
|
-
if (node) {
|
|
676
|
-
if (node.nodeType === Node.TEXT_NODE) {
|
|
677
|
-
return node;
|
|
678
|
-
}
|
|
679
|
-
if (node.childNodes) {
|
|
680
|
-
return this._getTextNode(node.childNodes[0]);
|
|
681
|
-
}
|
|
682
|
-
}
|
|
683
|
-
};
|
|
684
675
|
FsHtmlEditorComponent.prototype.uninitializedClick = function (event) {
|
|
685
676
|
if (!event.defaultPrevented) {
|
|
686
677
|
var target_1 = event.target;
|
|
@@ -781,6 +772,42 @@
|
|
|
781
772
|
// this._html = html;
|
|
782
773
|
this.onChange(html);
|
|
783
774
|
};
|
|
775
|
+
FsHtmlEditorComponent.prototype._initButtons = function (config) {
|
|
776
|
+
var _this = this;
|
|
777
|
+
(config.buttons || [])
|
|
778
|
+
.forEach(function (button) {
|
|
779
|
+
/*
|
|
780
|
+
Svg Keys:
|
|
781
|
+
["add", "advancedImageEditor", "alignCenter", "alignJustify", "alignLeft", "alignRight",
|
|
782
|
+
"anchors", "back", "backgroundColor", "blockquote", "bold", "cellBackground",
|
|
783
|
+
"cellBorderColor", "cellOptions", "cellStyle", "clearFormatting", "close", "codeView",
|
|
784
|
+
"cogs", "columns", "editLink", "exitFullscreen", "fontAwesome", "fontFamily",
|
|
785
|
+
"fontSize", "fullscreen", "help", "horizontalLine", "imageAltText", "imageCaption",
|
|
786
|
+
"imageClass", "imageDisplay", "imageManager", "imageSize", "indent", "inlineClass",
|
|
787
|
+
"inlineStyle", "insertEmbed", "insertFile", "insertImage", "insertLink", "insertMore",
|
|
788
|
+
"insertTable", "insertVideo", "upload", "italic", "search", "lineHeight", "linkStyles",
|
|
789
|
+
"mention", "more", "openLink", "orderedList", "outdent", "pageBreaker",
|
|
790
|
+
"paragraphFormat", "paragraphMore", "paragraphStyle", "pdfExport", "print",
|
|
791
|
+
"redo", "removeTable", "remove", "replaceImage", "row", "selectAll", "smile",
|
|
792
|
+
"spellcheck", "star", "strikeThrough", "subscript", "superscript", "symbols", "tags",
|
|
793
|
+
"tableHeader", "tableStyle", "textColor", "textMore", "underline", "undo", "unlink",
|
|
794
|
+
"unorderedList", "verticalAlignBottom", "verticalAlignMiddle", "verticalAlignTop"]
|
|
795
|
+
*/
|
|
796
|
+
var _a, _b, _c;
|
|
797
|
+
if (button.svgKey) {
|
|
798
|
+
_this._fr.FroalaEditor.DefineIcon(button.name, { SVG_KEY: button.svgKey });
|
|
799
|
+
}
|
|
800
|
+
_this._fr.FroalaEditor.RegisterCommand(button.name, {
|
|
801
|
+
title: button.title,
|
|
802
|
+
focus: (_a = button.focus) !== null && _a !== void 0 ? _a : true,
|
|
803
|
+
undo: (_b = button.undo) !== null && _b !== void 0 ? _b : true,
|
|
804
|
+
refreshAfterCallback: (_c = button.refreshAfterCallback) !== null && _c !== void 0 ? _c : true,
|
|
805
|
+
callback: function () {
|
|
806
|
+
button.click(this);
|
|
807
|
+
}
|
|
808
|
+
});
|
|
809
|
+
});
|
|
810
|
+
};
|
|
784
811
|
FsHtmlEditorComponent.prototype._initPlugins = function (config) {
|
|
785
812
|
var _this = this;
|
|
786
813
|
(config.plugins || []).forEach(function (plugin) {
|
|
@@ -886,8 +913,8 @@
|
|
|
886
913
|
};
|
|
887
914
|
}
|
|
888
915
|
_this.initialize(options);
|
|
889
|
-
}), operators.switchMap(function () { return _this._froalaReady$; }), operators.filter(function (data) { return !!data; }), operators.tap(function (
|
|
890
|
-
var config =
|
|
916
|
+
}), operators.switchMap(function () { return _this._froalaReady$; }), operators.filter(function (data) { return !!data; }), operators.tap(function (_d) {
|
|
917
|
+
var config = _d.config, options = _d.options;
|
|
891
918
|
_this._setupFroala(config, options);
|
|
892
919
|
}))
|
|
893
920
|
.subscribe();
|
|
@@ -998,6 +1025,16 @@
|
|
|
998
1025
|
this.focus();
|
|
999
1026
|
}
|
|
1000
1027
|
};
|
|
1028
|
+
FsHtmlEditorComponent.prototype._getTextNode = function (node) {
|
|
1029
|
+
if (node) {
|
|
1030
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
1031
|
+
return node;
|
|
1032
|
+
}
|
|
1033
|
+
if (node.childNodes) {
|
|
1034
|
+
return this._getTextNode(node.childNodes[0]);
|
|
1035
|
+
}
|
|
1036
|
+
}
|
|
1037
|
+
};
|
|
1001
1038
|
return FsHtmlEditorComponent;
|
|
1002
1039
|
}());
|
|
1003
1040
|
FsHtmlEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsHtmlEditorComponent, deps: [{ token: FS_HTML_EDITOR_CONFIG, optional: true }, { token: i0__namespace.ChangeDetectorRef }, { token: FsFroalaLoaderService }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
@@ -1099,7 +1136,7 @@
|
|
|
1099
1136
|
}]
|
|
1100
1137
|
}] });
|
|
1101
1138
|
function FsHtmlEditorConfigFactory(config) {
|
|
1102
|
-
return Object.assign({
|
|
1139
|
+
return Object.assign({ froalaPlugins: [
|
|
1103
1140
|
"align" /* Align */,
|
|
1104
1141
|
"colors" /* Colors */,
|
|
1105
1142
|
"image" /* Image */,
|