@progress/kendo-angular-editor 3.0.0-dev.202201121058 → 3.0.1-dev.202201201312

package/dist/es2015/config/commands.js

@@ -2,7 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { alignBlocks, alignLeftRules, alignCenterRules, alignRightRules, alignJustifyRules, alignRemoveRules, indent, outdent, setHtml, getHtml, insertImage, insertText, applyLink, removeLink, expandToWordWrap, 
+import { alignBlocks, alignLeftRules, alignCenterRules, alignRightRules, alignJustifyRules, alignRemoveRules, indent, outdent, setHtml, getHtml, insertImage, insertText, applyLink, removeLink, expandToWordWrap, blockquote, 
 //marks
 bold, italic, underline, strikethrough, subscript, superscript, link, toggleInlineFormat, applyInlineStyle, formatBlockElements, toggleOrderedList, toggleUnorderedList, isAligned, undo, redo, cleanFormatting, selectAll, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, deleteTable, mergeCells, splitCell } from '@progress/kendo-editor-common';
 import { insertTable } from './table-commands';
@@ -27,7 +27,7 @@ const inlineCommand = {
     backColor: ɵ15,
     selectAll: ɵ16
 };
-const ɵ17 = () => (state, dispatch) => isAligned(state, alignCenterRules) ? alignRemove(state, dispatch) : alignBlocks(alignCenterRules)(state, dispatch), ɵ18 = () => (state, dispatch) => isAligned(state, alignJustifyRules) ? alignRemove(state, dispatch) : alignBlocks(alignJustifyRules)(state, dispatch), ɵ19 = () => (state, dispatch) => isAligned(state, alignLeftRules) ? alignRemove(state, dispatch) : alignBlocks(alignLeftRules)(state, dispatch), ɵ20 = () => (state, dispatch) => isAligned(state, alignRightRules) ? alignRemove(state, dispatch) : alignBlocks(alignRightRules)(state, dispatch), ɵ21 = formatAttr => formatBlockElements(formatAttr.tag), ɵ22 = () => getHtml, ɵ23 = () => indent, ɵ24 = attrs => insertImage(attrs), ɵ25 = () => toggleOrderedList, ɵ26 = () => toggleUnorderedList, ɵ27 = () => outdent, ɵ28 = () => redo, ɵ29 = ({ content, parseOptions }) => setHtml(content, 'setHTML', parseOptions), ɵ30 = () => undo;
+const ɵ17 = () => (state, dispatch) => isAligned(state, alignCenterRules) ? alignRemove(state, dispatch) : alignBlocks(alignCenterRules)(state, dispatch), ɵ18 = () => (state, dispatch) => isAligned(state, alignJustifyRules) ? alignRemove(state, dispatch) : alignBlocks(alignJustifyRules)(state, dispatch), ɵ19 = () => (state, dispatch) => isAligned(state, alignLeftRules) ? alignRemove(state, dispatch) : alignBlocks(alignLeftRules)(state, dispatch), ɵ20 = () => (state, dispatch) => isAligned(state, alignRightRules) ? alignRemove(state, dispatch) : alignBlocks(alignRightRules)(state, dispatch), ɵ21 = formatAttr => formatBlockElements(formatAttr.tag), ɵ22 = () => getHtml, ɵ23 = () => indent, ɵ24 = attrs => insertImage(attrs), ɵ25 = () => toggleOrderedList, ɵ26 = () => toggleUnorderedList, ɵ27 = () => outdent, ɵ28 = () => redo, ɵ29 = ({ content, parseOptions }) => setHtml(content, 'setHTML', parseOptions), ɵ30 = () => undo, ɵ31 = () => blockquote;
 const blockCommand = {
     alignCenter: ɵ17,
     alignJustify: ɵ18,
@@ -44,23 +44,24 @@ const blockCommand = {
     outdent: ɵ27,
     redo: ɵ28,
     setHTML: ɵ29,
-    undo: ɵ30
+    undo: ɵ30,
+    blockquote: ɵ31
 };
-const ɵ31 = attr => insertTable(attr), ɵ32 = () => addColumnBefore, ɵ33 = () => addColumnAfter, ɵ34 = () => addRowBefore, ɵ35 = () => addRowAfter, ɵ36 = () => deleteRow, ɵ37 = () => deleteColumn, ɵ38 = () => mergeCells, ɵ39 = () => splitCell, ɵ40 = () => deleteTable;
+const ɵ32 = attr => insertTable(attr), ɵ33 = () => addColumnBefore, ɵ34 = () => addColumnAfter, ɵ35 = () => addRowBefore, ɵ36 = () => addRowAfter, ɵ37 = () => deleteRow, ɵ38 = () => deleteColumn, ɵ39 = () => mergeCells, ɵ40 = () => splitCell, ɵ41 = () => deleteTable;
 const tableCommand = {
-    insertTable: ɵ31,
-    addColumnBefore: ɵ32,
-    addColumnAfter: ɵ33,
-    addRowBefore: ɵ34,
-    addRowAfter: ɵ35,
-    deleteRow: ɵ36,
-    deleteColumn: ɵ37,
-    mergeCells: ɵ38,
-    splitCell: ɵ39,
-    deleteTable: ɵ40
+    insertTable: ɵ32,
+    addColumnBefore: ɵ33,
+    addColumnAfter: ɵ34,
+    addRowBefore: ɵ35,
+    addRowAfter: ɵ36,
+    deleteRow: ɵ37,
+    deleteColumn: ɵ38,
+    mergeCells: ɵ39,
+    splitCell: ɵ40,
+    deleteTable: ɵ41
 };
 /**
  * @hidden
  */
 export const editorCommands = Object.assign({}, inlineCommand, blockCommand, tableCommand);
-export { ɵ0, ɵ1, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8, ɵ9, ɵ10, ɵ11, ɵ12, ɵ13, ɵ14, ɵ15, ɵ16, ɵ17, ɵ18, ɵ19, ɵ20, ɵ21, ɵ22, ɵ23, ɵ24, ɵ25, ɵ26, ɵ27, ɵ28, ɵ29, ɵ30, ɵ31, ɵ32, ɵ33, ɵ34, ɵ35, ɵ36, ɵ37, ɵ38, ɵ39, ɵ40 };
+export { ɵ0, ɵ1, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8, ɵ9, ɵ10, ɵ11, ɵ12, ɵ13, ɵ14, ɵ15, ɵ16, ɵ17, ɵ18, ɵ19, ɵ20, ɵ21, ɵ22, ɵ23, ɵ24, ɵ25, ɵ26, ɵ27, ɵ28, ɵ29, ɵ30, ɵ31, ɵ32, ɵ33, ɵ34, ɵ35, ɵ36, ɵ37, ɵ38, ɵ39, ɵ40, ɵ41 };

package/dist/es2015/config/schema.d.ts

@@ -6,7 +6,7 @@ import { Schema } from '@progress/kendo-editor-common';
 /**
  * @hidden
  */
-export declare const schema: Schema<"blockquote", string>;
+export declare const schema: Schema<string, string>;
 /**
  * @hidden
  */

package/dist/es2015/config/schema.js

@@ -14,7 +14,7 @@ const nodes = Object.assign(commonNodes, semanticNodes);
  */
 export const schema = new Schema({
     marks,
-    nodes: Object.assign({}, nodes, { blockquote: Object.assign({}, nodes.blockquote, { content: 'inline*' }) })
+    nodes
 });
 /**
  * @hidden

package/dist/es2015/dialogs/colorpicker-dialog.component.js

@@ -66,7 +66,7 @@ ColorPickerDialogComponent = tslib_1.__decorate([
                 <div class="k-edit-form-container k-window-content" style="text-align: center;">
                     <kendo-colorpicker
                         #colorpicker
-                        [view]="view"
+                        [views]="['palette']"
                         [format]="'hex'"
                         [attr.title]="title"
                         [icon]="icon"

package/dist/es2015/dialogs/file-link-dialog.component.js

@@ -123,26 +123,26 @@ FileLinkDialogComponent = tslib_1.__decorate([
                             <label (click)="hrefInput.focus()">{{ textForWithPrefix('WebAddress') }}</label>
                         </div>
                         <div class="k-edit-field">
-                            <input #hrefInput formControlName="href" type="text" class="k-textbox" />
+                            <input #hrefInput formControlName="href" type="text" class="k-textbox k-input k-rounded-md" />
                         </div>
 
                         <div class="k-edit-label">
                             <label (click)="textInput.focus()">{{ textForWithPrefix('Text') }}</label>
                         </div>
                         <div class="k-edit-field">
-                            <input #textInput formControlName="text" type="text" class="k-textbox" />
+                            <input #textInput formControlName="text" type="text" class="k-textbox k-input k-rounded-md" />
                         </div>
 
                         <div class="k-edit-label">
                             <label (click)="titleInput.focus()">{{ textForWithPrefix('Title') }}</label>
                         </div>
                         <div class="k-edit-field">
-                            <input #titleInput formControlName="title" type="text" class="k-textbox" />
+                            <input #titleInput formControlName="title" type="text" class="k-textbox k-input k-rounded-md" />
                         </div>
                         <ng-container *ngIf="command === 'createLink'">
                             <div class="k-edit-label"></div>
                             <div class="k-edit-field">
-                                <input type="checkbox" id="k-target-blank" class="k-checkbox" formControlName="target" />
+                                <input type="checkbox" id="k-target-blank" kendoCheckBox formControlName="target" />
                                 <label class="k-checkbox-label" for="k-target-blank">{{ textForWithPrefix('OpenInNewWindow') }}</label>
                             </div>
                         </ng-container>

package/dist/es2015/dialogs/image-dialog.component.js

@@ -101,25 +101,25 @@ ImageDialogComponent = tslib_1.__decorate([
                         <label [for]="srcInputId">{{ textFor('imageWebAddress') }}</label>
                     </div>
                     <div class="k-edit-field">
-                        <input [id]="srcInputId" #srcInput [formControl]="src" type="text" class="k-textbox" />
+                        <input [id]="srcInputId" #srcInput [formControl]="src" type="text" class="k-textbox k-input k-rounded-md" />
                     </div>
                     <div class="k-edit-label">
                         <label [for]="altTextInputId">{{ textFor('imageAltText') }}</label>
                     </div>
                     <div class="k-edit-field">
-                        <input [id]="altTextInputId" [formControl]="alt" type="text" class="k-textbox" />
+                        <input [id]="altTextInputId" [formControl]="alt" type="text" class="k-textbox k-input k-rounded-md" />
                     </div>
                     <div class="k-edit-label">
                         <label [for]="widthInputId">{{ textFor('imageWidth') }}</label>
                     </div>
                     <div class="k-edit-field">
-                        <input [id]="widthInputId" [formControl]="width" type="text" class="k-textbox" />
+                        <input [id]="widthInputId" [formControl]="width" type="text" class="k-textbox k-input k-rounded-md" />
                     </div>
                     <div class="k-edit-label">
                         <label [for]="heightInputId">{{ textFor('imageHeight') }}</label>
                     </div>
                     <div class="k-edit-field">
-                        <input [id]="heightInputId" [formControl]="height" type="text" class="k-textbox" />
+                        <input [id]="heightInputId" [formControl]="height" type="text" class="k-textbox k-input k-rounded-md" />
                     </div>
                 </div>
             </div>

package/dist/es2015/editor-toolbar-state.js

@@ -2,7 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { cleanFormatting } from '@progress/kendo-editor-common';
+import { blockquote, cleanFormatting, isIndented } from '@progress/kendo-editor-common';
 import { alignRightRules, alignCenterRules, alignLeftRules, alignJustifyRules, isAligned, bold, italic, underline, strikethrough, subscript, superscript, link, activeNode, hasNode, getActiveMarks, hasMark, expandSelection, indentRules, outdentRules, canIndentAsListItem, canOutdentAsListItem, canBeIndented, undo, redo, addRowBefore, addRowAfter, addColumnBefore, addColumnAfter, deleteRow, deleteColumn, deleteTable, mergeCells, splitCell } from '@progress/kendo-editor-common';
 /**
  * @hidden
@@ -36,6 +36,10 @@ export const getToolbarState = (state, options) => ({
         selected: activeNode(state),
         disabled: false
     },
+    blockquote: {
+        selected: false,
+        disabled: !blockquote(state)
+    },
     indent: {
         selected: false,
         disabled: !(canIndentAsListItem(state, state.schema.nodes.list_item) || canBeIndented(state, indentRules))
@@ -58,7 +62,11 @@ export const getToolbarState = (state, options) => ({
     },
     outdent: {
         selected: false,
-        disabled: !(canOutdentAsListItem(state, outdentRules) || canBeIndented(state, outdentRules))
+        get disabled() {
+            return !(hasNode(state, state.schema.nodes.blockquote) ||
+                canOutdentAsListItem(state, outdentRules) ||
+                isIndented(state, outdentRules.nodes));
+        }
     },
     redo: {
         selected: false,
@@ -184,6 +192,7 @@ export const initialToolBarState = {
     format: { selected: { text: 'Format', tag: null }, disabled: false },
     style: { selected: { marks: [], hasNodesWithoutMarks: false }, disabled: false },
     cleanFormatting: { selected: false, disabled: true },
+    blockquote: { selected: false, disabled: false },
     //indent
     indent: { selected: false, disabled: false },
     outdent: { selected: false, disabled: false },
@@ -236,6 +245,7 @@ export const disabledToolBarState = {
     format: { selected: { text: 'Format', tag: null }, disabled: true },
     style: { selected: { marks: [], hasNodesWithoutMarks: false }, disabled: true },
     cleanFormatting: { selected: false, disabled: true },
+    blockquote: { selected: false, disabled: true },
     //indent
     indent: { selected: false, disabled: true },
     outdent: { selected: false, disabled: true },

package/dist/es2015/editor.component.d.ts

@@ -189,7 +189,7 @@ export declare class EditorComponent implements AfterViewInit, ControlValueAcces
      * @param {any} attr - Optional parameters for the command. Apart from the following list,
      * the parameters do not expect specific attributes when you call them:
      * - `format` - Accepts an object with the `tag` property.
-     * The supported tags are `p`, `blockquote`, and any of the `h1` to `h6` heading tags.
+     * The supported tags are `p` and any of the `h1` to `h6` heading tags.
      * - `createLink` - Accepts an object with the `href`, `title`, and `target` properties. The `href` property is mandatory.
      * - `setHTML` - Accepts a `string` parameter.
      * - `insertTable` - Accepts an object with the `rows` and `cols` properties. The number values are zero based.

package/dist/es2015/editor.component.js

@@ -421,7 +421,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
      * @param {any} attr - Optional parameters for the command. Apart from the following list,
      * the parameters do not expect specific attributes when you call them:
      * - `format` - Accepts an object with the `tag` property.
-     * The supported tags are `p`, `blockquote`, and any of the `h1` to `h6` heading tags.
+     * The supported tags are `p` and any of the `h1` to `h6` heading tags.
      * - `createLink` - Accepts an object with the `href`, `title`, and `target` properties. The `href` property is mandatory.
      * - `setHTML` - Accepts a `string` parameter.
      * - `insertTable` - Accepts an object with the `rows` and `cols` properties. The number values are zero based.
@@ -677,7 +677,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
             this.subs.add(fromEvent(containerElement, 'focusin')
                 .subscribe(() => {
                 if (this.readonly) {
-                    contentAreaClasslist.add('k-state-focused');
+                    contentAreaClasslist.add('k-focus');
                 }
                 if (!this.focusChangedProgrammatically || this.shouldEmitFocus) {
                     this.ngZone.run(() => this.onFocus.emit());
@@ -687,7 +687,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
             this.subs.add(fromEvent(containerElement, 'focusout')
                 .subscribe(() => {
                 if (this.readonly) {
-                    contentAreaClasslist.remove('k-state-focused');
+                    contentAreaClasslist.remove('k-focus');
                 }
                 if (!this.focusChangedProgrammatically) {
                     this.ngZone.run(() => this.onBlur.emit());
@@ -833,7 +833,7 @@ tslib_1.__decorate([
     tslib_1.__metadata("design:paramtypes", [])
 ], EditorComponent.prototype, "resizableClass", null);
 tslib_1.__decorate([
-    HostBinding('class.k-state-disabled'),
+    HostBinding('class.k-disabled'),
     tslib_1.__metadata("design:type", Boolean),
     tslib_1.__metadata("design:paramtypes", [])
 ], EditorComponent.prototype, "isDisabled", null);
@@ -939,6 +939,8 @@ EditorComponent = EditorComponent_1 = tslib_1.__decorate([
             alignRight="Align text right"
             i18n-backColor="kendo.editor.backColor|The title of the tool that changes the text background color."
             backColor="Background color"
+            i18n-blockquote="kendo.editor.blockquote|The title of the tool that wraps an element in a blockquote"
+            blockquote="Quotation"
             i18n-bold="kendo.editor.bold|The title of the tool that makes text bold."
             bold="Bold"
             i18n-cleanFormatting="kendo.editor.cleanFormatting|The title of the Clean Formatting tool."

package/dist/es2015/editor.module.js

@@ -10,8 +10,7 @@ import { ToolBarModule } from '@progress/kendo-angular-toolbar';
 import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
 import { DialogModule } from '@progress/kendo-angular-dialog';
 import { ButtonModule } from '@progress/kendo-angular-buttons';
-import { ColorPickerModule } from '@progress/kendo-angular-inputs';
-import { NumericTextBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
+import { NumericTextBoxModule, TextBoxModule, ColorPickerModule, CheckBoxModule } from '@progress/kendo-angular-inputs';
 import { EditorComponent } from './editor.component';
 import { ImageDialogComponent } from './dialogs/image-dialog.component';
 import { SourceDialogComponent } from './dialogs/source-dialog.component';
@@ -30,6 +29,7 @@ import { EditorAlignLeftButtonDirective } from './tools/alignment/editor-align-l
 import { EditorAlignCenterButtonDirective } from './tools/alignment/editor-align-center-button.directive';
 import { EditorAlignRightButtonDirective } from './tools/alignment/editor-align-right-button.directive';
 import { EditorAlignJustifyButtonDirective } from './tools/alignment/editor-align-justify-button.directive';
+import { EditorBlockquoteDirective } from './tools/blockquote/editor-blockquote-button.directive';
 import { EditorRedoButtonDirective } from './tools/history/editor-redo-button.directive';
 import { EditorUndoButtonDirective } from './tools/history/editor-undo-button.directive';
 import { EditorInsertImageButtonDirective } from './tools/image/editor-insert-image-button.directive';
@@ -123,7 +123,9 @@ const COMPONENT_DIRECTIVES = [
     // print
     EditorPrintDirective,
     // select all
-    EditorSelectAllButtonDirective
+    EditorSelectAllButtonDirective,
+    // blockquote
+    EditorBlockquoteDirective
 ];
 const TOOLBAR_TOOLS = [
     EditorFontSizeComponent,
@@ -227,6 +229,7 @@ EditorModule = tslib_1.__decorate([
             DialogModule,
             DropDownsModule,
             NumericTextBoxModule,
+            CheckBoxModule,
             ToolBarModule,
             TextBoxModule
         ]

package/dist/es2015/index.d.ts

@@ -7,6 +7,7 @@
  */
 export * from './main';
 export { DialogCommand, EditorCommand } from './common/commands';
+export { semanticNodes, semanticTagNames } from './config/semantic-nodes';
 export { ColorPickerDialogComponent } from './dialogs/colorpicker-dialog.component';
 export { FileLinkDialogComponent } from './dialogs/file-link-dialog.component';
 export { FontFamilyDialogComponent } from './dialogs/font-family-dialog.component';
@@ -23,6 +24,7 @@ export { EditorAlignCenterButtonDirective } from './tools/alignment/editor-align
 export { EditorAlignJustifyButtonDirective } from './tools/alignment/editor-align-justify-button.directive';
 export { EditorAlignLeftButtonDirective } from './tools/alignment/editor-align-left-button.directive';
 export { EditorAlignRightButtonDirective } from './tools/alignment/editor-align-right-button.directive';
+export { EditorBlockquoteDirective } from './tools/blockquote/editor-blockquote-button.directive';
 export { EditorBackColorDirective } from './tools/colorpicker/editor-back-color.directive';
 export { EditorColorPickerComponent } from './tools/colorpicker/editor-colorpicker.component';
 export { EditorForeColorDirective } from './tools/colorpicker/editor-fore-color.directive';

package/dist/es2015/index.js

@@ -6,6 +6,7 @@
  * Generated bundle index. Do not edit.
  */
 export * from './main';
+export { semanticNodes, semanticTagNames } from './config/semantic-nodes';
 export { ColorPickerDialogComponent } from './dialogs/colorpicker-dialog.component';
 export { FileLinkDialogComponent } from './dialogs/file-link-dialog.component';
 export { FontFamilyDialogComponent } from './dialogs/font-family-dialog.component';
@@ -22,6 +23,7 @@ export { EditorAlignCenterButtonDirective } from './tools/alignment/editor-align
 export { EditorAlignJustifyButtonDirective } from './tools/alignment/editor-align-justify-button.directive';
 export { EditorAlignLeftButtonDirective } from './tools/alignment/editor-align-left-button.directive';
 export { EditorAlignRightButtonDirective } from './tools/alignment/editor-align-right-button.directive';
+export { EditorBlockquoteDirective } from './tools/blockquote/editor-blockquote-button.directive';
 export { EditorBackColorDirective } from './tools/colorpicker/editor-back-color.directive';
 export { EditorColorPickerComponent } from './tools/colorpicker/editor-colorpicker.component';
 export { EditorForeColorDirective } from './tools/colorpicker/editor-fore-color.directive';