@libs-ui/components-inputs-quill 0.2.326-0 → 0.2.327-0

package/index.d.ts

@@ -1,3 +1,4 @@
 export * from './quill.component';
 export * from './quill2x.component';
 export * from './interfaces/quill.interface';
+export * from './interfaces/quill2x.interface';

package/interfaces/quill2x.interface.d.ts

@@ -0,0 +1,62 @@
+import { ILabel } from '@libs-ui/components-label';
+import Quill2x, { Range, EmitterSource } from 'quill2x';
+import Delta from 'quill-delta';
+export type QUILL2X_TYPE_MODE_BAR_CONFIG_OPTION = 'all' | 'default' | 'basic' | 'custom';
+export interface IQuill2xToolbarConfig {
+    type: string;
+    mode?: Array<QUILL2X_TYPE_MODE_BAR_CONFIG_OPTION>;
+    width: number;
+    display?: boolean;
+}
+export interface IQuill2xEventSave {
+    link: string;
+    width?: number;
+    height?: number;
+}
+export interface IQuill2xUploadImageConfig {
+    modeCustom: boolean;
+    showIcon?: boolean;
+    zIndex?: number;
+    maxImageSize?: number;
+    label?: ILabel;
+    onlyAcceptImageHttpsLink?: boolean;
+    functionUploadImage?: (files: Array<File>) => Promise<Array<string | ArrayBuffer>>;
+}
+export interface IQuill2xFunctionControlEvent {
+    checkIsValid: () => Promise<boolean>;
+    refreshItemValue: () => void;
+    setContent: (content: string) => Promise<void>;
+    insertText: (value: string, index?: number, focusLt?: boolean) => Promise<void>;
+    insertLink: (value: string, url: string, index?: number) => Promise<void>;
+    insertImage: (content: string, index?: number) => Promise<void>;
+    setFontSize: (size: number) => Promise<Delta | undefined>;
+    setColor: (color: string) => Promise<Delta | undefined>;
+    setBackground: (color: string) => Promise<Delta | undefined>;
+    setMessageError: (message: string) => Promise<void>;
+    quill: () => Quill2x | undefined;
+    reCalculatorToolbar: () => Promise<void>;
+}
+export interface IQuill2xLink {
+    title: string;
+    url: string;
+    range: {
+        index: number;
+        length: number;
+    };
+}
+export interface IQuill2xBlotRegister {
+    component: any;
+    className: string;
+    style: string;
+    ignoreDelete?: boolean;
+}
+export interface IQuill2xSelectionChange {
+    quill: Quill2x;
+    range: Range;
+    oldRange: Range;
+    source: EmitterSource;
+}
+export interface IQuill2xTextChange {
+    quill: Quill2x;
+    delta: Delta;
+}

package/package.json

@@ -1,30 +1,31 @@
 {
   "name": "@libs-ui/components-inputs-quill",
-  "version": "0.2.326-0",
+  "version": "0.2.327-0",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",
     "quill": "1.3.7",
+    "quill2x": "npm:quill@2.0.3",
     "parchment": "1.1.4",
-    "@libs-ui/components-label": "0.2.326-0",
+    "@libs-ui/components-label": "0.2.327-0",
     "quill-delta": "5.1.0",
-    "@libs-ui/components-inputs-valid": "0.2.326-0",
-    "@libs-ui/components-modal": "0.2.326-0",
-    "@libs-ui/utils": "0.2.326-0",
-    "@libs-ui/components-buttons-button": "0.2.326-0",
-    "@libs-ui/components-buttons-select-color": "0.2.326-0",
-    "@libs-ui/components-dropdown": "0.2.326-0",
-    "@libs-ui/components-inputs-emoji": "0.2.326-0",
-    "@libs-ui/components-inputs-mention": "0.2.326-0",
-    "@libs-ui/components-list": "0.2.326-0",
-    "@libs-ui/components-popover": "0.2.326-0",
-    "@libs-ui/interfaces-types": "0.2.326-0",
-    "@libs-ui/services-dynamic-component": "0.2.326-0",
+    "@libs-ui/components-inputs-valid": "0.2.327-0",
+    "@libs-ui/components-modal": "0.2.327-0",
+    "@libs-ui/utils": "0.2.327-0",
+    "@libs-ui/components-buttons-button": "0.2.327-0",
+    "@libs-ui/components-buttons-select-color": "0.2.327-0",
+    "@libs-ui/components-dropdown": "0.2.327-0",
+    "@libs-ui/components-inputs-emoji": "0.2.327-0",
+    "@libs-ui/components-inputs-mention": "0.2.327-0",
+    "@libs-ui/components-list": "0.2.327-0",
+    "@libs-ui/components-popover": "0.2.327-0",
+    "@libs-ui/interfaces-types": "0.2.327-0",
+    "@libs-ui/services-dynamic-component": "0.2.327-0",
     "@ngx-translate/core": "^15.0.0",
     "rxjs": "~7.8.0",
-    "@libs-ui/components-spinner": "0.2.326-0",
-    "@libs-ui/services-notification": "0.2.326-0",
-    "@libs-ui/services-http-request": "0.2.326-0"
+    "@libs-ui/components-spinner": "0.2.327-0",
+    "@libs-ui/services-notification": "0.2.327-0",
+    "@libs-ui/services-http-request": "0.2.327-0"
   },
   "sideEffects": false,
   "module": "fesm2022/libs-ui-components-inputs-quill.mjs",

