@solidev/data 0.0.1-rc.1 → 0.0.1-rc.2

package/fesm2020/solidev-data.mjs

@@ -4016,49 +4016,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImpor
                 type: Input
             }] } });
 
+const RichEditToolbars = {
+    default: [
+        ['bold', 'italic'],
+        ['underline', 'strike'],
+        ['code', 'blockquote'],
+        ['ordered_list', 'bullet_list'],
+        [{ heading: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] }],
+        ['link'],
+        ['text_color', 'background_color'],
+        ['align_left', 'align_center', 'align_right', 'align_justify'],
+    ],
+    light: [
+        ['bold', 'italic', 'underline'],
+        ['ordered_list', 'bullet_list'],
+        ['text_color'],
+        ['align_left', 'align_center', 'align_right', 'align_justify'],
+    ],
+    none: [],
+};
 class RicheditComponent {
     constructor() {
         this.editable = true;
         this.edit = true;
         this.mode = 'dd';
-        /**
-         *  Hide label (for inline forms)
-         */
+        /** Hide label (for inline forms) */
         this.hideLabel = false;
-        /**
-         * Hide button (for changed usage)
-         */
+        /** Hide button (for changed usage) */
         this.hideButton = false;
+        /** Toolbar mode */
+        this.toolbar = 'default';
         this.changed = new EventEmitter();
-        this.toolbar = [
-            ['bold', 'italic'],
-            ['underline', 'strike'],
-            ['code', 'blockquote'],
-            ['ordered_list', 'bullet_list'],
-            [{ heading: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] }],
-            ['link'],
-            ['text_color', 'background_color'],
-            ['align_left', 'align_center', 'align_right', 'align_justify'],
-        ];
         this.html = '';
-        this.fc = new FormControl('');
     }
     ngOnInit() {
         this.editor = new Editor();
-        this.manager = this.model?.FM(this.field);
-        this.required = this.manager?.required || false;
-        if (this.model) {
-            this.fc.setValue(this.model[this.field] || '', {
-                emitEvent: false,
-            });
+        if (this.toolbar === 'light' || this.toolbar === 'default') {
+            this.realToolbar = RichEditToolbars[this.toolbar];
         }
-        if (this.edit) {
-            this.fc.enable();
+        else if (this.toolbar === 'none') {
         }
         else {
-            this.fc.disable();
+            this.realToolbar = this.toolbar;
+        }
+        if (!this.fc) {
+            this.fc = new FormControl('');
+            if (this.model && this.field) {
+                this.manager = this.model.FM(this.field);
+                this.required = this.manager?.required || false;
+                this.fc.setValue(this.model[this.field] || '', {
+                    emitEvent: false,
+                });
+            }
+            if (this.edit) {
+                this.fc.enable();
+            }
+            else {
+                this.fc.disable();
+            }
+            this.fc.valueChanges.subscribe((v) => this.changed.emit(v));
         }
-        this.fc.valueChanges.subscribe((v) => this.changed.emit(v));
     }
     // make sure to destory the editor
     ngOnDestroy() {
@@ -4081,17 +4098,19 @@ class RicheditComponent {
         }
     }
     async save() {
-        this.model.setFV(this.field, this.fc.value);
-        if (this.mode === 'dd') {
-            await firstValueFrom(this.model.save({ updateModel: true }));
+        if (this.model && this.field) {
+            this.model.setFV(this.field, this.fc.value);
+            if (this.mode === 'dd') {
+                await firstValueFrom(this.model.save({ updateModel: true }));
+            }
         }
     }
 }
 RicheditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: RicheditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RicheditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: RicheditComponent, isStandalone: true, selector: "data-richedit", inputs: { model: "model", field: "field", editable: "editable", edit: "edit", mode: "mode", hideLabel: "hideLabel", hideButton: "hideButton" }, outputs: { changed: "changed" }, ngImport: i0, template: "\n<ng-template #editorTemplate>\n  <div class=\"NgxEditor__Wrapper\">\n    <ngx-editor-menu [editor]=\"editor\" [toolbar]=\"toolbar\" *ngIf=\"edit\"></ngx-editor-menu>\n    <ngx-editor [editor]=\"editor\" [formControl]=\"fc\" [placeholder]=\"''\"></ngx-editor>\n  </div>\n  <button class=\"btn btn-primary btn-sm w-100 mt-1\" *ngIf=\"edit &amp;&amp; !hideButton\" (click)=\"save()\"><i class=\"bi bi-save me-2\"></i>Enregistrer</button>\n</ng-template>\n<ng-template #titleTpl>\n  <ng-content></ng-content>\n</ng-template>\n<!-- Dd display-->\n<ng-container *ngIf=\"mode==='dd'\">\n  <dt [class.required]=\"required\" *ngIf=\"!hideLabel\"><span class=\"editable\" (click)=\"toggleEdit()\" role=\"button\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container></span></dt>\n  <dd [class.mb-0]=\"hideLabel\">\n    <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n  </dd>\n</ng-container>\n<!-- Inline display-->\n<ng-container *ngIf=\"mode==='inline'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>\n<!-- Form display-->\n<ng-container *ngIf=\"mode==='form'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgxEditorModule }, { kind: "component", type: i2$3.NgxEditorComponent, selector: "ngx-editor", inputs: ["editor", "outputFormat", "placeholder"], outputs: ["focusOut", "focusIn"] }, { kind: "component", type: i2$3.MenuComponent, selector: "ngx-editor-menu", inputs: ["toolbar", "colorPresets", "disabled", "editor", "customMenuRef", "dropdownPlacement"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+RicheditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: RicheditComponent, isStandalone: true, selector: "data-richedit", inputs: { model: "model", field: "field", editable: "editable", edit: "edit", mode: "mode", hideLabel: "hideLabel", hideButton: "hideButton", fc: "fc", toolbar: "toolbar" }, outputs: { changed: "changed" }, ngImport: i0, template: "\n<ng-template #editorTemplate>\n  <div class=\"NgxEditor__Wrapper\">\n    <ngx-editor-menu [editor]=\"editor\" [toolbar]=\"realToolbar\" *ngIf=\"edit &amp;&amp; toolbar!=='none'\"></ngx-editor-menu>\n    <ngx-editor [editor]=\"editor\" [formControl]=\"fc\" [placeholder]=\"''\"></ngx-editor>\n  </div>\n  <button class=\"btn btn-primary btn-sm w-100 mt-1\" *ngIf=\"edit &amp;&amp; !hideButton\" (click)=\"save()\"><i class=\"bi bi-save me-2\"></i>Enregistrer</button>\n</ng-template>\n<ng-template #titleTpl>\n  <ng-content></ng-content>\n</ng-template>\n<!-- Dd display-->\n<ng-container *ngIf=\"mode==='dd'\">\n  <dt [class.required]=\"required\" *ngIf=\"!hideLabel\"><span class=\"editable\" (click)=\"toggleEdit()\" role=\"button\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container></span></dt>\n  <dd [class.mb-0]=\"hideLabel\">\n    <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n  </dd>\n</ng-container>\n<!-- Inline display-->\n<ng-container *ngIf=\"mode==='inline'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>\n<!-- Form display-->\n<ng-container *ngIf=\"mode==='form'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NgxEditorModule }, { kind: "component", type: i2$3.NgxEditorComponent, selector: "ngx-editor", inputs: ["editor", "outputFormat", "placeholder"], outputs: ["focusOut", "focusIn"] }, { kind: "component", type: i2$3.MenuComponent, selector: "ngx-editor-menu", inputs: ["toolbar", "colorPresets", "disabled", "editor", "customMenuRef", "dropdownPlacement"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: RicheditComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'data-richedit', standalone: true, imports: [CommonModule, NgxEditorModule, ReactiveFormsModule], template: "\n<ng-template #editorTemplate>\n  <div class=\"NgxEditor__Wrapper\">\n    <ngx-editor-menu [editor]=\"editor\" [toolbar]=\"toolbar\" *ngIf=\"edit\"></ngx-editor-menu>\n    <ngx-editor [editor]=\"editor\" [formControl]=\"fc\" [placeholder]=\"''\"></ngx-editor>\n  </div>\n  <button class=\"btn btn-primary btn-sm w-100 mt-1\" *ngIf=\"edit &amp;&amp; !hideButton\" (click)=\"save()\"><i class=\"bi bi-save me-2\"></i>Enregistrer</button>\n</ng-template>\n<ng-template #titleTpl>\n  <ng-content></ng-content>\n</ng-template>\n<!-- Dd display-->\n<ng-container *ngIf=\"mode==='dd'\">\n  <dt [class.required]=\"required\" *ngIf=\"!hideLabel\"><span class=\"editable\" (click)=\"toggleEdit()\" role=\"button\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container></span></dt>\n  <dd [class.mb-0]=\"hideLabel\">\n    <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n  </dd>\n</ng-container>\n<!-- Inline display-->\n<ng-container *ngIf=\"mode==='inline'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>\n<!-- Form display-->\n<ng-container *ngIf=\"mode==='form'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>" }]
+            args: [{ selector: 'data-richedit', standalone: true, imports: [CommonModule, NgxEditorModule, ReactiveFormsModule], template: "\n<ng-template #editorTemplate>\n  <div class=\"NgxEditor__Wrapper\">\n    <ngx-editor-menu [editor]=\"editor\" [toolbar]=\"realToolbar\" *ngIf=\"edit &amp;&amp; toolbar!=='none'\"></ngx-editor-menu>\n    <ngx-editor [editor]=\"editor\" [formControl]=\"fc\" [placeholder]=\"''\"></ngx-editor>\n  </div>\n  <button class=\"btn btn-primary btn-sm w-100 mt-1\" *ngIf=\"edit &amp;&amp; !hideButton\" (click)=\"save()\"><i class=\"bi bi-save me-2\"></i>Enregistrer</button>\n</ng-template>\n<ng-template #titleTpl>\n  <ng-content></ng-content>\n</ng-template>\n<!-- Dd display-->\n<ng-container *ngIf=\"mode==='dd'\">\n  <dt [class.required]=\"required\" *ngIf=\"!hideLabel\"><span class=\"editable\" (click)=\"toggleEdit()\" role=\"button\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container></span></dt>\n  <dd [class.mb-0]=\"hideLabel\">\n    <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n  </dd>\n</ng-container>\n<!-- Inline display-->\n<ng-container *ngIf=\"mode==='inline'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>\n<!-- Form display-->\n<ng-container *ngIf=\"mode==='form'\">\n  <ng-container *ngIf=\"!hideLabel\">\n    <label [class.required]=\"required\">\n      <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n    </label>\n  </ng-container>\n  <ng-container *ngTemplateOutlet=\"editorTemplate\"></ng-container>\n</ng-container>" }]
         }], propDecorators: { model: [{
                 type: Input
             }], field: [{
@@ -4106,6 +4125,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImpor
                 type: Input
             }], hideButton: [{
                 type: Input
+            }], fc: [{
+                type: Input
+            }], toolbar: [{
+                type: Input
             }], changed: [{
                 type: Output
             }] } });
