@kolkov/angular-editor 3.0.0-beta.1 → 3.0.0

package/lib/angular-editor.service.d.ts

@@ -1,87 +0,0 @@
-import { HttpClient, HttpEvent } from '@angular/common/http';
-import { Observable } from 'rxjs';
-import { CustomClass } from './config';
-import * as i0 from "@angular/core";
-export interface UploadResponse {
-    imageUrl: string;
-}
-export declare class AngularEditorService {
-    private http;
-    private doc;
-    savedSelection: Range | null;
-    selectedText: string;
-    uploadUrl: string;
-    uploadWithCredentials: boolean;
-    constructor(http: HttpClient, doc: any);
-    /**
-     * Executed command from editor header buttons exclude toggleEditorMode
-     * @param command string from triggerCommand
-     * @param value
-     */
-    executeCommand(command: string, value?: string): void;
-    /**
-     * Create URL link
-     * @param url string from UI prompt
-     */
-    createLink(url: string): void;
-    /**
-     * insert color either font or background
-     *
-     * @param color color to be inserted
-     * @param where where the color has to be inserted either text/background
-     */
-    insertColor(color: string, where: string): void;
-    /**
-     * Set font name
-     * @param fontName string
-     */
-    setFontName(fontName: string): void;
-    /**
-     * Set font size
-     * @param fontSize string
-     */
-    setFontSize(fontSize: string): void;
-    /**
-     * Create raw HTML
-     * @param html HTML string
-     */
-    insertHtml(html: string): void;
-    /**
-     * save selection when the editor is focussed out
-     */
-    saveSelection: () => void;
-    /**
-     * restore selection when the editor is focused in
-     *
-     * saved selection when the editor is focused out
-     */
-    restoreSelection(): boolean;
-    /**
-     * setTimeout used for execute 'saveSelection' method in next event loop iteration
-     */
-    executeInNextQueueIteration(callbackFn: (...args: any[]) => any, timeout?: number): void;
-    /** check any selection is made or not */
-    private checkSelection;
-    /**
-     * Upload file to uploadUrl
-     * @param file The file
-     */
-    uploadImage(file: File): Observable<HttpEvent<UploadResponse>>;
-    /**
-     * Insert image with Url
-     * @param imageUrl The imageUrl.
-     */
-    insertImage(imageUrl: string): void;
-    setDefaultParagraphSeparator(separator: string): void;
-    createCustomClass(customClass: CustomClass): void;
-    insertVideo(videoUrl: string): void;
-    private insertYouTubeVideoTag;
-    private insertVimeoVideoTag;
-    nextNode(node: any): any;
-    getRangeSelectedNodes(range: any, includePartiallySelectedContainers: any): any[];
-    getSelectedNodes(): any[];
-    replaceWithOwnChildren(el: any): void;
-    removeSelectedElements(tagNames: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AngularEditorService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<AngularEditorService>;
-}

package/lib/config.d.ts

@@ -1,39 +0,0 @@
-import { UploadResponse } from './angular-editor.service';
-import { HttpEvent } from '@angular/common/http';
-import { Observable } from 'rxjs';
-export interface CustomClass {
-    name: string;
-    class: string;
-    tag?: string;
-}
-export interface Font {
-    name: string;
-    class: string;
-}
-export interface AngularEditorConfig {
-    editable?: boolean;
-    spellcheck?: boolean;
-    height?: 'auto' | string;
-    minHeight?: '0' | string;
-    maxHeight?: 'auto' | string;
-    width?: 'auto' | string;
-    minWidth?: '0' | string;
-    translate?: 'yes' | 'now' | string;
-    enableToolbar?: boolean;
-    showToolbar?: boolean;
-    placeholder?: string;
-    defaultParagraphSeparator?: string;
-    defaultFontName?: string;
-    defaultFontSize?: '1' | '2' | '3' | '4' | '5' | '6' | '7' | string;
-    uploadUrl?: string;
-    upload?: (file: File) => Observable<HttpEvent<UploadResponse>>;
-    uploadWithCredentials?: boolean;
-    fonts?: Font[];
-    customClasses?: CustomClass[];
-    sanitize?: boolean;
-    toolbarPosition?: 'top' | 'bottom';
-    outline?: boolean;
-    toolbarHiddenButtons?: string[][];
-    rawPaste?: boolean;
-}
-export declare const angularEditorConfig: AngularEditorConfig;

package/lib/utils.d.ts

@@ -1 +0,0 @@
-export declare function isDefined(value: any): boolean;

package/public-api.d.ts

@@ -1,8 +0,0 @@
-export * from './lib/angular-editor.service';
-export * from './lib/angular-editor.component';
-export * from './lib/ae-button/ae-button.component';
-export * from './lib/ae-toolbar-set/ae-toolbar-set.component';
-export * from './lib/ae-select/ae-select.component';
-export * from './lib/angular-editor-toolbar.component';
-export * from './lib/angular-editor.module';
-export { AngularEditorConfig, CustomClass } from './lib/config';

package/src/lib/style.scss

@@ -1,290 +0,0 @@
-a {
-  cursor: pointer;
-}
-
-.angular-editor-textarea {
-  min-height: 150px;
-  overflow: auto;
-  margin-top: 5px;
-  resize: vertical;
-  &:after {
-    content:"";
-    position: absolute;
-    bottom: 0;
-    right:0;
-    display:block;
-    width:8px;
-    height:8px;
-    cursor: nwse-resize;
-    background-color: rgba(255,255,255,0.5)
-  }
-}
-
-.angular-editor-toolbar {
-  font: 100 14px/15px Roboto, Arial, sans-serif;
-  background-color: #f5f5f5;
-  font-size: 0.8rem;
-  padding: 0.2rem;
-  border: 1px solid #ddd;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 4px;
-
-  .angular-editor-toolbar-set {
-    display: flex;
-    gap: 1px;
-    width: fit-content;
-    vertical-align: baseline;
-    .angular-editor-button {
-      background-color: white;
-      vertical-align: middle;
-      border: 1px solid #ddd;
-      padding: 0.4rem;
-      float: left;
-      width: 2rem;
-      height: 2rem;
-
-      &:hover {
-        cursor: pointer;
-        background-color: #f1f1f1;
-        transition: 0.2s ease;
-      }
-
-      &:focus,
-      &.focus {
-        outline: 0;
-      }
-
-      &:disabled {
-        background-color: #f5f5f5;
-        pointer-events: none;
-        cursor: not-allowed;
-
-        > .color-label {
-          pointer-events: none;
-          cursor: not-allowed;
-
-          &.foreground {
-            :after {
-              background: #555555;
-            }
-          }
-
-          &.background {
-            background: #555555;
-          }
-        }
-      }
-
-      &.active {
-        background: #fff5b9;
-
-        &:hover {
-          background-color: #fffa98;
-        }
-      }
-    }
-
-    select {
-      font-size: 11px;
-      width: 90px;
-      vertical-align: middle;
-      background-color: transparent;
-      border: 0.5px solid rgba(255, 255, 255, 0);
-      border-radius: 5px;
-      outline: none;
-      padding: 0.4rem;
-      cursor: pointer;
-    }
-
-    .select-heading {
-      display: inline-block;
-      width: 90px;
-      @supports not( -moz-appearance:none ) {
-        optgroup {
-          font-size: 12px;
-          background-color: #f4f4f4;
-          padding: 5px;
-        }
-        option {
-          border: 1px solid;
-          background-color: white;
-        }
-        .default {
-          font-size: 16px;
-        }
-        .h1 {
-          font-size: 24px;
-        }
-        .h2 {
-          font-size: 20px;
-        }
-        .h3 {
-          font-size: 16px;
-        }
-        .h4 {
-          font-size: 15px;
-        }
-        .h5 {
-          font-size: 14px;
-        }
-        .h6 {
-          font-size: 13px;
-        }
-        .div {
-          font-size: 12px;
-        }
-        .pre {
-          font-size: 12px;
-        }
-      }
-
-      &:disabled {
-        background-color: #f5f5f5;
-        pointer-events: none;
-        cursor: not-allowed;
-      }
-
-      &:hover {
-        cursor: pointer;
-        background-color: #f1f1f1;
-        transition: 0.2s ease;
-      }
-    }
-
-    .select-font {
-      display: inline-block;
-      width: 90px;
-      @supports not( -moz-appearance:none ) {
-        optgroup {
-          font-size: 12px;
-          background-color: #f4f4f4;
-          padding: 5px;
-        }
-        option {
-          border: 1px solid;
-          background-color: white;
-        }
-      }
-
-      &:disabled {
-        background-color: #f5f5f5;
-        pointer-events: none;
-        cursor: not-allowed;
-      }
-
-      &:hover {
-        cursor: pointer;
-        background-color: #f1f1f1;
-        transition: 0.2s ease;
-      }
-    }
-
-    .select-font-size {
-      display: inline-block;
-      width: 50px;
-      @supports not( -moz-appearance:none ) {
-        optgroup {
-          font-size: 12px;
-          background-color: #f4f4f4;
-          padding: 5px;
-        }
-        option {
-          border: 1px solid;
-          background-color: white;
-        }
-        .size1 {
-          font-size: 10px;
-        }
-        .size2 {
-          font-size: 12px;
-        }
-        .size3 {
-          font-size: 14px;
-        }
-        .size4 {
-          font-size: 16px;
-        }
-        .size5 {
-          font-size: 18px;
-        }
-        .size6 {
-          font-size: 20px;
-        }
-        .size7 {
-          font-size: 22px;
-        }
-      }
-
-      &:disabled {
-        background-color: #f5f5f5;
-        pointer-events: none;
-        cursor: not-allowed;
-      }
-
-      &:hover {
-        cursor: pointer;
-        background-color: #f1f1f1;
-        transition: 0.2s ease;
-      }
-    }
-
-    .select-custom-style {
-      display: inline-block;
-      width: 90px;
-      @supports not( -moz-appearance:none ) {
-        optgroup {
-          font-size: 12px;
-          background-color: #f4f4f4;
-          padding: 5px;
-        }
-        option {
-          border: 1px solid;
-          background-color: white;
-        }
-      }
-
-      &:disabled {
-        background-color: #f5f5f5;
-        pointer-events: none;
-        cursor: not-allowed;
-      }
-
-      &:hover {
-        cursor: pointer;
-        background-color: #f1f1f1;
-        transition: 0.2s ease;
-      }
-    }
-
-    .color-label {
-      position: relative;
-      cursor: pointer;
-    }
-
-    .background {
-      font-size: smaller;
-      background: #1b1b1b;
-      color: white;
-      padding: 3px;
-    }
-
-    .foreground {
-      :after {
-        position: absolute;
-        content: "";
-        left: -1px;
-        top: auto;
-        bottom: -3px;
-        right: auto;
-        width: 15px;
-        height: 2px;
-        z-index: 0;
-        background: #1b1b1b;
-      }
-    }
-  }
-  .angular-editor-toolbar-set:not([style*="display:none"]):not([style*="display: none"]){
-    //display: inline-block;
-  }
-}