package/quill.component.d.ts

@@ -33,6 +33,8 @@ export declare class LibsUiComponentsInputsQuillComponent implements OnInit, Aft
     protected displayShowMoreToolbar: import("@angular/core").Signal<boolean>;
     protected displaySkeleton: import("@angular/core").Signal<boolean>;
     private timeCalculationToolBar;
+    private timerCalculatorToolbar;
+    private totalRecallCalculatorToolbar;
     private popoverFunctionControl;
     private quill;
     private handlers;

package/quill2x.component.d.ts

@@ -1,16 +1,21 @@
-import { OnInit, TemplateRef, WritableSignal } from '@angular/core';
+import { OnDestroy, OnInit, TemplateRef, WritableSignal } from '@angular/core';
 import { IEmitSelectKey } from '@libs-ui/components-dropdown';
+import { IValidLength, IValidRequired } from '@libs-ui/components-inputs-valid';
 import { ILabel } from '@libs-ui/components-label';
 import { IListConfigItem } from '@libs-ui/components-list';
 import { TYPE_POPOVER_EVENT } from '@libs-ui/components-popover';
-import { IQuillBlotRegister, IQuillFunctionControlEvent, IQuillLink, IQuillSelectionChange, IQuillTextChange, IQuillToolbarConfig, IQuillUploadImageConfig, TYPE_MODE_BAR_CONFIG_OPTION } from './interfaces/quill.interface';
+import { IQuill2xToolbarConfig, IQuill2xBlotRegister, IQuill2xFunctionControlEvent, IQuill2xLink, IQuill2xSelectionChange, IQuill2xTextChange, IQuill2xUploadImageConfig, QUILL2X_TYPE_MODE_BAR_CONFIG_OPTION } from './interfaces/quill2x.interface';
 import * as i0 from "@angular/core";