@@ -5617,6 +5640,78 @@ const slugify = (str) => {
     return str;
 };
 
+// By default, Underscore uses ERB-style template delimiters, change the
+// following template settings to use alternative delimiters.
+const settings = {
+    evaluate: /<%([\s\S]+?)%>/g,
+    interpolate: /<%=([\s\S]+?)%>/g,
+    escape: /<%-([\s\S]+?)%>/g,
+    variable: 'obj',
+};
+// When customizing `templateSettings`, if you don't want to define an
+// interpolation, evaluation or escaping regex, we need one that is
+// guaranteed not to match.
+const noMatch = /.^/;
+// Certain characters need to be escaped so that they can be put into a
+// string literal.
+let escapes = {
+    '\\': '\\',
+    "'": "'",
+    r: '\r',
+    n: '\n',
+    t: '\t',
+    u2028: '\u2028',
+    u2029: '\u2029',
+};
+for (let p in escapes) {
+    escapes[escapes[p]] = p;
+}
+const escaper = /\\|'|\r|\n|\t|\u2028|\u2029/g;
+const unescaper = /\\(\\|'|r|n|t|u2028|u2029)/g;
+const tmpl = (text, data, objectName) => {
+    if (objectName) {
+        settings.variable = objectName;
+    }
+    // Compile the template source, taking care to escape characters that
+    // cannot be included in a string literal and then unescape them in code
+    // blocks.
+    let source = "__p+='" +
+        text
+            .replace(escaper, function (match) {
+            return '\\' + escapes[match];
+        })
+            .replace(settings.escape || noMatch, function (match, code) {
+            return "'+\n_.escape(" + unescape(code) + ")+\n'";
+        })
+            .replace(settings.interpolate || noMatch, function (match, code) {
+            return "'+\n(" + unescape(code) + ")+\n'";
+        })
+            .replace(settings.evaluate || noMatch, function (match, code) {
+            return "';\n" + unescape(code) + "\n;__p+='";
+        }) +
+        "';\n";
+    // If a variable is not specified, place data values in local scope.
+    if (!settings.variable) {
+        source = 'with(obj||{}){\n' + source + '}\n';
+    }
+    source =
+        "var __p='';var print=function(){__p+=Array.prototype.join.call(arguments, '')};\n" +
+            source +
+            'return __p;\n';
+    var render = new Function(settings.variable || 'obj', source);
+    if (data) {
+        return render(data);
+    }
+    const template = (data) => {
+        return render.call(this, data);
+    };
+    // Provide the compiled function source as a convenience for build time
+    // precompilation.
+    template.source =
+        'function(' + (settings.variable || 'obj') + '){\n' + source + '}';
+    return template;
+};
+
 class UpdateService {
     constructor(appRef, swUpdate) {
         this.appRef = appRef;
@@ -5690,6 +5785,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AuthInterceptor, AuthServiceBase, BanAdapter, BootstrapDataDisplayConfig, BreadcrumbComponent, ChoicePipe, Collection, CollectionMock, DATA_API_URL, DATA_AUTH_PARAMS, DATA_AUTH_SERVICE, DATA_AUTH_USER_SERVICE, DATA_DISPLAY_CONFIG, DATA_MAX_TRANSFERSTATE_TIME, DATA_MESSAGE_SOUNDS, DEFAULT_TIMEOUTS, DataBackend, DataMessageService, DataModel, DataUploaderService, DispeditComponent, FactorPipe, FactorcPipe, FkselectComponent, FlagsComponent, Jwt, Link, M2mselectComponent, Message, MessageZoneComponent, ModelList, ModelListAutocompleteFilter, ModelListAutocompleteMultiFilter, ModelListDateFilter, ModelListDatetimeFilter, ModelListDatetimerangeFilter, ModelListFieldHeaderComponent, ModelListFieldsSelectorComponent, ModelListFilters, ModelListFiltersComponent, ModelListFiltersSelectComponent, ModelListFlagsFilter, ModelListGeodistanceFilter, ModelListNumberFilter, ModelListNumberOperations, ModelListPaginatorComponent, ModelListSelectFilter, ModelListSelectMultiFilter, ModelListService, ModelListSorterComponent, ModelListTextFilter, ModelListTreeFilter, NavDriver, NgFileDropDirective, NgFileSelectDirective, NgxUploaderModule, PChoicePipe, PFactorPipe, PFactorcPipe, Queryset, RData, RicheditComponent, STATUS, SafeDeleteComponent, TabMemoryService, UpdateComponent, UpdateService, UploadStatus, booleanField, charField, computedField, dateField, datetimeField, decimalField, detailsField, emailField, floatField, foreignKeyField, humanizeBytes, integerField, isValue, manyToManyField, passwordField, primaryField, reverseForeignKeyField, slugify, strToNumber, textField };
+export { AuthInterceptor, AuthServiceBase, BanAdapter, BootstrapDataDisplayConfig, BreadcrumbComponent, ChoicePipe, Collection, CollectionMock, DATA_API_URL, DATA_AUTH_PARAMS, DATA_AUTH_SERVICE, DATA_AUTH_USER_SERVICE, DATA_DISPLAY_CONFIG, DATA_MAX_TRANSFERSTATE_TIME, DATA_MESSAGE_SOUNDS, DEFAULT_TIMEOUTS, DataBackend, DataMessageService, DataModel, DataUploaderService, DispeditComponent, FactorPipe, FactorcPipe, FkselectComponent, FlagsComponent, Jwt, Link, M2mselectComponent, Message, MessageZoneComponent, ModelList, ModelListAutocompleteFilter, ModelListAutocompleteMultiFilter, ModelListDateFilter, ModelListDatetimeFilter, ModelListDatetimerangeFilter, ModelListFieldHeaderComponent, ModelListFieldsSelectorComponent, ModelListFilters, ModelListFiltersComponent, ModelListFiltersSelectComponent, ModelListFlagsFilter, ModelListGeodistanceFilter, ModelListNumberFilter, ModelListNumberOperations, ModelListPaginatorComponent, ModelListSelectFilter, ModelListSelectMultiFilter, ModelListService, ModelListSorterComponent, ModelListTextFilter, ModelListTreeFilter, NavDriver, NgFileDropDirective, NgFileSelectDirective, NgxUploaderModule, PChoicePipe, PFactorPipe, PFactorcPipe, Queryset, RData, RichEditToolbars, RicheditComponent, STATUS, SafeDeleteComponent, TabMemoryService, UpdateComponent, UpdateService, UploadStatus, booleanField, charField, computedField, dateField, datetimeField, decimalField, detailsField, emailField, floatField, foreignKeyField, humanizeBytes, integerField, isValue, manyToManyField, passwordField, primaryField, reverseForeignKeyField, slugify, strToNumber, textField, tmpl };
 //# sourceMappingURL=solidev-data.mjs.map
 //# sourceMappingURL=solidev-data.mjs.map