@ecodev/natural-editor 1.1.0

package/lib/editor.component.d.ts

@@ -0,0 +1,47 @@
+import { EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { MatDialog } from '@angular/material/dialog';
+import { Key, MenuItems } from './menu';
+import * as i0 from "@angular/core";
+/**
+ * Prosemirror component
+ *
+ * Usage :
+ *
+ * ```html
+ * <natural-editor [(ngModel)]="htmlString"></natural-editor>
+ * ```
+ */
+export declare class NaturalEditorComponent implements OnInit, OnDestroy, ControlValueAccessor {
+    readonly ngControl: NgControl;
+    private readonly document;
+    private readonly dialog;
+    private view;
+    private editor;
+    readonly contentChange: EventEmitter<string>;
+    /**
+     * Interface with ControlValueAccessor
+     * Notifies parent model / form controller
+     */
+    private onChange?;
+    /**
+     * HTML string
+     */
+    private content;
+    menu: MenuItems | null;
+    constructor(ngControl: NgControl, document: Document, dialog: MatDialog);
+    ngOnInit(): void;
+    writeValue(val: string | undefined): void;
+    private createState;
+    /**
+     * Called by Prosemirror whenever the editor state changes. So we update our menu states.
+     */
+    update(): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    ngOnDestroy(): void;
+    run(event: Event, key: Key): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NaturalEditorComponent, [{ optional: true; self: true; }, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NaturalEditorComponent, "natural-editor", never, {}, { "contentChange": "contentChange"; }, never, never>;
+}

package/lib/editor.module.d.ts

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./editor.component";
+import * as i2 from "./link-dialog/link-dialog.component";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/material/button";
+import * as i5 from "@angular/material/button-toggle";
+import * as i6 from "@angular/material/dialog";
+import * as i7 from "@angular/material/form-field";
+import * as i8 from "@angular/material/icon";
+import * as i9 from "@angular/material/input";
+import * as i10 from "@angular/material/menu";
+import * as i11 from "@angular/material/toolbar";
+import * as i12 from "@angular/material/tooltip";
+import * as i13 from "@angular/forms";
+export declare class NaturalEditorModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<NaturalEditorModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<NaturalEditorModule, [typeof i1.NaturalEditorComponent, typeof i2.LinkDialogComponent], [typeof i3.CommonModule, typeof i4.MatButtonModule, typeof i5.MatButtonToggleModule, typeof i6.MatDialogModule, typeof i7.MatFormFieldModule, typeof i8.MatIconModule, typeof i9.MatInputModule, typeof i10.MatMenuModule, typeof i11.MatToolbarModule, typeof i12.MatTooltipModule, typeof i13.ReactiveFormsModule], [typeof i3.CommonModule, typeof i4.MatButtonModule, typeof i5.MatButtonToggleModule, typeof i6.MatDialogModule, typeof i7.MatFormFieldModule, typeof i8.MatIconModule, typeof i9.MatInputModule, typeof i10.MatMenuModule, typeof i11.MatToolbarModule, typeof i12.MatTooltipModule, typeof i13.ReactiveFormsModule, typeof i1.NaturalEditorComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<NaturalEditorModule>;
+}

package/lib/link-dialog/link-dialog.component.d.ts

@@ -0,0 +1,18 @@
+import { MatDialogRef } from '@angular/material/dialog';
+import { FormControl, FormGroup } from '@angular/forms';
+import * as i0 from "@angular/core";
+export interface LinkDialogData {
+    href: string;
+    title?: string;
+}
+export declare class LinkDialogComponent {
+    private dialogRef;
+    readonly hrefControl: FormControl;
+    readonly titleControl: FormControl;
+    readonly form: FormGroup;
+    constructor(data: LinkDialogData, dialogRef: MatDialogRef<LinkDialogComponent, LinkDialogData>);
+    maybeConfirm(): void;
+    private confirm;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LinkDialogComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LinkDialogComponent, "ng-component", never, {}, {}, never, never>;
+}

package/lib/menu.d.ts

@@ -0,0 +1,39 @@
+import { MenuItemSpec } from 'prosemirror-menu';
+import { EditorState } from 'prosemirror-state';
+import { Schema } from 'prosemirror-model';
+import { MatDialog } from '@angular/material/dialog';
+import { EditorView } from 'prosemirror-view';
+/**
+ * One item of the menu.
+ *
+ * This is the equivalent of `MenuItem` but without all the rendering logic since we use Angular
+ * templates for rendering. Also it caches the state of the item everytime the editor state changes,
+ * so Angular can query the state as often as needed without performance hit.
+ */
+export declare class Item {
+    readonly spec: MenuItemSpec;
+    /**
+     * Whether the item is 'active' (for example, the item for toggling the strong mark might be active when the cursor is in strong text).
+     */
+    active: boolean;
+    /**
+     * Button is shown but disabled, because the item cannot be (un-)applied
+     */
+    disabled: boolean;
+    /**
+     * Whether the item is shown at the moment
+     */
+    show: boolean;
+    constructor(spec: MenuItemSpec);
+    /**
+     * Update the item state according to the editor state
+     */
+    update(view: EditorView, state: EditorState): void;
+}
+export declare type Key = 'toggleStrong' | 'toggleEm' | 'toggleCode' | 'toggleLink' | 'insertImage' | 'wrapBulletList' | 'wrapOrderedList' | 'wrapBlockQuote' | 'makeParagraph' | 'makeCodeBlock' | 'makeHead1' | 'makeHead2' | 'makeHead3' | 'makeHead4' | 'makeHead5' | 'makeHead6' | 'insertHorizontalRule' | 'joinUp' | 'lift' | 'selectParentNode' | 'undo' | 'redo';
+export declare type MenuItems = Partial<Record<Key, Item>>;
+/**
+ * Given a schema, look for default mark and node types in it and
+ * return an object with relevant menu items relating to those marks:
+ */
+export declare function buildMenuItems(schema: Schema, dialog: MatDialog): MenuItems;

package/lib/schema.d.ts

@@ -0,0 +1,2 @@
+import { Schema } from 'prosemirror-model';
+export declare const schema: Schema<any, "link" | "em" | "strong">;

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@ecodev/natural-editor",
+  "version": "1.1.0",
+  "license": "MIT",
+  "repository": "github:Ecodev/natural",
+  "sideEffects": false,
+  "dependencies": {
+    "@types/prosemirror-commands": "^1.0.4",
+    "@types/prosemirror-menu": "^1.0.6",
+    "@types/prosemirror-model": "^1.13.2",
+    "@types/prosemirror-schema-basic": "^1.0.2",
+    "@types/prosemirror-schema-list": "^1.0.3",
+    "@types/prosemirror-state": "^1.2.7",
+    "@types/prosemirror-view": "^1.19.1",
+    "prosemirror-commands": "^1.1.12",
+    "prosemirror-example-setup": "^1.1.2",
+    "prosemirror-keymap": "^1.1.4",
+    "prosemirror-menu": "^1.1.4",
+    "prosemirror-model": "^1.16.1",
+    "prosemirror-schema-basic": "^1.1.2",
+    "prosemirror-schema-list": "^1.1.6",
+    "prosemirror-state": "^1.3.4",
+    "prosemirror-view": "^1.23.5",
+    "tslib": "^2.3.0"
+  },
+  "peerDependencies": {
+    "@angular/common": "^12.2.0",
+    "@angular/core": "^12.2.0",
+    "@ecodev/natural": ">40.0"
+  },
+  "main": "bundles/ecodev-natural-editor.umd.js",
+  "module": "fesm2015/ecodev-natural-editor.js",
+  "es2015": "fesm2015/ecodev-natural-editor.js",
+  "esm2015": "esm2015/ecodev-natural-editor.js",
+  "fesm2015": "fesm2015/ecodev-natural-editor.js",
+  "typings": "ecodev-natural-editor.d.ts"
+}

package/public-api.d.ts

@@ -0,0 +1,3 @@
+import '@angular/localize/init';
+export { NaturalEditorComponent } from './lib/editor.component';
+export { NaturalEditorModule } from './lib/editor.module';