-export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
+export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit, OnDestroy {
     private quill?;
     private addEditLinkComponentRef;
     private uploadImageComponentRef;
     private handlers;
     private timerSetFontSize;
+    private timerCalculatorToolbar;
+    private totalRecallCalculatorToolbar;
+    private isCalculatorToolbarSuccess;
+    protected borderColor: import("@angular/core").Signal<string>;
     protected containerToolbarClass: import("@angular/core").Signal<string>;
     protected containerEditorClass: import("@angular/core").Signal<string>;
     protected showButtonMoreToolbar: import("@angular/core").Signal<boolean>;
@@ -26,23 +31,26 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     protected iconAlignSelectedComputed: import("@angular/core").Signal<any>;
     protected colorSelected: WritableSignal<boolean>;
     protected backgroundSelected: WritableSignal<boolean>;
+    protected messageError: WritableSignal<string>;
     protected size: WritableSignal<{
         value: number;
     }>;
-    protected link: WritableSignal<IQuillLink>;
+    protected link: WritableSignal<IQuill2xLink>;
     protected showMoreAction: WritableSignal<boolean>;
-    protected toolbarOptionsConfig: WritableSignal<Array<IQuillToolbarConfig>>;
+    protected toolbarOptionsConfig: WritableSignal<Array<IQuill2xToolbarConfig>>;
     protected loadingUploadImage: WritableSignal<boolean>;
-    readonly uploadImageConfig: import("@angular/core").InputSignalWithTransform<IQuillUploadImageConfig, IQuillUploadImageConfig | undefined>;
+    readonly uploadImageConfig: import("@angular/core").InputSignalWithTransform<IQuill2xUploadImageConfig, IQuill2xUploadImageConfig | undefined>;
     readonly placeholder: import("@angular/core").InputSignalWithTransform<string, string | undefined>;
-    readonly blotsRegister: import("@angular/core").InputSignal<IQuillBlotRegister[] | undefined>;
+    readonly blotsRegister: import("@angular/core").InputSignal<IQuill2xBlotRegister[] | undefined>;
     readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, boolean | undefined>;
     readonly quillCustomConfig: import("@angular/core").InputSignal<{
         toolbar?: {
             hidden?: boolean;
-            type: TYPE_MODE_BAR_CONFIG_OPTION;
-            options?: Array<IQuillToolbarConfig>;
+            type: QUILL2X_TYPE_MODE_BAR_CONFIG_OPTION;
+            options?: Array<IQuill2xToolbarConfig>;
             classCustomContainerToolbar?: string;
+            lessWidthToolbarRecallCalculator?: number;
+            maximumRecallCalculator?: number;
         };
         editor?: {
             classCustomContainerEditor?: string;
@@ -60,8 +68,15 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
         title: string;
         action: () => void;
     }[] | undefined>;
+    readonly autoFocus: import("@angular/core").InputSignal<boolean | undefined>;
+    readonly focusBottom: import("@angular/core").InputSignal<boolean | undefined>;
+    readonly validRequired: import("@angular/core").InputSignal<IValidRequired | undefined>;
+    readonly validMinLength: import("@angular/core").InputSignal<IValidLength | undefined>;
+    readonly validMaxLength: import("@angular/core").InputSignal<IValidLength | undefined>;
+    readonly showErrorLabel: import("@angular/core").InputSignalWithTransform<boolean, boolean | undefined>;
+    readonly showErrorBorder: import("@angular/core").InputSignal<boolean | undefined>;
     readonly outShowPopupEditLink: import("@angular/core").OutputEmitterRef<{
-        dataLink: IQuillLink;
+        dataLink: IQuill2xLink;
         callback: (linkEdit: {
             title: string;
             link: string;
@@ -71,10 +86,10 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     readonly outBlur: import("@angular/core").OutputEmitterRef<void>;
     readonly outFocus: import("@angular/core").OutputEmitterRef<void>;
     readonly outChange: import("@angular/core").OutputEmitterRef<string>;
-    readonly outSelectionChange: import("@angular/core").OutputEmitterRef<IQuillSelectionChange>;
-    readonly outTextChange: import("@angular/core").OutputEmitterRef<IQuillTextChange>;
+    readonly outSelectionChange: import("@angular/core").OutputEmitterRef<IQuill2xSelectionChange>;
+    readonly outTextChange: import("@angular/core").OutputEmitterRef<IQuill2xTextChange>;
     readonly outContextMenu: import("@angular/core").OutputEmitterRef<MouseEvent>;
-    readonly outFunctionsControl: import("@angular/core").OutputEmitterRef<IQuillFunctionControlEvent>;
+    readonly outFunctionsControl: import("@angular/core").OutputEmitterRef<IQuill2xFunctionControlEvent>;
     private readonly htmlContainer;
     private readonly quillBodyContainer;
     private readonly toolbarContainer;
@@ -85,8 +100,8 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     private readonly translate;
     private readonly cdr;
     private readonly dynamicComponentService;
-    ngOnInit(): void;
-    get FunctionsControl(): any;
+    ngOnInit(): Promise<void>;
+    get FunctionsControl(): IQuill2xFunctionControlEvent;
     protected handlerChangeShowMoreAction(event: Event): void;
     protected handleSelectFont(event: IEmitSelectKey | undefined): void;
     protected handleSelectHeader(event: IEmitSelectKey | undefined): void;
@@ -94,6 +109,8 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     protected handleSelectAlign(event: IEmitSelectKey | undefined): void;
     protected handlerSetFormat(type: string, data: string | number): void;
     protected handlerInsertEmoji(emoji: unknown): void;
+    protected handlerUnlink(event: Event): void;
+    protected handlerEditLink(event: Event): void;
     private handleTable;
     private handleUndo;
     private handleRedo;
@@ -102,6 +119,7 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     private handlerSelectionChange;
     private handlerPaste;
     private handlerTextChange;
+    private validate;
     private updateHandlerFunction;
     private noPreventEmbedDeletion;
     private setFontSizeSelected;
@@ -116,11 +134,12 @@ export declare class LibsUiComponentsInputsQuill2xComponent implements OnInit {
     private insertImage;
     protected handlerPopoverEvent(event: TYPE_POPOVER_EVENT): void;
     private insertLink;
-    protected handlerEditLink(event: Event): void;
-    protected handleShowUploadLink(event: unknown): void;
-    protected handlerUnlink(event: Event): void;
-    private handlerUnInsertLink;
+    private handleShowUploadLink;
+    private updateValueByRootQuillHtml;
+    private convertInnerHTMLAndSetValue;
     private removeUnwantedPart;
+    private focus;
+    ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsInputsQuill2xComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsInputsQuill2xComponent, "libs_ui-components-inputs-quill2x", never, { "uploadImageConfig": { "alias": "uploadImageConfig"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "blotsRegister": { "alias": "blotsRegister"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "quillCustomConfig": { "alias": "quillCustomConfig"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "item": { "alias": "item"; "required": true; "isSignal": true; }; "fieldBind": { "alias": "fieldBind"; "required": true; "isSignal": true; }; "autoUpdateValueWhenTextChange": { "alias": "autoUpdateValueWhenTextChange"; "required": false; "isSignal": true; }; "templateToolBarPersonalize": { "alias": "templateToolBarPersonalize"; "required": false; "isSignal": true; }; "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "ignoreShowPopupEditLink": { "alias": "ignoreShowPopupEditLink"; "required": false; "isSignal": true; }; "ignoreCommunicateMicroEventPopup": { "alias": "ignoreCommunicateMicroEventPopup"; "required": false; "isSignal": true; }; "handlersExpand": { "alias": "handlersExpand"; "required": false; "isSignal": true; }; }, { "item": "itemChange"; "outShowPopupEditLink": "outShowPopupEditLink"; "outMessageError": "outMessageError"; "outBlur": "outBlur"; "outFocus": "outFocus"; "outChange": "outChange"; "outSelectionChange": "outSelectionChange"; "outTextChange": "outTextChange"; "outContextMenu": "outContextMenu"; "outFunctionsControl": "outFunctionsControl"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsInputsQuill2xComponent, "libs_ui-components-inputs-quill2x", never, { "uploadImageConfig": { "alias": "uploadImageConfig"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "blotsRegister": { "alias": "blotsRegister"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "quillCustomConfig": { "alias": "quillCustomConfig"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "item": { "alias": "item"; "required": true; "isSignal": true; }; "fieldBind": { "alias": "fieldBind"; "required": true; "isSignal": true; }; "autoUpdateValueWhenTextChange": { "alias": "autoUpdateValueWhenTextChange"; "required": false; "isSignal": true; }; "templateToolBarPersonalize": { "alias": "templateToolBarPersonalize"; "required": false; "isSignal": true; }; "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "ignoreShowPopupEditLink": { "alias": "ignoreShowPopupEditLink"; "required": false; "isSignal": true; }; "ignoreCommunicateMicroEventPopup": { "alias": "ignoreCommunicateMicroEventPopup"; "required": false; "isSignal": true; }; "handlersExpand": { "alias": "handlersExpand"; "required": false; "isSignal": true; }; "autoFocus": { "alias": "autoFocus"; "required": false; "isSignal": true; }; "focusBottom": { "alias": "focusBottom"; "required": false; "isSignal": true; }; "validRequired": { "alias": "validRequired"; "required": false; "isSignal": true; }; "validMinLength": { "alias": "validMinLength"; "required": false; "isSignal": true; }; "validMaxLength": { "alias": "validMaxLength"; "required": false; "isSignal": true; }; "showErrorLabel": { "alias": "showErrorLabel"; "required": false; "isSignal": true; }; "showErrorBorder": { "alias": "showErrorBorder"; "required": false; "isSignal": true; }; }, { "item": "itemChange"; "outShowPopupEditLink": "outShowPopupEditLink"; "outMessageError": "outMessageError"; "outBlur": "outBlur"; "outFocus": "outFocus"; "outChange": "outChange"; "outSelectionChange": "outSelectionChange"; "outTextChange": "outTextChange"; "outContextMenu": "outContextMenu"; "outFunctionsControl": "outFunctionsControl"; }, never, never, true, never>;
 }